move more components to specific folders

web/src/app/app/_components/LoginComponents/LoginConfigProvider.tsx

@@ -1,3 +1,5 @@
+'use client';
+
 import { ConfigProvider } from 'antd';
 import { ThemeConfig } from 'antd/lib';
 import React from 'react';

web/src/app/app/_components/LoginComponents/WelcomeSidebar.tsx

@@ -0,0 +1,41 @@
+import React from 'react';
+import { Text } from '@/components/ui/text';
+import Link from 'next/link';
+import { BusterFrameLogoWithText } from '@/assets';
+import { BUSTER_HOME_PAGE } from '@/routes/externalRoutes';
+
+export const WelcomeToBuster: React.FC<{
+  hasUser: boolean;
+}> = () => {
+  return (
+    <div className="flex h-full w-full flex-col justify-between p-10">
+      <div>
+        <div className="w-[130px]">
+          <Link href={BUSTER_HOME_PAGE}>
+            <BusterFrameLogoWithText />
+          </Link>
+        </div>
+        <div className="mt-24">
+          <h1
+            className="mb-3"
+            style={{
+              fontSize: 48
+            }}>
+            Welcome to Buster.
+          </h1>
+          <div className="text-lg">Stand up a PoC in 30 minutes.</div>
+        </div>
+      </div>
+      <div>
+        <div className="flex space-x-8">
+          <a href="#">
+            <Text>Terms of Service</Text>
+          </a>
+          <a href="#">
+            <Text>Privacy Policy</Text>
+          </a>
+        </div>
+      </div>
+    </div>
+  );
+};

web/src/app/app/new-user/page.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
-import { LoginConfigProvider } from '@/app/auth/login/_components/LoginConfigProvider';
 import { NewUserController } from './_NewUserController';
+import { LoginConfigProvider } from '../_components/LoginComponents/LoginConfigProvider';
 
 export default function NewUserPage() {
   return (

web/src/app/auth/layout.tsx

@@ -1,13 +1,13 @@
 import React, { PropsWithChildren } from 'react';
-import { WelcomeToBuster } from './login/_components/WelcomeSidebar';
+import { WelcomeToBuster } from '@appComponents/LoginComponents/WelcomeSidebar';
 import { Metadata } from 'next';
-import { LoginConfigProvider } from './login/_components/LoginConfigProvider';
+import { LoginConfigProvider } from '@appComponents/LoginComponents/LoginConfigProvider';
 
 export const metadata: Metadata = {
   title: 'Buster Login'
 };
 
-const LoginLayout: React.FC<PropsWithChildren<{}>> = ({ children }) => {
+const LoginLayout: React.FC<PropsWithChildren<{}>> = async ({ children }) => {
   return (
     <LoginConfigProvider>
       <section className="h-[100vh]">

web/src/app/auth/login/_components/WelcomeSidebar.tsx

@@ -1,66 +0,0 @@
-import React from 'react';
-import { BusterFrameLogoWithText } from '@/assets/svg/BusterFrameLogoWithText';
-import Link from 'next/link';
-import { BUSTER_HOME_PAGE } from '@/routes/externalRoutes';
-import PodiumImage from '@/assets/png/podium.png';
-import ArtifactImage from '@/assets/png/artifact.png';
-import AdobeImage from '@/assets/png/adobe.png';
-import BambooImage from '@/assets/png/bamboo.png';
-import CartaImage from '@/assets/png/carta.png';
-import GuideCX from '@/assets/png/guidecx.png';
-import { Text } from '@/components/ui';
-
-export const WelcomeToBuster: React.FC<{
-  hasUser: boolean;
-}> = () => {
-  const allImages = [ArtifactImage, AdobeImage, BambooImage, CartaImage, GuideCX, PodiumImage];
-
-  return (
-    <div className="flex h-full w-full flex-col justify-between p-10">
-      <div>
-        <div className="w-[130px]">
-          <Link href={BUSTER_HOME_PAGE}>
-            <BusterFrameLogoWithText />
-          </Link>
-        </div>
-        <div className="mt-24">
-          <h1
-            className="mb-3"
-            style={{
-              fontSize: 48
-            }}>
-            Welcome to Buster.
-          </h1>
-          <div className="text-lg">Stand up a PoC in 30 minutes.</div>
-        </div>
-      </div>
-      <div>
-        {/* <div>
-          <div className="mb-6">Join startups & enterprises</div>
-          <div className="flex max-w-[450px] flex-wrap gap-6">
-            {allImages.map((image, index) => {
-              return (
-                <img
-                  key={index}
-                  src={image.src}
-                  alt={`Company logo ${index}`}
-                  className="max-h-[24px] object-contain"
-                />
-              );
-            })}
-          </div>
-        </div> */}
-        {/* <Divider className="mt-12 border-black" /> */}
-
-        <div className="flex space-x-8">
-          <a href="#">
-            <Text>Terms of Service</Text>
-          </a>
-          <a href="#">
-            <Text>Privacy Policy</Text>
-          </a>
-        </div>
-      </div>
-    </div>
-  );
-};

web/src/app/auth/login/page.tsx

@@ -1,4 +1,4 @@
-import { LoginForm } from './_components/LoginForm';
+import { LoginForm } from '@appComponents/LoginComponents/LoginForm';
 import { useBusterSupabaseAuthMethods } from '@/hooks/useBusterSupabaseAuthMethods';
 import { redirect } from 'next/navigation';
 import { BusterRoutes, createBusterRoute } from '@/routes';

web/src/app/auth/reset-password-email/_ResetEmailForm.tsx

@@ -4,11 +4,11 @@ import { createBusterRoute, BusterRoutes } from '@/routes';
 import { isValidEmail, timeout } from '@/utils';
 import { Button, Input, Result } from 'antd';
 import Link from 'next/link';
-import React, { useContext, useState } from 'react';
+import React, { useState } from 'react';
-import { useStyles } from '../login/_components/LoginForm';
 import { Title, Text } from '@/components/ui';
 import { useMemoizedFn } from 'ahooks';
 import { useBusterNotifications } from '@/context/BusterNotifications';
+import { useStyles } from '@appComponents/LoginComponents/LoginForm';
 
 export const ResetEmailForm: React.FC<{
   queryEmail: string;

web/src/app/auth/reset-password/_ResetPasswordForm.tsx

@@ -3,7 +3,6 @@
 import { Title } from '@/components/ui';
 import React, { useState } from 'react';
 import { Button, Input } from 'antd';
-import { PolicyCheck } from '../login/_components/PolicyCheck';
 import { useMemoizedFn } from 'ahooks';
 import { BusterAppRoutes } from '@/routes/busterRoutes/busterAppRoutes';
 import type { User } from '@supabase/supabase-js';
@@ -12,6 +11,7 @@ import { useRouter } from 'next/navigation';
 import { createBusterRoute } from '@/routes';
 import { Result } from 'antd';
 import { useBusterNotifications } from '@/context/BusterNotifications';
+import { PolicyCheck } from '@appComponents/LoginComponents/PolicyCheck';
 
 export const ResetPasswordForm: React.FC<{
   supabaseUser: User;

web/src/context/BusterStyles/BusterStyles.tsx

@@ -2,7 +2,7 @@
 
 import 'react-material-symbols/rounded';
 import React, { PropsWithChildren } from 'react';
-import { usePreventBackwardNavigation } from '@/hooks';
+import { usePreventBackwardNavigation } from '@/hooks/dom/usePreventBackwardsNavigation';
 import { App, ConfigProvider, theme, ThemeConfig } from 'antd';
 import {
   busterAppStyleConfig,

web/src/controllers/AppPasswordAccess.tsx

@@ -4,7 +4,7 @@ import { BusterLogo } from '@/assets/svg/BusterLogo';
 import React, { useRef } from 'react';
 import { Title } from '@/components/ui';
 import { Button, Input, InputRef, Typography } from 'antd';
-import { LoginConfigProvider } from '@/app/auth/login/_components/LoginConfigProvider';
+import { LoginConfigProvider } from '@appComponents/LoginComponents/LoginConfigProvider';
 import { ShareAssetType } from '@/api/asset_interfaces';
 import { useBusterAssetsContextSelector } from '@/context/Assets/BusterAssetsProvider';
 import { useMemoizedFn } from 'ahooks';

web/src/hooks/dom/useConfetti.tsx

@@ -1,3 +1,5 @@
+'use client';
+
 import React from 'react';
 import confetti from 'canvas-confetti';
 import { Options } from 'canvas-confetti';

web/src/hooks/dom/useOnWindowResize.tsx

@@ -1,3 +1,5 @@
+'use client';
+
 import React from 'react';
 
 const useOnWindowResize = (handler: { (): void }) => {

web/src/hooks/dom/useSmoothScroll.tsx

@@ -1,3 +1,5 @@
+'use client';
+
 import { useRef, useState } from 'react';
 import { useMemoizedFn, useThrottleFn, useUpdateEffect } from 'ahooks';
 

web/src/hooks/dom/useWindowFocus.ts

@@ -1,3 +1,5 @@
+'use client';
+
 import { useEffect } from 'react';
 import isFunction from 'lodash/isFunction';
 

web/src/styles/busterAntDStyleConfig.tsx

@@ -1,6 +1,6 @@
 import type { ConfigProviderProps, ThemeConfig } from 'antd';
 import { createStyles } from 'antd-style';
-import { AppMaterialIcons } from '@/components/ui';
+import { AppMaterialIcons } from '@/components/ui/icons/AppMaterialIcons';
 
 export const busterAppStyleConfig: ThemeConfig = {
   token: {