Merge pull request #531 from mozzius/samuel/bottom-tabs

Native bottom tabs

Author: mozzius

apps/expo/app.config.ts

@@ -72,11 +72,22 @@ const defineConfig = (_: ConfigContext): ExpoConfig => ({
     typedRoutes: false, // too much string interpolation :(
   },
   plugins: [
+    "./plugins/withStaticPods.js",
+    [
+      "react-native-edge-to-edge",
+      {
+        android: {
+          parentTheme: "Material3",
+        },
+      },
+    ],
     [
       "expo-build-properties",
       {
         ios: {
           deploymentTarget: "14.0",
+          useFrameworks: "static",
+          ccacheEnabled: true,
         },
       },
     ],

apps/expo/assets/tabs/bell.svg

@@ -1,6 +1,6 @@
 {
   "name": "@graysky/app",
-  "version": "1.6.4",
+  "version": "1.7.0",
   "main": "index.tsx",
   "scripts": {
     "eas-build-pre-install": "./scripts/pre-install.sh",
@@ -28,6 +28,7 @@
   },
   "dependencies": {
     "@atproto/api": "^0.13.31",
+    "@bottom-tabs/react-navigation": "^0.8.6",
     "@expo/metro-config": "^0.18.11",
     "@expo/react-native-action-sheet": "^4.0.1",
     "@formatjs/intl-getcanonicallocales": "^2.3.0",
@@ -79,7 +80,6 @@
     "expo-screen-orientation": "^7.0.5",
     "expo-sharing": "^12.0.1",
     "expo-splash-screen": "~0.27.5",
-    "expo-status-bar": "~1.12.1",
     "expo-system-ui": "~3.0.7",
     "expo-task-manager": "^11.7.2",
     "expo-updates": "^0.25.24",
@@ -99,11 +99,13 @@
     "react-native": "0.75.3",
     "react-native-avoid-softinput": "^5.0.0",
     "react-native-awesome-gallery": "^0.4.2",
+    "react-native-bottom-tabs": "^0.8.6",
     "react-native-circular-progress": "^1.3.9",
     "react-native-collapsible-tab-view": "^8.0.0",
-    "react-native-date-picker": "^5.0.0",
+    "react-native-date-picker": "^5.0.10",
     "react-native-draggable-flatlist": "^4.0.1",
     "react-native-drawer-layout": "4.0.0-alpha.5",
+    "react-native-edge-to-edge": "^1.4.3",
     "react-native-gesture-handler": "~2.19.0",
     "react-native-image-crop-picker": "0.41.2",
     "react-native-ios-context-menu": "^3.1.0",

apps/expo/assets/tabs/cloud.svg

@@ -0,0 +1,68 @@
+const { promises: fs } = require("node:fs");
+const path = require("node:path");
+const {
+  withDangerousMod,
+} = require("@expo/config-plugins/build/plugins/withDangerousMod.js");
+const {
+  mergeContents,
+} = require("@expo/config-plugins/build/utils/generateCode.js");
+
+function addPreInstall(src) {
+  return mergeContents({
+    tag: "add-pre-install",
+    src,
+    newSrc: `
+  pre_install do |installer|
+    installer.pod_targets.each do |pod|
+      if pod.name.eql?('react-native-paste-input')
+        def pod.build_type
+          Pod::BuildType.static_library
+        end
+      end
+    end
+  end`,
+    anchor: /use_expo_modules!/,
+    offset: 1,
+    comment: "#",
+  });
+}
+
+const withPreInstall = (config) => {
+  return withDangerousMod(config, [
+    "ios",
+    async (config) => {
+      const filePath = path.join(
+        config.modRequest.platformProjectRoot,
+        "Podfile",
+      );
+      const contents = await fs.readFile(filePath, "utf-8");
+      let results;
+      if (contents.indexOf("pod.name.eql?('react-native-paste-input')") > -1) {
+        return config;
+      } else {
+        try {
+          results = addPreInstall(contents);
+        } catch (error) {
+          if (error.code === "ERR_NO_MATCH") {
+            throw new Error(
+              `Cannot add pre_install hook to project's ios/Podfile because it's malformed. Please report this with a copy of your project Podfile.`,
+            );
+          }
+          throw error;
+        }
+
+        if (results.didMerge || results.didClear) {
+          await fs.writeFile(filePath, results.contents);
+        }
+        return config;
+      }
+    },
+  ]);
+};
+
+const initPlugin = (config) => {
+  config = withPreInstall(config);
+  return config;
+};
+
+module.exports = initPlugin;

apps/expo/assets/tabs/cloudy.svg

@@ -35,11 +35,6 @@ export default function AuthLayout() {
       <Stack
         screenOptions={{
           headerLeft,
-          ...Platform.select({
-            android: {
-              animation: "ios",
-            },
-          }),
         }}
       >
         <Stack.Screen