From 89702904f5ca68a7233522a9b21395193206a742 Mon Sep 17 00:00:00 2001
From: Fernando Rojo <frojo@sas.upenn.edu>
Date: Fri, 7 Oct 2022 14:49:51 -0400
Subject: [PATCH] =?UTF-8?q?2=EF=B8=8F=E2=83=A3=20Chapter=202.1:=20Home=20t?=
 =?UTF-8?q?ab=20stack?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 apps/expo/app/(tabs).tsx                     |  2 +-
 apps/expo/app/(tabs)/(home).tsx              | 27 ++++++++++++++++++++
 apps/expo/app/(tabs)/{ => (home)}/index.tsx  |  0
 apps/expo/app/(tabs)/users.tsx               |  2 +-
 packages/app/features/user/detail-screen.tsx |  9 ++-----
 5 files changed, 31 insertions(+), 9 deletions(-)
 create mode 100644 apps/expo/app/(tabs)/(home).tsx
 rename apps/expo/app/(tabs)/{ => (home)}/index.tsx (100%)

diff --git a/apps/expo/app/(tabs).tsx b/apps/expo/app/(tabs).tsx
index 4f21c6a..d8c7490 100644
--- a/apps/expo/app/(tabs).tsx
+++ b/apps/expo/app/(tabs).tsx
@@ -18,7 +18,7 @@ function MyTabs() {
       }}
     >
       <Tabs.Screen
-        name="index"
+        name="(home)"
         options={{
           title: 'Home',
           tabBarIcon({ color, size, focused }) {
diff --git a/apps/expo/app/(tabs)/(home).tsx b/apps/expo/app/(tabs)/(home).tsx
new file mode 100644
index 0000000..f907255
--- /dev/null
+++ b/apps/expo/app/(tabs)/(home).tsx
@@ -0,0 +1,27 @@
+import { NativeStack as Stack } from 'expo-router'
+import { useDripsyTheme } from 'dripsy'
+
+export default function MyStack({ children }) {
+  const { colors } = useDripsyTheme().theme
+  return (
+    <Stack
+      screenOptions={{
+        headerStyle: {
+          backgroundColor: colors.$background2,
+        },
+        headerTitleStyle: {
+          color: colors.$text,
+        },
+        headerTintColor: '#D864D8',
+        headerShadowVisible: false,
+      }}
+    >
+      <Stack.Screen
+        name="index"
+        options={{
+          title: 'Home',
+        }}
+      />
+    </Stack>
+  )
+}
diff --git a/apps/expo/app/(tabs)/index.tsx b/apps/expo/app/(tabs)/(home)/index.tsx
similarity index 100%
rename from apps/expo/app/(tabs)/index.tsx
rename to apps/expo/app/(tabs)/(home)/index.tsx
diff --git a/apps/expo/app/(tabs)/users.tsx b/apps/expo/app/(tabs)/users.tsx
index bfff9bd..af5bae2 100644
--- a/apps/expo/app/(tabs)/users.tsx
+++ b/apps/expo/app/(tabs)/users.tsx
@@ -1,7 +1,7 @@
 import { NativeStack as Stack } from 'expo-router'
 import { useDripsyTheme } from 'dripsy'
 
-export default function MyStack() {
+export default function MyStack({ children }) {
   const { colors } = useDripsyTheme().theme
   return (
     <Stack
diff --git a/packages/app/features/user/detail-screen.tsx b/packages/app/features/user/detail-screen.tsx
index db57f22..bbe5a83 100644
--- a/packages/app/features/user/detail-screen.tsx
+++ b/packages/app/features/user/detail-screen.tsx
@@ -16,13 +16,8 @@ export function UserDetailScreen() {
         bg: '$background',
       }}
     >
-      <Link href="/">
-        <Text sx={{ textAlign: 'center' }}>
-          {`User ID:`}{' '}
-          <Text sx={{ bg: '$purple3', px: '$1', borderRadius: '$1' }}>
-            {id}
-          </Text>
-        </Text>
+      <Link href="/users">
+        <Text sx={{ bg: '$purple3', px: '$2', py: '$2' }}>{id}</Text>
       </Link>
     </View>
   )