add react-native-bottom-tabs

Signed-off-by: Shreyans Jain <[email protected]>
CodeWithShreyans · Oct 18, 2024 · 5b827c9 · 5b827c9
1 parent b3bc20a
commit 5b827c9
Show file tree

Hide file tree

Showing 5 changed files with 56 additions and 10 deletions.
diff --git a/.github/workflows/build.yml → .github/workflows/build-prod.yml b/.github/workflows/build.yml → .github/workflows/build-prod.yml
diff --git a/.github/workflows/build-sim.yml b/.github/workflows/build-sim.yml
@@ -0,0 +1,37 @@
+on:
+    push:
+        branches-ignore:
+            - main
+
+jobs:
+    build:
+        runs-on: macos-15
+        steps:
+            - name: 🏗 Setup repo
+              uses: actions/checkout@v3
+
+            - name: 🏗 Setup Node
+              uses: actions/setup-node@v3
+              with:
+                  node-version: latest
+
+            - name: 🏗 Setup Bun
+              uses: oven-sh/setup-bun@v2
+
+            - name: 🏗 Setup EAS
+              uses: expo/expo-github-action@v8
+              with:
+                  eas-version: latest
+                  packager: bun
+                  token: ${{ secrets.EXPO_TOKEN }}
+
+            - name: 📦 Install dependencies
+              run: bun install
+
+            - name: 🚧 Build app
+              run: eas build --profile ios-simulator --platform ios --non-interactive --local --output ${{ github.workspace }}/build.ipa
+
+            - name: ⬆️ Upload IPA
+              uses: actions/upload-artifact@v4
+              with:
+                  path: ${{ github.workspace }}/build.ipa
diff --git a/app/(tabs)/_layout.tsx b/app/(tabs)/_layout.tsx
@@ -1,6 +1,6 @@
 import { BottomTabBarProps } from "@react-navigation/bottom-tabs";
 import { Icon, IconProps } from "@roninoss/icons";
-import { Stack, Tabs } from "expo-router";
+import { Stack } from "expo-router";
 import * as React from "react";
 import {
     Platform,
@@ -20,6 +20,13 @@ import { Text } from "~/components/nativewindui/Text";
 import { Badge } from "~/components/nativewindui/Badge";
 import { cn } from "~/lib/cn";
 import { useColorScheme } from "~/lib/useColorScheme";
+import { withLayoutContext } from "expo-router";
+import {
+    createNativeBottomTabNavigator,
+    NativeBottomTabNavigationOptions,
+} from "react-native-bottom-tabs/react-navigation";
+
+const Tabs = withLayoutContext(createNativeBottomTabNavigator().Navigator);
 
 export default function TabLayout() {
     const { colors } = useColorScheme();
@@ -29,6 +36,7 @@ export default function TabLayout() {
             <Tabs
                 tabBar={TAB_BAR}
                 screenOptions={{
+                    // @ts-ignore
                     headerShown: false,
                     tabBarActiveTintColor: colors.primary,
                 }}
@@ -37,7 +45,7 @@ export default function TabLayout() {
                     name="index"
                     options={{
                         title: "Home",
-                        tabBarIcon(props) {
+                        tabBarIcon(props: { focused: boolean }) {
                             return !props.focused ? (
                                 <Icon
                                     name="home-outline"
@@ -54,7 +62,7 @@ export default function TabLayout() {
                     name="add/index"
                     options={{
                         title: "Add",
-                        tabBarIcon(props) {
+                        tabBarIcon(props: { focused: boolean }) {
                             return !props.focused ? (
                                 <Icon
                                     name="plus-box-outline"
@@ -71,7 +79,7 @@ export default function TabLayout() {
                     name="settings/index"
                     options={{
                         title: "Settings",
-                        tabBarIcon(props) {
+                        tabBarIcon(props: { focused: boolean }) {
                             return !props.focused ? (
                                 <Icon name="cog-outline" {...props} size={27} />
                             ) : (

diff --git a/bun.lockb b/bun.lockb
diff --git a/package.json b/package.json
@@ -29,7 +29,7 @@
         "class-variance-authority": "^0.7.0",
         "clsx": "^2.1.1",
         "deep-equal": "^2.2.3",
-        "expo": "~51.0.37",
+        "expo": "~51.0.38",
         "expo-background-fetch": "^12.0.1",
         "expo-blur": "~13.0.2",
         "expo-build-properties": "^0.12.5",
@@ -51,9 +51,10 @@
         "react": "18.3.1",
         "react-dom": "18.3.1",
         "react-native": "~0.75.4",
+        "react-native-bottom-tabs": "^0.0.11",
         "react-native-gesture-handler": "~2.20.0",
-        "react-native-keyboard-controller": "^1.14.0",
-        "react-native-reanimated": "~3.15.4",
+        "react-native-keyboard-controller": "^1.14.2",
+        "react-native-reanimated": "~3.15.5",
         "react-native-safe-area-context": "4.11.0",
         "react-native-screens": "~3.34.0",
         "react-native-svg": "15.7.1",
@@ -64,11 +65,11 @@
         "resend": "^4.0.0",
         "sonner-native": "^0.15.0",
         "string-similarity-js": "^2.1.4",
-        "tailwind-merge": "^2.5.3",
-        "tailwindcss": "^3.4.13"
+        "tailwind-merge": "^2.5.4",
+        "tailwindcss": "^3.4.14"
     },
     "devDependencies": {
-        "@babel/core": "^7.25.7",
+        "@babel/core": "^7.25.8",
         "@types/react": "~18.3.11",
         "typescript": "~5.6.3"
     },