fix json syntax highlighting after light/dark mode is switched

This commit is contained in:
Ankit Mahato
2025-04-13 00:08:11 +05:30
parent 8ebf4c8e20
commit f532f20660
4 changed files with 19 additions and 15 deletions

View File

@@ -146,6 +146,7 @@ class HisRequestBody extends ConsumerWidget {
"${selectedHistoryModel?.historyId}-json-body-viewer", "${selectedHistoryModel?.historyId}-json-body-viewer",
initialValue: requestModel?.body, initialValue: requestModel?.body,
readOnly: true, readOnly: true,
isDark: Theme.of(context).brightness == Brightness.dark,
), ),
), ),
_ => Padding( _ => Padding(

View File

@@ -20,7 +20,7 @@ class EditRequestBody extends ConsumerWidget {
.select((value) => value?.httpRequestModel?.bodyContentType)); .select((value) => value?.httpRequestModel?.bodyContentType));
final apiType = ref final apiType = ref
.watch(selectedRequestModelProvider.select((value) => value?.apiType)); .watch(selectedRequestModelProvider.select((value) => value?.apiType));
final mode = ref.watch(settingsProvider.select( final darkMode = ref.watch(settingsProvider.select(
(value) => value.isDark, (value) => value.isDark,
)); ));
@@ -49,7 +49,8 @@ class EditRequestBody extends ConsumerWidget {
padding: kPt5o10, padding: kPt5o10,
child: JsonTextFieldEditor( child: JsonTextFieldEditor(
key: Key("$selectedId-json-body"), key: Key("$selectedId-json-body"),
fieldKey: "$selectedId-json-body-editor-$mode", fieldKey: "$selectedId-json-body-editor-$darkMode",
isDark: darkMode,
initialValue: requestModel?.httpRequestModel?.body, initialValue: requestModel?.httpRequestModel?.body,
onChanged: (String value) { onChanged: (String value) {
ref ref

View File

@@ -13,6 +13,7 @@ class JsonTextFieldEditor extends StatefulWidget {
this.initialValue, this.initialValue,
this.hintText, this.hintText,
this.readOnly = false, this.readOnly = false,
this.isDark = false,
}); });
final String fieldKey; final String fieldKey;
@@ -20,6 +21,8 @@ class JsonTextFieldEditor extends StatefulWidget {
final String? initialValue; final String? initialValue;
final String? hintText; final String? hintText;
final bool readOnly; final bool readOnly;
final bool isDark;
@override @override
State<JsonTextFieldEditor> createState() => _JsonTextFieldEditorState(); State<JsonTextFieldEditor> createState() => _JsonTextFieldEditorState();
} }
@@ -74,10 +77,8 @@ class _JsonTextFieldEditorState extends State<JsonTextFieldEditor> {
controller.selection = controller.selection =
TextSelection.collapsed(offset: controller.text.length); TextSelection.collapsed(offset: controller.text.length);
} }
if (oldWidget.fieldKey != widget.fieldKey) { if ((oldWidget.fieldKey != widget.fieldKey) ||
// TODO: JsonTextField uses ExtendedTextField which does (oldWidget.isDark != widget.isDark)) {
// not rebuild because no key is provided
// so light mode to dark mode switching leads to incorrect color.
setState(() {}); setState(() {});
} }
} }
@@ -93,39 +94,40 @@ class _JsonTextFieldEditorState extends State<JsonTextFieldEditor> {
}, },
}, },
child: JsonField( child: JsonField(
key: Key(widget.fieldKey), key: ValueKey("${widget.fieldKey}-fld"),
fieldKey: widget.fieldKey,
commonTextStyle: kCodeStyle.copyWith( commonTextStyle: kCodeStyle.copyWith(
color: Theme.of(context).brightness == Brightness.dark color: widget.isDark
? kDarkCodeTheme['root']?.color ? kDarkCodeTheme['root']?.color
: kLightCodeTheme['root']?.color, : kLightCodeTheme['root']?.color,
), ),
specialCharHighlightStyle: kCodeStyle.copyWith( specialCharHighlightStyle: kCodeStyle.copyWith(
color: Theme.of(context).brightness == Brightness.dark color: widget.isDark
? kDarkCodeTheme['root']?.color ? kDarkCodeTheme['root']?.color
: kLightCodeTheme['root']?.color, : kLightCodeTheme['root']?.color,
), ),
stringHighlightStyle: kCodeStyle.copyWith( stringHighlightStyle: kCodeStyle.copyWith(
color: Theme.of(context).brightness == Brightness.dark color: widget.isDark
? kDarkCodeTheme['string']?.color ? kDarkCodeTheme['string']?.color
: kLightCodeTheme['string']?.color, : kLightCodeTheme['string']?.color,
), ),
numberHighlightStyle: kCodeStyle.copyWith( numberHighlightStyle: kCodeStyle.copyWith(
color: Theme.of(context).brightness == Brightness.dark color: widget.isDark
? kDarkCodeTheme['number']?.color ? kDarkCodeTheme['number']?.color
: kLightCodeTheme['number']?.color, : kLightCodeTheme['number']?.color,
), ),
boolHighlightStyle: kCodeStyle.copyWith( boolHighlightStyle: kCodeStyle.copyWith(
color: Theme.of(context).brightness == Brightness.dark color: widget.isDark
? kDarkCodeTheme['literal']?.color ? kDarkCodeTheme['literal']?.color
: kLightCodeTheme['literal']?.color, : kLightCodeTheme['literal']?.color,
), ),
nullHighlightStyle: kCodeStyle.copyWith( nullHighlightStyle: kCodeStyle.copyWith(
color: Theme.of(context).brightness == Brightness.dark color: widget.isDark
? kDarkCodeTheme['variable']?.color ? kDarkCodeTheme['variable']?.color
: kLightCodeTheme['variable']?.color, : kLightCodeTheme['variable']?.color,
), ),
keyHighlightStyle: kCodeStyle.copyWith( keyHighlightStyle: kCodeStyle.copyWith(
color: Theme.of(context).brightness == Brightness.dark color: widget.isDark
? kDarkCodeTheme['attr']?.color ? kDarkCodeTheme['attr']?.color
: kLightCodeTheme['attr']?.color, : kLightCodeTheme['attr']?.color,
fontWeight: FontWeight.bold, fontWeight: FontWeight.bold,

View File

@@ -832,7 +832,7 @@ packages:
path: "packages/json_field_editor" path: "packages/json_field_editor"
relative: true relative: true
source: path source: path
version: "1.2.0" version: "1.2.1"
json_serializable: json_serializable:
dependency: "direct dev" dependency: "direct dev"
description: description: