diff --git a/mobile/src/app/(tabs)/capture.tsx b/mobile/src/app/(tabs)/capture.tsx index 9336146..51888b3 100644 --- a/mobile/src/app/(tabs)/capture.tsx +++ b/mobile/src/app/(tabs)/capture.tsx @@ -13,6 +13,7 @@ export default function CaptureScreen() { const saveDraft = useNotesStore((state: NotesState) => state.saveDraft); const workspaces = useWorkspaceStore((state: WorkspaceState) => state.workspaces); const activeWorkspaceId = useWorkspaceStore((state: WorkspaceState) => state.activeWorkspaceId); + const setActiveWorkspace = useWorkspaceStore((state: WorkspaceState) => state.setActiveWorkspace); const activeWorkspaceName = workspaces.find((workspace: MobileWorkspace) => workspace.id === activeWorkspaceId)?.name ?? 'Drafts'; @@ -22,6 +23,22 @@ export default function CaptureScreen() { Create a lightweight mobile draft in {activeWorkspaceName}. Offline queue wiring comes in a later batch. + + {workspaces.map((workspace: MobileWorkspace) => { + const isActive = workspace.id === activeWorkspaceId; + return ( + setActiveWorkspace(workspace.id)} + style={[styles.workspaceChip, isActive ? styles.workspaceChipActive : null]} + > + + {workspace.name} + + + ); + })} + { @@ -121,6 +138,31 @@ const styles = StyleSheet.create({ padding: 14, gap: 6, }, + workspaceRow: { + flexDirection: 'row', + flexWrap: 'wrap', + gap: 8, + }, + workspaceChip: { + borderRadius: 999, + borderWidth: 1, + borderColor: colors.borderDefault, + paddingHorizontal: 12, + paddingVertical: 8, + backgroundColor: colors.surfaceCard, + }, + workspaceChipActive: { + backgroundColor: colors.accentPrimary, + borderColor: colors.accentPrimary, + }, + workspaceChipText: { + color: colors.textSecondary, + fontSize: 13, + fontWeight: '600', + }, + workspaceChipTextActive: { + color: colors.textPrimary, + }, cardTitle: { color: colors.textPrimary, fontSize: 16,