flutter/apidash
1
0
Fork 0
mirror of https://github.com/foss42/apidash.git synced 2025-05-21 00:09:55 +08:00
Code Issues Packages Projects Releases Wiki Activity

JsonTextFieldEditor fixes

Browse Source
This commit is contained in:
Ankit Mahato
2025-03-29 19:23:19 +05:30
parent 8a996f7619
commit d03eb12e5a
2 changed files with 120 additions and 99 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
lib/screens/home_page/editor_pane/details_card/request_pane/request_body.dart
View File

@ -20,6 +20,9 @@ class EditRequestBody extends ConsumerWidget {
.select((value) => value?.httpRequestModel?.bodyContentType));
final apiType = ref
.watch(selectedRequestModelProvider.select((value) => value?.apiType));
final mode = ref.watch(settingsProvider.select(
(value) => value.isDark,
));
// TODO: #178 GET->POST Currently switches to POST everytime user edits body even if the user intentionally chooses GET
// final sm = ScaffoldMessenger.of(context);
@ -66,7 +69,7 @@ class EditRequestBody extends ConsumerWidget {
padding: kPt5o10,
child: JsonTextFieldEditor(
key: Key("$selectedId-json-body"),
fieldKey: "$selectedId-json-body-editor",
fieldKey: "$selectedId-json-body-editor-$mode",
initialValue: requestModel?.httpRequestModel?.body,
onChanged: (String value) {
// changeToPostMethod();

214
lib/widgets/editor_json.dart
View File

@ -1,12 +1,9 @@
import 'package:apidash/widgets/widgets.dart';
import 'dart:math' as math;
import 'package:apidash/consts.dart';
import 'package:apidash/utils/utils.dart';
import 'dart:convert';
import 'package:apidash_design_system/apidash_design_system.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:json_text_field/json_text_field.dart';
import 'package:apidash/consts.dart';
class JsonTextFieldEditor extends StatefulWidget {
const JsonTextFieldEditor({
@ -49,6 +46,9 @@ class _JsonTextFieldEditorState extends State<JsonTextFieldEditor> {
@override
void initState() {
super.initState();
if (widget.initialValue != null) {
controller.text = widget.initialValue!;
}
controller.formatJson(sortJson: false);
editorFocusNode = FocusNode(debugLabel: "Editor Focus Node");
}
@ -60,106 +60,124 @@ class _JsonTextFieldEditorState extends State<JsonTextFieldEditor> {
}
@override
Widget build(BuildContext context) {
if (widget.initialValue != null) {
controller.text = widget.initialValue!;
void didUpdateWidget(JsonTextFieldEditor oldWidget) {
super.didUpdateWidget(oldWidget);
if (oldWidget.initialValue != widget.initialValue) {
controller.text = widget.initialValue ?? "";
controller.selection =
TextSelection.collapsed(offset: controller.text.length);
}
return Column(
mainAxisSize: MainAxisSize.max,
if (oldWidget.fieldKey != widget.fieldKey) {
// TODO: JsonTextField uses ExtendedTextField which does
// not rebuild because no key is provided
// so light mode to dark mode switching leads to incorrect color.
setState(() {});
}
}
@override
Widget build(BuildContext context) {
return Stack(
children: [
Align(
alignment: Alignment.topRight,
child: IconButton(
icon: const Icon(Icons.format_align_left),
onPressed: () {
controller.formatJson(sortJson: false);
CallbackShortcuts(
bindings: <ShortcutActivator, VoidCallback>{
const SingleActivator(LogicalKeyboardKey.tab): () {
insertTab();
},
},
child: JsonTextField(
key: Key(widget.fieldKey),
commonTextStyle: kCodeStyle.copyWith(
color: Theme.of(context).brightness == Brightness.dark
? kDarkCodeTheme['root']?.color
: kLightCodeTheme['root']?.color,
),
specialCharHighlightStyle: kCodeStyle.copyWith(
color: Theme.of(context).brightness == Brightness.dark
? kDarkCodeTheme['root']?.color
: kLightCodeTheme['root']?.color,
),
stringHighlightStyle: kCodeStyle.copyWith(
color: Theme.of(context).brightness == Brightness.dark
? kDarkCodeTheme['string']?.color
: kLightCodeTheme['string']?.color,
),
numberHighlightStyle: kCodeStyle.copyWith(
color: Theme.of(context).brightness == Brightness.dark
? kDarkCodeTheme['number']?.color
: kLightCodeTheme['number']?.color,
),
boolHighlightStyle: kCodeStyle.copyWith(
color: Theme.of(context).brightness == Brightness.dark
? kDarkCodeTheme['literal']?.color
: kLightCodeTheme['literal']?.color,
),
nullHighlightStyle: kCodeStyle.copyWith(
color: Theme.of(context).brightness == Brightness.dark
? kDarkCodeTheme['variable']?.color
: kLightCodeTheme['variable']?.color,
),
keyHighlightStyle: kCodeStyle.copyWith(
color: Theme.of(context).brightness == Brightness.dark
? kDarkCodeTheme['attr']?.color
: kLightCodeTheme['attr']?.color,
fontWeight: FontWeight.bold,
),
// errorContainerDecoration: BoxDecoration(
// color: Theme.of(context).colorScheme.error.withOpacity(
// kForegroundOpacity,
// ),
// borderRadius: kBorderRadius8,
// ),
// TODO: Show error message in Global Status bar
// showErrorMessage: true,
isFormatting: true,
controller: controller,
focusNode: editorFocusNode,
keyboardType: TextInputType.multiline,
expands: true,
maxLines: null,
readOnly: widget.readOnly,
style: kCodeStyle.copyWith(
fontSize: Theme.of(context).textTheme.bodyMedium?.fontSize,
),
textAlignVertical: TextAlignVertical.top,
onChanged: widget.onChanged,
onTapOutside: (PointerDownEvent event) {
editorFocusNode.unfocus();
},
decoration: InputDecoration(
hintText: kHintJson,
hintStyle: TextStyle(
color: Theme.of(context).colorScheme.outlineVariant,
),
focusedBorder: OutlineInputBorder(
borderRadius: kBorderRadius8,
borderSide: BorderSide(
color: Theme.of(context).colorScheme.outlineVariant,
),
),
enabledBorder: OutlineInputBorder(
borderRadius: kBorderRadius8,
borderSide: BorderSide(
color: Theme.of(context).colorScheme.surfaceContainerHighest,
),
),
filled: true,
hoverColor: kColorTransparent,
fillColor: Theme.of(context).colorScheme.surfaceContainerLow,
),
),
),
Expanded(
child: CallbackShortcuts(
bindings: <ShortcutActivator, VoidCallback>{
const SingleActivator(LogicalKeyboardKey.tab): () {
insertTab();
},
Align(
alignment: Alignment.topRight,
child: ADIconButton(
icon: Icons.format_align_left,
tooltip: "Format JSON",
onPressed: () {
controller.formatJson(sortJson: false);
widget.onChanged?.call(controller.text);
},
child: JsonTextField(
stringHighlightStyle: kCodeStyle.copyWith(
color: Theme.of(context).brightness == Brightness.dark
? kDarkCodeTheme['string']?.color
: kLightCodeTheme['string']?.color,
),
numberHighlightStyle: kCodeStyle.copyWith(
color: Theme.of(context).brightness == Brightness.dark
? kDarkCodeTheme['number']?.color
: kLightCodeTheme['number']?.color,
),
boolHighlightStyle: kCodeStyle.copyWith(
color: Theme.of(context).brightness == Brightness.dark
? kDarkCodeTheme['literal']?.color
: kLightCodeTheme['literal']?.color,
),
nullHighlightStyle: kCodeStyle.copyWith(
color: Theme.of(context).brightness == Brightness.dark
? kDarkCodeTheme['variable']?.color
: kLightCodeTheme['variable']?.color,
),
keyHighlightStyle: kCodeStyle.copyWith(
color: Theme.of(context).brightness == Brightness.dark
? kDarkCodeTheme['attr']?.color
: kLightCodeTheme['attr']?.color,
fontWeight: FontWeight.bold,
),
errorContainerDecoration: BoxDecoration(
color: Theme.of(context).colorScheme.error.withOpacity(
kForegroundOpacity,
),
borderRadius: kBorderRadius8,
),
showErrorMessage: true,
readOnly: widget.readOnly,
isFormatting: true,
key: Key(widget.fieldKey),
controller: controller,
focusNode: editorFocusNode,
keyboardType: TextInputType.multiline,
expands: true,
maxLines: null,
style: kCodeStyle,
textAlignVertical: TextAlignVertical.top,
decoration: InputDecoration(
hintText: kHintJson,
hintStyle: TextStyle(
color: Theme.of(context).colorScheme.outline.withOpacity(
kHintOpacity,
),
),
focusedBorder: OutlineInputBorder(
borderRadius: kBorderRadius8,
borderSide: BorderSide(
color: Theme.of(context).colorScheme.primary.withOpacity(
kHintOpacity,
),
),
),
enabledBorder: OutlineInputBorder(
borderRadius: kBorderRadius8,
borderSide: BorderSide(
color:
Theme.of(context).colorScheme.surfaceContainerHighest,
),
),
filled: true,
hoverColor: kColorTransparent,
fillColor: Color.alphaBlend(
(Theme.of(context).brightness == Brightness.dark
? Theme.of(context).colorScheme.onPrimaryContainer
: Theme.of(context).colorScheme.primaryContainer)
.withOpacity(kForegroundOpacity),
Theme.of(context).colorScheme.surface),
),
),
),
),
],