Update

apps/mobile/app/(app)/_layout.tsx

@@ -8,6 +8,7 @@ import { useAuthStore, useMatchStore, useMessageStore, useSubscriptionStore, use
 import { colors, gradients, blur, radius, spacing, typography, shadows } from "../../src/theme";
 import { supabase } from "../../src/lib/supabase";
 import { isBiometricEnabled } from "../../src/lib/biometricAuth";
+import { checkAndRegisterPushToken } from "../../src/lib/notifications";
 import { BiometricLockScreen } from "../../src/components/BiometricLockScreen";
 import type { MatchWithQuestion } from "../../src/types";
 import type { Database } from "../../src/types/supabase";
@@ -182,6 +183,14 @@ export default function AppLayout() {
         }
     }, [user?.id, initializeRevenueCat]);
 
+    // Check and register push token for this device
+    // This handles the case where user onboarded on a different device
+    useEffect(() => {
+        if (user?.id && user?.onboarding_completed) {
+            checkAndRegisterPushToken(user.id);
+        }
+    }, [user?.id, user?.onboarding_completed]);
+
     // Subscribe to realtime match notifications
     useEffect(() => {
         if (!user?.couple_id) return;

apps/mobile/app/(app)/chat/[id].tsx

@@ -211,7 +211,25 @@ export default function ChatScreen() {
     const handlePickImage = async () => {
         const result = await ImagePicker.launchImageLibraryAsync({
             mediaTypes: ImagePicker.MediaTypeOptions.Images,
-            allowsEditing: true,
+            quality: 0.7,
+        });
+
+        if (!result.canceled) {
+            uploadImage(result.assets[0].uri);
+        }
+    };
+
+    const handleTakePhoto = async () => {
+        const { status } = await ImagePicker.requestCameraPermissionsAsync();
+        if (status !== 'granted') {
+            Alert.alert(
+                "Camera Permission",
+                "Please allow camera access to take photos."
+            );
+            return;
+        }
+
+        const result = await ImagePicker.launchCameraAsync({
             quality: 0.7,
         });
 
@@ -423,6 +441,7 @@ export default function ChatScreen() {
                         onChangeText={handleTyping}
                         onSend={handleSend}
                         onPickImage={handlePickImage}
+                        onTakePhoto={handleTakePhoto}
                     />
                 </View>
             </KeyboardAvoidingView>
@@ -611,23 +630,29 @@ function InputBar({
     onChangeText,
     onSend,
     onPickImage,
+    onTakePhoto,
 }: {
     inputText: string;
     uploading: boolean;
     onChangeText: (text: string) => void;
     onSend: () => void;
     onPickImage: () => void;
+    onTakePhoto: () => void;
 }) {
     return (
         <View style={styles.inputContainer}>
-            <TouchableOpacity onPress={onPickImage} disabled={uploading} style={styles.attachButton}>
+            <TouchableOpacity onPress={onTakePhoto} disabled={uploading} style={styles.attachButton}>
                 {uploading ? (
                     <ActivityIndicator color={colors.primary} size="small" />
                 ) : (
-                    <Ionicons name="image-outline" size={22} color={colors.textSecondary} />
+                    <Ionicons name="camera-outline" size={22} color={colors.textSecondary} />
                 )}
             </TouchableOpacity>
 
+            <TouchableOpacity onPress={onPickImage} disabled={uploading} style={styles.attachButton}>
+                <Ionicons name="image-outline" size={22} color={colors.textSecondary} />
+            </TouchableOpacity>
+
             <View style={styles.inputFieldWrapper}>
                 <TextInput
                     style={styles.input}

apps/mobile/app/(app)/packs.tsx

@@ -123,10 +123,13 @@ export default function PacksScreen() {
                         </View>
                         <View style={styles.packInfo}>
                             <View style={styles.packHeader}>
-                                <Text style={[
-                                    styles.packName,
-                                    isPremiumLocked && styles.packNameLocked
-                                ]}>
+                                <Text
+                                    style={[
+                                        styles.packName,
+                                        isPremiumLocked && styles.packNameLocked
+                                    ]}
+                                    numberOfLines={1}
+                                >
                                     {item.name}
                                 </Text>
                                 {item.is_premium && (
@@ -359,7 +362,7 @@ const styles = StyleSheet.create({
     },
     packInfo: {
         flex: 1,
-        marginRight: spacing.sm,
+        marginRight: spacing.md,
     },
     packHeader: {
         flexDirection: "row",
@@ -370,6 +373,8 @@ const styles = StyleSheet.create({
         ...typography.headline,
         color: colors.text,
         marginRight: spacing.sm,
+        flex: 1,
+        flexShrink: 1,
     },
     packNameLocked: {
         color: colors.textSecondary,