[Campaign Launcher UI] The App Redesign

campaign-launcher/client/eslint.config.js

@@ -3,9 +3,10 @@ import tseslint from 'typescript-eslint';
 import reactPlugin from 'eslint-plugin-react';
 import reactHooksPlugin from 'eslint-plugin-react-hooks';
 import prettierPlugin from 'eslint-plugin-prettier';
-import importPlugin from 'eslint-plugin-import';
+import importXPlugin from 'eslint-plugin-import-x';
 import globals from 'globals';
 import { defineConfig } from 'eslint/config';
+import { createTypeScriptImportResolver } from 'eslint-import-resolver-typescript';
 
 export default defineConfig(
   {
@@ -35,17 +36,18 @@ export default defineConfig(
       react: reactPlugin,
       'react-hooks': reactHooksPlugin,
       prettier: prettierPlugin,
-      import: importPlugin,
+      import: importXPlugin,
     },
     settings: {
       react: {
         version: 'detect',
       },
-      'import/resolver': {
-        typescript: {
+      'import-x/resolver-next': [
+        createTypeScriptImportResolver({
           alwaysTryTypes: true,
-        },
-      },
+          project: './tsconfig.json',
+        }),
+      ],
     },
     rules: {
       'react/prop-types': 'off',

campaign-launcher/client/package.json

@@ -54,7 +54,7 @@
     "@vitejs/plugin-react-refresh": "^1.3.6",
     "eslint": "^10.2.0",
     "eslint-import-resolver-typescript": "^4.4.4",
-    "eslint-plugin-import": "^2.32.0",
+    "eslint-plugin-import-x": "^4.16.2",
     "eslint-plugin-prettier": "^5.5.5",
     "eslint-plugin-react": "^7.37.5",
     "eslint-plugin-react-hooks": "^7.0.1",

campaign-launcher/client/src/App.tsx

@@ -6,19 +6,19 @@ import { BrowserRouter, Routes, Route } from 'react-router';
 
 import Layout from '@/components/Layout';
 import ProtectedRoute from '@/components/ProtectedRoute';
-import StakeProtectedRoute from '@/components/StakeProtectedRoute';
+import WalletProtectedRoute from '@/components/WalletProtectedRoute';
 import { ROUTES } from '@/constants';
 import Campaign from '@/pages/Campaign';
 import Dashboard from '@/pages/Dashboard';
 import LaunchCampaignPage from '@/pages/LaunchCampaign';
 import ManageApiKeysPage from '@/pages/ManageApiKeys';
 import ActiveAccountProvider from '@/providers/ActiveAccountProvider';
+import { AuthedUserDataProvider } from '@/providers/AuthedUserData';
 import ExchangesProvider from '@/providers/ExchangesProvider';
 import { NetworkProvider } from '@/providers/NetworkProvider';
 import { NotificationProvider } from '@/providers/NotificationProvider';
 import QueryClientProvider from '@/providers/QueryClientProvider';
 import SignerProvider from '@/providers/SignerProvider';
-import StakeProvider from '@/providers/StakeProvider';
 import ThemeProvider from '@/providers/ThemeProvider';
 import WagmiProvider from '@/providers/WagmiProvider';
 import { Web3AuthProvider } from '@/providers/Web3AuthProvider';
@@ -34,8 +34,8 @@ const App: FC = () => {
                 <ActiveAccountProvider>
                   <SignerProvider>
                     <Web3AuthProvider>
-                      <ExchangesProvider>
-                        <StakeProvider>
+                      <AuthedUserDataProvider>
+                        <ExchangesProvider>
                           <LocalizationProvider
                             dateAdapter={AdapterDayjs}
                             adapterLocale="en"
@@ -61,16 +61,16 @@ const App: FC = () => {
                                 <Route
                                   path={ROUTES.LAUNCH_CAMPAIGN}
                                   element={
-                                    <StakeProtectedRoute>
+                                    <WalletProtectedRoute>
                                       <LaunchCampaignPage />
-                                    </StakeProtectedRoute>
+                                    </WalletProtectedRoute>
                                   }
                                 />
                               </Routes>
                             </Layout>
                           </LocalizationProvider>
-                        </StakeProvider>
-                      </ExchangesProvider>
+                        </ExchangesProvider>
+                      </AuthedUserDataProvider>
                     </Web3AuthProvider>
                   </SignerProvider>
                 </ActiveAccountProvider>

campaign-launcher/client/src/components/Account/index.tsx

@@ -83,16 +83,15 @@ const Account: FC = () => {
   return (
     <>
       <Button
-        size={isMobile ? 'small' : 'medium'}
+        size={isMobile ? 'medium' : 'large'}
         aria-describedby="account-popover"
         onClick={(event) => setAnchorEl(event.currentTarget)}
         disableRipple
         sx={{
           bgcolor: 'primary.main',
           borderRadius: '4px',
-          height: isMobile ? '30px' : '42px',
           width: 'fit-content',
-          paddingX: 1,
+          px: 1,
           borderBottomLeftRadius: anchorEl ? 0 : 4,
           borderBottomRightRadius: anchorEl ? 0 : 4,
         }}