import 'package:flutter/material.dart';
import 'package:provider/provider.dart';

import 'data.dart';

class Sia extends StatelessWidget {
  const Sia({super.key});

  @override
  Widget build(BuildContext context) {
    return ChangeNotifierProvider<AppState>(
      create: (BuildContext context) => AppState(),
      child: MaterialApp(
        home: Consumer<AppState>(
          builder: (_, AppState provider, _) {
            if (provider.onConnectionPage) {
              return const ConnectionPage();
            }
            return const DevicesPage();
          }
        ),
      ),
    );
  }
}

class ConnectionPage extends StatelessWidget {
  const ConnectionPage({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text("Connection")),
      body: const Padding(
        padding: EdgeInsets.all(16.0),
        child: TextField(
          decoration: InputDecoration(
            labelText: "Server name",
            hintText: "iot.example.org",
            border: OutlineInputBorder(),
          ),
        ),
      ),
      bottomNavigationBar: const ConnectionStatus(),
    );
  }
}

class DevicesPage extends StatelessWidget {
  const DevicesPage({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text("Contacts")),
      body: const Column(
        children: <Widget>[
          Expanded(child: ContactList()),
        ],
      ),
      bottomNavigationBar: const ConnectionStatus(),
    );
  }
}

class ContactList extends StatelessWidget {
  const ContactList({super.key});

  @override
  Widget build(BuildContext context) {
    return  Consumer<AppState>(
      builder: (BuildContext context, AppState state, Widget? child) {
        return ListView.builder(
          itemCount: state.contacts.length,
          itemBuilder: (BuildContext context, int index) {
            MapEntry<String, bool> data = state.contacts.entries.elementAt(index);
            String address = data.key;
            bool isOpen = data.value;
            return ListTile(
              leading: Icon(
                isOpen ? Icons.meeting_room : Icons.door_front_door,
                color: isOpen ? Colors.red : Colors.green,
              ),
              title: Text(address),
            );
          },
        );
      },
    );
  }
}

class ConnectionStatus extends StatelessWidget {
  const ConnectionStatus({super.key});

  @override
  Widget build(BuildContext context) {
    return  SafeArea(
      child: Consumer<AppState>(
        builder: (BuildContext context, AppState state, Widget? child) {
          Icon icon;
          Text text;

          if (state.brokerConnected && state.serverConnected) {
            icon = const Icon(Icons.cloud, color: Colors.green);
            text = const Text('Connected');
          } else if (state.brokerConnected && !state.serverConnected) {
            icon = const Icon(Icons.cloud_off, color: Colors.orange);
            text = const Text('Connection issue');
          } else {
            icon = const Icon(Icons.cloud_off, color: Colors.red);
            text = const Text('Disconnected');
          }

          return ListTile(leading: icon, title: text);
        },
      ),
    );
  }
}