I am getting an error when trying to sign a transaction using HashPack with Hedera Javascript SDK

Question

I am attempting to sign a transaction on the front end and send the signed bytes to the backend for transaction execution. However, I am encountering difficulty in signing the transaction. I have paired my app with HashConnect and have my signer, but have had no success with signing. Currently, my code is as follows:

const transactionId = new TransactionId(AccountId.fromString(accountId));
const transaction = new TopicMessageSubmitTransaction()
    .setTopicId(id)
    .setMessage(JSON.stringify(message))
    .setTransactionId(transactionId);

const signedTransaction = await transaction.signWithSigner(signer);

This code is throwing the following error:

TopicMessageSubmitTransaction.js:293 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'seconds')
at TopicMessageSubmitTransaction.freezeWith (TopicMessageSubmitTransaction.js:293:1)
at HashConnectSigner.signTransaction (signer.ts:66:1)
at TopicMessageSubmitTransaction.signWithSigner (Transaction.js:990:1)
at postReply (Thread.js:133:1)
at onSubmit (Thread.js:252:1)
at HTMLUnknownElement.callCallback (react-dom.development.js:4164:1)
at Object.invokeGuardedCallbackDev (react-dom.development.js:4213:1)
at invokeGuardedCallback (react-dom.development.js:4277:1)
at invokeGuardedCallbackAndCatchFirstError (react-dom.development.js:4291:1)
at executeDispatch (react-dom.development.js:9041:1)