relatica/lib/screens/sign_in.dart

import 'package:flutter/material.dart';
import 'package:go_router/go_router.dart';
import 'package:relatica/models/auth/basic_credentials.dart';
import 'package:relatica/routes.dart';
import 'package:string_validator/string_validator.dart';

import '../controls/padding.dart';
import '../globals.dart';
import '../services/auth_service.dart';
import '../utils/snackbar_builder.dart';

class SignInScreen extends StatefulWidget {
  @override
  State<SignInScreen> createState() => _SignInScreenState();
}

class _SignInScreenState extends State<SignInScreen> {
  final formKey = GlobalKey<FormState>();
  final usernameController = TextEditingController();
  final serverNameController = TextEditingController();
  final passwordController = TextEditingController();
  var hidePassword = true;

  @override
  void initState() {
    super.initState();
    final service = getIt<AccountsService>();
    if (service.loggedIn) {
      usernameController.text = service.currentProfile.username;
      passwordController.text =
          (service.currentProfile.credentials as BasicCredentials).password;
      serverNameController.text = service.currentProfile.serverName;
    }
  }

  @override
  Widget build(BuildContext context) {
    final service = getIt<AccountsService>();
    final loggedInProfiles = service.loggedInProfiles;
    final loggedOutProfiles = service.loggedOutProfiles;
    return Scaffold(
      appBar: AppBar(
        title: const Text('Sign In'),
      ),
      body: Padding(
        padding: const EdgeInsets.all(20.0),
        child: Form(
          key: formKey,
          child: Center(
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.center,
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                TextFormField(
                  autovalidateMode: AutovalidateMode.onUserInteraction,
                  controller: serverNameController,
                  validator: (value) =>
                      isFQDN(value ?? '') ? null : 'Not a valid server name',
                  decoration: InputDecoration(
                    prefixIcon: const Icon(Icons.alternate_email),
                    hintText: 'Server Name (friendica.example.com)',
                    border: OutlineInputBorder(
                      borderSide: BorderSide(
                        color: Theme.of(context).backgroundColor,
                      ),
                      borderRadius: BorderRadius.circular(5.0),
                    ),
                    labelText: 'Server Name',
                  ),
                ),
                const VerticalPadding(),
                TextFormField(
                  autovalidateMode: AutovalidateMode.onUserInteraction,
                  controller: usernameController,
                  keyboardType: TextInputType.emailAddress,
                  validator: (value) {
                    if (value == null) {
                      return null;
                    }

                    if (value.contains('@')) {
                      return isEmail(value ?? '')
                          ? null
                          : 'Not a valid Friendica Account Address';
                    }

                    return isAlphanumeric(value.replaceAll('-', ''))
                        ? null
                        : 'Username should be alpha-numeric';
                  },
                  decoration: InputDecoration(
                    prefixIcon: const Icon(Icons.alternate_email),
                    hintText: 'Username (user@example.com)',
                    border: OutlineInputBorder(
                      borderSide: BorderSide(
                        color: Theme.of(context).backgroundColor,
                      ),
                      borderRadius: BorderRadius.circular(5.0),
                    ),
                    labelText: 'Username',
                  ),
                ),
                const VerticalPadding(),
                TextFormField(
                  obscureText: hidePassword,
                  controller: passwordController,
                  decoration: InputDecoration(
                    prefixIcon: const Icon(Icons.password),
                    suffixIcon: IconButton(
                      onPressed: () {
                        setState(() {
                          hidePassword = !hidePassword;
                        });
                      },
                      icon: hidePassword
                          ? const Icon(Icons.remove_red_eye_outlined)
                          : const Icon(Icons.remove_red_eye),
                    ),
                    hintText: 'Password',
                    border: OutlineInputBorder(
                      borderSide: BorderSide(
                        color: Theme.of(context).backgroundColor,
                      ),
                      borderRadius: BorderRadius.circular(5.0),
                    ),
                    labelText: 'Password',
                  ),
                ),
                const VerticalPadding(),
                ElevatedButton(
                  onPressed: () => _signIn(context),
                  child: const Text('Signin'),
                ),
                const VerticalPadding(),
                const Text('Logged out:'),
                Expanded(
                  flex: 1,
                  child: ListView.separated(
                    itemBuilder: (context, index) {
                      final p = loggedOutProfiles[index];
                      return ListTile(
                        onTap: () {
                          setState(() {
                            serverNameController.text = p.serverName;
                            usernameController.text = p.username;
                            passwordController.text =
                                (p.credentials as BasicCredentials).password;
                          });
                        },
                        title: Text(p.handle),
                        subtitle: Text(p.id),
                      );
                    },
                    separatorBuilder: (_, __) => const Divider(),
                    itemCount: loggedOutProfiles.length,
                  ),
                ),
                const VerticalPadding(),
                const Text('Logged in:'),
                Expanded(
                  flex: 1,
                  child: ListView.separated(
                    itemBuilder: (context, index) {
                      final p = loggedInProfiles[index];
                      final active = service.loggedIn
                          ? p.id == service.currentProfile.id
                          : false;
                      return ListTile(
                        onTap: () async {
                          await service.setActiveProfile(p);
                          if (mounted) {
                            clearCaches();
                            context.goNamed(ScreenPaths.timelines);
                          }
                        },
                        title: Text(
                          p.handle,
                          style: active
                              ? const TextStyle(fontWeight: FontWeight.bold)
                              : null,
                        ),
                        subtitle: Text(p.id),
                      );
                    },
                    separatorBuilder: (_, __) => const Divider(),
                    itemCount: loggedInProfiles.length,
                  ),
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }

  void _signIn(BuildContext context) async {
    if (formKey.currentState?.validate() ?? false) {
      final creds = BasicCredentials(
          username: usernameController.text,
          password: passwordController.text,
          serverName: serverNameController.text);

      final result = await getIt<AccountsService>().signIn(creds);
      if (!mounted) {
        return;
      }
      if (result.isFailure) {
        buildSnackbar(context, 'Error signing in: ${result.error}');
      }
      context.goNamed(ScreenPaths.timelines);
    }
  }
}