feat: multisignature manager

.env.example

@@ -21,3 +21,6 @@ INDEXER_ENDPOINT=indexer.local
 
 NEXT_PUBLIC_POSTHOG_KEY=ph_project_api_key
 NEXT_PUBLIC_POSTHOG_HOST=ph_instance_address
+
+FAUNADB_SECRET=fauna_db_secret_key
+FAUNADB_URL=fauna_db_url

.yarnrc.yml

@@ -13,10 +13,18 @@ enableGlobalCache: false
 
 nodeLinker: node-modules
 
+npmRegistryServer: "http://npm.haqq.sh"
+
 npmScopes:
+  npm:
+    npmAuthToken: yRcr2MaVexpigup8O46NCtAPb6OfFKeBlSwenr83ACQ=
+    npmRegistryServer: "http://npm.haqq.sh"
   buf:
     npmRegistryServer: "https://buf.build/gen/npm/v1"
 
+unsafeHttpWhitelist:
+  - npm.haqq.sh
+
 tsEnableAutoTypes: true
 
 yarnPath: .yarn/releases/yarn-4.1.0.cjs

apps/shell/src/app/app-wrapper.tsx

@@ -109,6 +109,7 @@ function HeaderButtons({
         <HeaderNavLink href="/staking">Staking</HeaderNavLink>
         <HeaderNavLink href="/governance">Governance</HeaderNavLink>
         <HeaderNavLink href="/authz">Authz</HeaderNavLink>
+        <HeaderNavLink href="/multisig">Multisig</HeaderNavLink>
       </nav>
 
       <div className="hidden pl-[80px] lg:block">

apps/shell/src/app/app.tsx

@@ -35,6 +35,14 @@ const AirdropPage = lazy(async () => {
   const { AirdropPage } = await import('@haqq/shell-airdrop');
   return { default: AirdropPage };
 });
+const MultisigMainPage = lazy(async () => {
+  const { MultisigMainPage } = await import('@haqq/shell-multisig');
+  return { default: MultisigMainPage };
+});
+const MultisigAddressPage = lazy(async () => {
+  const { MultisigAddressPage } = await import('@haqq/shell-multisig');
+  return { default: MultisigAddressPage };
+});
 
 export function App() {
   return (
@@ -54,6 +62,7 @@ export function App() {
             </Routes>
           }
         />
+
         <Route
           path="/governance/*"
           element={
@@ -63,19 +72,38 @@ export function App() {
             </Routes>
           }
         />
+
         <Route path="/authz" element={<ShellAuthzPage />} />
+
         <Route
-          path="/airdrop"
+          path="/airdrop/*"
           element={
-            <AirdropPage
-              turnstileSiteKey={environment.turnstileSiteKey}
-              airdropEndpoint={environment.airdropEndpoint}
-            />
+            <Routes>
+              <Route
+                path="/"
+                element={
+                  <AirdropPage
+                    turnstileSiteKey={environment.turnstileSiteKey}
+                    airdropEndpoint={environment.airdropEndpoint}
+                  />
+                }
+              />
+              <Route
+                path="/revision-address"
+                element={<Navigate to="/airdrop" replace />}
+              />
+            </Routes>
           }
         />
+
         <Route
-          path="/airdrop/revision-address"
-          element={<Navigate to="/airdrop" replace />}
+          path="/multisig/*"
+          element={
+            <Routes>
+              <Route path="/" element={<MultisigMainPage />} />
+              <Route path=":address" element={<MultisigAddressPage />} />
+            </Routes>
+          }
         />
 
         <Route path="not-found" element={<NotFoundPage />} />

apps/shell/src/environments/environment.prod.ts

@@ -5,4 +5,6 @@ export const environment = {
   turnstileSiteKey: process.env['NX_TURNSTILE_SITEKEY'],
   airdropEndpoint: process.env['NX_AIRDROP_ENDPOINT'],
   commitSha: process.env['GIT_COMMIT_SHA'],
+  faunaDbSecret: process.env['FAUNADB_SECRET'],
+  faunaDbUrl: process.env['FAUNADB_URL'],
 };

apps/shell/src/environments/environment.ts

@@ -5,4 +5,6 @@ export const environment = {
   turnstileSiteKey: process.env['NX_TURNSTILE_SITEKEY'],
   airdropEndpoint: process.env['NX_AIRDROP_ENDPOINT'],
   commitSha: process.env['GIT_COMMIT_SHA'],
+  faunaDbSecret: process.env['FAUNADB_SECRET'],
+  faunaDbUrl: process.env['FAUNADB_URL'],
 };

apps/shell/tsconfig.app.json

@@ -23,5 +23,14 @@
     "src/**/*.spec.jsx",
     "src/**/*.test.jsx"
   ],
-  "include": ["src/**/*.js", "src/**/*.jsx", "src/**/*.ts", "src/**/*.tsx"]
+  "include": [
+    "src/**/*.js",
+    "src/**/*.jsx",
+    "src/**/*.ts",
+    "src/**/*.tsx",
+    "../../libs/multisig/src/lib/utils/display-helpers.ts",
+    "../../libs/multisig/src/lib/utils/graphql-helpers.ts",
+    "../../libs/multisig/src/lib/utils/multisig-helpers.ts",
+    "../../libs/multisig/src/lib/utils/request.ts"
+  ]
 }

apps/shell/webpack.config.js

@@ -24,6 +24,10 @@ module.exports = composePlugins(
               process.env['VERCEL_GIT_COMMIT_SHA'] ??
               'dev',
           ),
+          'process.env.FAUNADB_SECRET': JSON.stringify(
+            process.env.FAUNADB_SECRET,
+          ),
+          'process.env.FAUNADB_URL': JSON.stringify(process.env.FAUNADB_URL),
         }),
       ],
       node: { global: true },
@@ -41,6 +45,16 @@ module.exports = composePlugins(
           url: false,
         },
       },
+      ignoreWarnings: [
+        { module: /next/ },
+        { module: /cosmjs-types/ },
+        { module: /ethereumjs-util/ },
+        { module: /@evmos/ },
+        { module: /@walletconnect/ },
+        { module: /@cosmjs/ },
+        { module: /@haqqjs/ },
+        { module: /@confio/ },
+      ],
     });
   },
 );

apps/shell/webpack.config.prod.js

@@ -24,6 +24,10 @@ module.exports = composePlugins(
               process.env['VERCEL_GIT_COMMIT_SHA'] ??
               'dev',
           ),
+          'process.env.FAUNADB_SECRET': JSON.stringify(
+            process.env.FAUNADB_SECRET,
+          ),
+          'process.env.FAUNADB_URL': JSON.stringify(process.env.FAUNADB_URL),
         }),
       ],
       node: { global: true },
@@ -41,6 +45,16 @@ module.exports = composePlugins(
           url: false,
         },
       },
+      ignoreWarnings: [
+        { module: /next/ },
+        { module: /cosmjs-types/ },
+        { module: /ethereumjs-util/ },
+        { module: /@evmos/ },
+        { module: /@walletconnect/ },
+        { module: /@cosmjs/ },
+        { module: /@haqqjs/ },
+        { module: /@confio/ },
+      ],
     });
   },
 );

apps/vesting/src/OnboardingContainer.tsx

