feat: 画面共有とカメラ共有をマルチモーダルモデルに関係なく利用可能に

locales/en/translation.json

@@ -222,6 +222,8 @@
   "RealtimeAPIModeContentType": "Submission type",
   "RealtimeAPIModeVoice": "Voice type",
   "AudioMode": "Audio mode",
+  "AutoSendImagesInMultiModal": "Auto-send images in multimodal models",
+  "AutoSendImagesInMultiModalDescription": "Automatically capture and send images when screen sharing or camera is active during message sending.",
   "InputText": "Text",
   "InputAudio": "Audio",
   "SearchGrounding": "Use search function",

locales/ja/translation.json

@@ -224,6 +224,8 @@
   "RealtimeAPIModeContentType": "送信タイプ",
   "RealtimeAPIModeVoice": "ボイスタイプ",
   "AudioMode": "オーディオモード",
+  "AutoSendImagesInMultiModal": "マルチモーダルモデルで画像を自動送信",
+  "AutoSendImagesInMultiModalDescription": "画面共有やカメラが有効な場合、メッセージ送信時に自動的に画像をキャプチャして送信します。",
   "InputText": "テキスト",
   "InputAudio": "音声",
   "SearchGrounding": "検索機能を利用する",

src/components/form.tsx

@@ -7,6 +7,8 @@ import { handleSendChatFn } from '../features/chat/handlers'
 import { MessageInputContainer } from './messageInputContainer'
 import { PresetQuestionButtons } from './presetQuestionButtons'
 import { SlideText } from './slideText'
+import { isMultiModalModel } from '@/features/constants/aiModels'
+import { AIService } from '@/features/constants/settings'
 
 export const Form = () => {
   const modalImage = homeStore((s) => s.modalImage)
@@ -16,6 +18,11 @@ export const Form = () => {
   const slideVisible = menuStore((s) => s.slideVisible)
   const slidePlaying = slideStore((s) => s.isPlaying)
   const chatProcessingCount = homeStore((s) => s.chatProcessingCount)
+  const autoSendImagesInMultiModal = settingsStore(
+    (s) => s.autoSendImagesInMultiModal
+  )
+  const selectAIService = settingsStore((s) => s.selectAIService)
+  const selectAIModel = settingsStore((s) => s.selectAIModel)
   const [delayedText, setDelayedText] = useState('')
   const handleSendChat = handleSendChatFn()
 
@@ -29,20 +36,33 @@ export const Form = () => {
 
   const hookSendChat = useCallback(
     (text: string) => {
-      // すでにmodalImageが存在する場合は、Webcamのキャプチャーをスキップ
-      if (!homeStore.getState().modalImage) {
-        homeStore.setState({ triggerShutter: true })
-      }
+      // 画像を自動送信するかどうかの判定
+      const shouldAutoSendImages =
+        autoSendImagesInMultiModal &&
+        isMultiModalModel(selectAIService as AIService, selectAIModel)
 
-      // MENUの中でshowCameraがtrueの場合、画像が取得されるまで待機
-      if (webcamStatus || captureStatus) {
-        // Webcamが開いている場合
-        setDelayedText(text) // 画像が取得されるまで遅延させる
+      // 自動送信が有効で、カメラ/画面共有がアクティブな場合のみ画像キャプチャ
+      if (shouldAutoSendImages && (webcamStatus || captureStatus)) {
+        // すでにmodalImageが存在する場合は、Webcamのキャプチャーをスキップ
+        if (!homeStore.getState().modalImage) {
+          homeStore.setState({ triggerShutter: true })
+        }
+        // 画像が取得されるまで遅延させる
+        setDelayedText(text)
       } else {
+        // 自動送信が無効、またはカメラ/画面共有が無効な場合は直接送信
         handleSendChat(text)
       }
     },
-    [handleSendChat, webcamStatus, captureStatus, setDelayedText]
+    [
+      handleSendChat,
+      webcamStatus,
+      captureStatus,
+      setDelayedText,
+      autoSendImagesInMultiModal,
+      selectAIService,
+      selectAIModel,
+    ]
   )
 
   return slideMode &&

src/components/menu.tsx

@@ -229,26 +229,26 @@ export const Menu = () => {
                   />
                 )}
               </div>
-              {!youtubeMode &&
-                isMultiModalModel(
-                  selectAIService as AIService,
-                  selectAIModel
-                ) && (
-                  <>
-                    <div className="order-3">
-                      <IconButton
-                        iconName="screen-share"
-                        isProcessing={false}
-                        onClick={toggleCapture}
-                      />
-                    </div>
-                    <div className="order-4">
-                      <IconButton
-                        iconName="24/Camera"
-                        isProcessing={false}
-                        onClick={toggleWebcam}
-                      />
-                    </div>
+              {!youtubeMode && (
+                <>
+                  <div className="order-3">
+                    <IconButton
+                      iconName="screen-share"
+                      isProcessing={false}
+                      onClick={toggleCapture}
+                    />
+                  </div>
+                  <div className="order-4">
+                    <IconButton
+                      iconName="24/Camera"
+                      isProcessing={false}
+                      onClick={toggleWebcam}
+                    />
+                  </div>
+                  {isMultiModalModel(
+                    selectAIService as AIService,
+                    selectAIModel
+                  ) && (
                     <div className="order-4">
                       <IconButton
                         iconName="24/AddImage"
@@ -273,8 +273,9 @@ export const Menu = () => {
                         }}
                       />
                     </div>
-                  </>
-                )}
+                  )}
+                </>
+              )}
               {youtubeMode && (
                 <div className="order-5">
                   <IconButton