softplayer-web/lib/features/authorization/presentation/login_form.dart

import 'dart:developer';

import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:fluttertoast/fluttertoast.dart';
import 'package:softplayer_web/features/authorization/application/authorization_application.dart';
import 'package:softplayer_web/features/authorization/application/sign_in_data.dart';

class LoginForm extends ConsumerStatefulWidget {
  const LoginForm({super.key, required this.toggleAuth});

  final VoidCallback toggleAuth;
  @override
  ConsumerState<LoginForm> createState() => _LoginForm();
}

class _LoginForm extends ConsumerState<LoginForm> {
  final _formKey = GlobalKey<FormState>();

  final TextEditingController emailCtrl = TextEditingController();
  final TextEditingController passwordCtrl = TextEditingController();

  Future<void> _submitForm() async {
    if (_formKey.currentState!.validate()) {
      final email = emailCtrl.text;
      final password = passwordCtrl.text;
      final form = SignInData(email: email, password: password);
      await ref.read(authorizationControllerProvider.notifier).signin(form);
    }
  }

  @override
  Widget build(BuildContext context) {
    final state = ref.watch(authorizationControllerProvider);

    ref.listenManual(authorizationControllerProvider, (previous, next) {
      next.whenOrNull(
        error: (error, stackTrace) {
          log("test");
          Fluttertoast.showToast(
            msg: "Authentication failed",
            toastLength: Toast.LENGTH_LONG,
            gravity: ToastGravity.TOP, // important for web
            webPosition: "right", // 👈 important for web
            webBgColor: "#d32f2f", // required for proper visibility
            timeInSecForIosWeb: 4,
          );
        },
      );
    });
    return LayoutBuilder(
      builder: ((context, constraints) {
        return Stack(
          children: [
            SizedBox(
              width: 400,
              child: Form(
                key: _formKey,
                child: AutofillGroup(
                  child: Column(
                    children: [
                      Container(
                        alignment: Alignment.topLeft,
                        child: SelectableText(
                          "Welcome back!",
                          style: Theme.of(context).textTheme.headlineLarge,
                        ),
                      ),
                      SizedBox(height: 12),
                      Container(
                        alignment: Alignment.topLeft,
                        child: Row(
                          children: [
                            Text(
                              "Don't have an account yet? ",
                              style: Theme.of(context).textTheme.bodyMedium,
                            ),
                            TextButton(
                              onPressed: widget.toggleAuth,
                              style: TextButton.styleFrom(
                                padding: EdgeInsets.zero,
                                minimumSize: Size(0, 0),
                                tapTargetSize: MaterialTapTargetSize.shrinkWrap,
                              ),
                              child: const Text(
                                "Sign up now",
                                style: TextStyle(
                                  decoration: TextDecoration.underline,
                                ),
                              ),
                            ),
                          ],
                        ),
                      ),
                      SizedBox(height: 36),
                      TextFormField(
                        autofillHints: const [
                          AutofillHints.username,
                          AutofillHints.email,
                        ],
                        onFieldSubmitted: (_) => _submitForm(),
                        controller: emailCtrl,
                        decoration: InputDecoration(hintText: "Email address"),
                        validator: (value) {
                          if (value == null || value.isEmpty) {
                            return 'Email is required';
                          }
                          return null;
                        },
                      ),
                      SizedBox(height: 16),
                      TextFormField(
                        onFieldSubmitted: (_) => _submitForm(),
                        autofillHints: const [AutofillHints.password],
                        controller: passwordCtrl,
                        obscureText: true,
                        enabled: !state.isLoading,
                        decoration: InputDecoration(hintText: "Password"),
                        validator: (value) {
                          if (value == null || value.isEmpty) {
                            return 'Password is required';
                          }
                          return null;
                        },
                      ),
                      SizedBox(height: 16),
                      SizedBox(
                        width: double.infinity,
                        child: Text(
                          "Forgot password?",
                          textAlign: TextAlign.left,
                        ),
                      ),
                      ElevatedButton(
                        onPressed: _submitForm,
                        child: const Text('Log in'),
                      ),
                    ],
                  ),
                ),
              ),
            ),
          ],
        );
      }),
    );
  }
}