feat(map): implement map navigation, OSRM routing, and Nominatim search
This commit is contained in:
@@ -1 +1,561 @@
|
||||
export '../screens.dart' show UserSettingsScreen;
|
||||
// ignore_for_file: use_build_context_synchronously
|
||||
// lib/features/settings/user_settings_screen.dart
|
||||
|
||||
import 'dart:async';
|
||||
|
||||
import 'package:dio/dio.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter/services.dart';
|
||||
import 'package:flutter_bloc/flutter_bloc.dart';
|
||||
import 'package:go_router/go_router.dart';
|
||||
|
||||
import '../../app/app_cubit.dart';
|
||||
import '../../app/injection_container.dart';
|
||||
import '../../core/constants/app_constants.dart';
|
||||
import '../../core/network/api_client.dart';
|
||||
import '../../core/services/haptic_service.dart';
|
||||
import '../../core/services/tts_service.dart';
|
||||
import '../../core/storage/secure_storage.dart';
|
||||
|
||||
Dio get _api => sl<ApiClient>().dio;
|
||||
|
||||
// ─── Colours (inline, tidak butuh import app_colors.dart) ────────────────────
|
||||
const _kBlue = Color(0xFF1A56DB);
|
||||
const _kRed = Color(0xFFDC2626);
|
||||
const _kSurface = Color(0xFFF8FAFC);
|
||||
const _kBorder = Color(0xFFE2E8F0);
|
||||
const _kMuted = Color(0xFF64748B);
|
||||
const _kText = Color(0xFF0F172A);
|
||||
|
||||
// ─── Screen ──────────────────────────────────────────────────────────────────
|
||||
|
||||
class UserSettingsScreen extends StatefulWidget {
|
||||
const UserSettingsScreen({super.key});
|
||||
|
||||
@override
|
||||
State<UserSettingsScreen> createState() => _UserSettingsScreenState();
|
||||
}
|
||||
|
||||
class _UserSettingsScreenState extends State<UserSettingsScreen> {
|
||||
// ── local state ────────────────────────────────────────────────────────────
|
||||
bool _loading = true;
|
||||
bool _saving = false;
|
||||
|
||||
// TTS
|
||||
String _ttsLanguage = 'id-ID';
|
||||
double _ttsPitch = 1.0; // read-only for user, shown as info
|
||||
double _ttsSpeed = 0.9; // read-only for user, shown as info
|
||||
|
||||
// Caution
|
||||
bool _warnNoGuardian = true;
|
||||
bool _hapticEnabled = true;
|
||||
|
||||
// Account info (from SecureStorage)
|
||||
String _displayName = '';
|
||||
String _uniqueId = '';
|
||||
|
||||
// Pairing status
|
||||
String _pairingStatus = '—';
|
||||
bool _paired = false;
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
super.initState();
|
||||
sl<TtsService>().speak('Settings menu.');
|
||||
_loadAll();
|
||||
}
|
||||
|
||||
Future<void> _loadAll() async {
|
||||
setState(() => _loading = true);
|
||||
await Future.wait([_loadAccount(), _loadSettings(), _loadPairing()]);
|
||||
if (mounted) setState(() => _loading = false);
|
||||
}
|
||||
|
||||
Future<void> _loadAccount() async {
|
||||
final storage = sl<SecureStorage>();
|
||||
_displayName = await storage.getDisplayName() ?? '';
|
||||
_uniqueId = await storage.getUniqueUserId() ?? '';
|
||||
}
|
||||
|
||||
Future<void> _loadSettings() async {
|
||||
try {
|
||||
final res =
|
||||
await _api.get('/user/settings').timeout(const Duration(seconds: 6));
|
||||
final data = res.data['data'];
|
||||
if (data is Map) {
|
||||
_ttsLanguage = data['ttsLanguage']?.toString() ?? 'id-ID';
|
||||
_ttsPitch = (data['ttsPitch'] as num?)?.toDouble() ?? 1.0;
|
||||
_ttsSpeed = (data['ttsSpeed'] as num?)?.toDouble() ?? 0.9;
|
||||
_warnNoGuardian = data['warnNoGuardian'] as bool? ?? true;
|
||||
_hapticEnabled = data['hapticEnabled'] as bool? ?? true;
|
||||
}
|
||||
} catch (_) {
|
||||
// offline: tetap pakai default / nilai lokal
|
||||
}
|
||||
}
|
||||
|
||||
Future<void> _loadPairing() async {
|
||||
try {
|
||||
final res = await _api
|
||||
.get('/shared/pairing/status')
|
||||
.timeout(const Duration(seconds: 5));
|
||||
final data = res.data['data'];
|
||||
if (data is Map) {
|
||||
_paired = data['status'] == 'ACTIVE';
|
||||
final partner = data['pairedWithName'] ?? data['pairedWithEmail'] ?? '';
|
||||
_pairingStatus = _paired
|
||||
? 'Terhubung dengan $partner'
|
||||
: data['status'] == 'PENDING'
|
||||
? 'Menunggu konfirmasi Guardian'
|
||||
: 'Belum paired';
|
||||
}
|
||||
} catch (_) {
|
||||
_pairingStatus = 'Tidak bisa cek status';
|
||||
}
|
||||
}
|
||||
|
||||
Future<void> _save() async {
|
||||
setState(() => _saving = true);
|
||||
// Apply TTS locally dulu
|
||||
await sl<TtsService>().setLanguage(_ttsLanguage);
|
||||
if (_hapticEnabled) {
|
||||
await sl<HapticService>().success();
|
||||
}
|
||||
|
||||
try {
|
||||
await _api.put('/user/settings', data: {
|
||||
'ttsLanguage': _ttsLanguage,
|
||||
'ttsPitch': _ttsPitch,
|
||||
'ttsSpeed': _ttsSpeed,
|
||||
'warnNoGuardian': _warnNoGuardian,
|
||||
'hapticEnabled': _hapticEnabled,
|
||||
}).timeout(const Duration(seconds: 8));
|
||||
_snack('Settings tersimpan.');
|
||||
sl<TtsService>().speak('Settings disimpan.');
|
||||
} on DioException catch (e) {
|
||||
final msg = e.response?.data['message']?.toString() ??
|
||||
'Server tidak merespons, settings lokal sudah diterapkan.';
|
||||
_snack(msg);
|
||||
} catch (_) {
|
||||
_snack('Settings lokal sudah diterapkan, gagal sync ke server.');
|
||||
} finally {
|
||||
if (mounted) setState(() => _saving = false);
|
||||
}
|
||||
}
|
||||
|
||||
Future<void> _logout() async {
|
||||
await sl<SecureStorage>().clearAll();
|
||||
context.read<AppCubit>().clearSession();
|
||||
unawaited(_api
|
||||
.post('/auth/logout')
|
||||
.timeout(const Duration(seconds: 3))
|
||||
.catchError((_) => null));
|
||||
if (mounted) context.go('/login');
|
||||
}
|
||||
|
||||
Future<void> _changeServer() async {
|
||||
await AppConstants.clearServerUrl();
|
||||
if (mounted) context.go('/server-connect');
|
||||
}
|
||||
|
||||
void _snack(String msg) {
|
||||
if (mounted) {
|
||||
ScaffoldMessenger.of(context).showSnackBar(SnackBar(content: Text(msg)));
|
||||
}
|
||||
}
|
||||
|
||||
// ── build ──────────────────────────────────────────────────────────────────
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return SafeArea(
|
||||
child: _loading
|
||||
? const Center(child: CircularProgressIndicator())
|
||||
: ListView(
|
||||
padding: const EdgeInsets.all(16),
|
||||
children: [
|
||||
// ── header ─────────────────────────────────────────────────
|
||||
Text('Settings',
|
||||
style: Theme.of(context)
|
||||
.textTheme
|
||||
.headlineSmall
|
||||
?.copyWith(fontWeight: FontWeight.w800)),
|
||||
const Text('TTS, haptic, pairing, account',
|
||||
style: TextStyle(color: _kMuted)),
|
||||
const SizedBox(height: 20),
|
||||
|
||||
// ── 1. TTS Settings ────────────────────────────────────────
|
||||
_SectionHeader('1. TTS Settings', Icons.record_voice_over),
|
||||
const SizedBox(height: 10),
|
||||
_Card(
|
||||
child: Column(
|
||||
children: [
|
||||
// Language (editable)
|
||||
DropdownButtonFormField<String>(
|
||||
value: _ttsLanguage,
|
||||
decoration: const InputDecoration(
|
||||
labelText: 'Bahasa TTS',
|
||||
border: OutlineInputBorder(),
|
||||
contentPadding: EdgeInsets.symmetric(
|
||||
horizontal: 12, vertical: 10),
|
||||
),
|
||||
items: const [
|
||||
DropdownMenuItem(
|
||||
value: 'id-ID', child: Text('Bahasa Indonesia')),
|
||||
DropdownMenuItem(
|
||||
value: 'en-US', child: Text('English (US)')),
|
||||
],
|
||||
onChanged: (v) =>
|
||||
setState(() => _ttsLanguage = v ?? _ttsLanguage),
|
||||
),
|
||||
const SizedBox(height: 12),
|
||||
// Pitch — read-only info
|
||||
_InfoRow(
|
||||
label: 'Pitch',
|
||||
value: _ttsPitch.toStringAsFixed(1),
|
||||
note: 'Diatur oleh Guardian',
|
||||
icon: Icons.tune,
|
||||
),
|
||||
const Divider(height: 20),
|
||||
// Speed — read-only info
|
||||
_InfoRow(
|
||||
label: 'Speed',
|
||||
value: _ttsSpeed.toStringAsFixed(1),
|
||||
note: 'Diatur oleh Guardian',
|
||||
icon: Icons.speed,
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
|
||||
const SizedBox(height: 20),
|
||||
|
||||
// ── 2. Pairing ─────────────────────────────────────────────
|
||||
_SectionHeader('2. Pairing', Icons.link),
|
||||
const SizedBox(height: 10),
|
||||
_Card(
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
// unique ID
|
||||
if (_uniqueId.isNotEmpty) ...[
|
||||
const Text('Unique User ID',
|
||||
style: TextStyle(
|
||||
fontSize: 12,
|
||||
color: _kMuted,
|
||||
fontWeight: FontWeight.w600)),
|
||||
const SizedBox(height: 4),
|
||||
GestureDetector(
|
||||
onTap: () {
|
||||
Clipboard.setData(ClipboardData(text: _uniqueId));
|
||||
_snack('ID disalin ke clipboard.');
|
||||
},
|
||||
child: Container(
|
||||
width: double.infinity,
|
||||
padding: const EdgeInsets.symmetric(
|
||||
horizontal: 14, vertical: 10),
|
||||
decoration: BoxDecoration(
|
||||
color: const Color(0xFFEFF6FF),
|
||||
borderRadius: BorderRadius.circular(10),
|
||||
),
|
||||
child: Row(
|
||||
children: [
|
||||
const Icon(Icons.qr_code_2,
|
||||
color: _kBlue, size: 20),
|
||||
const SizedBox(width: 10),
|
||||
Text(
|
||||
_uniqueId,
|
||||
style: const TextStyle(
|
||||
fontSize: 20,
|
||||
fontWeight: FontWeight.w800,
|
||||
letterSpacing: 2,
|
||||
color: _kBlue),
|
||||
),
|
||||
const Spacer(),
|
||||
const Icon(Icons.copy,
|
||||
color: _kMuted, size: 16),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 12),
|
||||
const Divider(height: 1),
|
||||
const SizedBox(height: 12),
|
||||
],
|
||||
// pairing status
|
||||
Row(
|
||||
children: [
|
||||
Icon(
|
||||
_paired ? Icons.link : Icons.link_off,
|
||||
color: _paired
|
||||
? const Color(0xFF16A34A)
|
||||
: const Color(0xFFD97706),
|
||||
size: 20,
|
||||
),
|
||||
const SizedBox(width: 10),
|
||||
Expanded(
|
||||
child: Text(_pairingStatus,
|
||||
style: TextStyle(
|
||||
color: _paired
|
||||
? const Color(0xFF166534)
|
||||
: const Color(0xFF92400E),
|
||||
fontWeight: FontWeight.w600)),
|
||||
),
|
||||
IconButton(
|
||||
icon: const Icon(Icons.refresh, size: 18),
|
||||
onPressed: () async {
|
||||
await _loadPairing();
|
||||
setState(() {});
|
||||
},
|
||||
tooltip: 'Refresh status',
|
||||
),
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 8),
|
||||
SizedBox(
|
||||
width: double.infinity,
|
||||
child: OutlinedButton.icon(
|
||||
onPressed: () => context.go('/user/pairing'),
|
||||
icon: const Icon(Icons.manage_accounts_outlined),
|
||||
label: const Text('Buka menu Pairing'),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
|
||||
const SizedBox(height: 20),
|
||||
|
||||
// ── 3. Manual / Instructions ───────────────────────────────
|
||||
_SectionHeader('3. Manual & Instruksi', Icons.menu_book),
|
||||
const SizedBox(height: 10),
|
||||
_Card(
|
||||
child: ListTile(
|
||||
contentPadding: EdgeInsets.zero,
|
||||
leading: const Icon(Icons.help_outline, color: _kBlue),
|
||||
title: const Text('Daftar Voice Commands & Shortcuts'),
|
||||
subtitle:
|
||||
const Text('Lihat semua perintah suara yang tersedia'),
|
||||
trailing: const Icon(Icons.chevron_right),
|
||||
onTap: () {
|
||||
// Route /user/manual belum ada di router —
|
||||
// tambahkan GoRoute('/user/manual', ManualScreen) di router.dart
|
||||
// lalu ganti baris ini dengan: context.go('/user/manual');
|
||||
ScaffoldMessenger.of(context).showSnackBar(
|
||||
const SnackBar(
|
||||
content: Text(
|
||||
'Manual screen: tambah route /user/manual di router.dart')),
|
||||
);
|
||||
},
|
||||
),
|
||||
),
|
||||
|
||||
const SizedBox(height: 20),
|
||||
|
||||
// ── 4. Caution Settings ────────────────────────────────────
|
||||
_SectionHeader('4. Caution Settings', Icons.warning_amber),
|
||||
const SizedBox(height: 10),
|
||||
_Card(
|
||||
child: Column(
|
||||
children: [
|
||||
SwitchListTile(
|
||||
contentPadding: EdgeInsets.zero,
|
||||
value: _warnNoGuardian,
|
||||
onChanged: (v) => setState(() => _warnNoGuardian = v),
|
||||
title: const Text('Peringatan belum paired'),
|
||||
subtitle: const Text(
|
||||
'TTS ingatkan jika belum terhubung Guardian'),
|
||||
secondary: const Icon(
|
||||
Icons.notifications_active_outlined,
|
||||
color: _kBlue),
|
||||
),
|
||||
const Divider(height: 1),
|
||||
SwitchListTile(
|
||||
contentPadding: EdgeInsets.zero,
|
||||
value: _hapticEnabled,
|
||||
onChanged: (v) => setState(() => _hapticEnabled = v),
|
||||
title: const Text('Haptic feedback'),
|
||||
subtitle:
|
||||
const Text('Getaran saat obstacle terdeteksi'),
|
||||
secondary: const Icon(Icons.vibration, color: _kBlue),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
|
||||
const SizedBox(height: 20),
|
||||
|
||||
// ── 5. Account ─────────────────────────────────────────────
|
||||
_SectionHeader('5. Account', Icons.person),
|
||||
const SizedBox(height: 10),
|
||||
_Card(
|
||||
child: Column(
|
||||
children: [
|
||||
_InfoRow(
|
||||
label: 'Display Name',
|
||||
value: _displayName.isNotEmpty ? _displayName : '—',
|
||||
icon: Icons.badge_outlined,
|
||||
),
|
||||
const Divider(height: 20),
|
||||
_InfoRow(
|
||||
label: 'Role',
|
||||
value: 'User',
|
||||
icon: Icons.accessibility_new,
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
|
||||
const SizedBox(height: 24),
|
||||
|
||||
// ── Save button ────────────────────────────────────────────
|
||||
FilledButton.icon(
|
||||
onPressed: _saving ? null : _save,
|
||||
icon: _saving
|
||||
? const SizedBox(
|
||||
width: 18,
|
||||
height: 18,
|
||||
child: CircularProgressIndicator(
|
||||
strokeWidth: 2, color: Colors.white))
|
||||
: const Icon(Icons.save_outlined),
|
||||
label: Text(_saving ? 'Menyimpan…' : 'Simpan Settings'),
|
||||
style: FilledButton.styleFrom(
|
||||
minimumSize: const Size.fromHeight(48),
|
||||
),
|
||||
),
|
||||
|
||||
const SizedBox(height: 10),
|
||||
|
||||
// ── Change server ──────────────────────────────────────────
|
||||
OutlinedButton.icon(
|
||||
onPressed: _changeServer,
|
||||
icon: const Icon(Icons.dns_outlined),
|
||||
label: const Text('Ganti Server'),
|
||||
style: OutlinedButton.styleFrom(
|
||||
minimumSize: const Size.fromHeight(44),
|
||||
),
|
||||
),
|
||||
|
||||
const SizedBox(height: 10),
|
||||
|
||||
// ── Logout ─────────────────────────────────────────────────
|
||||
OutlinedButton.icon(
|
||||
onPressed: () => _confirmLogout(context),
|
||||
icon: const Icon(Icons.logout, color: _kRed),
|
||||
label: const Text('Logout', style: TextStyle(color: _kRed)),
|
||||
style: OutlinedButton.styleFrom(
|
||||
minimumSize: const Size.fromHeight(44),
|
||||
side: const BorderSide(color: _kRed),
|
||||
),
|
||||
),
|
||||
|
||||
const SizedBox(height: 32),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Future<void> _confirmLogout(BuildContext context) async {
|
||||
final confirm = await showDialog<bool>(
|
||||
context: context,
|
||||
builder: (ctx) => AlertDialog(
|
||||
title: const Text('Logout?'),
|
||||
content: const Text('Sesi akan diakhiri. Kamu perlu login ulang.'),
|
||||
actions: [
|
||||
TextButton(
|
||||
onPressed: () => Navigator.pop(ctx, false),
|
||||
child: const Text('Batal')),
|
||||
FilledButton(
|
||||
style: FilledButton.styleFrom(backgroundColor: _kRed),
|
||||
onPressed: () => Navigator.pop(ctx, true),
|
||||
child: const Text('Logout'),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
if (confirm == true) await _logout();
|
||||
}
|
||||
}
|
||||
|
||||
// ─── Sub-widgets ─────────────────────────────────────────────────────────────
|
||||
|
||||
class _SectionHeader extends StatelessWidget {
|
||||
final String title;
|
||||
final IconData icon;
|
||||
const _SectionHeader(this.title, this.icon);
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Row(
|
||||
children: [
|
||||
Icon(icon, size: 18, color: _kBlue),
|
||||
const SizedBox(width: 8),
|
||||
Text(title,
|
||||
style: const TextStyle(
|
||||
fontWeight: FontWeight.w800, fontSize: 14, color: _kBlue)),
|
||||
],
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _Card extends StatelessWidget {
|
||||
final Widget child;
|
||||
const _Card({required this.child});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Container(
|
||||
width: double.infinity,
|
||||
padding: const EdgeInsets.all(16),
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white,
|
||||
borderRadius: BorderRadius.circular(14),
|
||||
border: Border.all(color: _kBorder),
|
||||
),
|
||||
child: child,
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _InfoRow extends StatelessWidget {
|
||||
final String label;
|
||||
final String value;
|
||||
final IconData icon;
|
||||
final String? note;
|
||||
const _InfoRow(
|
||||
{required this.label,
|
||||
required this.value,
|
||||
required this.icon,
|
||||
this.note});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Row(
|
||||
children: [
|
||||
Icon(icon, size: 18, color: _kMuted),
|
||||
const SizedBox(width: 10),
|
||||
Expanded(
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(label, style: const TextStyle(fontSize: 12, color: _kMuted)),
|
||||
Text(value,
|
||||
style: const TextStyle(
|
||||
fontWeight: FontWeight.w700, color: _kText)),
|
||||
],
|
||||
),
|
||||
),
|
||||
if (note != null)
|
||||
Container(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 3),
|
||||
decoration: BoxDecoration(
|
||||
color: _kSurface,
|
||||
borderRadius: BorderRadius.circular(8),
|
||||
border: Border.all(color: _kBorder),
|
||||
),
|
||||
child: Text(note!,
|
||||
style: const TextStyle(fontSize: 11, color: _kMuted)),
|
||||
),
|
||||
],
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user