Problem
src/components/SorobanPanel.tsx line 87 attaches the form's invoke handler to a button onClick via an unsafe cast:
onClick={invoke as unknown as React.MouseEventHandler}invoke is typed async function invoke(e: React.FormEvent) and calls e.preventDefault(). When triggered via onClick it receives a MouseEvent, not a FormEvent. The cast through unknown silences a real TypeScript error instead of fixing it.
The identical anti-pattern appears in src/components/TransactionPanel.tsx on the Send Payment button — onClick={submit as unknown as React.MouseEventHandler} — where submit is also a FormEvent handler.
Both forms already have onSubmit wired correctly. The onClick override is entirely redundant, creates a runtime type mismatch, and means the e.preventDefault() call inside each handler operates on the wrong event type.
Solution
Remove the onClick prop from both buttons and change them to type="submit" so they trigger the parent <form onSubmit> natively. This is the correct HTML pattern and eliminates the cast entirely.
// Before
<Button onClick={invoke as unknown as React.MouseEventHandler}>
// After
<Button type="submit">Acceptance Criteria
Note for Contributors: If you're assigned to this issue, write a clear and detailed description for your pull request. Explain what was changed, why it was needed, how it was implemented, and include any relevant testing or screenshots where applicable.
Problem
src/components/SorobanPanel.tsxline 87 attaches the form'sinvokehandler to a buttononClickvia an unsafe cast:invokeis typedasync function invoke(e: React.FormEvent)and callse.preventDefault(). When triggered viaonClickit receives aMouseEvent, not aFormEvent. The cast throughunknownsilences a real TypeScript error instead of fixing it.The identical anti-pattern appears in
src/components/TransactionPanel.tsxon the Send Payment button —onClick={submit as unknown as React.MouseEventHandler}— wheresubmitis also aFormEventhandler.Both forms already have
onSubmitwired correctly. TheonClickoverride is entirely redundant, creates a runtime type mismatch, and means thee.preventDefault()call inside each handler operates on the wrong event type.Solution
Remove the
onClickprop from both buttons and change them totype="submit"so they trigger the parent<form onSubmit>natively. This is the correct HTML pattern and eliminates the cast entirely.Acceptance Criteria
SorobanPanel.tsxInvoke button usestype="submit"with noonClickoverrideTransactionPanel.tsxSend Payment button usestype="submit"with noonClickoverrideas unknown ascasts remain in either component filetsc --noEmitpasses with no new type errors after the change