Moving generate buttons to Set Image control

- Removed direct thumbnail generation options from Scene dropdown.
- Added onGenerateThumbFromCurrent and onGenerateThumbDefault props to SceneEditPanel for handling thumbnail generation.
- Updated ImageInput component to include buttons for generating thumbnails from the current image and a default image.

ui/v2.5/src/components/Scenes/SceneDetails/Scene.tsx

@@ -468,20 +468,6 @@ const ScenePage: React.FC<IProps> = PatchComponent("ScenePage", (props) => {
         >
           <FormattedMessage id="actions.generate" />…
         </Dropdown.Item>
-        <Dropdown.Item
-          key="generate-screenshot"
-          className="bg-secondary text-white"
-          onClick={() => onGenerateScreenshot(getPlayerPosition())}
-        >
-          <FormattedMessage id="actions.generate_thumb_from_current" />
-        </Dropdown.Item>
-        <Dropdown.Item
-          key="generate-default"
-          className="bg-secondary text-white"
-          onClick={() => onGenerateScreenshot()}
-        >
-          <FormattedMessage id="actions.generate_thumb_default" />
-        </Dropdown.Item>
         {boxes.length > 0 && (
           <Dropdown.Item
             key="submit"
@@ -640,6 +626,10 @@ const ScenePage: React.FC<IProps> = PatchComponent("ScenePage", (props) => {
             <SceneEditPanel
               isVisible={activeTabKey === "scene-edit-panel"}
               scene={scene}
+              onGenerateThumbFromCurrent={() =>
+                onGenerateScreenshot(getPlayerPosition())
+              }
+              onGenerateThumbDefault={() => onGenerateScreenshot()}
               onSubmit={onSave}
               onDelete={() => setIsDeleteAlertOpen(true)}
             />

ui/v2.5/src/components/Scenes/SceneDetails/SceneEditPanel.tsx

@@ -64,6 +64,8 @@ interface IProps {
   initialCoverImage?: string;
   isNew?: boolean;
   isVisible: boolean;
+  onGenerateThumbFromCurrent?: () => Promise<void>;
+  onGenerateThumbDefault?: () => Promise<void>;
   onSubmit: (input: GQL.SceneCreateInput, andNew?: boolean) => Promise<void>;
   onDelete?: () => void;
 }
@@ -73,6 +75,8 @@ export const SceneEditPanel: React.FC<IProps> = ({
   initialCoverImage,
   isNew = false,
   isVisible,
+  onGenerateThumbFromCurrent,
+  onGenerateThumbDefault,
   onSubmit,
   onDelete,
 }) => {
@@ -877,15 +881,25 @@ export const SceneEditPanel: React.FC<IProps> = ({
             {renderDetailsField()}
             <Form.Group controlId="cover_image">
               <Form.Label>
-                <FormattedMessage id="cover_image" />
+                {intl.formatMessage({ id: "cover_image" })}
               </Form.Label>
               {image}
-              <ImageInput
-                isEditing
-                onImageChange={onCoverImageChange}
-                onImageURL={onImageLoad}
-                onReset={scene.id ? onResetCover : undefined}
-              />
+              <div className="mt-2 d-flex align-items-center">
+                {!isNew && (
+                  <ImageInput
+                    isEditing
+                    onImageChange={onCoverImageChange}
+                    onImageURL={onImageLoad}
+                    onGenerateDefault={onGenerateThumbDefault}
+                    onGenerateCurrent={onGenerateThumbFromCurrent}
+                  />
+                )}
+                {scene.id && (
+                  <Button variant="danger" onClick={() => onResetCover()}>
+                    {intl.formatMessage({ id: "actions.clear_image" })}
+                  </Button>
+                )}
+              </div>
             </Form.Group>
 
             <CustomFieldsInput

ui/v2.5/src/components/Shared/ImageInput.tsx

@@ -10,7 +10,7 @@ import {
 import { useIntl } from "react-intl";
 import { ModalComponent } from "./Modal";
 import { Icon } from "./Icon";
-import { faClipboard, faFile, faLink } from "@fortawesome/free-solid-svg-icons";
+import { faArrowsRotate, faCameraRotate, faClipboard, faFile, faLink } from "@fortawesome/free-solid-svg-icons";
 import { PatchComponent } from "src/patch";
 import ImageUtils from "src/utils/image";
 import { useToast } from "src/hooks/Toast";
@@ -22,6 +22,8 @@ interface IImageInput {
   onImageURL?: (url: string) => void;
   onReset?: () => void;
   acceptSVG?: boolean;
+  onGenerateDefault?: () => void;
+  onGenerateCurrent?: () => void;
 }
 
 function acceptExtensions(acceptSVG: boolean = false) {
@@ -37,12 +39,13 @@ export const ImageInput: React.FC<IImageInput> = PatchComponent(
     onImageURL,
     onReset,
     acceptSVG = false,
+    onGenerateDefault,
+    onGenerateCurrent,
   }) => {
     const [isShowDialog, setIsShowDialog] = useState(false);
     const [url, setURL] = useState("");
     const intl = useIntl();
     const Toast = useToast();
-
     if (!isEditing) return <div />;
 
     if (!onImageURL) {
@@ -162,6 +165,28 @@ export const ImageInput: React.FC<IImageInput> = PatchComponent(
                 </Button>
               </div>
             )}
+            {onGenerateDefault && (
+              <div>
+                <Button className="minimal" onClick={onGenerateDefault}>
+                  <Icon icon={faArrowsRotate} className="fa-fw" />
+                  <span>
+                    {intl.formatMessage({ id: "actions.generate_thumb_default" })}
+                  </span>
+                </Button>
+              </div>
+            )}
+            {onGenerateCurrent && (
+              <div>
+                <Button className="minimal" onClick={onGenerateCurrent}>
+                  <Icon icon={faCameraRotate} className="fa-fw" />
+                  <span>
+                    {intl.formatMessage({
+                      id: "actions.generate_thumb_from_current",
+                    })}
+                  </span>
+                </Button>
+              </div>
+            )}
           </>
         </Popover.Content>
       </Popover>