feat(video): add image reference button and send tooltip

Add button for image reference with tooltip in video panel
Include send button tooltip using i18n translation

src/renderer/src/i18n/locales/en-us.json

@@ -1027,6 +1027,7 @@
     "selected": "Selected",
     "selectedItems": "Selected {{count}} items",
     "selectedMessages": "Selected {{count}} messages",
+    "send": "Send",
     "settings": "Settings",
     "sort": {
       "pinyin": {
@@ -4656,6 +4657,11 @@
         "reason": "The file may be corrupted or has been deleted externally."
       }
     },
+    "input_reference": {
+      "add": {
+        "tooltip": "Add image reference"
+      }
+    },
     "prompt": {
       "placeholder": "describes the video to generate"
     },

src/renderer/src/pages/video/VideoPanel.tsx

@@ -1,11 +1,11 @@
-import { Button, Skeleton, Textarea } from '@heroui/react'
+import { Button, Skeleton, Textarea, Tooltip } from '@heroui/react'
 import { loggerService } from '@logger'
 import { useAddOpenAIVideo } from '@renderer/hooks/video/useOpenAIVideos'
 import { createVideo } from '@renderer/services/ApiService'
 import { Provider } from '@renderer/types'
 import { Video } from '@renderer/types/video'
 import { getErrorMessage } from '@renderer/utils'
-import { ArrowUp } from 'lucide-react'
+import { ArrowUp, ImageIcon } from 'lucide-react'
 import { useCallback, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 
@@ -73,14 +73,28 @@ export const VideoPanel = ({ provider, video }: VideoPanelProps) => {
             }
           }}
         />
-        <Button
-          color="primary"
-          radius="full"
-          isIconOnly
-          isLoading={isProcessing}
-          className="absolute right-2 bottom-2 h-6 w-6 min-w-0">
-          <ArrowUp size={16} className="text-primary-foreground" />
-        </Button>
+        <div className="absolute bottom-0 flex w-full items-end justify-between p-2">
+          <div className="flex">
+            <Tooltip content={t('video.input_reference.add.tooltip')} closeDelay={0}>
+              <Button
+                variant="light"
+                startContent={<ImageIcon size={16} />}
+                isIconOnly
+                className="h-6 w-6 min-w-0"
+                isDisabled={isProcessing}
+                onPress={() => {
+                  window.toast.info('Not implemented')
+                }}
+              />
+            </Tooltip>
+          </div>
+
+          <Tooltip content={t('common.send')} closeDelay={0}>
+            <Button color="primary" radius="full" isIconOnly isLoading={isProcessing} className="h-6 w-6 min-w-0">
+              <ArrowUp size={16} className="text-primary-foreground" />
+            </Button>
+          </Tooltip>
+        </div>
       </div>
     </div>
   )