Feat/stitch restyle

.claude/settings.local.json

@@ -24,7 +24,12 @@
       "Bash(gh run *)",
       "PowerShell(gh run list --workflow=android-release.yml --limit 3 2>&1)",
       "Bash(xxd)",
-      "Read(//d//**)"
+      "Read(//d//**)",
+      "Bash(xargs grep *)",
+      "Bash(echo \"tsc exit code: $?\")",
+      "Bash(powershell -Command ' *)",
+      "Bash(grep -rn \"#[0-9a-fA-F]\\\\{3,6\\\\}\" d:/Dev/pit-stop/src/app/ d:/Dev/pit-stop/src/components/fab.tsx d:/Dev/pit-stop/src/components/vehicle-card.tsx d:/Dev/pit-stop/src/components/part-status-row.tsx d:/Dev/pit-stop/src/components/add-sheet.tsx d:/Dev/pit-stop/src/components/app-tabs.tsx d:/Dev/pit-stop/src/components/status-pill.tsx)",
+      "Bash(grep -rn \"#[0-9a-fA-F]\\\\{3,6\\\\}\" \"d:/Dev/pit-stop/src/components/themed-text.tsx\" \"d:/Dev/pit-stop/src/components/themed-view.tsx\" \"d:/Dev/pit-stop/src/components/modal-sheet.tsx\")"
     ]
   }
 }

app.config.js

@@ -0,0 +1,24 @@
+const baseConfig = require("./app.json");
+
+const variant = process.env.APP_VARIANT;
+const isDev = variant === "development" || variant === "dev";
+
+const expo = {
+  ...baseConfig.expo,
+  name: isDev ? "Pit Stop Dev" : baseConfig.expo.name,
+  slug: isDev ? "pit-stop-dev" : baseConfig.expo.slug,
+  scheme: isDev ? "pitstop-dev" : baseConfig.expo.scheme,
+  icon: isDev ? "./assets/appIcons/appstore-dev.png" : baseConfig.expo.icon,
+  ios: {
+    ...baseConfig.expo.ios,
+    bundleIdentifier: isDev ? "com.edzy.pitstop.dev" : "com.edzy.pitstop",
+    icon: isDev ? "./assets/appIcons/appstore-dev.png" : baseConfig.expo.ios?.icon,
+  },
+  android: {
+    ...baseConfig.expo.android,
+    package: isDev ? "com.edzy.pitstop.dev" : baseConfig.expo.android.package,
+    icon: isDev ? "./assets/appIcons/playstore-dev.png" : baseConfig.expo.android.icon,
+  },
+};
+
+module.exports = { expo };

package.json

@@ -4,9 +4,16 @@
   "version": "1.0.0",
   "scripts": {
     "start": "expo start",
+    "start:dev": "node ./scripts/with-app-variant.js development expo start",
+    "prebuild": "expo prebuild",
+    "prebuild:clean": "expo prebuild --clean",
+    "prebuild:dev": "node ./scripts/with-app-variant.js development expo prebuild",
+    "prebuild:dev:clean": "node ./scripts/with-app-variant.js development expo prebuild --clean",
     "reset-project": "node ./scripts/reset-project.js",
     "android": "expo run:android",
+    "android:dev": "node ./scripts/with-app-variant.js development expo run:android",
     "ios": "expo run:ios",
+    "ios:dev": "node ./scripts/with-app-variant.js development expo run:ios",
     "web": "expo start --web",
     "lint": "expo lint",
     "test": "jest"
@@ -18,6 +25,7 @@
     }
   },
   "dependencies": {
+    "@expo/vector-icons": "^15.1.1",
     "@react-navigation/bottom-tabs": "^7.15.5",
     "@react-navigation/elements": "^2.9.10",
     "@react-navigation/native": "^7.1.33",
@@ -30,6 +38,7 @@
     "expo-linking": "~55.0.14",
     "expo-router": "~55.0.13",
     "expo-splash-screen": "~55.0.19",
+    "expo-sqlite": "~55.0.15",
     "expo-status-bar": "~55.0.5",
     "expo-symbols": "~55.0.7",
     "expo-system-ui": "~55.0.16",
@@ -38,13 +47,12 @@
     "react-dom": "19.2.0",
     "react-native": "0.83.6",
     "react-native-gesture-handler": "~2.30.0",
-    "react-native-worklets": "0.7.4",
     "react-native-reanimated": "4.2.1",
     "react-native-safe-area-context": "~5.6.2",
     "react-native-screens": "~4.23.0",
+    "react-native-svg": "15.15.3",
     "react-native-web": "~0.21.0",
-    "expo-sqlite": "~55.0.15",
-    "react-native-svg": "15.15.3"
+    "react-native-worklets": "0.7.4"
   },
   "devDependencies": {
     "@types/jest": "29.5.14",

scripts/with-app-variant.js

@@ -0,0 +1,16 @@
+const { spawnSync } = require("node:child_process");
+
+const [, , variant, command, ...args] = process.argv;
+
+if (!variant || !command) {
+  console.error("Usage: node scripts/with-app-variant.js <variant> <command> [...args]");
+  process.exit(1);
+}
+
+const result = spawnSync(command, args, {
+  env: { ...process.env, APP_VARIANT: variant },
+  shell: true,
+  stdio: "inherit",
+});
+
+process.exit(result.status ?? 1);

src/app/index.tsx

@@ -3,6 +3,7 @@ import { ScrollView, StyleSheet, View } from 'react-native';
 import { useSQLiteContext } from 'expo-sqlite';
 import { useFocusEffect } from '@react-navigation/native';
 import { SafeAreaView } from 'react-native-safe-area-context';
+import { MaterialIcons } from '@expo/vector-icons';
 
 import { Colors, BottomTabInset, Spacing } from '@/constants/theme';
 import { Part, Vehicle } from '@/types';
@@ -76,7 +77,11 @@ export default function HomeScreen() {
 
         {!hasFlags && data.length > 0 && (
           <View style={styles.allGood}>
-            <ThemedText style={styles.allGoodIcon}>✓</ThemedText>
+            <MaterialIcons
+              name="check-circle"
+              size={20}
+              color={Colors.dark.success}
+            />
             <ThemedText type="default">All parts are up to date</ThemedText>
           </View>
         )}
@@ -143,8 +148,4 @@ const styles = StyleSheet.create({
     gap: Spacing.two,
     paddingVertical: Spacing.four,
   },
-  allGoodIcon: {
-    color: Colors.dark.success,
-    fontSize: 20,
-  },
 });