feat(ui): hub-endpoint settings dialog with persistence
Studio is no longer hardcoded to localhost:50051. A gear icon in the sidebar footer opens a small settings dialog where the operator picks host / port / TLS-on-or-off. Saved values persist via shared_preferences and Studio reconnects to the new endpoint immediately. - data/hub.dart: HubService.loadPersistedEndpoint() called once before the first frame; reconnect() persists on every change. - widgets/fai_settings_dialog.dart: typed form with port range validation, live URL preview pill, error surfacing if the reconnect fails. - main.dart: gear icon at the sidebar bottom, replaces the static "platform v0.10.42" footer. shared_preferences added as dependency. flutter analyze clean, flutter test 2/2, macOS debug build succeeds. Bumps fai_studio 0.4.0 -> 0.5.0. Signed-off-by: flemming-it <stefan.a.flemming@googlemail.com>
This commit is contained in:
parent
4352ecc28c
commit
521a8baab8
9 changed files with 365 additions and 11 deletions
212
lib/widgets/fai_settings_dialog.dart
Normal file
212
lib/widgets/fai_settings_dialog.dart
Normal file
|
|
@ -0,0 +1,212 @@
|
|||
// FaiSettingsDialog — modal for changing the hub endpoint.
|
||||
// Reads current values from HubService, persists on save via
|
||||
// HubService.reconnect.
|
||||
|
||||
import 'package:fai_dart_sdk/fai_dart_sdk.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
import '../data/hub.dart';
|
||||
import '../theme/theme.dart';
|
||||
import '../theme/tokens.dart';
|
||||
|
||||
class FaiSettingsDialog extends StatefulWidget {
|
||||
const FaiSettingsDialog({super.key});
|
||||
|
||||
/// Convenience launcher used from the sidebar gear icon.
|
||||
static Future<bool> show(BuildContext context) async {
|
||||
final ok = await showDialog<bool>(
|
||||
context: context,
|
||||
builder: (_) => const FaiSettingsDialog(),
|
||||
);
|
||||
return ok ?? false;
|
||||
}
|
||||
|
||||
@override
|
||||
State<FaiSettingsDialog> createState() => _FaiSettingsDialogState();
|
||||
}
|
||||
|
||||
class _FaiSettingsDialogState extends State<FaiSettingsDialog> {
|
||||
late final TextEditingController _host;
|
||||
late final TextEditingController _port;
|
||||
bool _secure = false;
|
||||
bool _saving = false;
|
||||
String? _error;
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
super.initState();
|
||||
final ep = HubService.instance.currentEndpoint;
|
||||
_host = TextEditingController(text: ep.host);
|
||||
_port = TextEditingController(text: ep.port.toString());
|
||||
_secure = ep.secure;
|
||||
}
|
||||
|
||||
@override
|
||||
void dispose() {
|
||||
_host.dispose();
|
||||
_port.dispose();
|
||||
super.dispose();
|
||||
}
|
||||
|
||||
Future<void> _save() async {
|
||||
setState(() {
|
||||
_saving = true;
|
||||
_error = null;
|
||||
});
|
||||
final port = int.tryParse(_port.text.trim());
|
||||
if (port == null || port <= 0 || port > 65535) {
|
||||
setState(() {
|
||||
_saving = false;
|
||||
_error = 'port must be 1–65535';
|
||||
});
|
||||
return;
|
||||
}
|
||||
final endpoint = HubEndpoint(
|
||||
host: _host.text.trim().isEmpty ? '127.0.0.1' : _host.text.trim(),
|
||||
port: port,
|
||||
secure: _secure,
|
||||
);
|
||||
try {
|
||||
await HubService.instance.reconnect(endpoint);
|
||||
if (!mounted) return;
|
||||
Navigator.pop(context, true);
|
||||
} catch (e) {
|
||||
setState(() {
|
||||
_saving = false;
|
||||
_error = e.toString();
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final theme = Theme.of(context);
|
||||
return AlertDialog(
|
||||
title: const Text('Hub endpoint'),
|
||||
shape: RoundedRectangleBorder(
|
||||
borderRadius: BorderRadius.circular(FaiRadius.md),
|
||||
),
|
||||
contentPadding: const EdgeInsets.symmetric(
|
||||
horizontal: FaiSpace.xl,
|
||||
vertical: FaiSpace.lg,
|
||||
),
|
||||
content: ConstrainedBox(
|
||||
constraints: const BoxConstraints(maxWidth: 380),
|
||||
child: Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(
|
||||
'Where should Studio connect? Default is the local hub at 127.0.0.1:50051.',
|
||||
style: theme.textTheme.bodySmall?.copyWith(
|
||||
color: theme.colorScheme.onSurfaceVariant,
|
||||
),
|
||||
),
|
||||
const SizedBox(height: FaiSpace.lg),
|
||||
TextField(
|
||||
controller: _host,
|
||||
decoration: const InputDecoration(
|
||||
labelText: 'Host',
|
||||
border: OutlineInputBorder(),
|
||||
isDense: true,
|
||||
),
|
||||
autofocus: true,
|
||||
),
|
||||
const SizedBox(height: FaiSpace.md),
|
||||
Row(
|
||||
children: [
|
||||
Expanded(
|
||||
flex: 2,
|
||||
child: TextField(
|
||||
controller: _port,
|
||||
decoration: const InputDecoration(
|
||||
labelText: 'Port',
|
||||
border: OutlineInputBorder(),
|
||||
isDense: true,
|
||||
),
|
||||
keyboardType: TextInputType.number,
|
||||
),
|
||||
),
|
||||
const SizedBox(width: FaiSpace.md),
|
||||
Expanded(
|
||||
flex: 3,
|
||||
child: SwitchListTile(
|
||||
contentPadding: EdgeInsets.zero,
|
||||
dense: true,
|
||||
title: const Text('TLS'),
|
||||
subtitle: Text(
|
||||
'https/grpc-secure',
|
||||
style: theme.textTheme.bodySmall?.copyWith(
|
||||
color: theme.colorScheme.onSurfaceVariant,
|
||||
),
|
||||
),
|
||||
value: _secure,
|
||||
onChanged: (v) => setState(() => _secure = v),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
if (_error != null) ...[
|
||||
const SizedBox(height: FaiSpace.md),
|
||||
Text(
|
||||
_error!,
|
||||
style: theme.textTheme.bodySmall?.copyWith(
|
||||
color: theme.colorScheme.error,
|
||||
),
|
||||
),
|
||||
],
|
||||
const SizedBox(height: FaiSpace.md),
|
||||
Container(
|
||||
padding: const EdgeInsets.all(FaiSpace.sm),
|
||||
decoration: BoxDecoration(
|
||||
color: theme.colorScheme.surfaceContainerHigh,
|
||||
borderRadius: BorderRadius.circular(FaiRadius.sm),
|
||||
),
|
||||
child: Row(
|
||||
children: [
|
||||
Icon(
|
||||
Icons.link,
|
||||
size: 14,
|
||||
color: theme.colorScheme.onSurfaceVariant,
|
||||
),
|
||||
const SizedBox(width: FaiSpace.sm),
|
||||
Text(
|
||||
_previewUrl(),
|
||||
style: FaiTheme.mono(
|
||||
size: 11,
|
||||
color: theme.colorScheme.onSurface,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
actions: [
|
||||
TextButton(
|
||||
onPressed: _saving ? null : () => Navigator.pop(context, false),
|
||||
child: const Text('Cancel'),
|
||||
),
|
||||
FilledButton(
|
||||
onPressed: _saving ? null : _save,
|
||||
child: _saving
|
||||
? const SizedBox(
|
||||
width: 16,
|
||||
height: 16,
|
||||
child: CircularProgressIndicator(strokeWidth: 2),
|
||||
)
|
||||
: const Text('Save & connect'),
|
||||
),
|
||||
],
|
||||
);
|
||||
}
|
||||
|
||||
String _previewUrl() {
|
||||
final scheme = _secure ? 'https' : 'http';
|
||||
final host =
|
||||
_host.text.trim().isEmpty ? '127.0.0.1' : _host.text.trim();
|
||||
final port = _port.text.trim().isEmpty ? '50051' : _port.text.trim();
|
||||
return '$scheme://$host:$port';
|
||||
}
|
||||
}
|
||||
|
|
@ -9,4 +9,5 @@ export 'fai_data_row.dart';
|
|||
export 'fai_delta_mark.dart';
|
||||
export 'fai_empty_state.dart';
|
||||
export 'fai_pill.dart';
|
||||
export 'fai_settings_dialog.dart';
|
||||
export 'fai_status_dot.dart';
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue