Add job tabs.

app/jobs/[jobId]/_layout.tsx

@@ -0,0 +1,59 @@
+import FontAwesome from "@expo/vector-icons/FontAwesome";
+import { Tabs } from "expo-router";
+import { useTranslation } from "react-i18next";
+
+function JobTabLayout() {
+  const { t } = useTranslation();
+
+  return (
+    <Tabs
+      screenOptions={{
+        tabBarActiveTintColor: "blue",
+        tabBarPosition: "top",
+        headerShown: false,
+        tabBarStyle: {
+          marginTop: -50,
+        },
+      }}
+    >
+      <Tabs.Screen
+        name="index"
+        options={{
+          title: t("jobdetail.labels.job"),
+          tabBarIcon: ({ color }) => (
+            <FontAwesome size={28} name="home" color={color} />
+          ),
+        }}
+      />
+      <Tabs.Screen
+        name="lines"
+        options={{
+          title: t("jobdetail.labels.lines"),
+          tabBarIcon: ({ color }) => (
+            <FontAwesome size={28} name="cog" color={color} />
+          ),
+        }}
+      />
+      <Tabs.Screen
+        name="documents"
+        options={{
+          title: t("jobdetail.labels.documents"),
+          tabBarIcon: ({ color }) => (
+            <FontAwesome size={28} name="cog" color={color} />
+          ),
+        }}
+      />
+      <Tabs.Screen
+        name="notes"
+        options={{
+          title: t("jobdetail.labels.notes"),
+          tabBarIcon: ({ color }) => (
+            <FontAwesome size={28} name="cog" color={color} />
+          ),
+        }}
+      />
+    </Tabs>
+  );
+}
+
+export default JobTabLayout;

app/jobs/[jobId]/documents.tsx

@@ -0,0 +1,10 @@
+import { Text, View } from "react-native";
+
+function Documents() {
+  return (
+    <View>
+      <Text>Documents</Text>
+    </View>
+  );
+}
+export default Documents;

app/jobs/[jobId]/index.tsx

@@ -1,12 +1,14 @@
 import { useLocalSearchParams } from "expo-router";
 import { StyleSheet, Text, View } from "react-native";
+import JobDetail from "../../../components/job-detail/job-detail";
 
-export default function JobDetail() {
+export default function JobDetailScreen() {
   const params = useLocalSearchParams();
 
   return (
     <View style={styles.container}>
       <Text>Job Details for Job ID: {JSON.stringify(params)}</Text>
+      <JobDetail />
     </View>
   );
 }

app/jobs/[jobId]/lines.tsx

@@ -0,0 +1,10 @@
+import { Text, View } from "react-native";
+
+function JobLines() {
+  return (
+    <View>
+      <Text>Job Lines</Text>
+    </View>
+  );
+}
+export default JobLines;

app/jobs/[jobId]/notes.tsx

@@ -0,0 +1,10 @@
+import { Text, View } from "react-native";
+
+function Notes() {
+  return (
+    <View>
+      <Text>Notes</Text>
+    </View>
+  );
+}
+export default Notes;

app/jobs/_layout.tsx

@@ -31,6 +31,7 @@ function JobsStack() {
       <Stack.Screen
         name="[jobId]"
         options={({ route }) => ({
+          //headerShown: false,
           title: (route.params as any)?.title || "Job Details",
         })}
       />