Update files

packages/app/src/app/agents.tsx

@@ -33,7 +33,7 @@ export default function AgentsScreen() {
 
   return (
     <View style={styles.container}>
-      <BackHeader title="All Agents" />
+      <BackHeader title="All agents" />
       <AgentList
         agents={sortedAgents}
         isRefreshing={isManualRefresh && isRevalidating}

packages/app/src/app/settings.tsx

@@ -469,7 +469,7 @@ export default function SettingsScreen() {
       }
 
       Alert.alert(
-        "Remove Host",
+        "Remove host",
         `Remove ${profile.label}?`,
         [
           { text: "Cancel", style: "cancel" },
@@ -520,7 +520,7 @@ export default function SettingsScreen() {
 
   function handleReset() {
     Alert.alert(
-      "Reset Settings",
+      "Reset settings",
       "Are you sure you want to reset all settings to defaults?",
       [
         { text: "Cancel", style: "cancel" },
@@ -531,7 +531,7 @@ export default function SettingsScreen() {
             try {
               await resetSettings();
               Alert.alert(
-                "Settings Reset",
+                "Settings reset",
                 "All settings have been reset to defaults."
               );
             } catch (error) {
@@ -596,7 +596,7 @@ export default function SettingsScreen() {
               style={styles.addButton}
               onPress={() => setIsAddHostMethodVisible(true)}
             >
-              <Text style={styles.addButtonText}>+ Add Host</Text>
+              <Text style={styles.addButtonText}>+ Add host</Text>
             </Pressable>
           </View>
 
@@ -711,7 +711,7 @@ export default function SettingsScreen() {
             <View style={styles.audioCard}>
               <View style={styles.audioRow}>
                 <View style={styles.audioRowContent}>
-                  <Text style={styles.audioRowTitle}>Use Speaker</Text>
+                  <Text style={styles.audioRowTitle}>Use speaker</Text>
                   <Text style={styles.audioRowDescription}>
                     Play audio through speaker instead of earpiece
                   </Text>
@@ -726,7 +726,7 @@ export default function SettingsScreen() {
 
               <View style={[styles.audioRow, styles.audioRowBorder]}>
                 <View style={styles.audioRowContent}>
-                  <Text style={styles.audioRowTitle}>Keep Screen On</Text>
+                  <Text style={styles.audioRowTitle}>Keep screen on</Text>
                   <Text style={styles.audioRowDescription}>
                     Prevent screen from sleeping during voice sessions
                   </Text>
@@ -750,7 +750,7 @@ export default function SettingsScreen() {
                 onPress={() => router.push("/audio-test")}
               >
                 <View style={styles.devButtonContent}>
-                  <Text style={styles.devButtonTitle}>Audio Test</Text>
+                  <Text style={styles.devButtonTitle}>Audio test</Text>
                   <Text style={styles.devButtonDescription}>
                     Test audio recording and playback
                   </Text>

packages/app/src/components/agent-details-sheet.tsx

@@ -55,7 +55,7 @@ export function AgentDetailsSheet({
 
   return (
     <AdaptiveModalSheet
-      title="Agent Details"
+      title="Agent details"
       visible={visible}
       onClose={onClose}
       testID="agent-details-sheet"

packages/app/src/components/agent-form/agent-form-dropdowns.tsx

@@ -706,7 +706,7 @@ export function AgentConfigRow({
       <View style={styles.agentConfigColumn}>
         <ComboSelect
           label="PROVIDER"
-          title="Select Provider"
+          title="Select provider"
           value={selectedProvider}
           options={providerOptions}
           placeholder="Select..."
@@ -717,7 +717,7 @@ export function AgentConfigRow({
       <View style={styles.agentConfigColumn}>
         <ComboSelect
           label="MODEL"
-          title="Select Model"
+          title="Select model"
           value={selectedModel}
           options={modelSelectOptions}
           placeholder="Auto"
@@ -729,7 +729,7 @@ export function AgentConfigRow({
       <View style={styles.agentConfigColumn}>
         <ComboSelect
           label="MODE"
-          title="Select Mode"
+          title="Select mode"
           value={effectiveSelectedMode}
           options={modeSelectOptions}
           placeholder="Default"
@@ -775,7 +775,7 @@ export function AssistantDropdown({
         controlRef={anchorRef}
       />
       <AdaptiveSelect
-        title="Choose Assistant"
+        title="Choose assistant"
         visible={isOpen}
         onClose={handleClose}
         anchorRef={anchorRef}
@@ -1069,7 +1069,7 @@ export function WorkingDirectoryDropdown({
         testID="working-directory-select"
       />
       <AdaptiveSelect
-        title="Working Directory"
+        title="Working directory"
         visible={isOpen}
         onClose={handleClose}
         anchorRef={anchorRef}

packages/app/src/components/agent-list.tsx

@@ -226,7 +226,7 @@ export function AgentList({
                   ]}
                   numberOfLines={1}
                 >
-                  {agent.title || "New Agent"}
+                  {agent.title || "New agent"}
                 </Text>
               </View>
 

packages/app/src/components/file-explorer-pane.tsx

@@ -862,7 +862,7 @@ export function FileExplorerPane({
                   handleCloseMenu();
                 }}
               >
-                <Text style={styles.entryMenuText}>Copy Path</Text>
+                <Text style={styles.entryMenuText}>Copy path</Text>
               </Pressable>
               {menuEntry.kind === "file" ? (
                 <Pressable

packages/app/src/components/grouped-agent-list.tsx

@@ -444,7 +444,7 @@ export function GroupedAgentList({
                   ]}
                   numberOfLines={1}
                 >
-                  {agent.title || "New Agent"}
+                  {agent.title || "New agent"}
                 </Text>
               </View>
 

packages/app/src/components/home-footer.tsx

@@ -156,7 +156,7 @@ export function HomeFooter() {
                   style={iconStyle}
                 />
               </View>
-              <Text style={styles.footerButtonText}>New Agent</Text>
+              <Text style={styles.footerButtonText}>New agent</Text>
             </Pressable>
 
             <Pressable

packages/app/src/components/message.tsx

@@ -19,7 +19,8 @@ import {
 import type { ReactNode, ComponentType } from "react";
 import type { AgentProvider } from "@server/server/agent/agent-sdk-types";
 import { getAgentProviderDefinition } from "@server/server/agent/provider-manifest";
-import Markdown from "react-native-markdown-display";
+import Markdown, { MarkdownIt } from "react-native-markdown-display";
+import * as Linking from "expo-linking";
 import {
   Circle,
   Info,
@@ -506,6 +507,16 @@ export const AssistantMessage = memo(function AssistantMessage({
 
   const markdownStyles = useMemo(() => createMarkdownStyles(theme), [theme]);
 
+  const markdownParser = useMemo(
+    () => MarkdownIt({ typographer: true, linkify: true }),
+    []
+  );
+
+  const handleLinkPress = useCallback((url: string) => {
+    void Linking.openURL(url);
+    return true;
+  }, []);
+
   const markdownRules = useMemo(() => {
     return {
       text: (
@@ -657,7 +668,12 @@ export const AssistantMessage = memo(function AssistantMessage({
           assistantMessageStylesheet.containerSpacing,
       ]}
     >
-      <Markdown style={markdownStyles} rules={markdownRules}>
+      <Markdown
+        style={markdownStyles}
+        rules={markdownRules}
+        markdownit={markdownParser}
+        onLinkPress={handleLinkPress}
+      >
         {message}
       </Markdown>
     </View>

packages/app/src/components/sliding-sidebar.tsx

@@ -201,15 +201,16 @@ export function SlidingSidebar({ selectedAgentId }: SlidingSidebarProps) {
               {/* Header */}
               <View style={styles.sidebarHeader}>
                 <Pressable
-                  style={({ hovered }) => [
+                  style={styles.newAgentButton}
-                    styles.newAgentButton,
-                    hovered && styles.newAgentButtonHovered,
-                  ]}
                   testID="sidebar-new-agent"
                   onPress={handleCreateAgentCleanMobile}
                 >
-                  <Plus size={18} color={theme.colors.foreground} />
+                  {({ hovered }) => (
-                  <Text style={styles.newAgentButtonText}>New Agent</Text>
+                    <>
+                      <Plus size={18} color={hovered ? theme.colors.foreground : theme.colors.foregroundMuted} />
+                      <Text style={[styles.newAgentButtonText, hovered && styles.newAgentButtonTextHovered]}>New agent</Text>
+                    </>
+                  )}
                 </Pressable>
               </View>
 
@@ -267,15 +268,16 @@ export function SlidingSidebar({ selectedAgentId }: SlidingSidebarProps) {
         {...dragHandlers}
       >
         <Pressable
-          style={({ hovered }) => [
+          style={styles.newAgentButton}
-            styles.newAgentButton,
-            hovered && styles.newAgentButtonHovered,
-          ]}
           testID="sidebar-new-agent"
           onPress={handleCreateAgentCleanDesktop}
         >
-          <Plus size={18} color={theme.colors.foreground} />
+          {({ hovered }) => (
-          <Text style={styles.newAgentButtonText}>New Agent</Text>
+            <>
+              <Plus size={18} color={hovered ? theme.colors.foreground : theme.colors.foregroundMuted} />
+              <Text style={[styles.newAgentButtonText, hovered && styles.newAgentButtonTextHovered]}>New agent</Text>
+            </>
+          )}
         </Pressable>
       </View>
 
@@ -344,28 +346,25 @@ const styles = StyleSheet.create((theme) => ({
   sidebarHeader: {
     paddingHorizontal: theme.spacing[4],
     paddingTop: theme.spacing[4],
-    paddingBottom: theme.spacing[2],
+    paddingBottom: theme.spacing[3],
+    borderBottomWidth: 1,
+    borderBottomColor: theme.colors.border,
     userSelect: "none",
   },
   newAgentButton: {
     flexDirection: "row",
     alignItems: "center",
-    justifyContent: "center",
     gap: theme.spacing[2],
-    paddingVertical: theme.spacing[3],
+    paddingVertical: theme.spacing[1],
-    borderRadius: theme.borderRadius.lg,
+    paddingHorizontal: theme.spacing[1],
-    borderWidth: 1,
-    borderColor: theme.colors.border,
-    transitionProperty: "border-color, background-color",
-    transitionDuration: "150ms",
-  },
-  newAgentButtonHovered: {
-    borderColor: theme.colors.palette.zinc[500],
-    backgroundColor: theme.colors.surface2,
   },
+  newAgentButtonHovered: {},
   newAgentButtonText: {
     fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.normal,
+    color: theme.colors.foregroundMuted,
+  },
+  newAgentButtonTextHovered: {
     color: theme.colors.foreground,
   },
   sidebarFooter: {

packages/app/src/screens/agent/agent-ready-screen.tsx

@@ -714,13 +714,13 @@ function AgentScreenContent({
                     leading={<GitBranch size={16} color={theme.colors.foreground} />}
                     onSelect={handleViewChanges}
                   >
-                    View Changes
+                    View changes
                   </DropdownMenuItem>
                   <DropdownMenuItem
                     leading={<Folder size={16} color={theme.colors.foreground} />}
                     onSelect={handleBrowseFiles}
                   >
-                    Browse Files
+                    Browse files
                   </DropdownMenuItem>
                   <DropdownMenuItem
                     leading={<RotateCcw size={16} color={theme.colors.foreground} />}

packages/app/src/screens/agent/draft-agent-screen.tsx

@@ -597,7 +597,7 @@ export function DraftAgentScreen({
         model,
         modeId,
       },
-      title: "New Agent",
+      title: "New agent",
       cwd,
       model,
     };
@@ -788,7 +788,7 @@ export function DraftAgentScreen({
       <View style={styles.container}>
         <View style={styles.agentPanel}>
           <MenuHeader
-            title="New Agent"
+            title="New agent"
             rightContent={
               <Pressable
                 style={styles.hostBadge}

packages/app/src/screens/agent/legacy-agent-id-screen.tsx

@@ -74,7 +74,7 @@ export function LegacyAgentIdScreen({ agentId }: { agentId: string }) {
           This link is missing an agent id. Go back to the Agents screen to pick one.
         </Text>
         <Pressable style={styles.primaryButton} onPress={handleGoDraft}>
-          <Text style={styles.primaryButtonText}>New Agent</Text>
+          <Text style={styles.primaryButtonText}>New agent</Text>
         </Pressable>
       </View>
     );
@@ -96,7 +96,7 @@ export function LegacyAgentIdScreen({ agentId }: { agentId: string }) {
             again from the Agents screen after it comes back online.
           </Text>
           <Pressable style={styles.primaryButton} onPress={handleGoDraft}>
-            <Text style={styles.primaryButtonText}>New Agent</Text>
+            <Text style={styles.primaryButtonText}>New agent</Text>
           </Pressable>
       </View>
     );