7.2.6 (#154)

* fix password validation (#140) * fix: password confirmation (#141) * completed moon theme switch ST-355 (#144) * completed moon theme switch ST-355 * removed theme staking requirment and updated front png and preview svg colors * updated moon preview (#146) * changed preview colors (#148) * Update information exposed by the extension (#145) * fix: menu bg color (#149) * fix private key export issue (#151) * removed system default theme and makes it dark mode ST-433 (#150) * fix: password issue (#152) * fix password issue * fix: consolidate checks & replace depracated substr --------- Co-authored-by: Alessandro Candeago <[email protected]> * fix: enter activates submit send page (#153) * fix: enter activates submit send page * fix: LCDSetting enter activation * chore: update version number (#155) * fix: onFocus password confirmation (#156) --------- Co-authored-by: Alessandro Candeago <[email protected]> Co-authored-by: Joshua Brigati <[email protected]>
stationmoney · May 23, 2023 · 570685a · 570685a
1 parent 3fb45b4
commit 570685a
Show file tree

Hide file tree

Showing 21 changed files with 178 additions and 79 deletions.
diff --git a/public/firefox.manifest.json b/public/firefox.manifest.json
@@ -1,7 +1,7 @@
 {
   "manifest_version": 2,
   "name": "Station Wallet",
-  "version": "7.2.4",
+  "version": "7.2.6",
   "background": {
     "scripts": ["background.js"],
     "persistent": true

diff --git a/public/manifest.json b/public/manifest.json
@@ -1,7 +1,7 @@
 {
   "manifest_version": 3,
   "name": "Station Wallet",
-  "version": "7.2.4",
+  "version": "7.2.6",
   "background": {
     "service_worker": "background.js",
     "type": "module"

diff --git a/scripts/contentScript.js b/scripts/contentScript.js
@@ -76,8 +76,8 @@ function setupEvents() {
     if (namespace === "local") {
       if (
         changes.wallet &&
-        (Object.values(changes.wallet.oldValue.addresses).join(",") !==
-          Object.values(changes.wallet.newValue.addresses).join(",") ||
+        (changes.wallet.oldValue.address !== changes.wallet.newValue.address ||
+          changes.wallet.oldValue.name !== changes.wallet.newValue.name ||
           Object.values(changes.wallet.oldValue.pubkey).join(",") !==
             Object.values(changes.wallet.newValue.pubkey).join(","))
       ) {
@@ -87,9 +87,17 @@ function setupEvents() {
         window.dispatchEvent(event)
       }
       if (
-        changes.networks &&
-        Object.keys(changes.networks.oldValue).join(",") !==
-          Object.keys(changes.networks.newValue).join(",")
+        changes.wallet &&
+        changes.wallet.oldValue.theme !== changes.wallet.newValue.theme
+      ) {
+        const event = new CustomEvent("station_theme_change", {
+          detail: changes.wallet.newValue.theme,
+        })
+        window.dispatchEvent(event)
+      }
+      if (
+        changes.networkName &&
+        changes.networkName.oldValue !== changes.networkName.newValue
       ) {
         const event = new CustomEvent("station_network_change", {
           detail: changes.networks.newValue,
@@ -100,7 +108,9 @@ function setupEvents() {
   }
 
   extension.storage.local.get(["connect"], ({ connect }) => {
-    const isAllowed = ((connect && connect.allowed) || []).includes(window.location.origin)
+    const isAllowed = ((connect && connect.allowed) || []).includes(
+      window.location.origin
+    )
 
     if (isAllowed) {
       extension.storage.onChanged.addListener(createEvent)

diff --git a/src/auth/hooks/useAddress.ts b/src/auth/hooks/useAddress.ts
@@ -2,7 +2,7 @@ import { useConnectedWallet } from "@terra-money/use-wallet"
 import { useNetworks } from "app/InitNetworks"
 import { addressFromWords } from "utils/bech32"
 import useAuth from "./useAuth"
-import { useChainID } from "./useNetwork"
+import { useChainID, useNetworkName } from "./useNetwork"
 import { useNetwork } from "data/wallet"
 
 /* auth | walle-provider */
@@ -17,9 +17,26 @@ const useAddress = () => {
     ? addressFromWords(wallet.words["330"])
     : undefined
 }
+
 export const useAllInterchainAddresses = () => {
   const connected = useConnectedWallet()
+  const { wallet } = useAuth()
+  const { networks } = useNetworks()
+  const networkName = useNetworkName()
+
   if (connected?.addresses) return connected.addresses
+
+  const words = wallet?.words
+  if (!words) return
+
+  const addresses = Object.values(networks[networkName]).reduce(
+    (acc, { prefix, coinType, chainID }) => {
+      acc[chainID] = addressFromWords(words[coinType] as string, prefix)
+      return acc
+    },
+    {} as Record<string, string>
+  )
+  return addresses
 }
 
 export const useInterchainAddresses = () => {

diff --git a/src/auth/hooks/useAuth.ts b/src/auth/hooks/useAuth.ts
@@ -132,8 +132,20 @@ const useAuth = () => {
     const { name, words } = getConnectedWallet()
     const key = getKey(password)
     if (!key) throw new PasswordError("Key do not exist")
-    // TODO: update key export
-    if ("seed" in key) throw new PasswordError("This key cannot be exported")
+    if ("seed" in key) {
+      const seed = new SeedKey({
+        seed: Buffer.from(key.seed, "hex"),
+        coinType: key.legacy ? 118 : 330,
+        index: key.index || 0,
+      })
+
+      const data = {
+        name,
+        address: seed.accAddress("terra"),
+        encrypted_key: encrypt(seed.privateKey.toString("hex"), password),
+      }
+      return encode(JSON.stringify(data))
+    }
 
     const data = {
       name,

diff --git a/src/auth/modules/create/CreateWalletForm.tsx b/src/auth/modules/create/CreateWalletForm.tsx
@@ -45,7 +45,6 @@ const CreateWalletForm = () => {
       <FormItem label={t("Password")} error={errors.password?.message}>
         <Input
           {...register("password", { validate: validate.password })}
-          onChange={() => form.trigger("confirm")}
           type="password"
         />
       </FormItem>
@@ -55,6 +54,7 @@ const CreateWalletForm = () => {
           {...register("confirm", {
             validate: (confirm) => validate.confirm(password, confirm),
           })}
+          onFocus={() => form.trigger("confirm")}
           type="password"
         />
       </FormItem>

diff --git a/src/auth/modules/manage/ChangePasswordForm.tsx b/src/auth/modules/manage/ChangePasswordForm.tsx
@@ -64,6 +64,7 @@ const ChangePasswordForm = () => {
             {...register("confirm", {
               validate: (value) => validate.confirm(password, value),
             })}
+            onFocus={() => form.trigger("confirm")}
             type="password"
           />
         </FormItem>

diff --git a/src/auth/scripts/decrypt.ts b/src/auth/scripts/decrypt.ts
@@ -4,25 +4,27 @@ const keySize = 256
 const iterations = 100
 
 const decrypt = (transitmessage: string, pass: string) => {
-  try {
-    const salt = CryptoJS.enc.Hex.parse(transitmessage.substr(0, 32))
-    const iv = CryptoJS.enc.Hex.parse(transitmessage.substr(32, 32))
-    const encrypted = transitmessage.substring(64)
-
-    const key = CryptoJS.PBKDF2(pass, salt, {
-      keySize: keySize / 32,
-      iterations: iterations,
-    })
-
-    const decrypted = CryptoJS.AES.decrypt(encrypted, key, {
-      iv: iv,
-      padding: CryptoJS.pad.Pkcs7,
-      mode: CryptoJS.mode.CBC,
-    }).toString(CryptoJS.enc.Utf8)
-    return decrypted
-  } catch (error) {
-    return ""
-  }
+  const salt = CryptoJS.enc.Hex.parse(transitmessage.substring(0, 32))
+  const iv = CryptoJS.enc.Hex.parse(transitmessage.substring(32, 64))
+  const encrypted = transitmessage.substring(64)
+
+  const key = CryptoJS.PBKDF2(pass, salt, {
+    keySize: keySize / 32,
+    iterations: iterations,
+  })
+
+  const decrypted = CryptoJS.AES.decrypt(encrypted, key, {
+    iv: iv,
+    padding: CryptoJS.pad.Pkcs7,
+    mode: CryptoJS.mode.CBC,
+  })
+
+  const decoded = decrypted.toString(CryptoJS.enc.Utf8)
+
+  if (!decoded || decrypted.sigBytes < 128)
+    throw new Error("Incorrect password")
+
+  return decoded
 }
 
 export default decrypt
diff --git a/src/components/form/Input.tsx b/src/components/form/Input.tsx
@@ -47,6 +47,7 @@ const Input = forwardRef(
 
         {actionButton && (
           <button
+            type="button"
             className={classNames(styles.symbol, styles.after)}
             onClick={(e) => {
               actionButton.onClick()

diff --git a/src/components/form/StandardDropDown.tsx b/src/components/form/StandardDropDown.tsx
@@ -25,6 +25,7 @@ const StandardDropdown = ({
   return (
     <div className={styles.container}>
       <button
+        type="button"
         className={styles.selector}
         onClick={(e) => {
           e.preventDefault()

diff --git a/src/components/layout/Card.module.scss b/src/components/layout/Card.module.scss
@@ -16,6 +16,16 @@
   background: var(--card-bg-muted);
 }
 
+.twoTone {
+  .header {
+    border-bottom: var(--border-width) solid var(--card-border);
+  }
+
+  .main {
+    background-color: var(--card-bg-muted);
+  }
+}
+
 // as a button
 .link,
 .button {

diff --git a/src/components/layout/Card.tsx b/src/components/layout/Card.tsx
@@ -5,6 +5,7 @@ import { ExternalLink } from "components/general"
 import { Flex } from "../layout"
 import { ErrorBoundary, WithFetching } from "../feedback"
 import styles from "./Card.module.scss"
+import { useTheme } from "data/settings/Theme"
 
 const cx = classNames.bind(styles)
 
@@ -21,6 +22,7 @@ export interface Props extends QueryState {
   className?: string
   mainClassName?: string
   inputCard?: boolean
+  twoTone?: boolean
 
   /* button */
   onClick?: () => void
@@ -42,8 +44,11 @@ const Card = (props: PropsWithChildren<Props>) => {
     mainClassName,
     muted,
     inputCard,
+    twoTone,
   } = props
 
+  const { name } = useTheme()
+
   return (
     <WithFetching {...props} height={2}>
       {(progress, wrong) => {
@@ -56,6 +61,7 @@ const Card = (props: PropsWithChildren<Props>) => {
           link: to || href,
           button: onClick,
           error: wrong,
+          twoTone,
         }
 
         const cardClassName = cx(styles.card, size, style, className)
@@ -71,7 +77,9 @@ const Card = (props: PropsWithChildren<Props>) => {
               </header>
             )}
 
-            <section className={classNames(styles.main, mainClassName)}>
+            <section
+              className={classNames(styles.main, mainClassName, twoTone)}
+            >
               {wrong ?? (children && <ErrorBoundary>{children}</ErrorBoundary>)}
             </section>
           </>
@@ -82,7 +90,7 @@ const Card = (props: PropsWithChildren<Props>) => {
             {content}
           </ExternalLink>
         ) : to ? (
-          <Link to={to} className={cardClassName}>
+          <Link to={to} className={cx(cardClassName, name)}>
             {content}
           </Link>
         ) : onClick ? (

diff --git a/src/extension/App.tsx b/src/extension/App.tsx
@@ -17,29 +17,40 @@ import Auth from "./auth/Auth"
 import Header from "./layouts/Header"
 import Front from "./modules/Front"
 import ManageWallets from "./auth/SelectWallets"
-import { useInterchainAddresses, usePubkey } from "auth/hooks/useAddress"
+import { useAllInterchainAddresses, usePubkey } from "auth/hooks/useAddress"
 import { Flex } from "components/layout"
 import NetworkStatus from "components/display/NetworkStatus"
 import Preferences from "app/sections/Preferences"
 import { useAuth } from "auth"
 import is from "auth/scripts/is"
+import { useNetworks } from "app/InitNetworks"
+import { useTheme } from "data/settings/Theme"
 
 const App = () => {
-  const network = useNetwork()
+  const { networks } = useNetworks()
   const name = useNetworkName()
   const chainID = useChainID()
   const address = useAddress()
   const pubkey = usePubkey()
-  const addresses = useInterchainAddresses()
+  const addresses = useAllInterchainAddresses()
+  const { name: theme } = useTheme()
   const { wallet } = useAuth()
 
   useEffect(() => {
-    storeNetwork({ ...network[chainID], name }, network)
-  }, [network, chainID, name])
+    storeNetwork({ ...networks[name][chainID], name }, networks[name])
+  }, [networks, chainID, name])
 
   useEffect(() => {
     if (address)
-      storeWalletAddress(address, addresses ?? {}, is.ledger(wallet), pubkey)
+      storeWalletAddress({
+        address,
+        addresses: addresses ?? {},
+        name: wallet?.name,
+        ledger: is.ledger(wallet),
+        pubkey,
+        network: name,
+        theme,
+      })
     else clearWalletAddress()
   }, [address, addresses, pubkey, wallet])
 

diff --git a/src/extension/storage.ts b/src/extension/storage.ts
@@ -7,18 +7,21 @@ export const storeNetwork = (
   network: TerraNetwork,
   networks: Record<ChainID, InterchainNetwork>
 ) => {
-  extension.storage?.local.set({ network, networks })
+  extension.storage?.local.set({ network, networks, networkName: network.name })
 }
 
 /* wallet */
-export const storeWalletAddress = (
-  address: AccAddress,
-  addresses: Record<ChainID, AccAddress>,
-  ledger?: boolean,
+export const storeWalletAddress = (wallet: {
+  address: AccAddress
+  addresses: Record<ChainID, AccAddress>
+  name?: string
+  ledger?: boolean
   pubkey?: { "330": string; "118"?: string }
-) => {
+  network: string
+  theme: string
+}) => {
   extension.storage?.local.set({
-    wallet: { address, addresses, ledger, pubkey },
+    wallet,
   })
 }