TF-783 Show toast message and disable login button when no connection internet

lib/features/base/mixin/network_connection_mixin.dart

@@ -15,11 +15,11 @@ mixin NetworkConnectionMixin {
             color: Colors.white,
             borderRadius: BorderRadius.circular(16)),
         width: 320,
-        margin: const EdgeInsets.only(bottom: 100),
+        margin: const EdgeInsets.only(bottom: 150),
         child: Material(
-            elevation: 8,
+            elevation: 2,
             shape:  const RoundedRectangleBorder(
-              borderRadius: BorderRadius.all(Radius.circular(16.0)),
+              borderRadius: BorderRadius.all(Radius.circular(10.0)),
             ),
             child: ListTile(
                 leading: SvgPicture.asset(_imagePaths.icNotConnection),

lib/features/login/presentation/base_login_view.dart

@@ -3,9 +3,9 @@ import 'package:core/presentation/resources/image_paths.dart';
 import 'package:core/presentation/utils/responsive_utils.dart';
 import 'package:core/presentation/views/text/text_builder.dart';
 import 'package:core/presentation/views/text/text_field_builder.dart';
-import 'package:flutter/foundation.dart';
 import 'package:flutter/material.dart';
 import 'package:get/get.dart';
+import 'package:tmail_ui_user/features/base/mixin/network_connection_mixin.dart';
 import 'package:tmail_ui_user/features/login/domain/state/get_oidc_configuration_state.dart';
 import 'package:tmail_ui_user/features/login/domain/state/get_token_oidc_state.dart';
 import 'package:tmail_ui_user/features/login/presentation/login_controller.dart';
@@ -15,7 +15,7 @@ import 'package:tmail_ui_user/features/login/presentation/widgets/login_input_de
 import 'package:tmail_ui_user/features/login/presentation/widgets/login_text_input_builder.dart';
 import 'package:tmail_ui_user/main/localizations/app_localizations.dart';
 
-abstract class BaseLoginView extends GetWidget<LoginController> {
+abstract class BaseLoginView extends GetWidget<LoginController> with NetworkConnectionMixin {
   BaseLoginView({Key? key}) : super(key: key);
 
   final loginController = Get.find<LoginController>();
@@ -71,11 +71,15 @@ abstract class BaseLoginView extends GetWidget<LoginController> {
     return Container(
         margin:  const EdgeInsets.only(bottom: 16, left: 24, right: 24),
         width: responsiveUtils.getDeviceWidth(context),height: 48,
+        child: AbsorbPointer(
+          absorbing: !controller.isNetworkConnectionAvailable(),
           child: ElevatedButton(
               key: const Key('loginSubmitForm'),
               style: ButtonStyle(
                   foregroundColor: MaterialStateProperty.resolveWith<Color>((Set<MaterialState> states) => Colors.white),
-                backgroundColor: MaterialStateProperty.resolveWith<Color>((Set<MaterialState> states) => AppColor.primaryColor),
+                  backgroundColor: MaterialStateProperty.resolveWith<Color>(
+                      (Set<MaterialState> states) => AppColor.primaryColor.withOpacity(
+                          controller.isNetworkConnectionAvailable() ? 1 : 0.5)),
                   shape: MaterialStateProperty.all(RoundedRectangleBorder(
                       borderRadius: BorderRadius.circular(10),
                       side: const BorderSide(width: 0, color: AppColor.primaryColor)
@@ -87,6 +91,7 @@ abstract class BaseLoginView extends GetWidget<LoginController> {
               onPressed: () {
                 loginController.handleLoginPressed();
               }
+          ),
         )
     );
   }

lib/features/login/presentation/login_view.dart

@@ -18,7 +18,8 @@ class LoginView extends BaseLoginView {
   Widget build(BuildContext context) {
     return Scaffold(
       backgroundColor: AppColor.primaryLightColor,
-      body: GestureDetector(
+      body: Stack(children: [
+        GestureDetector(
           onTap: () => FocusScope.of(context).unfocus(),
           child: SafeArea(
             child: _supportScrollForm(context)
@@ -47,7 +48,16 @@ class LoginView extends BaseLoginView {
                 ]
             ),
           ),
-    ));
+        ),
+        Obx(() {
+          if (controller.isNetworkConnectionAvailable()) {
+            return const SizedBox.shrink();
+          }
+          return Align(
+              alignment: Alignment.bottomCenter,
+              child: buildNetworkConnectionWidget(context));
+        }),
+      ]));
   }
 
   Widget _buildCenterForm(BuildContext context) {
@@ -158,11 +168,15 @@ class LoginView extends BaseLoginView {
     return Container(
       margin:  const EdgeInsets.only(bottom: 16, left: 24, right: 24),
       width: responsiveUtils.getDeviceWidth(context),height: 48,
+      child: AbsorbPointer(
+        absorbing: !controller.isNetworkConnectionAvailable(),
         child: ElevatedButton(
           key: const Key('nextToCredentialForm'),
           style: ButtonStyle(
             foregroundColor: MaterialStateProperty.resolveWith<Color>((Set<MaterialState> states) => Colors.white),
-          backgroundColor: MaterialStateProperty.resolveWith<Color>((Set<MaterialState> states) => AppColor.primaryColor),
+            backgroundColor: MaterialStateProperty.resolveWith<Color>(
+              (Set<MaterialState> states) => AppColor.primaryColor.withOpacity(
+                  controller.isNetworkConnectionAvailable() ? 1 : 0.5)),
             shape: MaterialStateProperty.all(RoundedRectangleBorder(
               borderRadius: BorderRadius.circular(10),
               side: const BorderSide(width: 0, color: AppColor.primaryColor)
@@ -174,6 +188,7 @@ class LoginView extends BaseLoginView {
           onPressed: () {
             loginController.handleNextInUrlInputFormPress();
           }
+        ),
       )
     );
   }

lib/features/login/presentation/login_view_web.dart

@@ -15,7 +15,8 @@ class LoginView extends BaseLoginView {
   Widget build(BuildContext context) {
     return Scaffold(
       backgroundColor: AppColor.primaryLightColor,
-      body: SafeArea(
+      body: Stack(children: [
+        SafeArea(
             child: Center(child: SingleChildScrollView(
                 child: ResponsiveWidget(
                   responsiveUtils: responsiveUtils,
@@ -23,6 +24,15 @@ class LoginView extends BaseLoginView {
                   desktop: _buildWebForm(context),
                 )))
         ),
+        Obx(() {
+          if (controller.isNetworkConnectionAvailable()) {
+            return const SizedBox.shrink();
+          }
+          return Align(
+              alignment: Alignment.bottomCenter,
+              child: buildNetworkConnectionWidget(context));
+        }),
+      ]),
     );
   }
 
@@ -269,11 +279,15 @@ class LoginView extends BaseLoginView {
     return Container(
         margin:  const EdgeInsets.only(bottom: 16, left: 24, right: 24),
         width: responsiveUtils.getDeviceWidth(context),height: 48,
+        child: AbsorbPointer(
+          absorbing: !controller.isNetworkConnectionAvailable(),
           child: ElevatedButton(
               key: const Key('ssoSubmitForm'),
               style: ButtonStyle(
                   foregroundColor: MaterialStateProperty.resolveWith<Color>((Set<MaterialState> states) => Colors.white),
-                backgroundColor: MaterialStateProperty.resolveWith<Color>((Set<MaterialState> states) => AppColor.primaryColor),
+                  backgroundColor: MaterialStateProperty.resolveWith<Color>(
+                    (Set<MaterialState> states) => AppColor.primaryColor.withOpacity(
+                        controller.isNetworkConnectionAvailable() ? 1 : 0.5)),
                   shape: MaterialStateProperty.all(RoundedRectangleBorder(
                       borderRadius: BorderRadius.circular(10),
                       side: const BorderSide(width: 0, color: AppColor.primaryColor)
@@ -285,6 +299,7 @@ class LoginView extends BaseLoginView {
               onPressed: () {
                 loginController.handleSSOPressed();
               }
+          ),
         )
     );
   }