Merge pull request #956 from haqq-network/dev

release

.eslintrc.base.json

@@ -2,6 +2,7 @@
   "root": true,
   "ignorePatterns": ["**/*"],
   "plugins": ["@nx", "import", "prettier"],
+  "extends": ["plugin:i18next/recommended"],
   "overrides": [
     {
       "files": ["*.ts", "*.tsx", "*.js", "*.jsx"],
@@ -97,6 +98,13 @@
         "newlines-between": "never"
       }
     ],
-    "prettier/prettier": "error"
+    "prettier/prettier": "error",
+    "i18next/no-literal-string": [
+      "warn",
+      {
+        "markupOnly": true,
+        "ignoreAttribute": ["data-testid", "to"]
+      }
+    ]
   }
 }

.gitignore

@@ -59,3 +59,5 @@ package-lock.json
 
 # Sentry Config File
 .env.sentry-build-plugin
+
+**/vite.config.{js,ts,mjs,mts,cjs,cts}.timestamp*

apps/shell/messages/ar.json

@@ -0,0 +1,3 @@
+{
+  "hello-world": "مرحبا بالعالم!"
+}

apps/shell/messages/en.json

@@ -0,0 +1,3 @@
+{
+  "hello-world": "Hello, World!"
+}

apps/shell/messages/id.json

@@ -0,0 +1,3 @@
+{
+  "hello-world": "Halo Dunia!"
+}

apps/shell/messages/tr.json

@@ -0,0 +1,3 @@
+{
+  "hello-world": "Merhaba Dünya!"
+}

apps/shell/next.config.mjs

@@ -2,12 +2,15 @@
 // import { fileURLToPath } from 'node:url';
 import { composePlugins, withNx } from '@nx/next';
 import { withSentryConfig } from '@sentry/nextjs';
+import createNextIntlPlugin from 'next-intl/plugin';
 // import createJiti from 'jiti';
 // const jiti = createJiti(fileURLToPath(import.meta.url));
 
 // // Validate during build.
 // jiti('./src/env/client.ts');
 
+const withNextIntl = createNextIntlPlugin();
+
 /**
  * @type {import('@nx/next/plugins/with-nx').WithNxOptions}
  **/
