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

import 'account_list.dart';
import 'recurring_transaction_list.dart';

/// Eine Widget-Klasse, die die Einstellungsseite der Anwendung darstellt.
class Settings extends StatefulWidget {
  /// Erstellt eine neue Instanz dieser Klasse.
  const Settings({super.key});

  @override
  State<Settings> createState() => _SettingsState();
}

class _SettingsState extends State<Settings> {
  @override
  Widget build(final BuildContext context) {
    final ThemeData theme = Theme.of(context);

    return Scaffold(
      body: SafeArea(
        child: Padding(
          padding: const EdgeInsets.all(16),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: <Widget>[
              const Text(
                'Einstellungen',
                style: TextStyle(fontSize: 24, fontWeight: FontWeight.bold),
              ),
              const SizedBox(height: 24),

              const AccountList(),
              const SizedBox(height: 24),

              const RecurringTransactionList(),
              const SizedBox(height: 8),
              _versionNumber(theme),
            ],
          ),
        ),
      ),
    );
  }

  Widget _versionNumber(final ThemeData theme) {
    final Future<PackageInfo> packageInfo = PackageInfo.fromPlatform();

    return Align(
      alignment: Alignment.bottomLeft,
      child: FutureBuilder(
        future: packageInfo,
        builder:
            (
              final BuildContext context,
              final AsyncSnapshot<PackageInfo> snapshot,
            ) {
              if (snapshot.hasData) {
                return Text(
                  '${snapshot.data?.version}+${snapshot.data?.buildNumber}',
                  style: theme.textTheme.bodySmall?.copyWith(
                    color: theme.colorScheme.onSurface.withAlpha(
                      (0.6 * 255).round(),
                    ),
                  ),
                );
              } else {
                return const CircularProgressIndicator();
              }
            },
      ),
    );
  }
}