fixing type errors

app/client/web/package.json

@@ -17,6 +17,7 @@
     "@mantine/modals": "^7.12.2",
     "@tabler/core": "^1.0.0-beta20",
     "@tabler/icons-react": "^3.12.0",
+    "@types/crypto-js": "^4.2.2",
     "@types/jest": "29.0.3",
     "@types/react-dom": "18.0.6",
     "@vitejs/plugin-react": "4.3.1",

app/client/web/src/WebCrypto.ts

@@ -55,7 +55,7 @@ export class WebCrypto implements Crypto {
 
   // generate rsa key
   public rsaKey(): { publicKeyB64: string, privateKeyB64: string } {
-    const crypto = new JSEncrypt({ default_key_size: 2048 });
+    const crypto = new JSEncrypt({ default_key_size: '2048' });
     crypto.getKey();
     const publicKey = crypto.getPublicKey();
     const publicKeyB64 = this.convertPem(publicKey);
@@ -69,6 +69,9 @@ export class WebCrypto implements Crypto {
     const crypto = new JSEncrypt();
     crypto.setPublicKey(publicKeyB64);
     const encryptedDataB64 = crypto.encrypt(data);
+    if (!encryptedDataB64) {
+      throw new Error('rsaEncrypt failed');
+    }
     return { encryptedDataB64 };
   }
 
@@ -77,6 +80,9 @@ export class WebCrypto implements Crypto {
     const crypto = new JSEncrypt();
     crypto.setPrivateKey(privateKeyB64);
     const data = crypto.decrypt(encryptedDataB64);
+    if (!data) {
+      throw new Error('rsaDecrypt failed');
+    }
     return { data };
   }
 

app/client/web/src/settings/useSettings.hook.ts

@@ -55,6 +55,7 @@ export function useSettings() {
     sealPassword: '',
     sealConfirm: '',
     sealDelete: '',
+    secretCopied: false,
   })
 
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -281,13 +282,13 @@ export function useSettings() {
     setEditImage: (editImage: string) => {
       updateState({ editImage })
     },
-    setSealDelete: (sealDelete) => {
+    setSealDelete: (sealDelete: string) => {
       updateState({ sealDelete });
     },
-    setSealPassword: (sealPassword) => {
+    setSealPassword: (sealPassword: string) => {
       updateState({ sealPassword });
     },
-    setSealConfirm: (sealConfirm) => {
+    setSealConfirm: (sealConfirm: string) => {
       updateState({ sealConfirm });
     },
     setImage: async () => {