Merge branch 'development' of https://github.com/andrew-bierman/PackRat…

… into expo/upgrade_51
andrew-bierman · Jan 9, 2025 · ac58e61 · ac58e61
2 parents e828c70 + e397b3a
commit ac58e61
Show file tree

Hide file tree

Showing 11 changed files with 76 additions and 4 deletions.
diff --git a/apps/expo/app/(app)/(drawer)/(tabs)/(stack)/maps/index.tsx b/apps/expo/app/(app)/(drawer)/(tabs)/(stack)/maps/index.tsx
@@ -30,6 +30,8 @@ export default function MapsScreen() {
             hideWhenScrolling: false,
             headerIconColor: currentTheme.colors.text,
             inputType: 'text',
+            textColor:
+              Platform.OS === 'android' ? currentTheme.colors.text : undefined,
             onChangeText: (e) => setSearchQuery(e.nativeEvent.text),
           },
           headerStyle: {

diff --git a/apps/expo/app/(app)/(drawer)/(tabs)/(stack)/products/index.tsx b/apps/expo/app/(app)/(drawer)/(tabs)/(stack)/products/index.tsx
@@ -30,6 +30,8 @@ export default function ProductsPage() {
             headerIconColor: currentTheme.colors.text,
             hideWhenScrolling: false,
             inputType: 'text',
+            textColor:
+              Platform.OS === 'android' ? currentTheme.colors.text : undefined,
             onChangeText: (e) => setSearchQuery(e.nativeEvent.text),
           },
 

diff --git a/apps/expo/app/(app)/(drawer)/(tabs)/(stack)/trips/index.tsx b/apps/expo/app/(app)/(drawer)/(tabs)/(stack)/trips/index.tsx
@@ -26,6 +26,8 @@ export default function FeedNav() {
             headerIconColor: currentTheme.colors.text,
             hideWhenScrolling: false,
             inputType: 'text',
+            textColor:
+              Platform.OS === 'android' ? currentTheme.colors.text : undefined,
             onChangeText: (e) => setSearchQuery(e.nativeEvent.text),
           },
           // https://reactnavigation.org/docs/headers#adjusting-header-styles

diff --git a/apps/expo/app/(app)/(drawer)/(tabs)/feed/index.tsx b/apps/expo/app/(app)/(drawer)/(tabs)/feed/index.tsx
@@ -35,6 +35,8 @@ export default function FeedNav() {
 
             hideWhenScrolling: false,
             inputType: 'text',
+            textColor:
+              Platform.OS === 'android' ? currentTheme.colors.text : undefined,
             onChangeText: (e) => setSearchQuery(e.nativeEvent.text),
           },
 

diff --git a/apps/expo/app/(app)/(drawer)/(tabs)/index/index.tsx b/apps/expo/app/(app)/(drawer)/(tabs)/index/index.tsx
@@ -36,6 +36,16 @@ export default function HomeScreen() {
       <Stack.Screen
         options={{
           title: 'Home',
+          headerSearchBarOptions:
+            Platform.OS === 'ios'
+              ? {
+                  placeholder: 'Search maps',
+                  hideWhenScrolling: false,
+                  headerIconColor: currentTheme.colors.text,
+                  inputType: 'text',
+                  onChangeText: (e) => setSearchQuery(e.nativeEvent.text),
+                }
+              : undefined,
         }}
       />
       {connectionStatus === 'connected' && (

diff --git a/apps/expo/app/(app)/(drawer)/(tabs)/packs/index.tsx b/apps/expo/app/(app)/(drawer)/(tabs)/packs/index.tsx
@@ -28,6 +28,8 @@ export default function Packs() {
             headerIconColor: currentTheme.colors.text,
             hideWhenScrolling: false,
             inputType: 'text',
+            textColor:
+              Platform.OS === 'android' ? currentTheme.colors.text : undefined,
             onChangeText: (e) => setSearchQuery(e.nativeEvent.text),
           },
 

diff --git a/packages/app/components/Fab/FabNative.tsx b/packages/app/components/Fab/FabNative.tsx
@@ -21,7 +21,14 @@ const FABNative: React.FC<FABProps> = ({
   const { currentTheme } = useTheme();
 
   return (
-    <Popover>
+    <Popover
+      open={showQuickActions}
+      onOpenChange={(open) => {
+        if (!open) {
+          closeQuickActions();
+        }
+      }}
+    >
       <Popover.Trigger asChild>
         <RButton
           style={{
@@ -37,6 +44,7 @@ const FABNative: React.FC<FABProps> = ({
             bottom: 20,
             alignSelf: 'center',
           }}
+          onPress={toggleQuickActions}
         >
           <MaterialIcons
             name="add"
@@ -63,7 +71,10 @@ const FABNative: React.FC<FABProps> = ({
           {quickActionData.map((action) => (
             <QuickActionButton
               key={action.action}
-              onPress={() => handleActionSelect(action.action)}
+              onPress={() => {
+                handleActionSelect(action.action);
+                closeQuickActions();
+              }}
               iconName={action.iconName}
               text={action.text}
             />

diff --git a/packages/app/components/settings/index.tsx b/packages/app/components/settings/index.tsx
@@ -1,6 +1,6 @@
 import { AnimatePresence, Button, H1, Label, Spinner, View } from 'tamagui';
 import { Input } from './components/inputParts';
-import React, { useState } from 'react';
+import React, { useState, useContext } from 'react';
 import { Info } from '@tamagui/lucide-icons';
 import { FormCard } from './components/layoutParts';
 import { useForm, Controller } from 'react-hook-form';
@@ -10,26 +10,43 @@ import {
   FormSelect,
   ImageUpload,
   RH5,
+  RIconButton,
   RLabel,
   RStack,
   SubmitButton,
+  RText,
 } from '@packrat/ui';
 import Avatar from '../Avatar/Avatar';
 import { useProfileSettings } from 'app/modules/user/hooks';
+import Feather from '@expo/vector-icons/Feather';
+
 import {
   deleteUserForm,
   passwordChangeSchema,
   userSettingsSchema,
 } from '@packrat/validations';
 import { useDeleteProfile } from 'app/modules/user/hooks';
 import useResponsive from 'app/hooks/useResponsive';
+import ThemeContext from '../../context/theme';
+import { Platform } from 'react-native';
 
 export function SettingsForm() {
   const [showConfirmPassword, setShowConfirmPassword] = useState(false);
   const [loading, setLoading] = useState(false);
   const { user, handleEditUser, handleUpdatePassword } = useProfileSettings();
   const { deleteProfile, isLoading } = useDeleteProfile();
   const { xs, sm, md } = useResponsive();
+  const { isDark, enableDarkMode, enableLightMode } = useContext(ThemeContext);
+
+  const iconName = isDark ? 'moon' : 'sun';
+  const iconColor = isDark ? 'white' : 'black';
+  const handlePress = () => {
+    if (isDark) {
+      enableLightMode();
+    } else {
+      enableDarkMode();
+    }
+  };
 
   const {
     control,
@@ -177,6 +194,26 @@ export function SettingsForm() {
               Update Profile
             </SubmitButton>
           </Form>
+          {Platform.OS !== 'web' && (
+            <RStack
+              style={{
+                flexDirection: 'row',
+                justifyContent: 'space-between',
+                alignItems: 'center',
+
+                padding: 5,
+              }}
+            >
+              <RText style={{ fontWeight: 'bold', fontSize: 16 }}>
+                Toggle theme
+              </RText>
+              <RIconButton
+                backgroundColor="transparent"
+                icon={<Feather name={iconName} size={24} color={iconColor} />}
+                onPress={handlePress}
+              />
+            </RStack>
+          )}
 
           <Form validationSchema={passwordChangeSchema}>
             <View

diff --git a/packages/app/hooks/trips/useAddTrip.ts b/packages/app/hooks/trips/useAddTrip.ts
@@ -8,6 +8,7 @@ export const useAddTrip = () => {
     mutation.mutate(newTrip, {
       onSuccess: (result) => {
         utils.getTrips.invalidate();
+        utils.getUserTripsFeed.invalidate();
       },
     });
   };

diff --git a/packages/app/hooks/trips/useDeleteTrips.ts b/packages/app/hooks/trips/useDeleteTrips.ts
@@ -3,11 +3,14 @@ import { queryTrpc } from 'app/trpc';
 
 export const useDeleteTrips = (id) => {
   const { mutateAsync: deleteTrip } = queryTrpc.deleteTrip.useMutation();
+  const utils = queryTrpc.useUtils();
   const router = useRouter();
 
   const handleDeleteTrip = async () => {
     try {
       await deleteTrip({ tripId: id });
+      utils.getTrips.invalidate();
+      utils.getUserTripsFeed.invalidate();
       router.replace('/trips');
     } catch {}
   };

diff --git a/packages/app/screens/trip/TripScreen.tsx b/packages/app/screens/trip/TripScreen.tsx
@@ -124,7 +124,7 @@ export function TripScreen({
               flexWrap: 'wrap',
             }}
           >
-            <RText style={{ fontWeight: 700, fontSize: 24 }}>
+            <RText style={{ fontWeight: 700, fontSize: 24, marginTop: 32 }}>
               {isViewOnlyMode ? 'Trip Details' : 'Plan Your Trip'}
             </RText>
             {!isViewOnlyMode && (