Feat/exercise notes

app/exercise/[id].tsx

@@ -21,6 +21,7 @@ import {
   Trash2,
   Check,
   X,
+  StickyNote,
 } from 'lucide-react-native';
 import { colors } from '@/constants/theme';
 import { getDatabase } from '@/db/connection';
@@ -454,6 +455,78 @@ export default function ExerciseDetailScreen() {
           </View>
         </View>
 
+        {/* Notes section */}
+        {exercise.notes ? (
+          <Pressable
+            onPress={() => router.push(`/exercise/edit/${exerciseId}`)}
+            accessibilityRole="button"
+            accessibilityLabel={t('exercise.notes')}
+          >
+            {({ pressed }) => (
+              <Card
+                style={{
+                  marginBottom: 24,
+                  opacity: pressed ? 0.7 : 1,
+                }}
+              >
+                <View
+                  style={{ flexDirection: 'row', alignItems: 'center', gap: 8, marginBottom: 8 }}
+                >
+                  <StickyNote size={16} color={colors.text.tertiary} strokeWidth={1.5} />
+                  <Text
+                    style={{
+                      fontSize: 14,
+                      fontWeight: '600',
+                      color: colors.text.secondary,
+                    }}
+                  >
+                    {t('exercise.notes')}
+                  </Text>
+                </View>
+                <Text
+                  style={{
+                    fontSize: 14,
+                    color: colors.text.primary,
+                    lineHeight: 20,
+                  }}
+                >
+                  {exercise.notes}
+                </Text>
+              </Card>
+            )}
+          </Pressable>
+        ) : !exercise.isPredefined ? (
+          <Pressable
+            onPress={() => router.push(`/exercise/edit/${exerciseId}`)}
+            accessibilityRole="button"
+            accessibilityLabel={t('exercise.addNotes')}
+          >
+            {({ pressed }) => (
+              <View
+                style={{
+                  flexDirection: 'row',
+                  alignItems: 'center',
+                  justifyContent: 'center',
+                  gap: 6,
+                  marginBottom: 24,
+                  opacity: pressed ? 0.7 : 1,
+                }}
+              >
+                <StickyNote size={14} color={colors.brand.blue} strokeWidth={1.5} />
+                <Text
+                  style={{
+                    fontSize: 14,
+                    fontWeight: '500',
+                    color: colors.brand.blue,
+                  }}
+                >
+                  {t('exercise.addNotes')}
+                </Text>
+              </View>
+            )}
+          </Pressable>
+        ) : null}
+
         {/* Stats section */}
         {statsLoading ? (
           <View style={{ paddingVertical: 24, alignItems: 'center' }}>

app/exercise/create.tsx

@@ -66,6 +66,7 @@ export default function CreateExerciseScreen() {
 
   const [name, setName] = useState('');
   const [type, setType] = useState('');
+  const [notes, setNotes] = useState('');
   const [selectedMuscleGroups, setSelectedMuscleGroups] = useState<string[]>([]);
   const [muscleGroupModalVisible, setMuscleGroupModalVisible] = useState(false);
   const [errors, setErrors] = useState<FormErrors>({});
@@ -102,14 +103,15 @@ export default function CreateExerciseScreen() {
         muscleGroup: groups[0],
         muscleGroups: groups,
         illustration: null,
+        notes: notes.trim() || null,
       });
       router.back();
     } catch (error) {
       console.error('Failed to create exercise:', error);
       Alert.alert('Error', 'Could not save exercise. Please try again.');
       setSaving(false);
     }
-  }, [name, type, selectedMuscleGroups, router]);
+  }, [name, type, notes, selectedMuscleGroups, router]);
 
   return (
     <SafeAreaView style={{ flex: 1, backgroundColor: colors.bg.primary }}>
@@ -371,6 +373,19 @@ export default function CreateExerciseScreen() {
               </Pressable>
             </Modal>
           </View>
+
+          {/* Notes */}
+          <Input
+            label={t('exercise.notes')}
+            placeholder={t('exercise.notesPlaceholder')}
+            value={notes}
+            onChangeText={setNotes}
+            multiline
+            numberOfLines={3}
+            style={{ minHeight: 80, textAlignVertical: 'top' }}
+            maxLength={500}
+            returnKeyType="default"
+          />
         </ScrollView>
 
         {/* Save button */}

app/exercise/edit/[id].tsx

@@ -71,6 +71,7 @@ export default function EditExerciseScreen() {
   const [notFound, setNotFound] = useState(false);
   const [name, setName] = useState('');
   const [type, setType] = useState('');
+  const [notes, setNotes] = useState('');
   const [selectedMuscleGroups, setSelectedMuscleGroups] = useState<string[]>([]);
   const [muscleGroupModalVisible, setMuscleGroupModalVisible] = useState(false);
   const [errors, setErrors] = useState<FormErrors>({});
@@ -88,6 +89,7 @@ export default function EditExerciseScreen() {
         }
         setName(exercise.name);
         setType(exercise.type);
+        setNotes(exercise.notes ?? '');
         setSelectedMuscleGroups(exercise.muscleGroups);
       } catch (error) {
         console.error('Failed to load exercise:', error);
@@ -128,14 +130,15 @@ export default function EditExerciseScreen() {
         type: type as ExerciseType,
         muscleGroup: groups[0],
         muscleGroups: groups,
+        notes: notes.trim() || null,
       });
       router.back();
     } catch (error) {
       console.error('Failed to update exercise:', error);
       Alert.alert(t('common.error'), t('exercise.edit.saveError'));
       setSaving(false);
     }
-  }, [name, type, selectedMuscleGroups, exerciseId, router, t]);
+  }, [name, type, notes, selectedMuscleGroups, exerciseId, router, t]);
 
   if (loading) {
     return (
@@ -419,6 +422,19 @@ export default function EditExerciseScreen() {
               </Pressable>
             </Modal>
           </View>
+
+          {/* Notes */}
+          <Input
+            label={t('exercise.notes')}
+            placeholder={t('exercise.notesPlaceholder')}
+            value={notes}
+            onChangeText={setNotes}
+            multiline
+            numberOfLines={3}
+            style={{ minHeight: 80, textAlignVertical: 'top' }}
+            maxLength={500}
+            returnKeyType="default"
+          />
         </ScrollView>
 
         {/* Save button */}

app/routine/[id].tsx

@@ -28,6 +28,7 @@ function routineToExerciseItems(routine: RoutineWithExercises): RoutineExerciseI
     name: re.exercise.name,
     illustration: re.exercise.illustration,
     muscleGroup: re.exercise.muscleGroup,
+    notes: re.exercise.notes,
   }));
 }