From af1543135d42adc2e97dc5243aeef7418cd3b00d Mon Sep 17 00:00:00 2001
From: Matthias Nott <mnott@mnsoft.org>
Date: Sat, 07 Mar 2026 08:39:26 +0100
Subject: [PATCH] feat: dual address auto-switch, custom icon, notifications, image support

---
 components/chat/CommandBar.tsx |   47 ++++++++++++++++++++++++++---------------------
 1 files changed, 26 insertions(+), 21 deletions(-)

diff --git a/components/chat/CommandBar.tsx b/components/chat/CommandBar.tsx
index de9c0f4..92e6a33 100644
--- a/components/chat/CommandBar.tsx
+++ b/components/chat/CommandBar.tsx
@@ -1,14 +1,17 @@
 import React, { useState } from "react";
-import { Pressable, Text, View, useWindowDimensions } from "react-native";
+import { Pressable, Text, View } from "react-native";
 import * as Haptics from "expo-haptics";
+import { useTheme } from "../../contexts/ThemeContext";
 
 interface CommandBarProps {
-  onSessions: () => void;
   onScreenshot: () => void;
-  onHelp: () => void;
+  onNavigate: () => void;
+  onPhoto: () => void;
+  onClear: () => void;
 }
 
-export function CommandBar({ onSessions, onScreenshot, onHelp }: CommandBarProps) {
+export function CommandBar({ onScreenshot, onNavigate, onPhoto, onClear }: CommandBarProps) {
+  const { colors } = useTheme();
   return (
     <View
       style={{
@@ -18,26 +21,30 @@
         gap: 8,
       }}
     >
-      <CmdBtn icon="📋" label="Sessions" bg="#1A2744" border="#2E4A7A" onPress={onSessions} />
-      <CmdBtn icon="📸" label="Screen" bg="#1A3A2A" border="#2E6A4A" onPress={onScreenshot} />
-      <CmdBtn icon="❓" label="Help" bg="#3A1A2A" border="#6A2E4A" onPress={onHelp} />
+      <CmdBtn icon="📸" label="Screen" onPress={onScreenshot} colors={colors} />
+      <CmdBtn icon="🧭" label="Navigate" onPress={onNavigate} colors={colors} />
+      <CmdBtn icon="📎" label="Photo" onPress={onPhoto} colors={colors} />
+      <CmdBtn icon="🗑" label="Clear" onPress={onClear} colors={colors} />
     </View>
   );
 }
 
 interface TextModeCommandBarProps {
-  onSessions: () => void;
   onScreenshot: () => void;
   onNavigate: () => void;
+  onPhoto: () => void;
+  onHelp: () => void;
   onClear: () => void;
 }
 
 export function TextModeCommandBar({
-  onSessions,
   onScreenshot,
   onNavigate,
+  onPhoto,
+  onHelp,
   onClear,
 }: TextModeCommandBarProps) {
+  const { colors } = useTheme();
   return (
     <View
       style={{
@@ -47,10 +54,11 @@
         gap: 8,
       }}
     >
-      <CmdBtn icon="📋" label="Sessions" bg="#1A2744" border="#2E4A7A" onPress={onSessions} />
-      <CmdBtn icon="📸" label="Screen" bg="#1A3A2A" border="#2E6A4A" onPress={onScreenshot} />
-      <CmdBtn icon="🧭" label="Navigate" bg="#2A2A1A" border="#5A5A2E" onPress={onNavigate} />
-      <CmdBtn icon="🗑" label="Clear" bg="#3A1A1A" border="#6A2E2E" onPress={onClear} />
+      <CmdBtn icon="📸" label="Screen" onPress={onScreenshot} colors={colors} />
+      <CmdBtn icon="🧭" label="Navigate" onPress={onNavigate} colors={colors} />
+      <CmdBtn icon="📎" label="Photo" onPress={onPhoto} colors={colors} />
+      <CmdBtn icon="❓" label="Help" onPress={onHelp} colors={colors} />
+      <CmdBtn icon="🗑" label="Clear" onPress={onClear} colors={colors} />
     </View>
   );
 }
@@ -58,18 +66,15 @@
 function CmdBtn({
   icon,
   label,
-  bg,
-  border,
   onPress,
+  colors,
 }: {
   icon: string;
   label: string;
-  bg: string;
-  border: string;
   onPress: () => void;
+  colors: ReturnType<typeof useTheme>["colors"];
 }) {
   const [pressed, setPressed] = useState(false);
-  const { width } = useWindowDimensions();
 
   return (
     <View style={{ flex: 1 }}>
@@ -87,13 +92,13 @@
             borderRadius: 16,
             alignItems: "center",
             justifyContent: "center",
-            backgroundColor: pressed ? "#4A9EFF" : bg,
+            backgroundColor: pressed ? colors.accent : colors.bgTertiary,
             borderWidth: 1.5,
-            borderColor: pressed ? "#4A9EFF" : border,
+            borderColor: pressed ? colors.accent : colors.border,
           }}
         >
           <Text style={{ fontSize: 26, marginBottom: 2 }}>{icon}</Text>
-          <Text style={{ color: "#C8C8E0", fontSize: 13, fontWeight: "700" }}>
+          <Text style={{ color: colors.textSecondary, fontSize: 13, fontWeight: "700" }}>
             {label}
           </Text>
         </View>

--
Gitblit v1.3.1