feat: impl widgets of MasterPassword screen

CHANGELOG.md

@@ -1,3 +1,8 @@
+# 1.10.0+12
+
+- [Feature] : Implement `UI` of password unlock screen using `fluent_ui` package (#41)
+  - feat: impl widgets of `MasterPassword` screen [#44](https://github.com/pactus-project/pactus-gui/pull/44)
+
 # 1.9.1+11
 
 - [Feature] : CI/CD Integration for Automated Release Builds and Notifications (#50)

assets/translations/en.json

@@ -3,5 +3,6 @@
   "subtitle": "Welcome to Localization",
   "description": "You have pushed the button this many times:",
   "switch_language": "Switch language",
-  "applications": "Applications"
+  "applications": "Applications",
+  "enter_master_password_to_unlock": "Enter the master password to unlock"
 }

assets/translations/es.json

@@ -3,6 +3,7 @@
   "subtitle": "Bienvenido a Localización",
   "description": "Has pulsado el botón tantas veces:",
   "switchLanguage": "Cambiar idioma",
-  "applications": "Applications"
+  "applications": "Applications",
+  "enter_master_password_to_unlock": "Introduzca la contraseña maestra para desbloquear"
 
 }

assets/translations/fr.json

@@ -3,5 +3,7 @@
   "subtitle": "Bienvenue dans Localisation",
   "description": "Vous avez appuyé sur le bouton autant de fois :",
   "switchLanguage": "Changer de langue",
-  "applications": "Applications"
+  "applications": "Applications",
+  "enter_master_password_to_unlock": "Entrez le mot de passe principal pour déverrouiller"
+
 }

lib/src/core/common/colors/app_colors.dart

@@ -4,4 +4,6 @@ class AppColors {
   AppColors._();
   static const primaryDark = Color(0xFF242424);
   static const splashBackground = Color(0xFF00142E);
+  static const primaryGrey = Color(0xFF707070);
+  static const compoundRest = Color(0xFF0F6CBD);
 }

lib/src/core/common/widgets/text_field_wrapper.dart

@@ -0,0 +1,42 @@
+import 'package:fluent_ui/fluent_ui.dart';
+import 'package:flutter/material.dart';
+import 'package:gui/src/core/utils/paltform_detection.dart';
+
+/// [TextFieldWrapper] Documentation
+///
+/// ### Purpose:
+/// A platform-specific wrapper to address accessibility-related issues-
+/// on Linux.
+///
+/// This widget was designed to resolve an issue found on Linux platforms where
+/// selecting a `TextField` or `TextFormField` can cause the app to freeze for
+/// an extended period (20-40 seconds).
+/// It addresses this by conditionally excluding
+/// semantics for wrapped widgets on Linux.
+/// This ensures consistent behavior across different platforms without-
+/// impacting functionality on other operating systems.
+///
+/// ### Behavior:
+/// - **On Linux**: The [child] widget is wrapped with [ExcludeSemantics]
+///   to prevent accessibility-related issues affecting semantics on Linux.
+/// - **On other platforms**: The [child] widget is displayed as-is without-
+///   any changes.
+///
+/// ### Usage:
+/// Use this wrapper around any widget that might be affected by semantic-
+/// accessibility issues specific to Linux, such as `TextFormField`,
+/// `TextField`, or other form-related widgets.
+///
+class TextFieldWrapper extends StatelessWidget {
+  const TextFieldWrapper({super.key, required this.child});
+
+  final Widget child;
+
+  @override
+  Widget build(BuildContext context) {
+    if (Platform.isLinux) {
+      return ExcludeSemantics(child: child);
+    }
+    return child;
+  }
+}

lib/src/core/utils/gen/localization/codegen_loader.g.dart

@@ -19,21 +19,26 @@ class CodegenLoader extends AssetLoader {
     "subtitle": "Bienvenue dans Localisation",
     "description": "Vous avez appuyé sur le bouton autant de fois :",
     "switchLanguage": "Changer de langue",
-    "applications": "Applications"
+    "applications": "Applications",
+    "enter_master_password_to_unlock":
+        "Entrez le mot de passe principal pour déverrouiller"
   };
   static const Map<String, dynamic> es = {
     "title": "¡Hola, Mundo!",
     "subtitle": "Bienvenido a Localización",
     "description": "Has pulsado el botón tantas veces:",
     "switchLanguage": "Cambiar idioma",
-    "applications": "Applications"
+    "applications": "Applications",
+    "enter_master_password_to_unlock":
+        "Introduzca la contraseña maestra para desbloquear"
   };
   static const Map<String, dynamic> en = {
     "title": "Hello, World!",
     "subtitle": "Welcome to Localization",
     "description": "You have pushed the button this many times:",
     "switch_language": "Switch language",
-    "applications": "Applications"
+    "applications": "Applications",
+    "enter_master_password_to_unlock": "Enter the master password to unlock"
   };
   static const Map<String, Map<String, dynamic>> mapLocales = {
     "fr": fr,

lib/src/core/utils/gen/localization/locale_keys.g.dart

@@ -6,4 +6,6 @@ abstract class LocaleKeys {
   static const description = 'description';
   static const switchLanguage = 'switchLanguage';
   static const applications = 'applications';
+  static const enter_master_password_to_unlock =
+      'enter_master_password_to_unlock';
 }

lib/src/core/utils/paltform_detection.dart

@@ -0,0 +1,60 @@
+import 'package:flutter/foundation.dart'
+    show TargetPlatform, defaultTargetPlatform, kIsWeb;
+
+/// Documentation for the [Os] Enum
+/// Enum representing the supported operating systems and platforms.
+///
+/// Used to identify the current runtime platform in a Flutter application.
+enum Os {
+  web,
+  android,
+  ios,
+  macOS,
+  linux,
+  windows,
+  fuchsia,
+}
+
+/// Documentation for the [Platform] class
+/// Utility class for detecting the current platform or operating system.
+///
+/// Provides static properties to determine whether the application is running -
+/// on web, mobile, or desktop platforms.
+///
+class Platform {
+  const Platform._();
+
+  static bool get isWeb => os == Os.web;
+
+  static bool get isAndroid => os == Os.android;
+
+  static bool get isIOS => os == Os.ios;
+
+  static bool get isFuchsia => os == Os.fuchsia;
+
+  static bool get isLinux => os == Os.linux;
+
+  static bool get isMacOS => os == Os.macOS;
+
+  static bool get isWindows => os == Os.windows;
+
+  static bool get isMobile => isAndroid || isIOS;
+
+  static bool get isFullMobile => isMobile || isFuchsia;
+
+  static bool get isDesktop => isLinux || isWindows || isMacOS;
+
+  static Os get os {
+    if (kIsWeb) {
+      return Os.web;
+    }
+    return switch (defaultTargetPlatform) {
+      TargetPlatform.android => Os.android,
+      TargetPlatform.iOS => Os.ios,
+      TargetPlatform.macOS => Os.macOS,
+      TargetPlatform.windows => Os.windows,
+      TargetPlatform.fuchsia => Os.fuchsia,
+      TargetPlatform.linux => Os.linux
+    };
+  }
+}