Revert "feat: add account redesign"

apps/extension/src/@talisman/util/truncateString.ts

@@ -0,0 +1,3 @@
+/* eslint import/no-anonymous-default-export: [2, {"allowArrowFunction": true}] */
+export default (str?: string, start = 4, end = 4) =>
+  str ? `${str.substring(0, start)}...${str.substring(str.length - end)}` : null

apps/extension/src/ui/apps/dashboard/layout/LayoutBreadcrumb.tsx

@@ -4,8 +4,6 @@ import { FC, Fragment, ReactNode, useMemo } from "react"
 import { useTranslation } from "react-i18next"
 import { NavLink, To, useLocation } from "react-router-dom"
 
-import { MethodType } from "@ui/domains/Account/AccountAdd/context"
-
 const useBreadcrumbItems = (): Partial<Record<string, BreadcrumbItemProps[]>> => {
   const { t } = useTranslation()
 
@@ -15,10 +13,7 @@ const useBreadcrumbItems = (): Partial<Record<string, BreadcrumbItemProps[]>> =>
     // reusables
     const settings = { label: t("Settings"), to: "/settings/general" }
     const accounts = { label: t("Accounts"), to: "/settings/accounts" }
-    const accountsAdd = (methodType?: MethodType) => ({
-      label: t("Add Account"),
-      to: `/accounts/add${methodType ? `?methodType=${methodType}` : ""}`,
-    })
+    const accountsAdd = { label: t("Add Account"), to: "/accounts/add" }
     const securityAndPrivacy = {
       label: t("Security & Privacy"),
       to: "/settings/security-privacy-settings",
@@ -27,53 +22,53 @@ const useBreadcrumbItems = (): Partial<Record<string, BreadcrumbItemProps[]>> =>
 
     return {
       "/settings/accounts": [settings, accounts],
-      "/accounts/add": [settings, accounts, accountsAdd()],
+      "/accounts/add": [settings, accounts, accountsAdd],
       "/accounts/add/derived": [
         settings,
         accounts,
-        accountsAdd(),
+        accountsAdd,
         { label: t("New"), to: "/accounts/add/derived" },
       ],
       "/accounts/add/mnemonic": [
         settings,
         accounts,
-        accountsAdd("import"),
+        accountsAdd,
         { label: t("Recovery Phrase"), to: "/accounts/add/mnemonic" },
       ],
       "/accounts/add/pk": [
         settings,
         accounts,
-        accountsAdd("import"),
+        accountsAdd,
         { label: t("Private Key"), to: "/accounts/add/pk" },
       ],
       "/accounts/add/json": [
         settings,
         accounts,
-        accountsAdd("import"),
+        accountsAdd,
         { label: t("JSON"), to: "/accounts/add/json" },
       ],
       "/accounts/add/ledger": [
         settings,
         accounts,
-        accountsAdd("connect"),
+        accountsAdd,
         { label: t("Ledger"), to: "/accounts/add/ledger" },
       ],
       "/accounts/add/qr": [
         settings,
         accounts,
-        accountsAdd("connect"),
+        accountsAdd,
         { label: t("Polkadot Vault"), to: "/accounts/add/qr" },
       ],
       "/accounts/add/signet": [
         settings,
         accounts,
-        accountsAdd("connect"),
+        accountsAdd,
         { label: t("Signet Vault"), to: "/accounts/add/signet" },
       ],
       "/accounts/add/watched": [
         settings,
         accounts,
-        accountsAdd("watched"),
+        accountsAdd,
         { label: t("Watched Account"), to: "/accounts/add/watched" },
       ],
 

apps/extension/src/ui/apps/dashboard/routes/AccountAdd/AccountAddDcentWizard.tsx

@@ -1,6 +1,7 @@
-import { DashboardLayout } from "@ui/apps/dashboard/layout"
 import { AccountAddDcentDisabledMessage } from "@ui/domains/Account/AccountAdd/AccountAddDcent"
 
+import { DashboardLayout } from "../../layout"
+
 export const AccountAddDcentDashboardWizard = () => {
   return (
     <DashboardLayout sidebar="settings">

apps/extension/src/ui/apps/dashboard/routes/AccountAdd/AccountAddDerivedPage.tsx

@@ -4,10 +4,11 @@ import { useSearchParams } from "react-router-dom"
 import { AccountAddressType } from "@extension/core"
 import { HeaderBlock } from "@talisman/components/HeaderBlock"
 import { Spacer } from "@talisman/components/Spacer"
-import { DashboardLayout } from "@ui/apps/dashboard/layout"
 import { AccountAddDerivedForm } from "@ui/domains/Account/AccountAdd/AccountAddDerived/AccountAddDerivedForm"
 import { useSelectAccountAndNavigate } from "@ui/hooks/useSelectAccountAndNavigate"
 
+import { DashboardLayout } from "../../layout"
+
 const Content = () => {
   const { t } = useTranslation("admin")
   // get type paramter from url

apps/extension/src/ui/apps/dashboard/routes/AccountAdd/AccountAddJsonPage.tsx

@@ -2,19 +2,20 @@ import { useTranslation } from "react-i18next"
 
 import { HeaderBlock } from "@talisman/components/HeaderBlock"
 import { Spacer } from "@talisman/components/Spacer"
-import { DashboardLayout } from "@ui/apps/dashboard/layout"
 import { AccountAddJson } from "@ui/domains/Account/AccountAdd/AccountAddJson"
 import { useSelectAccountAndNavigate } from "@ui/hooks/useSelectAccountAndNavigate"
 
+import { DashboardLayout } from "../../layout"
+
 const Content = () => {
   const { t } = useTranslation("admin")
   const { setAddress } = useSelectAccountAndNavigate("/portfolio")
 
   return (
     <>
       <HeaderBlock
-        title={t("Import via JSON")}
-        text={t("Please choose the json file you exported from Polkadot.js or Talisman")}
+        title={t("Import JSON")}
+        text={t("Please choose the .json file you exported from Polkadot.js or Talisman")}
       />
       <Spacer />
       <AccountAddJson onSuccess={setAddress} />

apps/extension/src/ui/apps/dashboard/routes/AccountAdd/AccountAddSignetWizard.tsx

@@ -1,7 +1,8 @@
-import { DashboardLayout } from "@ui/apps/dashboard/layout"
 import { AccountAddSignetWizard } from "@ui/domains/Account/AccountAdd/AccountAddSignet/index"
 import { useSelectAccountAndNavigate } from "@ui/hooks/useSelectAccountAndNavigate"
 
+import { DashboardLayout } from "../../layout"
+
 const Content = () => {
   const { setAddress } = useSelectAccountAndNavigate("/portfolio")
 

apps/extension/src/ui/apps/dashboard/routes/AccountAdd/AccountAddWatchedPage.tsx

@@ -1,27 +1,23 @@
 import { useTranslation } from "react-i18next"
-import { useSearchParams } from "react-router-dom"
 
-import { AccountAddressType } from "@extension/core"
 import { HeaderBlock } from "@talisman/components/HeaderBlock"
 import { Spacer } from "@talisman/components/Spacer"
-import { DashboardLayout } from "@ui/apps/dashboard/layout"
 import { AccountAddWatchedForm } from "@ui/domains/Account/AccountAdd/AccountAddWatchedForm"
 import { useSelectAccountAndNavigate } from "@ui/hooks/useSelectAccountAndNavigate"
 
+import { DashboardLayout } from "../../layout"
+
 export const Content = () => {
   const { t } = useTranslation("admin")
-  // get type paramter from url
-  const [params] = useSearchParams()
-  const urlParamType = (params.get("type") ?? undefined) as AccountAddressType | undefined
   const { setAddress } = useSelectAccountAndNavigate("/portfolio")
 
   return (
     <>
       <HeaderBlock
-        title={t("Add a watched account")}
-        text={!urlParamType && t("What type of account would you like to create?")}
+        title={t("Choose account type")}
+        text={t("What type of account would you like to add?")}
       />
-      <Spacer small />
+      <Spacer />
       <AccountAddWatchedForm onSuccess={setAddress} />
     </>
   )

apps/extension/src/ui/apps/dashboard/routes/AccountAdd/index.tsx

@@ -1,10 +1,11 @@
 import { useTranslation } from "react-i18next"
 
 import { HeaderBlock } from "@talisman/components/HeaderBlock"
-import { DashboardLayout } from "@ui/apps/dashboard/layout"
 import { AccountCreateMenu } from "@ui/domains/Account/AccountAdd"
 import { useBalancesHydrate } from "@ui/state"
 
+import { DashboardLayout } from "../../layout"
+
 const Content = () => {
   useBalancesHydrate() // preload
   const { t } = useTranslation()
@@ -13,7 +14,7 @@ const Content = () => {
     <div className="flex flex-col gap-16">
       <HeaderBlock
         title={t("Add Account")}
-        text={t("Create a new account or import an existing account")}
+        text={t("Create a new account or import an existing one")}
       />
       <AccountCreateMenu />
     </div>

apps/extension/src/ui/apps/dashboard/routes/Networks/NetworkPage.tsx

@@ -3,14 +3,14 @@ import { useTranslation } from "react-i18next"
 import { useNavigate, useParams } from "react-router-dom"
 
 import { AnalyticsPage } from "@ui/api/analytics"
-import { DashboardLayout } from "@ui/apps/dashboard/layout"
 import {
   EvmNetworkForm,
   SubNetworkFormAdd,
   SubNetworkFormEdit,
 } from "@ui/domains/Settings/ManageNetworks/NetworkForm"
 import { useAnalyticsPageView } from "@ui/hooks/useAnalyticsPageView"
 
+import { DashboardLayout } from "../../layout"
 import { useNetworksType } from "./useNetworksType"
 
 const ANALYTICS_PAGE: AnalyticsPage = {

apps/extension/src/ui/apps/dashboard/routes/Networks/NetworksPage.tsx

@@ -12,7 +12,6 @@ import { OptionSwitch } from "@talisman/components/OptionSwitch"
 import { SearchInput } from "@talisman/components/SearchInput"
 import { Spacer } from "@talisman/components/Spacer"
 import { sendAnalyticsEvent } from "@ui/api/analytics"
-import { DashboardLayout } from "@ui/apps/dashboard/layout"
 import { EnableTestnetPillButton } from "@ui/domains/Settings/EnableTestnetPillButton"
 import { useAnalyticsPageView } from "@ui/hooks/useAnalyticsPageView"
 import {
@@ -22,6 +21,7 @@ import {
   getSettingValue$,
 } from "@ui/state"
 
+import { DashboardLayout } from "../../layout"
 import { ANALYTICS_PAGE } from "./analytics"
 import { ChainsList } from "./ChainsList"
 import { EvmNetworksList } from "./EvmNetworksList"

apps/extension/src/ui/apps/dashboard/routes/Portfolio/index.tsx

@@ -2,13 +2,13 @@ import { useEffect } from "react"
 import { Route, Routes, useSearchParams } from "react-router-dom"
 
 import { NavigateWithQuery } from "@talisman/components/NavigateWithQuery"
-import { DashboardLayout } from "@ui/apps/dashboard/layout"
 import { useBuyTokensModal } from "@ui/domains/Asset/Buy/useBuyTokensModal"
 import { DashboardPortfolioHeader } from "@ui/domains/Portfolio/DashboardPortfolioHeader"
 import { PortfolioContainer } from "@ui/domains/Portfolio/PortfolioContainer"
 import { PortfolioToolbarNfts } from "@ui/domains/Portfolio/PortfolioToolbarNfts"
 import { PortfolioToolbarTokens } from "@ui/domains/Portfolio/PortfolioToolbarTokens"
 
+import { DashboardLayout } from "../../layout"
 import { PortfolioAsset, PortfolioAssetHeader } from "./PortfolioAsset"
 import { PortfolioAssets } from "./PortfolioAssets"
 import { PortfolioNftCollection } from "./PortfolioNftCollection"

apps/extension/src/ui/apps/dashboard/routes/Settings/AboutPage.tsx

@@ -17,7 +17,8 @@ import {
   TERMS_OF_USE_URL,
 } from "@extension/shared"
 import { HeaderBlock } from "@talisman/components/HeaderBlock"
-import { DashboardLayout } from "@ui/apps/dashboard/layout"
+
+import { DashboardLayout } from "../../layout"
 
 const Content = () => {
   const { t } = useTranslation("admin")

apps/extension/src/ui/apps/dashboard/routes/Settings/AddressBookPage.tsx

@@ -31,7 +31,6 @@ import { Spacer } from "@talisman/components/Spacer"
 import { SuspenseTracker } from "@talisman/components/SuspenseTracker"
 import { useOpenClose } from "@talisman/hooks/useOpenClose"
 import { AnalyticsPage } from "@ui/api/analytics"
-import { DashboardLayout } from "@ui/apps/dashboard/layout"
 import { AccountIcon } from "@ui/domains/Account/AccountIcon"
 import { Address } from "@ui/domains/Account/Address"
 import { useCopyAddressModal } from "@ui/domains/CopyAddress"
@@ -46,6 +45,8 @@ import { useAnalyticsPageView } from "@ui/hooks/useAnalyticsPageView"
 import { useSendFundsPopup } from "@ui/hooks/useSendFundsPopup"
 import { useBalances, useChainByGenesisHash } from "@ui/state"
 
+import { DashboardLayout } from "../../layout"
+
 const ANALYTICS_PAGE: AnalyticsPage = {
   container: "Fullscreen",
   feature: "Settings",

apps/extension/src/ui/apps/dashboard/routes/Settings/AnalyticsOptInPage.tsx

@@ -2,10 +2,11 @@ import { useTranslation } from "react-i18next"
 import { Toggle } from "talisman-ui"
 
 import { Setting } from "@talisman/components/Setting"
-import { DashboardLayout } from "@ui/apps/dashboard/layout"
 import { AnalyticsOptInInfo } from "@ui/domains/Settings/Analytics/AnalyticsOptInInfo"
 import { useSetting } from "@ui/state"
 
+import { DashboardLayout } from "../../layout"
+
 const Content = () => {
   const { t } = useTranslation("admin")
   const [useAnalyticsTracking, setUseAnalyticsTracking] = useSetting("useAnalyticsTracking")

apps/extension/src/ui/apps/dashboard/routes/Settings/AssetsDiscovery/AssetDiscoveryPage.tsx

@@ -42,7 +42,6 @@ import { Spacer } from "@talisman/components/Spacer"
 import { shortenAddress } from "@talisman/util/shortenAddress"
 import { api } from "@ui/api"
 import { AnalyticsPage } from "@ui/api/analytics"
-import { DashboardLayout } from "@ui/apps/dashboard/layout"
 import { AccountIcon } from "@ui/domains/Account/AccountIcon"
 import { AccountsStack } from "@ui/domains/Account/AccountIconsStack"
 import { ChainLogo } from "@ui/domains/Asset/ChainLogo"
@@ -71,6 +70,7 @@ import {
 import { isErc20Token } from "@ui/util/isErc20Token"
 import { isUniswapV2Token } from "@ui/util/isUniswapV2Token"
 
+import { DashboardLayout } from "../../../layout"
 import {
   useAssetDiscoveryFetchTokenRates,
   useAssetDiscoveryTokenRates,

apps/extension/src/ui/apps/dashboard/routes/Settings/AutoLockTimerPage.tsx

@@ -4,9 +4,10 @@ import { useTranslation } from "react-i18next"
 import { ExclusiveButtonsList } from "@talisman/components/ExclusiveButtonsList"
 import { HeaderBlock } from "@talisman/components/HeaderBlock"
 import { Spacer } from "@talisman/components/Spacer"
-import { DashboardLayout } from "@ui/apps/dashboard/layout"
 import { useSetting } from "@ui/state"
 
+import { DashboardLayout } from "../../layout"
+
 type Option = { value: number; label: string }
 
 export const Content = () => {

apps/extension/src/ui/apps/dashboard/routes/Settings/ConnectedSitesPage.tsx

@@ -1,6 +1,7 @@
-import { DashboardLayout } from "@ui/apps/dashboard/layout"
 import { AuthorisedSites } from "@ui/domains/Settings/AuthorisedSites/AuthorisedSites"
 
+import { DashboardLayout } from "../../layout"
+
 export const ConnectedSitesPage = () => (
   <DashboardLayout sidebar="settings">
     <AuthorisedSites />

apps/extension/src/ui/apps/dashboard/routes/Settings/CurrencySettingsPage.tsx

@@ -3,11 +3,12 @@ import { useTranslation } from "react-i18next"
 
 import { HeaderBlock } from "@talisman/components/HeaderBlock"
 import { Spacer } from "@talisman/components/Spacer"
-import { DashboardLayout } from "@ui/apps/dashboard/layout"
 import { currencyConfig, currencyOrder, sortCurrencies } from "@ui/domains/Asset/currencyConfig"
 import { useFavoriteCurrencies } from "@ui/hooks/useFavoriteCurrencies"
 import { useSetting } from "@ui/state"
 
+import { DashboardLayout } from "../../layout"
+
 const Content = () => {
   const [favorites, setFavorites] = useFavoriteCurrencies()
   const [, setSelected] = useSetting("selectedCurrency")

apps/extension/src/ui/apps/dashboard/routes/Settings/GeneralPage.tsx

@@ -17,11 +17,12 @@ import { SPIRIT_KEYS_DOCS_URL } from "@extension/shared"
 import { HeaderBlock } from "@talisman/components/HeaderBlock"
 import { Setting } from "@talisman/components/Setting"
 import { AnalyticsPage } from "@ui/api/analytics"
-import { DashboardLayout } from "@ui/apps/dashboard/layout"
 import { AvatarTypeSelect } from "@ui/domains/Settings/AvatarTypeSelect"
 import { useRuntimeReload } from "@ui/hooks/useRuntimeReload"
 import { useAppState, useSetting } from "@ui/state"
 
+import { DashboardLayout } from "../../layout"
+
 const ANALYTICS_PAGE: AnalyticsPage = {
   container: "Fullscreen",
   feature: "Settings",

apps/extension/src/ui/apps/dashboard/routes/Settings/LanguagePage.tsx

@@ -5,7 +5,8 @@ import { languages } from "@common/i18nConfig"
 import { ExclusiveButtonsList } from "@talisman/components/ExclusiveButtonsList"
 import { HeaderBlock } from "@talisman/components/HeaderBlock"
 import { Spacer } from "@talisman/components/Spacer"
-import { DashboardLayout } from "@ui/apps/dashboard/layout"
+
+import { DashboardLayout } from "../../layout"
 
 const Content = () => {
   const { t, i18n } = useTranslation()

apps/extension/src/ui/apps/dashboard/routes/Settings/NetworksTokensPage.tsx

@@ -12,9 +12,10 @@ import { CtaButton, Toggle } from "talisman-ui"
 import { HeaderBlock } from "@talisman/components/HeaderBlock"
 import { Setting } from "@talisman/components/Setting"
 import { Spacer } from "@talisman/components/Spacer"
-import { DashboardLayout } from "@ui/apps/dashboard/layout"
 import { useSetting } from "@ui/state"
 
+import { DashboardLayout } from "../../layout"
+
 const Content = () => {
   const { t } = useTranslation("admin")
   const [useTestnets, setUseTestnets] = useSetting("useTestnets")

apps/extension/src/ui/apps/dashboard/routes/Settings/QrMetadataPage.tsx

@@ -10,7 +10,6 @@ import { FadeIn } from "@talisman/components/FadeIn"
 import { HeaderBlock } from "@talisman/components/HeaderBlock"
 import { notify } from "@talisman/components/Notifications"
 import { api } from "@ui/api"
-import { DashboardLayout } from "@ui/apps/dashboard/layout"
 import {
   MnemonicCreateModal,
   MnemonicCreateModalProvider,
@@ -22,6 +21,8 @@ import { MetadataQrCode } from "@ui/domains/Sign/Qr/MetadataQrCode"
 import { NetworkSpecsQrCode } from "@ui/domains/Sign/Qr/NetworkSpecsQrCode"
 import { useAppState, useBalancesHydrate, useChains, useMnemonic } from "@ui/state"
 
+import { DashboardLayout } from "../../layout"
+
 const SetVerifierCertificateContentInner = () => {
   const { t } = useTranslation("admin")
   const navigate = useNavigate()