@@ -1,6 +1,6 @@
 import {
   createContext,
-  ReactElement,
+  PropsWithChildren,
   useCallback,
   useContext,
   useEffect,
@@ -34,7 +34,7 @@ export interface OnboardingHook {
 
 const OnboardingContext = createContext<OnboardingHook | undefined>(undefined);
 
-export function OnboardingContainer({ children }: { children: ReactElement }) {
+export function OnboardingContainer({ children }: PropsWithChildren) {
   const { chain } = useNetwork();
   const { chains, switchNetworkAsync } = useSwitchNetwork();
   const [step, setOnboardingStep] = useState<OnboardingSteps>('start');

apps/vesting/src/app/app-container.tsx

@@ -1,25 +1,32 @@
-import { ReactElement } from 'react';
-import { haqqMainnet } from '@wagmi/chains';
+import { PropsWithChildren } from 'react';
 import { BrowserRouter } from 'react-router-dom';
+import { haqqMainnet, haqqTestedge2 } from 'viem/chains';
 import {
   CosmosProvider,
   ReactQueryProvider,
+  Toaster,
   WagmiProvider,
+  WalletProvider,
 } from '@haqq/shared';
 import { environment } from '../environments/environment';
 import { OnboardingContainer } from '../OnboardingContainer';
 
-export function AppContainer({ children }: { children: ReactElement }) {
+export function AppContainer({ children }: PropsWithChildren) {
   return (
     <BrowserRouter>
       <ReactQueryProvider>
         <WagmiProvider
           walletConnectProjectId={environment.walletConnectProjectId}
-          supportedChains={[haqqMainnet]}
+          supportedChains={[haqqMainnet, haqqTestedge2]}
         >
-          <CosmosProvider>
-            <OnboardingContainer>{children}</OnboardingContainer>
-          </CosmosProvider>
+          <WalletProvider>
+            <CosmosProvider>
+              <OnboardingContainer>
+                {children}
+                <Toaster />
+              </OnboardingContainer>
+            </CosmosProvider>
+          </WalletProvider>
         </WagmiProvider>
       </ReactQueryProvider>
     </BrowserRouter>

apps/vesting/src/components/Button/Button.tsx

@@ -1,5 +1,6 @@
 import { ReactNode, SyntheticEvent } from 'react';
 import clsx from 'clsx';
+import { Loader } from '../Loader/Loader';
 
 export interface ButtonProps {
   children: ReactNode;
@@ -10,6 +11,7 @@ export interface ButtonProps {
   fill?: boolean;
   type?: 'submit' | 'reset' | 'button';
   onClick?: (event: SyntheticEvent<HTMLButtonElement, MouseEvent>) => void;
+  isPending?: boolean;
 }
 
 export function Button({
@@ -20,28 +22,36 @@ export function Button({
   fill = false,
   type = 'button',
   className,
+  isPending = false,
 }: ButtonProps) {
   const classNames = clsx(
     outline
-      ? 'bg-transparent text-primary border-[2px] border-solid border-primary hover:text-[#20d775] hover:border-[#20d775]'
-      : 'bg-primary text-white hover:bg-[#20d775]',
-    'bg-primary text-white hover:bg-[#20d775]',
-    'text-base font-semibold font-sans leading-[24px]',
-    'rounded-[8px] py-[8px] px-[16px] appearance-none box-border',
+      ? 'bg-transparent text-primary border-[1px] border-solid border-primary hover:text-[#20d775] hover:border-[#20d775] py-[10px]'
+      : 'bg-primary text-white hover:bg-[#20d775] py-[11px]',
+    'text-[14px] font-semibold font-sans leading-[20px]',
+    'rounded-[8px] px-[16px] appearance-none relative',
     'transition-colors duration-150 ease-linear',
     fill ? 'w-full' : 'inline-block',
-    { 'opacity-75 cursor-not-allowed': disabled },
+    disabled && 'opacity-75 cursor-not-allowed',
+    isPending && 'cursor-wait',
     className,
   );
 
   return (
     <button
       type={type}
-      disabled={disabled}
       onClick={onClick}
       className={classNames}
+      disabled={disabled || isPending}
     >
-      {children}
+      <span className={clsx(isPending && 'invisible')}>{children}</span>
+
+      <Loader
+        className={clsx(
+          'pointer-events-none absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2',
+          isPending ? 'visible' : 'invisible',
+        )}
+      />
     </button>
   );
 }
@@ -57,10 +67,10 @@ export function DangerButton({
 }: ButtonProps) {
   const classNames = clsx(
     outline
-      ? 'bg-transparent text-danger border-[2px] border-solid border-danger hover:text-[#ff0000] hover:border-[#ff0000]'
-      : 'bg-danger text-white hover:bg-[#ff0000]',
-    'text-base font-semibold font-sans leading-[24px]',
-    'rounded-[8px] py-[8px] px-[16px] appearance-none box-border',
+      ? 'bg-transparent text-danger border-[1px] border-solid border-danger hover:text-[#ff0000] hover:border-[#ff0000] py-[10px]'
+      : 'bg-danger text-white hover:bg-[#ff0000] py-[11px]',
+    'text-[14px] font-semibold font-sans leading-[20px]',
+    'rounded-[8px] px-[16px] appearance-none box-border',
     'transition-colors duration-150 ease-linear',
     fill ? 'w-full' : 'inline-block',
     { 'opacity-75 cursor-not-allowed': disabled },