import 'package:flutter/material.dart';

import 'package:mobdr/main.dart';
import 'package:mobdr/config/global_style.dart';
import 'package:mobdr/ui/reusable/reusable_widget.dart';
import 'package:mobdr/db/box_log.dart';
import 'package:mobdr/service/plausible.dart';
import 'package:mobdr/service/logger_util.dart';

class LogPage extends StatefulWidget {
  @override
  _LogPageState createState() => _LogPageState();
}

class _LogPageState extends State<LogPage> {
  final _reusableWidget = ReusableWidget();

  Widget Function(BuildContext, int) _itemBuilder(List<Log> logs) =>
      (BuildContext context, int index) => Container(
            margin: const EdgeInsets.symmetric(horizontal: 0.0),
            decoration: const BoxDecoration(
              border: Border(bottom: BorderSide(color: Colors.black12)),
            ),
            child: Padding(
              padding: const EdgeInsets.symmetric(
                vertical: 12.0,
                horizontal: 0.0,
              ),
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: <Widget>[
                  Row(
                    children: <Widget>[
                      if (logs[index].type == 'LOG')
                        Icon(Icons.info, color: Colors.blue),
                      if (logs[index].type == 'ERR')
                        Icon(Icons.error, color: Colors.red),
                      SizedBox(width: 10.0),
                      Text(
                        logs[index].libelle,
                        style: const TextStyle(
                          fontSize: 15.0,
                        ),
                        // Provide a Key for the integration test
                        key: Key('list_log_$index'),
                      ),
                    ],
                  ),
                  Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: <Widget>[
                      Text(
                        'Added on ${logs[index].dateFormat}',
                        style: const TextStyle(
                          fontSize: 12.0,
                        ),
                      ),
                      if (logs[index].duree > 0)
                        Row(
                          children: <Widget>[
                            Icon(Icons.timer),
                            SizedBox(width: 5.0),
                            Text('${logs[index].duree} ms'),
                          ],
                        ),
                    ],
                  ),
                ],
              ),
            ),
          );

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

    // track & log page access
    final page = 'log';
    LoggerUtil.dblog('LOG', 'MOBDR', 'Page : ${page}', 0);
    PlausibleUtil.addEvent(name: 'pageview', page: page);
  }

  @override
  void dispose() {
    super.dispose();
  }

  void _showConfirmationDialog() {
    showDialog(
      context: context,
      builder: (context) => AlertDialog(
        title: Text('Confirmation'),
        content: Text('Are you sure you want to delete this log?'),
        actions: [
          TextButton(
            child: Text('Cancel'),
            onPressed: () {
              Navigator.of(context).pop();
            },
          ),
          TextButton(
            child: Text('Delete'),
            onPressed: () {
              // remove all log from db
              objectbox.logBox.removeAll();

              // close dialog
              Navigator.of(context).pop();
            },
          ),
        ],
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.white,
      appBar: AppBar(
        iconTheme: IconThemeData(
          color: GlobalStyle.appBarIconThemeColor,
        ),
        elevation: GlobalStyle.appBarElevation,
        title: Text(
          'Show logs',
          style: GlobalStyle.appBarTitle,
        ),
        backgroundColor: GlobalStyle.appBarBackgroundColor,
        systemOverlayStyle: GlobalStyle.appBarSystemOverlayStyle,
        actions: [
          IconButton(
            icon: Icon(Icons.delete),
            onPressed: _showConfirmationDialog,
          ),
        ],
        bottom: _reusableWidget.bottomAppBar(),
      ),
      body: Column(
        children: <Widget>[
          Expanded(
            child: StreamBuilder<List<Log>>(
              stream: objectbox.getLogs(),
              builder: (context, snapshot) => ListView.builder(
                shrinkWrap: true,
                padding: const EdgeInsets.symmetric(horizontal: 20.0),
                itemCount: snapshot.hasData ? snapshot.data!.length : 0,
                itemBuilder: _itemBuilder(snapshot.data ?? []),
              ),
            ),
          ),
        ],
      ),
    );
  }
}