From c8183e55db2051e624a61c82f1fd4d35d9d3c744 Mon Sep 17 00:00:00 2001
From: catloversg <152669316+catloversg@users.noreply.github.com>
Date: Mon, 4 Nov 2024 13:38:01 +0700
Subject: [PATCH] BUGFIX: Crash in theme editor modal (#1735)

---
 src/ScriptEditor/ui/ThemeEditorModal.tsx | 16 ++++++++++++----
 src/Themes/ui/ThemeEditorModal.tsx       | 16 ++++++++++++----
 2 files changed, 24 insertions(+), 8 deletions(-)

diff --git a/src/ScriptEditor/ui/ThemeEditorModal.tsx b/src/ScriptEditor/ui/ThemeEditorModal.tsx
index 11363b749..516109cf3 100644
--- a/src/ScriptEditor/ui/ThemeEditorModal.tsx
+++ b/src/ScriptEditor/ui/ThemeEditorModal.tsx
@@ -11,6 +11,7 @@ import { Modal } from "../../ui/React/Modal";
 import { OptionSwitch } from "../../ui/React/OptionSwitch";
 
 import { defaultMonacoTheme } from "./themes";
+import { dialogBoxCreate } from "../../ui/React/DialogBox";
 
 type ColorEditorProps = {
   label: string;
@@ -74,12 +75,19 @@ export function ThemeEditorModal(props: ThemeEditorProps): React.ReactElement {
 
   function onThemeChange(event: React.ChangeEvent<HTMLInputElement>): void {
     try {
-      const importedTheme = JSON.parse(event.target.value);
-      if (typeof importedTheme !== "object") return;
+      const importedTheme = JSON.parse(event.target.value) as typeof Settings.EditorTheme;
+      if (importedTheme == null) {
+        throw new Error("Theme data must not be null or undefined.");
+      }
+      if (typeof importedTheme !== "object") {
+        throw new Error(`Theme data is invalid.`);
+      }
       Settings.EditorTheme = importedTheme;
       props.onChange();
-    } catch (err) {
-      // ignore
+    } catch (error) {
+      console.error(`Theme data is invalid. Data: ${event.target.value}.`);
+      console.error(error);
+      dialogBoxCreate(`Invalid theme. ${error}`);
     }
   }
 
diff --git a/src/Themes/ui/ThemeEditorModal.tsx b/src/Themes/ui/ThemeEditorModal.tsx
index 22c1f487b..f3c0b42f9 100644
--- a/src/Themes/ui/ThemeEditorModal.tsx
+++ b/src/Themes/ui/ThemeEditorModal.tsx
@@ -18,6 +18,7 @@ import { UserInterfaceTheme } from "@nsdefs";
 import { Router } from "../../ui/GameRoot";
 import { Page } from "../../ui/Router";
 import { ThemeCollaborate } from "./ThemeCollaborate";
+import { dialogBoxCreate } from "../../ui/React/DialogBox";
 
 interface IProps {
   open: boolean;
@@ -81,15 +82,22 @@ export function ThemeEditorModal(props: IProps): React.ReactElement {
 
   function onThemeChange(event: React.ChangeEvent<HTMLInputElement>): void {
     try {
-      const importedTheme = JSON.parse(event.target.value);
-      if (typeof importedTheme !== "object") return;
+      const importedTheme = JSON.parse(event.target.value) as typeof Settings.theme;
+      if (importedTheme == null) {
+        throw new Error("Theme data must not be null or undefined.");
+      }
+      if (typeof importedTheme !== "object") {
+        throw new Error(`Theme data is invalid.`);
+      }
       setCustomTheme(importedTheme);
       for (const key of Object.keys(importedTheme)) {
         Settings.theme[key] = importedTheme[key];
       }
       ThemeEvents.emit();
-    } catch (err) {
-      // ignore
+    } catch (error) {
+      console.error(`Theme data is invalid. Data: ${event.target.value}.`);
+      console.error(error);
+      dialogBoxCreate(`Invalid theme. ${error}`);
     }
   }