Restore movie/studio data on edit cancel (#476)

ui/v2.5/src/components/Movies/MovieDetails/Movie.tsx

@@ -165,6 +165,11 @@ export const Movie: React.FC = () => {
     ImageUtils.onImageChange(event, onBackImageLoad);
   }
 
+  function onToggleEdit() {
+    setIsEditing(!isEditing);
+    updateMovieData(movie);
+  }
+
   function renderDeleteAlert() {
     return (
       <Modal
@@ -266,7 +271,7 @@ export const Movie: React.FC = () => {
           objectName={name ?? "movie"}
           isNew={isNew}
           isEditing={isEditing}
-          onToggleEdit={() => setIsEditing(!isEditing)}
+          onToggleEdit={onToggleEdit}
           onSave={onSave}
           onImageChange={onImageChange}
           onBackImageChange={onBackImageChange}

ui/v2.5/src/components/Movies/MovieDetails/MovieScenesPanel.tsx

@@ -41,5 +41,8 @@ export const MovieScenesPanel: React.FC<IMovieScenesPanel> = ({ movie }) => {
     return filter;
   }
 
+  if (movie && movie.id) {
     return <SceneList subComponent filterHook={filterHook} />;
+  }
+  return <></>;
 };

ui/v2.5/src/components/Studios/StudioDetails/Studio.tsx

@@ -150,6 +150,11 @@ export const Studio: React.FC = () => {
     );
   }
 
+  function onToggleEdit() {
+    setIsEditing(!isEditing);
+    updateStudioData(studio);
+  }
+
   return (
     <div className="row">
       <div
@@ -180,7 +185,7 @@ export const Studio: React.FC = () => {
           objectName={name ?? "studio"}
           isNew={isNew}
           isEditing={isEditing}
-          onToggleEdit={() => setIsEditing(!isEditing)}
+          onToggleEdit={onToggleEdit}
           onSave={onSave}
           onImageChange={onImageChangeHandler}
           onAutoTag={onAutoTag}

ui/v2.5/src/utils/editabletext.tsx

@@ -63,20 +63,20 @@ const renderInputGroup = (options: {
         {options.value}
       </a>
     );
-  } else {
+  }
+    
   return (
     <Form.Control
       className="text-input"
       readOnly={!options.isEditing}
       plaintext={!options.isEditing}
-        value={options.value}
+      value={options.value ?? ""}
       placeholder={options.placeholder ?? options.title}
       onChange={(event: React.FormEvent<HTMLInputElement>) =>
         options.onChange(event.currentTarget.value)
       }
     />
   );
-  }
 }
 
 const renderDurationInput = (options: {
@@ -86,7 +86,7 @@ const renderDurationInput = (options: {
   asString?: boolean
   onChange: (value: string | undefined) => void;
 }) => {
-  let numericValue: number | undefined = undefined;
+  let numericValue: number | undefined;
   if (options.value) {
     if (!options.asString) {
       try {
@@ -100,7 +100,7 @@ const renderDurationInput = (options: {
   }
   
   if (!options.isEditing) {
-    let durationString = undefined;
+    let durationString;
     if (numericValue !== undefined) {
       durationString = DurationUtils.secondsToString(numericValue);
     }
@@ -108,26 +108,26 @@ const renderDurationInput = (options: {
     return (
       <Form.Control
         className="text-input"
-        readOnly={true}
+        readOnly
-        plaintext={true}
+        plaintext
         defaultValue={durationString}
       />
     );
-  } else {
+  }
   return (
     <DurationInput
       disabled={!options.isEditing}
       numericValue={numericValue}
       onValueChange={(valueAsNumber: number, valueAsString? : string) => { 
+        let value = valueAsString;
         if (!options.asString) {
-            valueAsString = valueAsNumber !== undefined ? valueAsNumber.toString() : undefined;
+          value = valueAsNumber !== undefined ? valueAsNumber.toString() : undefined;
         }
 
-          options.onChange(valueAsString);
+        options.onChange(value);
       }}
     />
   );
-  }
 }
 
 const renderHtmlSelect = (options: {
@@ -140,12 +140,12 @@ const renderHtmlSelect = (options: {
     return (
       <Form.Control
         className="text-input"
-        readOnly={true}
+        readOnly
-        plaintext={true}
+        plaintext
         defaultValue={options.value}
       />
     );
-  } else {
+  }
   return (
     <Form.Control
       as="select"
@@ -164,7 +164,6 @@ const renderHtmlSelect = (options: {
       ))}
     </Form.Control>
   );
-  }
 }
 
 // TODO: isediting