@@ -100,6 +103,7 @@ const sentryWebpackPluginOptions = {
 const plugins = [
   // Add more Next.js plugins to this list if needed.
   withNx,
+  withNextIntl,
 ];
 
 export default withSentryConfig(

apps/shell/src/app/authz/page.tsx → apps/shell/src/app/[locale]/authz/page.tsx

@@ -11,7 +11,7 @@ import {
   indexerBalancesFetcher,
   parseWagmiCookies,
 } from '@haqq/shell-shared';
-import { supportedChainsIds } from '../../config/wagmi-config';
+import { supportedChainsIds } from '../../../config/wagmi-config';
 
 export default async function Authz() {
   const cookies = headers().get('cookie');

apps/shell/src/app/faucet/page.tsx → apps/shell/src/app/[locale]/faucet/page.tsx

@@ -12,8 +12,8 @@ import {
   indexerBalancesFetcher,
   parseWagmiCookies,
 } from '@haqq/shell-shared';
-import { supportedChainsIds } from '../../config/wagmi-config';
-import { env } from '../../env/client';
+import { supportedChainsIds } from '../../../config/wagmi-config';
+import { env } from '../../../env/client';
 
 const AuthProvider = dynamic(async () => {
   const { AuthProvider } = await import('@haqq/shell-faucet');

apps/shell/src/app/governance/page.tsx → apps/shell/src/app/[locale]/governance/page.tsx

@@ -8,7 +8,7 @@ import { headers } from 'next/headers';
 import { createCosmosService, getChainParams } from '@haqq/data-access-cosmos';
 import { ProposalListPage } from '@haqq/shell-governance';
 import { parseWagmiCookies } from '@haqq/shell-shared';
-import { supportedChainsIds } from '../../config/wagmi-config';
+import { supportedChainsIds } from '../../../config/wagmi-config';
 
 export const dynamic = 'force-dynamic';
 export const fetchCache = 'force-no-store';

apps/shell/src/app/governance/proposal/[id]/page.tsx → apps/shell/src/app/[locale]/governance/proposal/[id]/page.tsx

@@ -8,7 +8,7 @@ import { notFound } from 'next/navigation';
 import { createCosmosService, getChainParams } from '@haqq/data-access-cosmos';
 import { ProposalDetailsPage } from '@haqq/shell-governance';
 import { parseWagmiCookies } from '@haqq/shell-shared';
-import { supportedChainsIds } from '../../../../config/wagmi-config';
+import { supportedChainsIds } from '../../../../../config/wagmi-config';
 
 export const dynamic = 'force-dynamic';
 export const fetchCache = 'force-no-store';

apps/shell/src/app/layout.tsx → apps/shell/src/app/[locale]/layout.tsx

@@ -5,21 +5,26 @@ import clsx from 'clsx';
 import { Metadata, Viewport } from 'next';
 import dynamic from 'next/dynamic';
 import { headers } from 'next/headers';
+import { notFound } from 'next/navigation';
 import { cookieToInitialState } from 'wagmi';
 import {
   ethToHaqq,
   indexerBalancesFetcher,
   parseWagmiCookies,
 } from '@haqq/shell-shared';
 import { Footer } from '@haqq/shell-ui-kit/server';
-import { AppHeader } from '../components/header';
-import { AppHeaderMobile } from '../components/header-mobile';
-import { createWagmiConfig, supportedChainsIds } from '../config/wagmi-config';
-import { env } from '../env/client';
-import { clashDisplayFont, hkGuiseFont } from '../lib/fonts';
-import { AppProviders } from '../providers/app-providers';
-import { PHProvider } from '../providers/posthog-provider';
-import './global.css';
+import { AppHeader } from '../../components/header';
+import { AppHeaderMobile } from '../../components/header-mobile';
+import {
+  createWagmiConfig,
+  supportedChainsIds,
+} from '../../config/wagmi-config';
+import { env } from '../../env/client';
+import { clashDisplayFont, hkGuiseFont } from '../../lib/fonts';
+import { AppProviders } from '../../providers/app-providers';
+import { PHProvider } from '../../providers/posthog-provider';
+import { ALL_LOCALES, getStaticData } from '../../tolgee/shared';
+import '../global.css';
 
 export const metadata: Metadata = {
   title: {
@@ -39,7 +44,9 @@ export const viewport: Viewport = {
 
 const PostHogPageView = dynamic(
   async () => {
-    const { PostHogPageView } = await import('../components/posthog-page-view');
+    const { PostHogPageView } = await import(
+      '../../components/posthog-page-view'
+    );
     return { default: PostHogPageView };
   },
   {
@@ -50,7 +57,7 @@ const PostHogPageView = dynamic(
 const PostHogIdentifyWalletUsers = dynamic(
   async () => {
     const { PostHogIdentifyWalletUsers } = await import(
-      '../components/posthog-identify-users'
+      '../../components/posthog-identify-users'
     );
     return { default: PostHogIdentifyWalletUsers };
   },
@@ -61,12 +68,15 @@ const PostHogIdentifyWalletUsers = dynamic(
 
 const ParalaxBackground = dynamic(async () => {
   const { ParalaxBackground } = await import(
-    '../components/paralax-background'
+    '../../components/paralax-background'
   );
   return { default: ParalaxBackground };
 });
 
-export default async function RootLayout({ children }: PropsWithChildren) {
+export default async function RootLayout({
+  children,
+  params,
+}: PropsWithChildren<{ params: { locale: string } }>) {
   const wagmiConfig = createWagmiConfig();
   const headersList = headers();
   const cookies = headersList.get('cookie');
@@ -96,6 +106,14 @@ export default async function RootLayout({ children }: PropsWithChildren) {
     });
   }
 
+  if (!ALL_LOCALES.includes(params.locale)) {
+    notFound();
+  }
+
+  // make sure you provide all the necessary locales
+  // for the inital SSR render (e.g. fallback languages)
+  const locales = await getStaticData([params.locale]);
+
   const dehydratedState = dehydrate(queryClient);
 
   return (
@@ -111,6 +129,8 @@ export default async function RootLayout({ children }: PropsWithChildren) {
             dehydratedState={dehydratedState}
             walletConnectProjectId={env.NEXT_PUBLIC_WALLETCONNECT_PROJECT_ID}
             isMobileUA={isMobileUA}
+            locales={locales}
+            locale={params.locale}
           >
             <PostHogPageView />
             <PostHogIdentifyWalletUsers />

apps/shell/src/app/page.tsx → apps/shell/src/app/[locale]/page.tsx

@@ -12,7 +12,7 @@ import {
   indexerBalancesFetcher,
   parseWagmiCookies,
 } from '@haqq/shell-shared';
-import { supportedChainsIds } from '../config/wagmi-config';
+import { supportedChainsIds } from '../../config/wagmi-config';
 
 export default async function IndexPage() {
   const headersList = headers();

apps/shell/src/app/[locale]/staking/liquid-staking/@modals/liquid-staking-delegate/page.tsx

@@ -0,0 +1,36 @@
+'use client';
+import { useEffect, useState } from 'react';
+import { useRouter } from 'next/navigation';
+import { useAddress, useIndexerBalanceQuery } from '@haqq/shell-shared';
+import {
+  LiquidStakingDelegateModalHooked,
+  useStideStakingInfo,
+} from '@haqq/shell-staking';
+
+export default function LiquidStakingModalSegment() {
+  const { haqqAddress } = useAddress();
+  const { push } = useRouter();
+  const { data: balances } = useIndexerBalanceQuery(haqqAddress);
+  const [balance, setBalance] = useState(0);
+
+  useEffect(() => {
+    if (balances) {
+      const { availableForStake } = balances;
+      setBalance(availableForStake);
+    }
+  }, [balances]);
+
+  const { data: { unbonding_period } = {} } = useStideStakingInfo();
+
+  return (
+    <LiquidStakingDelegateModalHooked
+      isOpen
+      onClose={() => {
+        push(`/staking`);
+      }}
+      balance={balance}
+      unboundingTime={unbonding_period}
+      symbol="ISLM"
+    />
+  );
+}

apps/shell/src/app/[locale]/staking/liquid-staking/@modals/liquid-staking-undelegate/page.tsx

@@ -0,0 +1,39 @@
+'use client';
+import { useEffect, useState } from 'react';
+import { useRouter } from 'next/navigation';
+import { useAddress, useIndexerBalanceQuery } from '@haqq/shell-shared';
+import {
+  LiquidStakingUndelegateModalHooked,
+  useStislmBalance,
+  useStideStakingInfo,
+} from '@haqq/shell-staking';
+
+export default function LiquidStakingUndelegateModalSegment() {
+  const { haqqAddress } = useAddress();
+  const { push } = useRouter();
+  const { data: balances } = useIndexerBalanceQuery(haqqAddress);
+  const [balance, setBalance] = useState(0);
+
+  useEffect(() => {
+    if (balances) {
+      const { availableForStake } = balances;
+      setBalance(availableForStake);
+    }
+  }, [balances]);
+
+  const { data: { unbonding_period } = {} } = useStideStakingInfo();
+  const { stIslmBalance } = useStislmBalance();
+
+  return (
+    <LiquidStakingUndelegateModalHooked
+      isOpen
+      onClose={() => {
+        push(`/staking`);
+      }}
+      delegation={stIslmBalance}
+      balance={balance}
+      unboundingTime={unbonding_period}
+      symbol="stISLM"
+    />
+  );
+}

apps/shell/src/app/[locale]/staking/liquid-staking/[...catchAll]/page.tsx

@@ -0,0 +1,3 @@
+import ValidatorsListPage from '../../page';
+
+export default ValidatorsListPage;

apps/shell/src/app/[locale]/staking/liquid-staking/page.tsx

@@ -0,0 +1,3 @@
+import ValidatorsListPage from '../../page';
+
+export default ValidatorsListPage;

apps/shell/src/app/staking/page.tsx → apps/shell/src/app/[locale]/staking/page.tsx

@@ -11,7 +11,7 @@ import {
   parseWagmiCookies,
 } from '@haqq/shell-shared';
 import { ValidatorListPage } from '@haqq/shell-staking';
-import { supportedChainsIds } from '../../config/wagmi-config';
+import { supportedChainsIds } from '../../../config/wagmi-config';
 
 export const dynamic = 'force-dynamic';
 export const fetchCache = 'force-no-store';

apps/shell/src/app/[locale]/staking/validator/[address]/@modals/[...catchAll]/page.tsx

@@ -0,0 +1,3 @@
+export default function CatchAll() {
+  return null;
+}

apps/shell/src/app/[locale]/staking/validator/[address]/@modals/default.tsx

@@ -0,0 +1,3 @@
+export default function Default() {
+  return null;
+}

apps/shell/src/app/staking/validator/[address]/@modals/redelegate/page.tsx → apps/shell/src/app/[locale]/staking/validator/[address]/@modals/redelegate/page.tsx

@@ -34,12 +34,10 @@ export default function RedelegateModalSegment() {
     );
 
     if (delegation) {
-      return Number.parseFloat(
-        formatUnits(BigInt(delegation.balance.amount), 18),
-      );
+      return BigInt(delegation.balance.amount);
     }
 
-    return 0;
+    return 0n;
   }, [delegationInfo, address]);
 
   return (

apps/shell/src/app/[locale]/staking/validator/[address]/layout.tsx

@@ -0,0 +1,19 @@
+import { ReactNode } from 'react';
+
+export const dynamic = 'force-dynamic';
+export const fetchCache = 'force-no-store';
+
+export default function Layout({
+  modals,
+  children,
+}: {
+  modals: ReactNode;
+  children: ReactNode;
+}) {
+  return (
+    <>
+      {children}
+      {modals}
+    </>
+  );
+}

apps/shell/src/app/staking/validator/[address]/page.tsx → apps/shell/src/app/[locale]/staking/validator/[address]/page.tsx

@@ -12,7 +12,7 @@ import {
   parseWagmiCookies,
 } from '@haqq/shell-shared';
 import { ValidatorDetailsPage } from '@haqq/shell-staking';
-import { supportedChainsIds } from '../../../../config/wagmi-config';
+import { supportedChainsIds } from '../../../../../config/wagmi-config';
 
 export default async function ValidatorDetails({
   params: { address },

apps/shell/src/app/uc-dao/page.tsx → apps/shell/src/app/[locale]/uc-dao/page.tsx

@@ -11,7 +11,7 @@ import {
   parseWagmiCookies,
 } from '@haqq/shell-shared';
 import { UCDaoPage } from '@haqq/shell-ucdao';
-import { supportedChainsIds } from '../../config/wagmi-config';
+import { supportedChainsIds } from '../../../config/wagmi-config';
 
 export default async function Authz() {
   const cookies = headers().get('cookie');

apps/shell/src/components/header-desktop.tsx

@@ -13,6 +13,11 @@ const Web3ConnectButtons = dynamic(async () => {
   return { default: Web3ConnectButtons };
 });
 
+const HeaderUtilsMenu = dynamic(async () => {
+  const { HeaderUtilsMenu } = await import('../components/header-utils-menu');
+  return { default: HeaderUtilsMenu };
+});
+
 export function AppHeaderDesktop({ className }: { className?: string }) {
   const chains = useChains();
   const { chain = chains[0] } = useAccount();
@@ -28,6 +33,7 @@ export function AppHeaderDesktop({ className }: { className?: string }) {
     <Header
       links={links}
       web3ButtonsSlot={<Web3ConnectButtons />}
+      utilsSlot={<HeaderUtilsMenu />}
       className={className}
       isTestedge={isTestedge}
     />