Implement joystream isPasswordValid, adjust root account password to work with empty passwords in Derive

pioneer/packages/page-accounts/src/Accounts/PasswordInput.tsx

@@ -4,6 +4,7 @@
 
 import { Modal, Password } from '@polkadot/react-components';
 // import keyring from '@polkadot/ui-keyring';
+import { isPasswordValid } from '@polkadot/joy-utils/functions/accounts';
 
 import React, { useCallback, useState } from 'react';
 
@@ -22,6 +23,8 @@ export default function PasswordInput ({ onChange, onEnter, password }: Props):
 
   const _onPasswordChange = useCallback(
     (password: string) => {
+      const isPassValid = isPasswordValid(password);
+
       setPassValid(isPassValid);
 
       const isValid = isPassValid && isPass2Valid;
@@ -33,7 +36,7 @@ export default function PasswordInput ({ onChange, onEnter, password }: Props):
 
   const onPassword2Change = useCallback(
     (password2: string) => {
-      const isPass2Valid = password2 === password;
+      const isPass2Valid = isPasswordValid(password2) && (password2 === password);
 
       setPassword2({ isPass2Valid, password2 });
 

pioneer/packages/page-accounts/src/Accounts/modals/Backup.tsx

@@ -6,6 +6,7 @@ import FileSaver from 'file-saver';
 import React, { useCallback, useState } from 'react';
 import { AddressRow, Button, Modal, Password } from '@polkadot/react-components';
 import keyring from '@polkadot/ui-keyring';
+import { isPasswordValid } from '@polkadot/joy-utils/functions/accounts';
 
 import { useTranslation } from '../../translate';
 
@@ -19,7 +20,7 @@ function Backup ({ address, onClose }: Props): React.ReactElement<Props> {
   const [isBusy, setIsBusy] = useState(false);
   const [{ isPassTouched, password }, setPassword] = useState({ isPassTouched: true, password: '' });
   const [backupFailed, setBackupFailed] = useState(false);
-  const isPassValid = !backupFailed;
+  const isPassValid = !backupFailed && isPasswordValid(password);
 
   const _onChangePass = useCallback(
     (password: string): void => {

pioneer/packages/page-accounts/src/Accounts/modals/ChangePass.tsx

@@ -5,6 +5,7 @@
 import React, { useCallback, useState } from 'react';
 import { AddressRow, Button, Modal, Password } from '@polkadot/react-components';
 import keyring from '@polkadot/ui-keyring';
+import { isPasswordValid } from '@polkadot/joy-utils/functions/accounts';
 
 import { useTranslation } from '../../translate';
 
@@ -33,18 +34,18 @@ function ChangePass ({ address, className = '', onClose }: Props): React.ReactEl
 
   const _onChangeNew1 = useCallback(
     (password: string) =>
-      setNewPass1({ isValid: true, password }),
+      setNewPass1({ isValid: isPasswordValid(password), password }),
     []
   );
 
   const _onChangeNew2 = useCallback(
     (password: string) =>
-      setNewPass2({ isValid: newPass1.password === password, password }),
+      setNewPass2({ isValid: isPasswordValid(password) && (newPass1.password === password), password }),
     [newPass1]
   );
 
   const _onChangeOld = useCallback(
-    (oldPass: string) => setOldPass({ isOldValid: true, oldPass }),
+    (oldPass: string) => setOldPass({ isOldValid: isPasswordValid(oldPass), oldPass }),
     []
   );
 

pioneer/packages/page-accounts/src/Accounts/modals/Derive.tsx

@@ -11,6 +11,7 @@ import { AddressRow, Button, Input, InputAddress, Modal, Password, StatusContext
 import { useApi, useDebounce, useToggle } from '@polkadot/react-hooks';
 import keyring from '@polkadot/ui-keyring';
 import { keyExtractPath } from '@polkadot/util-crypto';
+import { isPasswordValid } from '@polkadot/joy-utils/functions/accounts';
 
 import { useTranslation } from '../../translate';
 import { downloadAccount } from './Create';
@@ -85,7 +86,7 @@ function Derive ({ className = '', from, onClose }: Props): React.ReactElement {
   const [{ isNameValid, name }, setName] = useState({ isNameValid: false, name: '' });
   const [{ isPassValid, password }, setPassword] = useState({ isPassValid: true, password: '' });
   const [{ isPass2Valid, password2 }, setPassword2] = useState({ isPass2Valid: true, password2: '' });
-  const [{ isRootValid, rootPass }, setRootPass] = useState({ isRootValid: false, rootPass: '' });
+  const [{ isRootValid, rootPass }, setRootPass] = useState({ isRootValid: true, rootPass: '' });
   const [suri, setSuri] = useState('');
   const debouncedSuri = useDebounce(suri);
   const isValid = !!address && !deriveError && isNameValid && isPassValid && isPass2Valid;
@@ -115,12 +116,12 @@ function Derive ({ className = '', from, onClose }: Props): React.ReactElement {
   );
 
   const _onChangePass = useCallback(
-    (password: string) => setPassword({ isPassValid: true, password }),
+    (password: string) => setPassword({ isPassValid: isPasswordValid(password), password }),
     []
   );
 
   const _onChangePass2 = useCallback(
-    (password2: string) => setPassword2({ isPass2Valid: password2 === password, password2 }),
+    (password2: string) => setPassword2({ isPass2Valid: isPasswordValid(password2) && (password2 === password), password2 }),
     [password]
   );
 

pioneer/packages/page-accounts/src/Accounts/modals/Import.tsx

@@ -10,6 +10,7 @@ import React, { useCallback, useState } from 'react';
 import { AddressRow, Button, InputAddress, InputFile, Modal, Password } from '@polkadot/react-components';
 import { isObject, u8aToString } from '@polkadot/util';
 import keyring from '@polkadot/ui-keyring';
+import { isPasswordValid } from '@polkadot/joy-utils/functions/accounts';
 
 import { useTranslation } from '../../translate';
 
@@ -63,7 +64,7 @@ function Import ({ className = '', onClose, onStatusChange }: Props): React.Reac
   );
 
   const _onChangePass = useCallback(
-    (password: string) => setPass({ isPassValid: true, password }),
+    (password: string) => setPass({ isPassValid: isPasswordValid(password), password }),
     []
   );