flutter/apidash
1
0
Fork 0
mirror of https://github.com/foss42/apidash.git synced 2025-12-02 02:39:19 +08:00
Code Issues Packages Projects Releases Wiki Activity

Added SSE(Streaming) to Native AI Requests

Browse Source
This commit is contained in:
Manas Hejmadi
2025-07-25 19:03:23 +05:30
parent d0dc563ae7
commit f60836e4b2
4 changed files with 86 additions and 316 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
lib/widgets/response_body_success.dart
View File

@@ -1,3 +1,5 @@
import 'dart:convert';
import 'package:apidash_core/apidash_core.dart'; import 'package:apidash_core/apidash_core.dart';
import 'package:apidash_design_system/apidash_design_system.dart'; import 'package:apidash_design_system/apidash_design_system.dart';
import 'package:flutter/foundation.dart'; import 'package:flutter/foundation.dart';
@@ -186,7 +188,7 @@ class _ResponseBodySuccessState extends State<ResponseBodySuccess> {
padding: kP8, padding: kP8,
decoration: textContainerdecoration, decoration: textContainerdecoration,
child: SSEDisplay( child: SSEDisplay(
sseOutput: widget.sseOutput, sseOutput: widget.sseOutput ?? [],
), ),
), ),
), ),

135
lib/widgets/sse_display.dart
View File

@@ -1,20 +1,31 @@
import 'dart:convert'; import 'dart:convert';
import 'package:apidash/providers/collection_providers.dart';
import 'package:apidash_design_system/apidash_design_system.dart'; import 'package:apidash_design_system/apidash_design_system.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
class SSEDisplay extends StatelessWidget { class SSEDisplay extends ConsumerStatefulWidget {
final List<String>? sseOutput; final List<String> sseOutput;
const SSEDisplay({ const SSEDisplay({
super.key, super.key,
this.sseOutput, required this.sseOutput,
}); });
@override
ConsumerState<SSEDisplay> createState() => _SSEDisplayState();
}
class _SSEDisplayState extends ConsumerState<SSEDisplay> {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
final requestModel = ref.read(selectedRequestModelProvider);
final aiRequestModel = requestModel?.aiRequestModel;
final isAIOutput = (aiRequestModel != null);
final theme = Theme.of(context); final theme = Theme.of(context);
final fontSizeMedium = theme.textTheme.bodyMedium?.fontSize; final fontSizeMedium = theme.textTheme.bodyMedium?.fontSize;
final isDark = theme.brightness == Brightness.dark; final isDark = theme.brightness == Brightness.dark;
if (sseOutput == null || sseOutput!.isEmpty) { if (widget.sseOutput.isEmpty) {
return Text( return Text(
'No content', 'No content',
style: kCodeStyle.copyWith( style: kCodeStyle.copyWith(
@@ -24,59 +35,77 @@ class SSEDisplay extends StatelessWidget {
); );
} }
return ListView( if (isAIOutput) {
padding: kP1, String out = "";
children: sseOutput!.reversed.where((e) => e != '').map<Widget>((chunk) { for (String x in widget.sseOutput) {
Map<String, dynamic>? parsedJson; x = x.substring(6);
try { out += aiRequestModel.model.provider.modelController
parsedJson = jsonDecode(chunk); .streamOutputFormatter(jsonDecode(x)) ??
} catch (_) {} "<?>";
}
return SingleChildScrollView(
child: Text(out),
);
}
return Card( return SingleChildScrollView(
color: theme.colorScheme.surfaceContainerLowest, child: Column(
shape: RoundedRectangleBorder( crossAxisAlignment: CrossAxisAlignment.stretch,
borderRadius: kBorderRadius6, children: (widget.sseOutput)
), .reversed
child: Padding( .where((e) => e != '')
padding: kP8, .map<Widget>((chunk) {
child: parsedJson != null Map<String, dynamic>? parsedJson;
? Column( try {
crossAxisAlignment: CrossAxisAlignment.start, parsedJson = jsonDecode(chunk);
children: parsedJson.entries.map((entry) { } catch (_) {}
return Padding(
padding: const EdgeInsets.symmetric(vertical: 2.0), return Card(
child: Row( color: theme.colorScheme.surfaceContainerLowest,
crossAxisAlignment: CrossAxisAlignment.start, shape: RoundedRectangleBorder(
children: [ borderRadius: kBorderRadius6,
Text( ),
'${entry.key}: ', child: Padding(
style: kCodeStyle.copyWith( padding: kP8,
fontSize: fontSizeMedium, child: parsedJson != null
color: isDark ? kColorGQL.toDark : kColorGQL, ? Column(
fontWeight: FontWeight.bold, crossAxisAlignment: CrossAxisAlignment.start,
children: parsedJson.entries.map((entry) {
return Padding(
padding: const EdgeInsets.symmetric(vertical: 2.0),
child: Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
'${entry.key}: ',
style: kCodeStyle.copyWith(
fontSize: fontSizeMedium,
color: isDark ? kColorGQL.toDark : kColorGQL,
fontWeight: FontWeight.bold,
),
), ),
), const SizedBox(width: 4),
const SizedBox(width: 4), Expanded(
Expanded( child: Text(
child: Text( entry.value.toString(),
entry.value.toString(), style: kCodeStyle,
style: kCodeStyle, ),
), ),
), ],
], ),
), );
); }).toList(),
}).toList(), )
) : Text(
: Text( chunk.toString().trim(),
chunk.toString().trim(), style: kCodeStyle.copyWith(
style: kCodeStyle.copyWith( fontSize: fontSizeMedium,
fontSize: fontSizeMedium, ),
), ),
), ),
), );
); }).toList(),
}).toList(), ),
); );
} }
} }

