Fix a issue when trying to edit profile with cutoff selected

frontend/src/components/forms/ProfileEditForm.tsx

@@ -65,7 +65,8 @@ const ProfileEditForm: FunctionComponent<Props> = ({
 
   const itemCutoffOptions = useSelectorOptions(
     form.values.items,
-    (v) => v.language
+    (v) => v.language,
+    (v) => String(v.id)
   );
 
   const cutoffOptions = useMemo(
@@ -76,6 +77,13 @@ const ProfileEditForm: FunctionComponent<Props> = ({
     [itemCutoffOptions]
   );
 
+  const selectedCutoff = useMemo(
+    () =>
+      cutoffOptions.options.find((v) => v.value.id === form.values.cutoff)
+        ?.value ?? null,
+    [cutoffOptions, form.values.cutoff]
+  );
+
   const mustContainOptions = useSelectorOptions(
     form.values.mustContain,
     (v) => v
@@ -255,7 +263,10 @@ const ProfileEditForm: FunctionComponent<Props> = ({
                 clearable
                 label="Cutoff"
                 {...cutoffOptions}
-                {...form.getInputProps("cutoff")}
+                value={selectedCutoff}
+                onChange={(value) => {
+                  form.setFieldValue("cutoff", value?.id ?? null);
+                }}
               ></Selector>
             </Stack>
           </Accordion.Item>

frontend/src/pages/Movies/Details/index.tsx

@@ -126,19 +126,6 @@ const MovieDetailView: FunctionComponent = () => {
     <Container fluid px={0}>
       <QueryOverlay result={movieQuery}>
         <DropOverlay state={dropzone}>
-          {/* <FileOverlay
-          disabled={profile === undefined}
-          accept={[""]}
-          onDrop={onDrop}
-        ></FileOverlay> */}
-          {/* <div hidden>
-          <File
-            disabled={profile === undefined}
-            accept={[""]}
-            openRef={dialogRef}
-            onDrop={onDrop}
-          ></File>
-        </div> */}
           <Toolbox>
             <Group spacing="xs">
               <Toolbox.Button