Skip to content

Commit 5ec1ad4

Browse files
committed
fix(FR-2069): prevent error page when saving empty theme.json (#5337)
Resolves [FR-2069](https://lablup.atlassian.net/browse/FR-2069) ## Summary Prevent React error page when saving empty or invalid JSON in the Theme JSON Configuration modal on the branding page. ## Changes - Add try-catch error handling for `JSON.parse(editorValue)` in both OK and Export button handlers - Display user-friendly error message instead of crashing with uncaught `SyntaxError` - Affected file: `react/src/components/BrandingSettingItems/ThemeJsonConfigModal.tsx` ## Before - Saving empty editor content caused uncaught `JSON.parse` error → React error page - Export with invalid JSON crashed the page ## After - Invalid JSON shows error message: "Cannot apply invalid JSON config" - Monaco schema validation still works for structure errors - No more error pages on empty/invalid JSON input **Checklist:** - [x] Bug fix - no documentation needed - [x] No manager version requirements - [x] Test: Open branding page → JSON Config modal → Clear all content → Click OK/Export → See error message instead of crash [FR-2069]: https://lablup.atlassian.net/browse/FR-2069?atlOrigin=eyJpIjoiNWRkNTljNzYxNjVmNDY3MDlhMDU5Y2ZhYzA5YTRkZjUiLCJwIjoiZ2l0aHViLWNvbS1KU1cifQ
1 parent b4b3c7d commit 5ec1ad4

1 file changed

Lines changed: 18 additions & 2 deletions

File tree

react/src/components/BrandingSettingItems/ThemeJsonConfigModal.tsx

Lines changed: 18 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -106,8 +106,16 @@ const ThemeJsonConfigModal: React.FC<ThemeJsonConfigModalProps> = ({
106106
message.error(t('theme.CannotApplyInvalidJsonConfig'));
107107
} else {
108108
// should export current value not the userCustomThemeConfig state
109+
let parsedValue;
110+
try {
111+
parsedValue = JSON.parse(editorValue);
112+
} catch (error) {
113+
logger.warn('Invalid JSON format in export', error);
114+
message.error(t('theme.CannotApplyInvalidJsonConfig'));
115+
return;
116+
}
109117
const blob = new Blob(
110-
[JSON.stringify(JSON.parse(editorValue), null, 2)],
118+
[JSON.stringify(parsedValue, null, 2)],
111119
{ type: 'application/json' },
112120
);
113121
downloadBlob(blob, `theme.json`);
@@ -128,7 +136,15 @@ const ThemeJsonConfigModal: React.FC<ThemeJsonConfigModalProps> = ({
128136
message.error(t('theme.CannotApplyInvalidJsonConfig'));
129137
return;
130138
}
131-
setUserCustomThemeConfig(JSON.parse(editorValue));
139+
let parsedValue;
140+
try {
141+
parsedValue = JSON.parse(editorValue);
142+
} catch (error) {
143+
logger.warn('Invalid JSON format in theme config', error);
144+
message.error(t('theme.CannotApplyInvalidJsonConfig'));
145+
return;
146+
}
147+
setUserCustomThemeConfig(parsedValue);
132148
message.success(t('theme.JsonConfigAppliedSuccessfully'));
133149
onRequestClose();
134150
}}

0 commit comments

Comments
 (0)