fix imports

wcpos · Feb 14, 2025 · f08c6f1 · f08c6f1
1 parent 88708c3
commit f08c6f1
Show file tree

Hide file tree

Showing 333 changed files with 2,240 additions and 1,910 deletions.
diff --git a/apps/main/app/(app)/(drawer)/(pos)/index.tsx b/apps/main/app/(app)/(drawer)/(pos)/index.tsx
@@ -2,10 +2,11 @@ import { Text, View } from 'react-native';
 
 import { Link } from 'expo-router';
 
-import { useSession } from '../../../../context/session-provider';
+import { useAppState } from '@wcpos/core/contexts/app-state';
 
 export default function Index() {
-	const { signOut } = useSession();
+	const { logout } = useAppState();
+
 	return (
 		<View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
 			<Text>Home Screen</Text>
@@ -14,7 +15,7 @@ export default function Index() {
 			<Text
 				onPress={() => {
 					// The `app/(app)/_layout.tsx` will redirect to the sign-in screen.
-					signOut();
+					logout();
 				}}
 			>
 				Sign Out

diff --git a/apps/main/app/(app)/(drawer)/_layout.tsx b/apps/main/app/(app)/(drawer)/_layout.tsx
@@ -1,6 +1,5 @@
 import { Link } from 'expo-router';
 import { Drawer } from 'expo-router/drawer';
-import { GestureHandlerRootView } from 'react-native-gesture-handler';
 
 export const unstable_settings = {
 	// Ensure that reloading on `/modal` keeps a back button present.
@@ -10,52 +9,50 @@ export const unstable_settings = {
 export default function DrawerLayout() {
 	// This layout can be deferred because it's not the root layout.
 	return (
-		<GestureHandlerRootView style={{ flex: 1 }}>
-			<Drawer
-				screenOptions={{
-					headerRight: (props) => {
-						return <Link href="/(app)/(modal)/settings">Present modal</Link>;
-						// <Header {...props} showUpgrade={showUpgrade} setShowUpgrade={setShowUpgrade} />
-					},
-					// drawerType: largeScreen ? 'permanent' : 'front',
-					// drawerStyle: {
-					// 	backgroundColor: theme.colors.headerBackground,
-					// 	width: largeScreen ? 'auto' : undefined,
-					// 	borderRightColor: 'rgba(0, 0, 0, 0.2)',
-					// 	// borderRightWidth: 0,
-					// },
-					// sceneContainerStyle: { height: '100%' }, // important to set height to 100% to avoid scrolling
+		<Drawer
+			screenOptions={{
+				headerRight: (props) => {
+					return <Link href="/(app)/(modal)/settings">Present modal</Link>;
+					// <Header {...props} showUpgrade={showUpgrade} setShowUpgrade={setShowUpgrade} />
+				},
+				// drawerType: largeScreen ? 'permanent' : 'front',
+				// drawerStyle: {
+				// 	backgroundColor: theme.colors.headerBackground,
+				// 	width: largeScreen ? 'auto' : undefined,
+				// 	borderRightColor: 'rgba(0, 0, 0, 0.2)',
+				// 	// borderRightWidth: 0,
+				// },
+				// sceneContainerStyle: { height: '100%' }, // important to set height to 100% to avoid scrolling
+			}}
+		>
+			<Drawer.Screen
+				name="(pos)"
+				options={{
+					drawerLabel: 'POS',
+					title: 'POS',
 				}}
-			>
-				<Drawer.Screen
-					name="(pos)"
-					options={{
-						drawerLabel: 'POS',
-						title: 'POS',
-					}}
-				/>
-				<Drawer.Screen
-					name="products"
-					options={{
-						drawerLabel: 'Products',
-						title: 'Products',
-					}}
-				/>
-				<Drawer.Screen
-					name="orders"
-					options={{
-						drawerLabel: 'Orders',
-						title: 'Orders',
-					}}
-				/>
-				<Drawer.Screen
-					name="support"
-					options={{
-						drawerLabel: 'Support',
-						title: 'Support',
-					}}
-				/>
-			</Drawer>
-		</GestureHandlerRootView>
+			/>
+			<Drawer.Screen
+				name="products"
+				options={{
+					drawerLabel: 'Products',
+					title: 'Products',
+				}}
+			/>
+			<Drawer.Screen
+				name="orders"
+				options={{
+					drawerLabel: 'Orders',
+					title: 'Orders',
+				}}
+			/>
+			<Drawer.Screen
+				name="support"
+				options={{
+					drawerLabel: 'Support',
+					title: 'Support',
+				}}
+			/>
+		</Drawer>
 	);
 }
diff --git a/apps/main/app/(app)/(drawer)/orders/index.tsx b/apps/main/app/(app)/(drawer)/orders/index.tsx
@@ -1,15 +1,16 @@
 import { Text, View } from 'react-native';
 
-import { useSession } from '../../../../context/session-provider';
+import { useAppState } from '@wcpos/core/contexts/app-state';
 
 export default function Index() {
-	const { signOut } = useSession();
+	const { logout } = useAppState();
+
 	return (
 		<View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
 			<Text
 				onPress={() => {
 					// The `app/(app)/_layout.tsx` will redirect to the sign-in screen.
-					signOut();
+					logout();
 				}}
 			>
 				Sign Out

diff --git a/apps/main/app/(app)/(drawer)/products/index.tsx b/apps/main/app/(app)/(drawer)/products/index.tsx
@@ -1,15 +1,16 @@
 import { Text, View } from 'react-native';
 
-import { useSession } from '../../../../context/session-provider';
+import { useAppState } from '@wcpos/core/contexts/app-state';
 
 export default function Index() {
-	const { signOut } = useSession();
+	const { logout } = useAppState();
+
 	return (
 		<View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
 			<Text
 				onPress={() => {
 					// The `app/(app)/_layout.tsx` will redirect to the sign-in screen.
-					signOut();
+					logout();
 				}}
 			>
 				Sign Out

diff --git a/apps/main/app/(app)/(drawer)/support/index.tsx b/apps/main/app/(app)/(drawer)/support/index.tsx
@@ -1,15 +1,16 @@
 import { Text, View } from 'react-native';
 
-import { useSession } from '../../../../context/session-provider';
+import { useAppState } from '@wcpos/core/contexts/app-state';
 
 export default function Index() {
-	const { signOut } = useSession();
+	const { logout } = useAppState();
+
 	return (
 		<View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
 			<Text
 				onPress={() => {
 					// The `app/(app)/_layout.tsx` will redirect to the sign-in screen.
-					signOut();
+					logout();
 				}}
 			>
 				Sign Out

diff --git a/apps/main/app/(app)/_layout.tsx b/apps/main/app/(app)/_layout.tsx
@@ -1,21 +1,16 @@
 import { Redirect, Stack } from 'expo-router';
 
-import { Splash } from '../../components/splash-screen';
-import { useSession } from '../../context/session-provider';
+import { useAppState } from '@wcpos/core/contexts/app-state';
 
 export const unstable_settings = {
 	// Ensure that reloading on `/modal` keeps a back button present.
 	initialRouteName: '(drawer)',
 };
 
 export default function AppLayout() {
-	const { session, isLoading } = useSession();
+	const { site, storeDB, fastStoreDB } = useAppState();
 
-	if (isLoading) {
-		return <Splash />;
-	}
-
-	if (!session) {
+	if (!storeDB) {
 		return <Redirect href="/(auth)/connect" />;
 	}
 

diff --git a/apps/main/app/(auth)/_layout.tsx b/apps/main/app/(auth)/_layout.tsx
@@ -1,4 +1,3 @@
-// apps/main/app/(auth)/_layout.tsx
 import { Stack } from 'expo-router';
 
 export default function AuthLayout() {

diff --git a/apps/main/app/(auth)/connect.tsx b/apps/main/app/(auth)/connect.tsx
@@ -1,22 +1 @@
-import { Text, View } from 'react-native';
-
-import { router } from 'expo-router';
-
-import { useSession } from '../../context/session-provider';
-
-export default function SignIn() {
-	const { signIn } = useSession();
-
-	return (
-		<View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
-			<Text
-				onPress={() => {
-					signIn();
-					router.replace('/');
-				}}
-			>
-				Sign In
-			</Text>
-		</View>
-	);
-}
+export { Connect as default } from '@wcpos/core/screens/auth/connect';
diff --git a/apps/main/app/_layout.tsx b/apps/main/app/_layout.tsx
@@ -1,6 +1,16 @@
 import { Slot } from 'expo-router';
+import { GestureHandlerRootView } from 'react-native-gesture-handler';
+import { SafeAreaProvider } from 'react-native-safe-area-context';
 
-import { SessionProvider } from '../context/session-provider';
+import { ErrorBoundary } from '@wcpos/components/error-boundary';
+import { PortalHost } from '@wcpos/components/portal';
+import { Suspense } from '@wcpos/components/suspense';
+import { Toast, toastConfig } from '@wcpos/components/toast';
+import { AppStateProvider } from '@wcpos/core/contexts/app-state';
+import { TranslationProvider } from '@wcpos/core/contexts/translations';
+
+import RootError from '../components/root-error';
+import { Splash } from '../components/splash-screen';
 
 import '../global.css';
 
@@ -9,10 +19,56 @@ export const unstable_settings = {
 	initialRouteName: '(app)',
 };
 
+/**
+ * Initial Props
+ * - only web at the moment, but may be useful for other platforms in the future
+ */
+let initialProps: Record<string, unknown> = {};
+if (globalThis.initialProps) {
+	initialProps = Object.freeze(globalThis.initialProps); // prevent accidental mutation
+}
+
 export default function RootLayout() {
 	return (
-		<SessionProvider>
-			<Slot />
-		</SessionProvider>
+		<ErrorBoundary FallbackComponent={RootError}>
+			<GestureHandlerRootView style={{ flex: 1 }}>
+				<Suspense
+					/**
+					 * First suspense to load the initial app state
+					 * - we now have site, user, store, etc if the user is logged in
+					 */
+					fallback={<Splash progress={33} />}
+				>
+					<AppStateProvider initialProps={initialProps}>
+						<Suspense
+							/**
+							 * Second suspense to allow anything else to load that depends on the app state
+							 * - translations, theme, etc
+							 * - in the future it might be nice to have a loading screen that shows progress for initial load
+							 */
+							fallback={<Splash progress={66} />}
+						>
+							<ErrorBoundary>
+								<TranslationProvider>
+									<SafeAreaProvider style={{ overflow: 'hidden' }}>
+										<Suspense fallback={<Splash progress={100} />}>
+											<ErrorBoundary>
+												<Slot />
+											</ErrorBoundary>
+										</Suspense>
+										<ErrorBoundary>
+											<PortalHost />
+										</ErrorBoundary>
+										<ErrorBoundary>
+											<Toast config={toastConfig} />
+										</ErrorBoundary>
+									</SafeAreaProvider>
+								</TranslationProvider>
+							</ErrorBoundary>
+						</Suspense>
+					</AppStateProvider>
+				</Suspense>
+			</GestureHandlerRootView>
+		</ErrorBoundary>
 	);
 }