feat: must be a new password to encrypt

src/i18n/en/translations.ts

@@ -345,7 +345,9 @@ export default {
             confirm_password_placeholder: "Enter the same password",
             encrypt: "Encrypt",
             skip: "Skip",
-            error_match: "Passwords do not match"
+            error_match: "Passwords do not match",
+            error_same_as_existingpassword:
+                "New password must not match existing password"
         },
         decrypt: {
             title: "Enter your password",

src/routes/settings/Encrypt.tsx

@@ -1,5 +1,5 @@
 import { createForm } from "@modular-forms/solid";
-import { createSignal, Show } from "solid-js";
+import { createMemo, createSignal, Show } from "solid-js";
 
 import {
     BackLink,
@@ -31,7 +31,7 @@ export default function Encrypt() {
     const [error, setError] = createSignal<Error>();
     const [loading, setLoading] = createSignal(false);
 
-    const [_encryptPasswordForm, { Form, Field }] =
+    const [encryptPasswordForm, { Form, Field }] =
         createForm<EncryptPasswordForm>({
             initialValues: {
                 existingPassword: "",
@@ -39,11 +39,16 @@ export default function Encrypt() {
                 confirmPassword: ""
             },
             validate: (values) => {
+                setError(undefined);
                 const errors: Record<string, string> = {};
                 if (values.password !== values.confirmPassword) {
                     errors.confirmPassword = i18n.t(
                         "settings.encrypt.error_match"
                     );
+                } else if (values.password === values.existingPassword) {
+                    errors.password = i18n.t(
+                        "settings.encrypt.error_same_as_existingpassword"
+                    );
                 }
                 return errors;
             }
@@ -66,6 +71,14 @@ export default function Encrypt() {
         }
     };
 
+    const encryptButtonDisabled = createMemo(() => {
+        return (
+            !encryptPasswordForm.dirty ||
+            encryptPasswordForm.invalid ||
+            !!error()
+        );
+    });
+
     return (
         <MutinyWalletGuard>
             <SafeArea>
@@ -145,7 +158,11 @@ export default function Encrypt() {
                                     </InfoBox>
                                 </Show>
                                 <div />
-                                <Button intent="blue" loading={loading()}>
+                                <Button
+                                    intent="blue"
+                                    disabled={encryptButtonDisabled()}
+                                    loading={loading()}
+                                >
                                     {i18n.t("settings.encrypt.encrypt")}
                                 </Button>
                             </VStack>