Validate custom javascript string

stashapp · May 28, 2024 · 66a932a · 66a932a
1 parent 520f35d
commit 66a932a
Show file tree

Hide file tree

Showing 2 changed files with 37 additions and 11 deletions.
diff --git a/ui/v2.5/src/components/Settings/SettingsInterfacePanel/SettingsInterfacePanel.tsx b/ui/v2.5/src/components/Settings/SettingsInterfacePanel/SettingsInterfacePanel.tsx
@@ -151,6 +151,24 @@ export const SettingsInterfacePanel: React.FC = () => {
     }
   }
 
+  function validateJavascriptString(v: string) {
+    if (!v) return;
+    try {
+      // creates a function from the string to validate it but does not execute it
+      // eslint-disable-next-line @typescript-eslint/no-implied-eval
+      new Function(v);
+    } catch (e) {
+      throw new Error(
+        intl.formatMessage(
+          { id: "errors.invalid_javascript_string" },
+          {
+            error: (e as SyntaxError).message,
+          }
+        )
+      );
+    }
+  }
+
   if (error) return <h1>{error.message}</h1>;
   if (loading) return <LoadingIndicator />;
 
@@ -740,16 +758,23 @@ export const SettingsInterfacePanel: React.FC = () => {
           subHeadingID="config.ui.custom_javascript.description"
           value={iface.javascript ?? undefined}
           onChange={(v) => saveInterface({ javascript: v })}
-          renderField={(value, setValue) => (
-            <Form.Control
-              as="textarea"
-              value={value}
-              onChange={(e: React.ChangeEvent<HTMLTextAreaElement>) =>
-                setValue(e.currentTarget.value)
-              }
-              rows={16}
-              className="text-input code"
-            />
+          validateChange={validateJavascriptString}
+          renderField={(value, setValue, err) => (
+            <>
+              <Form.Control
+                as="textarea"
+                value={value}
+                onChange={(e: React.ChangeEvent<HTMLTextAreaElement>) =>
+                  setValue(e.currentTarget.value)
+                }
+                rows={16}
+                className="text-input code"
+                isInvalid={!!err}
+              />
+              <Form.Control.Feedback type="invalid">
+                {err}
+              </Form.Control.Feedback>
+            </>
           )}
           renderValue={() => {
             return <></>;

diff --git a/ui/v2.5/src/locales/en-GB.json b/ui/v2.5/src/locales/en-GB.json
@@ -1017,7 +1017,8 @@
   "errors": {
     "header": "Error",
     "image_index_greater_than_zero": "Image index must be greater than 0",
-    "invalid_json_string": "invalid JSON string: {error}",
+    "invalid_javascript_string": "Invalid javascript code: {error}",
+    "invalid_json_string": "Invalid JSON string: {error}",
     "lazy_component_error_help": "If you recently upgraded Stash, please reload the page or clear your browser cache.",
     "loading_type": "Error loading {type}",
     "something_went_wrong": "Something went wrong."