add pseudo authorization

app/globals.css

@@ -5344,3 +5344,7 @@ h4 {
   margin-bottom: 0.5em;
   margin-top: 0.5em;
 }
+
+.is-open-add-account-modal {
+  opacity: 0.4;
+}

app/testnet/account/testnet.tsx

@@ -40,20 +40,16 @@ const PublicNet: FC<Props> = ({ id }) => {
             try {
                 await server.loadAccount(account);
                 setExists(true);
-                console.log('valid')
                 // Navigate to the account page if the account exists
             } catch (e) {
                 if (e instanceof StellarSdk.NotFoundError) {
                     setExists(false);
                     setErrorvalid('Error: Account does not exist on the network. Make sure that you copied account address correctly and there was at least one payment to this address.')
-                } else {
-                    console.error(e);
                 }
             }
         };
 
         if (StellarSdk.StrKey.isValidEd25519PublicKey(account)) {
-            console.log('true')
             checkAccount();
 
         } else {

package.json

@@ -2,7 +2,7 @@
     "name": "mtl-stellar-multisig",
     "version": "0.1.0",
     "private": true,
-    "homepage": "https://stellar-multisig.montelibero.org",
+    "homepage": "https://monobladegg.github.io/stellar-multisig-stanging",
     "scripts": {
         "dev": "next dev",
         "build": "next build",

src/features/store/index.ts

@@ -2,15 +2,16 @@ import { create } from "zustand";
 import { devtools, subscribeWithSelector } from "zustand/middleware";
 import { immer } from "zustand/middleware/immer";
 
-import { netSlice, themeSlice } from "./slices";
+import { netSlice, themeSlice, accountSlice } from "./slices";
 import { Store } from "@/shared/types"
 
 export const useStore = create<Store>()(
   devtools(
     subscribeWithSelector(
       immer((...a) => ({
         ...netSlice(...a),
-        ...themeSlice(...a)
+        ...themeSlice(...a),
+        ...accountSlice(...a)
       }))
     )
   )

src/features/store/slices/accountsSlice/index.ts

@@ -0,0 +1,38 @@
+import { IAccountsSlice, IAccount } from "@/shared/types";
+import { StateCreator } from "zustand";
+
+export const accountSlice: StateCreator<
+  IAccountsSlice,
+  [["zustand/immer", never]],
+  [],
+  IAccountsSlice
+> = (set/*, get*/) => {
+  const accounts: IAccount[] = [];
+  const isOpenAddAccountModal = false;
+  const currentAccount = null
+  const isAuth = false
+
+  const setIsAuth = (isAuth: boolean) => {
+    set({ isAuth: isAuth });
+  };
+
+  const setAccounts = (accounts: IAccount[]) => {
+    set({ accounts: accounts });
+    localStorage.setItem("accounts", JSON.stringify(accounts));
+  };
+
+  const setIsOpenAddAccountModal = (isOpenAddAccountModal: boolean) => {
+    set({ isOpenAddAccountModal: isOpenAddAccountModal });
+  };
+
+
+  return {
+    accounts,
+    setAccounts,
+    isOpenAddAccountModal,
+    setIsOpenAddAccountModal,
+    isAuth,
+    currentAccount,
+    setIsAuth
+  };
+};

src/features/store/slices/index.ts

@@ -1,2 +1,3 @@
 export { netSlice } from "./netSlice"
-export { themeSlice } from "./themeSlice"
+export { themeSlice } from "./themeSlice"
+export { accountSlice } from "./accountsSlice"

src/pages/Layout/layout.tsx

@@ -4,6 +4,9 @@ import { FC, useEffect, useState } from "react";
 import { useStore } from "@/features/store";
 import { Footer, Header } from "@/widgets";
 import { useShallow } from "zustand/react/shallow";
+import AddAccountModal from "@/widgets/shared/layouts/Header/ui/AddAccountModal";
+import Script from "next/script";
+import Head from "next/head";
 
 type Props = {
   children: React.ReactNode;
@@ -12,22 +15,41 @@ type Props = {
 const PageLayout: FC<Props> = ({ children }) => {
   const [isWindowDefined, setIsWindowDefined] = useState(false);
 
-  const { theme, setTheme, setNet } = useStore(
-    useShallow((state) => ({
-      theme: state.theme,
-      setTheme: state.setTheme,
-      setNet: state.setNet,
-    }))
-  );
+  const {
+    theme,
+    setTheme,
+    setNet,
+    setAccounts,
+    accounts,
+    isOpenAddAccountModal,
+    setIsAuth,
+    net,
+  } = useStore(useShallow((state) => state));
 
   useEffect(() => {
     setIsWindowDefined(typeof window !== "undefined");
     if (isWindowDefined) {
-      if (localStorage.getItem("theme"))
+      if (localStorage.getItem("theme")) {
         setTheme(localStorage.getItem("theme")!);
-      if (localStorage.getItem("net")) setNet(localStorage.getItem("net")!);
+      }
+
+      if (localStorage.getItem("net")) {
+        setNet(localStorage.getItem("net")!);
+      }
+
+      if (localStorage.getItem("accounts")) {
+        setAccounts(JSON.parse(localStorage.getItem("accounts")!));
+      }
     }
-  }, [setTheme, setNet, isWindowDefined]);
+  }, [isWindowDefined, setTheme, setNet, setAccounts]);
+
+  useEffect(() => {
+    setIsAuth(
+      accounts
+        .filter((account) => account.net === net)
+        .filter((account) => account.isCurrent).length > 0
+    );
+  }, [accounts, net, setIsAuth]);
 
   const themeLS: string | undefined | null = isWindowDefined
     ? window.localStorage.getItem("theme")
@@ -38,7 +60,7 @@ const PageLayout: FC<Props> = ({ children }) => {
   if (!isWindowDefined) {
     return (
       <html>
-        <head>
+        <Head>
           <meta
             name="viewport"
             content="width=device-width, initial-scale=1.0"
@@ -48,29 +70,38 @@ const PageLayout: FC<Props> = ({ children }) => {
             content={process.env.NEXT_PUBLIC_COMMIT_HASH || ""}
           />
           <title>Stellar Multisig</title>
-        </head>
+        </Head>
         <body></body>
       </html>
     );
   }
 
   return (
     <html lang="en" data-theme={!theme || themeLS}>
-      <head>
+      <Head>
         <meta name="viewport" content="width=device-width, initial-scale=1.0" />
         <meta
           name="commit-hash"
           content={process.env.NEXT_PUBLIC_COMMIT_HASH || ""}
         />
         <title>Stellar Multisig</title>
-      </head>
+      </Head>
       <body>
-        <main className="flex min-h-screen flex-col">
+        <main
+          className={`flex min-h-screen flex-col ${
+            isOpenAddAccountModal && "is-open-add-account-modal"
+          }`}
+        >
           <hr className="blue-ribbon" />
           <Header />
           {children}
           <Footer />
         </main>
+        {isOpenAddAccountModal && <AddAccountModal />}
+        <Script
+          src="https://kit.fontawesome.com/b02b92140a.js"
+          crossOrigin="anonymous"
+        />
       </body>
     </html>
   );

src/pages/public/account/publicnet.tsx

@@ -1,3 +1,4 @@
+
 "use client";
 
 import { MainLayout } from "@/widgets";
@@ -21,6 +22,15 @@ interface Props {
   id: string | undefined | null;
 }
 
+export const collapseAccount = (accountId: string) => {
+  if (accountId == "" || accountId == null || accountId == undefined) {
+    return <br />;
+  }
+  const first4Str = accountId.substring(0, 4);
+  const last4Str = accountId.substr(-4);
+  return first4Str + "..." + last4Str;
+};
+
 const PublicNet: FC<Props> = ({ id }) => {
   const account = id
   const { net } = useStore(useShallow((state) => ({ net: state.net })));
@@ -125,14 +135,6 @@ const PublicNet: FC<Props> = ({ id }) => {
     handler();
   }, [account]);
 
-  const collapseAccount = (accountId: string) => {
-    if (accountId == "" || accountId == null || accountId == undefined) {
-      return <br />;
-    }
-    const first4Str = accountId.substring(0, 4);
-    const last4Str = accountId.substr(-4);
-    return first4Str + "..." + last4Str;
-  };
 
   return (
     <MainLayout>

src/pages/public/assets/AssetsListItem.tsx

@@ -76,4 +76,4 @@ const AssetsListItem: FC<Props> = ({ item, tags }) => {
   );
 };
 
-export default AssetsListItem;
+export default AssetsListItem;

src/shared/lib/processKeys/index.ts

@@ -58,4 +58,4 @@ const processKeys = (
   return { processedKey, processedValue };
 };
 
-export default processKeys;
+export default processKeys;

src/shared/types/index.ts

@@ -2,7 +2,7 @@
 // @ts-ignore
 
 export { type default as Store } from "./store";
-export type { INetSlice, IThemeSlice } from "@/shared/types/store/slices";
+export type { INetSlice, IThemeSlice, IAccountsSlice, IAccount } from "@/shared/types/store/slices";
 export type {
     Information,
     Issuer,

src/shared/types/store/index.ts

@@ -1,5 +1,5 @@
-import { INetSlice, IThemeSlice } from "@/shared/types/store/slices";
+import { IAccountsSlice, INetSlice, IThemeSlice } from "@/shared/types/store/slices";
 
-interface Store extends INetSlice, IThemeSlice {}
+interface Store extends INetSlice, IThemeSlice, IAccountsSlice {}
 
 export default Store;

src/shared/types/store/slices/accountsSlice/index.ts

@@ -0,0 +1,24 @@
+export type IAccount = {
+  id: string
+  accountID: string
+  isMultiSig: boolean
+  isCurrent: boolean
+  net: string
+}
+
+export interface AccountState {
+  accounts: IAccount[]
+  isOpenAddAccountModal: boolean
+  isAuth: boolean
+  currentAccount: IAccount | null
+}
+
+export interface AccountActions {
+  setAccounts: (Accounts: IAccount[]) => void
+  setIsOpenAddAccountModal: (isOpenAddAccountModal: boolean) => void
+  setIsAuth: (isAuth: boolean) => void
+}
+
+interface IAccountsSlice extends AccountState, AccountActions {}
+
+export default IAccountsSlice

src/shared/types/store/slices/index.ts

@@ -1,2 +1,3 @@
 export {type default as INetSlice} from "./netSlice"
-export {type default as IThemeSlice} from "./themeSlice"
+export {type default as IThemeSlice} from "./themeSlice"
+export {type default as IAccountsSlice, type IAccount} from "./accountsSlice"

src/widgets/shared/layouts/Header/ui/AccountItem/index.ts

@@ -0,0 +1 @@
+export {default} from "./ui"

src/widgets/shared/layouts/Header/ui/AccountItem/ui/index.tsx

@@ -0,0 +1,70 @@
+import { FC } from "react";
+import Link from "next/link";
+import { useStore } from "@/features/store";
+import { useShallow } from "zustand/react/shallow";
+import { collapseAccount } from "@/pages/public/account/publicnet";
+import { IAccount } from "@/shared/types";
+
+interface Props {
+  id: string;
+  isOpenAccount: boolean;
+  setIsOpenAccount: (isOpenAccount: boolean) => void;
+  isMain?: boolean;
+  account: IAccount;
+}
+
+const AccountItem: FC<Props> = ({
+  id,
+  isOpenAccount,
+  setIsOpenAccount,
+  isMain = true,
+  account,
+}) => {
+  const { net, theme, accounts, setAccounts } = useStore(
+    useShallow((state) => ({
+      net: state.net,
+      theme: state.theme,
+      accounts: state.accounts,
+      setAccounts: state.setAccounts,
+    }))
+  );
+
+  const handleAccount = () => {
+    setIsOpenAccount(!isOpenAccount);
+
+    // Обновляем аккаунты только если они находятся на одном и том же 'net'
+    const updatedAccounts = accounts.map(
+      (account) =>
+        account.net === net
+          ? account.accountID === id
+            ? { ...account, isCurrent: true }
+            : { ...account, isCurrent: false }
+          : account // Не трогаем аккаунты с другим 'net'
+    );
+
+    setAccounts(updatedAccounts);
+  };
+
+  return (
+    <Link href={`/${net}/account?id=${id}`}>
+      <li
+        className={
+          theme === "night"
+            ? `dropdown-item ${isMain && "selected"}`
+            : `dropdown-item-light ${isMain && "selected"}`
+        }
+        style={{ textAlign: "center" }}
+        onClick={handleAccount}
+      >
+        {account?.isMultiSig ? (
+          <i className="fa-solid fa-users"></i>
+        ) : (
+          <i className="fa-solid fa-user"></i>
+        )}{" "}
+        {collapseAccount(id)}
+      </li>
+    </Link>
+  );
+};
+
+export default AccountItem;

src/widgets/shared/layouts/Header/ui/AddAccountModal/index.ts

@@ -0,0 +1 @@
+export {default} from "./ui"