Start writing the web app

Signed-off-by: Nikolai Rodionov <allanger@posteo.com>

lib/features/authorization/presentation/login_form.dart

@@ -0,0 +1,144 @@
+import 'package:flutter/material.dart';
+import 'package:flutter_riverpod/flutter_riverpod.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});
+
+  @override
+  ConsumerState<LoginForm> createState() => _LoginForm();
+}
+
+class _LoginForm extends ConsumerState<LoginForm> {
+  final _formKey = GlobalKey<FormState>();
+
+  final TextEditingController emailCtrl = TextEditingController();
+  final TextEditingController passwordCtrl = TextEditingController();
+
+  void _submitForm() {
+    if (_formKey.currentState!.validate()) {
+      // If valid, you can use the values
+      final email = emailCtrl.text;
+      final password = passwordCtrl.text;
+      final form = SignInData(email: email, password: password);
+      ref.read(authorizationControllerProvider.notifier).signin(form);
+    }
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    final state = ref.watch(authorizationControllerProvider);
+    final controller = ref.read(authorizationControllerProvider.notifier);
+    return SizedBox(
+      width: 400,
+      child: Form(
+        key: _formKey,
+        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: controller.toggleAuthMode,
+                    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(
+              onFieldSubmitted: (_) => _submitForm(),
+              controller: emailCtrl,
+              validator: (value) {
+                if (value == null || value.trim().isEmpty) {
+                  return 'Email is required';
+                }
+                final emailRegex = RegExp(r'^[\w-\.]+@([\w-]+\.)+[\w-]{2,4}$');
+                if (!emailRegex.hasMatch(value.trim())) {
+                  return 'Enter a valid email address';
+                }
+                return null;
+              },
+              decoration: InputDecoration(hintText: "Email address"),
+            ),
+            SizedBox(height: 16),
+            TextFormField(
+              onFieldSubmitted: (_) => _submitForm(),
+              controller: passwordCtrl,
+              validator: (value) {
+                if (value == null || value.isEmpty) {
+                  return 'Password is required';
+                }
+
+                if (value.length < 12) {
+                  return 'Password must be at least 12 characters long';
+                }
+
+                final hasNumber = RegExp(r'\d');
+                final hasSpecialChar = RegExp(
+                  r'[!@#$%^&*(),.?":{}|<>_\-\\[\]\\/+=~`]',
+                );
+
+                if (!hasNumber.hasMatch(value)) {
+                  return 'Password must contain at least one number';
+                }
+
+                if (!hasSpecialChar.hasMatch(value)) {
+                  return 'Password must contain at least one special character';
+                }
+
+                return null;
+              },
+              obscureText: true,
+              decoration: InputDecoration(hintText: "Password"),
+            ),
+            SizedBox(height: 16),
+            SizedBox(
+              width: double.infinity,
+              child: Text("Forgot password?", textAlign: TextAlign.left),
+            ),
+            ElevatedButton(
+              onPressed: _submitForm,
+              child: const Text('Log in'),
+              //  ) {
+              //    if (_formKey.currentState!.validate()) {
+              //      ScaffoldMessenger.of(context).showSnackBar(
+              //        const SnackBar(content: Text('Processing Data')),
+              //      );
+              //    }
+              //    _
+              //  },
+            ),
+            state.when(
+              loading: () => const CircularProgressIndicator(),
+              data: (_) => const SizedBox.shrink(),
+              error: (_, _) => const SizedBox.shrink(),
+            ),
+          ],
+        ),
+      ),
+    );
+  }
+}