Share composer control semantics

Generated-By: PostHog Code
Task-Id: 40c57a59-b4e1-4760-8e56-ecd03e9c2f0f

Author: richardsolomou

apps/mobile/src/app/task/index.tsx

@@ -3,6 +3,12 @@ import {
   DEFAULT_CLAUDE_EXECUTION_MODE,
   getAvailableModes,
 } from "@posthog/core/sessions/executionModes";
+import {
+  getComposerModelOptions,
+  getConfigOptionLabel,
+  getModelConfigOption,
+  resolveComposerModelChange,
+} from "@posthog/core/task-detail/composerControls";
 import {
   DEFAULT_GATEWAY_MODEL,
   DEFAULT_REASONING_EFFORT,
@@ -55,12 +61,6 @@ import {
 } from "@/features/tasks/composer/attachments/pickers";
 import type { PendingAttachment } from "@/features/tasks/composer/attachments/types";
 import { DotBackground } from "@/features/tasks/composer/DotBackground";
-import {
-  getMobileModelOptions,
-  getModelConfigOption,
-  getModelLabel,
-  resolveAvailableModel,
-} from "@/features/tasks/composer/options";
 import { Pill } from "@/features/tasks/composer/Pill";
 import { RepositoryPickerInline } from "@/features/tasks/composer/RepositoryPickerInline";
 import { SelectSheet } from "@/features/tasks/composer/SelectSheet";
@@ -131,7 +131,7 @@ export default function NewTaskScreen() {
   const restingBottom = bottom("compact");
   const { configOptions, hasLiveConfig } = useCloudTaskConfigOptions("claude");
   const modelConfigOption = getModelConfigOption(configOptions);
-  const mobileModelOptions = getMobileModelOptions(modelConfigOption);
+  const mobileModelOptions = getComposerModelOptions(modelConfigOption);
   const {
     error,
     hasGithubIntegration,
@@ -214,12 +214,14 @@ export default function NewTaskScreen() {
 
   useEffect(() => {
     if (!hasLiveConfig) return;
-    const availableModel = resolveAvailableModel(modelConfigOption, model);
-    if (availableModel === model) return;
-    setModel(availableModel);
-    if (!isSupportedReasoningEffort("claude", availableModel, reasoning)) {
-      setReasoning(DEFAULT_REASONING_EFFORT);
-    }
+    const next = resolveComposerModelChange({
+      adapter: "claude",
+      modelOption: modelConfigOption,
+      requestedModel: model,
+      reasoning,
+    });
+    if (next.model !== model) setModel(next.model);
+    if (next.reasoning !== reasoning) setReasoning(next.reasoning);
   }, [hasLiveConfig, model, modelConfigOption, reasoning]);
   const [creating, setCreating] = useState(false);
   const [repoSheetOpen, setRepoSheetOpen] = useState(false);
@@ -649,7 +651,12 @@ export default function NewTaskScreen() {
 
                     <Pill
                       icon={<Robot size={14} color={themeColors.gray[11]} />}
-                      label={getModelLabel(modelConfigOption, model)}
+                      label={
+                        getConfigOptionLabel(
+                          modelConfigOption.options,
+                          model,
+                        ) ?? model
+                      }
                       onPress={() => setModelSheetOpen(true)}
                     />
 
@@ -769,10 +776,14 @@ export default function NewTaskScreen() {
         title="Model"
         value={model}
         onChange={(value) => {
-          setModel(value);
-          if (!isSupportedReasoningEffort("claude", value, reasoning)) {
-            setReasoning(DEFAULT_REASONING_EFFORT);
-          }
+          const next = resolveComposerModelChange({
+            adapter: "claude",
+            modelOption: modelConfigOption,
+            requestedModel: value,
+            reasoning,
+          });
+          setModel(next.model);
+          setReasoning(next.reasoning);
         }}
         onClose={() => setModelSheetOpen(false)}
         options={mobileModelOptions.map((modelOption) => ({

apps/mobile/src/features/inbox/components/TinderView.tsx

@@ -3,6 +3,7 @@ import {
   formatSignalReportSummaryMarkdown,
   inboxStatusLabel,
 } from "@posthog/core/inbox/reportPresentation";
+import { getModelConfigOption } from "@posthog/core/task-detail/composerControls";
 import type {
   SignalReport,
   SignalReportPriority,
@@ -26,7 +27,6 @@ import {
 } from "react-native-safe-area-context";
 import { MarkdownText } from "@/features/chat/components/MarkdownText";
 import { usePreferencesStore } from "@/features/preferences/stores/preferencesStore";
-import { getModelConfigOption } from "@/features/tasks/composer/options";
 import { useCloudTaskConfigOptions } from "@/features/tasks/hooks/useCloudTaskConfigOptions";
 import type {
   CreateTaskOptions,

apps/mobile/src/features/tasks/composer/TaskChatComposer.tsx

@@ -3,12 +3,18 @@ import {
   DEFAULT_CLAUDE_EXECUTION_MODE,
   getAvailableModes,
 } from "@posthog/core/sessions/executionModes";
+import {
+  getComposerModelOptions,
+  getConfigOptionLabel,
+  getModelConfigOption,
+  resolveComposerModelChange,
+  resolveComposerPrimaryAction,
+} from "@posthog/core/task-detail/composerControls";
 import {
   DEFAULT_GATEWAY_MODEL,
   DEFAULT_REASONING_EFFORT,
   type ExecutionMode,
   getReasoningEffortOptions,
-  isSupportedReasoningEffort,
   type SupportedReasoningEffort,
 } from "@posthog/shared";
 import * as Haptics from "expo-haptics";
@@ -56,12 +62,6 @@ import {
   pickPhotoFromLibrary,
 } from "./attachments/pickers";
 import type { PendingAttachment } from "./attachments/types";
-import {
-  getMobileModelOptions,
-  getModelConfigOption,
-  getModelLabel,
-  resolveAvailableModel,
-} from "./options";
 import { Pill } from "./Pill";
 import { SelectSheet } from "./SelectSheet";
 
@@ -188,7 +188,7 @@ export function TaskChatComposer({
   const themeColors = useThemeColors();
   const { configOptions, hasLiveConfig } = useCloudTaskConfigOptions("claude");
   const modelConfigOption = getModelConfigOption(configOptions);
-  const mobileModelOptions = getMobileModelOptions(modelConfigOption);
+  const mobileModelOptions = getComposerModelOptions(modelConfigOption);
   const [message, setMessage] = useState(() => initialMessage ?? "");
   const [attachments, setAttachments] = useState<PendingAttachment[]>([]);
   const [attachmentSheetOpen, setAttachmentSheetOpen] = useState(false);
@@ -206,12 +206,14 @@ export function TaskChatComposer({
 
   useEffect(() => {
     if (!hasLiveConfig) return;
-    const availableModel = resolveAvailableModel(modelConfigOption, model);
-    if (availableModel === model) return;
-    onModelChange(availableModel);
-    if (!isSupportedReasoningEffort("claude", availableModel, reasoning)) {
-      onReasoningChange(DEFAULT_REASONING_EFFORT);
-    }
+    const next = resolveComposerModelChange({
+      adapter: "claude",
+      modelOption: modelConfigOption,
+      requestedModel: model,
+      reasoning,
+    });
+    if (next.model !== model) onModelChange(next.model);
+    if (next.reasoning !== reasoning) onReasoningChange(next.reasoning);
   }, [
     hasLiveConfig,
     model,
@@ -239,9 +241,16 @@ export function TaskChatComposer({
   const showReasoningPill = reasoningOptions.length > 0;
 
   const hasContent = message.trim().length > 0 || attachments.length > 0;
-  const canSend = hasContent && !disabled && !isRecording;
-  const showStop =
-    !isUserTurn && !canSend && !isRecording && !isTranscribing && !!onStop;
+  const primaryAction = resolveComposerPrimaryAction({
+    hasContent,
+    disabled,
+    isRecording,
+    isTranscribing,
+    canStop: !isUserTurn && !!onStop,
+    allowSendWhileRunning: true,
+  });
+  const canSend = primaryAction === "send";
+  const showStop = primaryAction === "stop";
 
   const handleSend = () => {
     const trimmed = message.trim();
@@ -410,7 +419,10 @@ export function TaskChatComposer({
 
                 <Pill
                   icon={<Robot size={14} color={themeColors.gray[11]} />}
-                  label={getModelLabel(modelConfigOption, model)}
+                  label={
+                    getConfigOptionLabel(modelConfigOption.options, model) ??
+                    model
+                  }
                   onPress={() => setModelSheetOpen(true)}
                 />
 
@@ -486,10 +498,14 @@ export function TaskChatComposer({
         title="Model"
         value={model}
         onChange={(v) => {
-          onModelChange(v);
-          if (!isSupportedReasoningEffort("claude", v, reasoning)) {
-            onReasoningChange(DEFAULT_REASONING_EFFORT);
-          }
+          const next = resolveComposerModelChange({
+            adapter: "claude",
+            modelOption: modelConfigOption,
+            requestedModel: v,
+            reasoning,
+          });
+          onModelChange(next.model);
+          onReasoningChange(next.reasoning);
         }}
         onClose={() => setModelSheetOpen(false)}
         options={mobileModelOptions.map((m) => ({

apps/mobile/src/features/tasks/composer/options.test.ts

@@ -26,7 +26,7 @@ vi.mock("@/lib/posthogApiClient", () => ({
   }),
 }));
 
-import { getModelConfigOption } from "../composer/options";
+import { getModelConfigOption } from "@posthog/core/task-detail/composerControls";
 import { useCloudTaskConfigOptions } from "./useCloudTaskConfigOptions";
 
 function createWrapper(queryClient: QueryClient) {

apps/mobile/src/features/tasks/composer/options.ts

@@ -0,0 +1,27 @@
+import { describe, expect, it } from "vitest";
+import { resolveComposerPrimaryAction } from "./composerControls";
+
+describe("resolveComposerPrimaryAction", () => {
+  it.each([
+    [{ hasContent: true }, "send"],
+    [{ canStop: true }, "stop"],
+    [{ canStop: true, hasContent: true }, "send"],
+    [{ canStop: true, hasContent: true, allowSendWhileRunning: false }, "stop"],
+    [{ isRecording: true }, "mic-stop"],
+    [{}, "mic"],
+    [{ disabled: true, hasContent: true }, "disabled"],
+    [{ isTranscribing: true }, "disabled"],
+  ])("derives %s", (overrides, expected) => {
+    expect(
+      resolveComposerPrimaryAction({
+        hasContent: false,
+        disabled: false,
+        isRecording: false,
+        isTranscribing: false,
+        canStop: false,
+        allowSendWhileRunning: true,
+        ...overrides,
+      }),
+    ).toBe(expected);
+  });
+});