feat: refactor code highlighting and add scripts editor pane

- replace `flutter_highlighter` and `highlighter` with `flutter_highlight` and `highlight`.
- add `flutter_code_editor` dependency.
- introduce a new scripts editor pane in the REST request view.
This commit is contained in:
Udhay-Adithya
2025-04-22 14:34:43 +05:30
parent ef3867ef43
commit 346e4c3ef0
8 changed files with 182 additions and 15 deletions

View File

@@ -0,0 +1,44 @@
import 'package:apidash/providers/settings_providers.dart';
import 'package:flutter/material.dart';
import 'package:flutter_code_editor/flutter_code_editor.dart';
import 'package:flutter_highlight/themes/monokai.dart';
import 'package:flutter_highlight/themes/xcode.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
class ScriptsEditorPane extends ConsumerStatefulWidget {
final CodeController controller;
const ScriptsEditorPane({super.key, required this.controller});
@override
ConsumerState<ScriptsEditorPane> createState() => _ScriptsEditorPaneState();
}
class _ScriptsEditorPaneState extends ConsumerState<ScriptsEditorPane> {
@override
Widget build(BuildContext context) {
final settings = ref.watch(settingsProvider);
return CodeTheme(
data: CodeThemeData(
styles: settings.isDark ? monokaiTheme : xcodeTheme,
),
child: SingleChildScrollView(
child: CodeField(
smartDashesType: SmartDashesType.enabled,
smartQuotesType: SmartQuotesType.enabled,
background: Theme.of(context).colorScheme.surfaceContainerLowest,
gutterStyle: GutterStyle(
width: 40, // TODO: Fix numbers size
margin: 2,
textAlign: TextAlign.left,
),
cursorColor: Theme.of(context).colorScheme.primary,
controller: widget.controller,
textStyle: TextStyle(
fontSize: 12,
fontFamily: 'monospace',
),
),
),
);
}
}