feat: toggle banking matching aside

packages/webapp/src/components/AppShell/AppShell.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { AppShellProvider } from './AppShellProvider';
+import { AppShellProvider, useAppShellContext } from './AppShellProvider';
 import { Box } from '../Layout';
 import styles from './AppShell.module.scss';
 
@@ -8,16 +8,26 @@ interface AppShellProps {
   mainProps: any;
   asideProps: any;
   children: React.ReactNode;
+  hideAside?: boolean;
+  hideMain?: boolean;
 }
 
 export function AppShell({
   asideProps,
   mainProps,
   topbarOffset = 0,
+  hideAside = false,
+  hideMain = false,
   ...restProps
 }: AppShellProps) {
   return (
-    <AppShellProvider mainProps={mainProps} asideProps={asideProps} topbarOffset={topbarOffset}>
+    <AppShellProvider
+      mainProps={mainProps}
+      asideProps={asideProps}
+      topbarOffset={topbarOffset}
+      hideAside={hideAside}
+      hideMain={hideMain}
+    >
       <Box {...restProps} className={styles.root} />
     </AppShellProvider>
   );
@@ -27,6 +37,12 @@ AppShell.Main = AppShellMain;
 AppShell.Aside = AppShellAside;
 
 function AppShellMain({ ...props }) {
+  const { hideMain } = useAppShellContext();
+
+  if (hideMain === true) {
+    return null;
+  }
+
   return <Box {...props} className={styles.main} />;
 }
 
@@ -35,5 +51,11 @@ interface AppShellAsideProps {
 }
 
 function AppShellAside({ ...props }: AppShellAsideProps) {
+  const { hideAside } = useAppShellContext();
+
+  console.log(hideAside, 'hideAsidehideAsidehideAsidehideAside');
+  if (hideAside === true) {
+    return null;
+  }
   return <Box {...props} className={styles.aside} />;
 }

packages/webapp/src/components/AppShell/AppShellProvider.tsx

@@ -1,22 +1,37 @@
+// @ts-nocheck
 import React, { createContext } from 'react';
 
-interface AppShellContextValue {
-  topbarOffset: number
+interface ContentShellCommonValue {
+  mainProps: any;
+  asideProps: any;
+  topbarOffset: number;
+  hideAside: boolean;
+  hideMain: boolean;
+}
+
+interface AppShellContextValue extends ContentShellCommonValue {
+  topbarOffset: number;
 }
 
 const AppShellContext = createContext<AppShellContextValue>(
   {} as AppShellContextValue,
 );
 
-interface AppShellProviderProps {
+interface AppShellProviderProps extends ContentShellCommonValue {
   children: React.ReactNode;
-  mainProps: any;
-  asideProps: any;
-  topbarOffset: number;
 }
 
-export function AppShellProvider({ topbarOffset, ...props }: AppShellProviderProps) {
-  const provider = { topbarOffset } as AppShellContextValue;
+export function AppShellProvider({
+  topbarOffset,
+  hideAside,
+  hideMain,
+  ...props
+}: AppShellProviderProps) {
+  const provider = {
+    topbarOffset,
+    hideAside,
+    hideMain,
+  } as AppShellContextValue;
 
   return <AppShellContext.Provider value={provider} {...props} />;
 }