// Settings: the few things that are chosen, gathered in one place. Build-time choices
// are shown so it is clear where they come from, not edited here.

import 'package:flutter/material.dart';

import '../actions/server_url.dart';
import '../link/boundary.dart';
import '../link/net.dart';
import '../shell_scope.dart';
import '../theme/palette.dart';

class SettingsPage extends StatelessWidget {
  const SettingsPage({
    super.key,
    required this.boundary,
    required this.usb,
    required this.themes,
  });
  final Boundary boundary;
  final UsbLink usb;
  final Themes themes;

  @override
  Widget build(BuildContext context) {
    final p = AppTheme.of(context);
    Widget section(String t) => Padding(
      padding: const EdgeInsets.fromLTRB(16, 20, 16, 4),
      child: Text(
        t,
        style: Theme.of(context).textTheme.labelLarge
            ?.copyWith(color: p.subdued),
      ),
    );
    return ListenableBuilder(
      listenable: Listenable.merge([boundary, themes]),
      builder: (context, _) => Scaffold(
        appBar: AppBar(
          leading: const MenuButton(),
          title: const Text('Settings'),
        ),
        body: ListView(
          children: [
            section('Connection'),
            ListTile(
              leading: const Icon(Icons.lan),
              title: const Text('Gateway address'),
              subtitle: Text(
                boundary.url,
                style: const TextStyle(fontFamily: 'monospace'),
              ),
              trailing: const Icon(Icons.edit),
              onTap: () => editUrl(context, boundary, usb),
            ),
            section('Display'),
            SwitchListTile(
              secondary: Icon(
                themes.isDark ? Icons.dark_mode : Icons.light_mode,
              ),
              title: const Text('Dark variant'),
              subtitle: const Text('Bright for daylight, dark for night'),
              value: themes.isDark,
              onChanged: (v) => themes.isDark = v,
            ),
            ListTile(
              leading: const Icon(Icons.palette),
              title: const Text('Theme'),
              subtitle: Text(
                '${themes.name} · set at build time: --dart-define=YUKART_THEME=<name>',
              ),
            ),
            ListTile(
              leading: const Icon(Icons.home),
              title: const Text('Landing view'),
              subtitle: Text(
                '${landingView.name} · set at build time: --dart-define=YUKART_HOME=dash|signals',
              ),
            ),
          ],
        ),
      ),
    );
  }
}