2
packages/genai/lib/models/ai_request_model.dart
View File

@@ -32,7 +32,7 @@ class AIRequestModel with _$AIRequestModel {
LLMRequestDetails createRequest() { LLMRequestDetails createRequest() {
final controller = model.provider.modelController; final controller = model.provider.modelController;
return controller.createRequest(model, payload); return controller.createRequest(model, payload, stream: true);
} }
factory AIRequestModel.fromDefaultSaveObject(LLMSaveObject? defaultLLMSO) { factory AIRequestModel.fromDefaultSaveObject(LLMSaveObject? defaultLLMSO) {

261
packages/genai/lib/widgets/llm_selector.dart
View File

@@ -1,261 +0,0 @@
import 'package:flutter/material.dart';
import 'package:genai/llm_provider.dart';
import 'package:genai/llm_saveobject.dart';
import 'package:genai/providers/ollama.dart';
class DefaultLLMSelectorButton extends StatelessWidget {
final LLMSaveObject? defaultLLM;
final Function(LLMSaveObject) onDefaultLLMUpdated;
const DefaultLLMSelectorButton({
super.key,
this.defaultLLM,
required this.onDefaultLLMUpdated,
});
@override
Widget build(BuildContext context) {
return ElevatedButton(
onPressed: () async {
final saveObject = await showDialog(
context: context,
builder: (context) {
return AlertDialog(
scrollable: true,
content: DefaultLLMSelectorDialog(defaultLLM: defaultLLM),
contentPadding: EdgeInsets.all(10),
);
},
);
if (saveObject == null) return;
onDefaultLLMUpdated(saveObject);
},
child: Text(defaultLLM?.selectedLLM.modelName ?? 'Select Model'),
);
}
}
class DefaultLLMSelectorDialog extends StatefulWidget {
final LLMSaveObject? defaultLLM;
const DefaultLLMSelectorDialog({super.key, this.defaultLLM});
@override
State<DefaultLLMSelectorDialog> createState() =>
_DefaultLLMSelectorDialogState();
}
class _DefaultLLMSelectorDialogState extends State<DefaultLLMSelectorDialog> {
late LLMProvider selectedLLMProvider;
late LLMSaveObject llmSaveObject;
@override
void initState() {
super.initState();
final oC = OllamaModelController().inputPayload;
llmSaveObject =
widget.defaultLLM ??
LLMSaveObject(
endpoint: oC.endpoint,
credential: '',
configMap: oC.configMap,
selectedLLM: LLMProvider.gemini.getLLMByIdentifier(
'gemini-2.0-flash',
),
provider: LLMProvider.ollama,
);
selectedLLMProvider = llmSaveObject.provider;
}
@override
Widget build(BuildContext context) {
return Container(
padding: const EdgeInsets.all(20),
width: MediaQuery.of(context).size.width * 0.8,
child: Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
// Left panel - Provider List
Container(
width: 300,
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Text('Providers'),
const SizedBox(height: 10),
...LLMProvider.values.map(
(provider) => ListTile(
title: Text(provider.displayName),
trailing: llmSaveObject.provider == provider
? const CircleAvatar(
radius: 5,
backgroundColor: Colors.green,
)
: null,
onTap: () {
final input = provider.modelController.inputPayload;
setState(() {
selectedLLMProvider = provider;
llmSaveObject = LLMSaveObject(
endpoint: input.endpoint,
credential: '',
configMap: input.configMap,
selectedLLM: provider.models.first,
provider: provider,
);
});
},
),
),
],
),
),
const SizedBox(width: 40),
// Right panel - Configuration and Save
Expanded(
flex: 3,
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
selectedLLMProvider.displayName,
style: const TextStyle(fontSize: 28),
),
const SizedBox(height: 20),
if (selectedLLMProvider != LLMProvider.ollama) ...[
const Text('API Key / Credential'),
const SizedBox(height: 10),
BoundedTextField(
onChanged: (x) {
llmSaveObject.credential = x;
},
value: llmSaveObject.credential,
),
const SizedBox(height: 10),
],
const Text('Endpoint'),
const SizedBox(height: 10),
BoundedTextField(
key: ValueKey(llmSaveObject.provider),
onChanged: (x) => llmSaveObject.endpoint = x,
value: llmSaveObject.endpoint,
),
const SizedBox(height: 20),
const Text('Models'),
const SizedBox(height: 8),
Container(
height: 300,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(10),
color: const Color.fromARGB(27, 0, 0, 0),
),
child: SingleChildScrollView(
child: Column(
children: selectedLLMProvider.models
.map(
(model) => ListTile(
title: Text(model.modelName),
subtitle: Text(model.identifier),
trailing: llmSaveObject.selectedLLM == model
? const CircleAvatar(
radius: 5,
backgroundColor: Colors.green,
)
: null,
onTap: () {
setState(() {
llmSaveObject.selectedLLM = model;
});
},
),
)
.toList(),
),
),
),
const SizedBox(height: 10),
Align(
alignment: Alignment.centerRight,
child: ElevatedButton(
onPressed: () {
llmSaveObject.provider = selectedLLMProvider;
Navigator.of(context).pop(llmSaveObject);
},
child: const Text('Save Changes'),
),
),
],
),
),
],
),
);
}
}
class BoundedTextField extends StatefulWidget {
const BoundedTextField({
super.key,
required this.value,
required this.onChanged,
});
final String value;
final void Function(String value) onChanged;
@override
State<BoundedTextField> createState() => _BoundedTextFieldState();
}
class _BoundedTextFieldState extends State<BoundedTextField> {
TextEditingController controller = TextEditingController();
@override
void initState() {
controller.text = widget.value;
super.initState();
}
@override
void didUpdateWidget(covariant BoundedTextField oldWidget) {
//Assisting in Resetting on Change
if (widget.value == '') {
controller.text = widget.value;
}
super.didUpdateWidget(oldWidget);
}
@override
Widget build(BuildContext context) {
// final double width = context.isCompactWindow ? 150 : 220;
return Container(
height: 40,
decoration: BoxDecoration(
border: Border.all(
color: Theme.of(context).colorScheme.surfaceContainerHighest,
),
borderRadius: BorderRadius.circular(8),
),
width: double.infinity,
child: Container(
transform: Matrix4.translationValues(0, -5, 0),
child: TextField(
controller: controller,
// obscureText: true,
decoration: InputDecoration(
border: InputBorder.none,
contentPadding: EdgeInsets.only(left: 10),
),
onChanged: widget.onChanged,
),
),
);
}
}