chore: add flag on phone input and handle select countries screen ope…

…ning
ice-blockchain · Dec 21, 2023 · 8f35259 · 8f35259
1 parent 307ae74
commit 8f35259
Show file tree

Hide file tree

Showing 2 changed files with 44 additions and 3 deletions.
diff --git a/lib/app/features/auth/views/pages/auth_page/auth_page.dart b/lib/app/features/auth/views/pages/auth_page/auth_page.dart
@@ -8,6 +8,9 @@ import 'package:ice/app/features/auth/providers/auth_provider.dart';
 import 'package:ice/app/features/auth/providers/ui_auth_provider.dart';
 import 'package:ice/app/features/auth/views/pages/auth_page/controllers/email_controller.dart';
 import 'package:ice/app/features/auth/views/pages/auth_page/controllers/phone_number_controller.dart';
+import 'package:ice/app/features/auth/views/pages/auth_page/widgets/country_code_input.dart';
+import 'package:ice/app/features/auth/views/pages/select_country/countries.dart';
+import 'package:ice/app/features/auth/views/pages/select_country/select_country.dart';
 import 'package:ice/app/shared/widgets/auth_header/auth_header.dart';
 import 'package:ice/app/shared/widgets/button/button.dart';
 import 'package:ice/app/shared/widgets/inputs/text_fields.dart';
@@ -66,9 +69,12 @@ class AuthPage extends HookConsumerWidget {
               ),
             if (!isEmailMode)
               InputField(
-                leadingIcon: Image.asset(
-                  Assets.images.fieldEmail.path,
-                  color: context.theme.appColors.primaryText,
+                leadingIcon: CountryCodeInput(
+                  country: countries[1],
+                  onTap: () => showModalScreen(
+                    const SelectCountries(),
+                    context,
+                  ),
                 ),
                 label: 'Phone number',
                 controller: numberController.controller,

diff --git a/lib/app/features/auth/views/pages/auth_page/widgets/country_code_input.dart b/lib/app/features/auth/views/pages/auth_page/widgets/country_code_input.dart
@@ -0,0 +1,35 @@
+import 'package:flutter/material.dart';
+import 'package:ice/app/extensions/build_context.dart';
+import 'package:ice/app/extensions/theme_data.dart';
+import 'package:ice/app/features/auth/views/pages/select_country/countries.dart';
+import 'package:ice/generated/assets.gen.dart';
+
+class CountryCodeInput extends StatelessWidget {
+  const CountryCodeInput({super.key, required this.country, this.onTap});
+
+  final Country country;
+  final VoidCallback? onTap;
+
+  @override
+  Widget build(BuildContext context) {
+    return GestureDetector(
+      onTap: onTap,
+      child: Row(
+        mainAxisSize: MainAxisSize.min,
+        children: <Widget>[
+          Text(
+            country.flag,
+            style: const TextStyle(fontSize: 30),
+          ),
+          const SizedBox(width: 8),
+          Image.asset(
+            Assets.images.loginDropdown.path,
+            color: context.theme.appColors.secondaryText,
+            width: 15,
+            height: 15,
+          ),
+        ],
+      ),
+    );
+  }
+}