import 'package:flutter/material.dart';
import 'package:flutter_speed_dial/flutter_speed_dial.dart';
import 'package:liteauthconfig/appconfig.dart';
import 'package:liteauthconfig/l10n/app_localizations.dart';
import 'package:liteauthconfig/pages/deviceinfo.dart';
import 'package:liteauthconfig/pages/registerpage.dart';

class DeviceListPage extends StatefulWidget {
  const DeviceListPage({super.key});

  @override
  State<StatefulWidget> createState() => _DeviceListPageState();
}

class _DeviceListPageState extends State<DeviceListPage> {
  List<Device> devices = [];

  @override
  void initState() {
    super.initState();
    refreshList();
  }

  void refreshList() {
    setState(() {
      devices = AppConfig().devices;
    });
  }

  @override
  Widget build(BuildContext context) {
    var appLocal = AppLocalizations.of(context)!;
    var appTheme = Theme.of(context);

    return Scaffold(
      appBar: AppBar(title: Text(appLocal.deviceList)),
      body: Visibility(
        visible: devices.isEmpty,
        replacement: ListView.builder(
          itemBuilder: (context, index) {
            final dev = devices[index];

            return ListTile(
              title: Text(dev.name),
              onTap: () {
                Navigator.push(
                  context,
                  MaterialPageRoute(
                    builder: (context) => DeviceInfoPage(deviceIndex: index),
                  ),
                ).then((_) => refreshList());
              },
            );
          },
          itemCount: devices.length,
          shrinkWrap: true,
        ),
        child: Padding(
          padding: const EdgeInsets.all(16.0),
          child: Text(
            appLocal.noDevices,
            textAlign: TextAlign.center,
            style: appTheme.textTheme.bodyLarge,
          ),
        ),
      ),
      floatingActionButton: SpeedDial(
        overlayColor: Colors.black,
        spacing: 8,
        children: [
          SpeedDialChild(
            child: const Icon(Icons.settings),
            label: appLocal.setupNewDevice,
            shape: CircleBorder(),
            labelStyle: appTheme.textTheme.bodyMedium?.copyWith(
              color: Colors.black,
            ),
            onTap: () {
              Navigator.of(context)
                  .push(MaterialPageRoute(builder: (context) => RegisterPage(true)))
                  .then((_) => refreshList());
            },
          ),
          SpeedDialChild(
            child: const Icon(Icons.add_box_outlined),
            label: appLocal.addExistingDevice,
            shape: CircleBorder(),
            labelStyle: appTheme.textTheme.bodyMedium?.copyWith(
              color: Colors.black,
            ),
            onTap: () {
              Navigator.of(context)
                  .push(MaterialPageRoute(builder: (context) => RegisterPage(false)))
                  .then((_) => refreshList());
            }
          ),
        ],
        child: const Icon(Icons.add),
      ),
    );
  }
}