From f4135a77d890b86103804b22c962ff108663cc43 Mon Sep 17 00:00:00 2001 From: Vaibhav Surve Date: Wed, 9 Jul 2025 11:53:30 +0530 Subject: [PATCH] feat(login): refactor login option screen to include demo request button and improve layout --- lib/view/auth/email_login_form.dart | 19 +----- lib/view/auth/login_option_screen.dart | 87 +++++++++++++++++--------- 2 files changed, 61 insertions(+), 45 deletions(-) diff --git a/lib/view/auth/email_login_form.dart b/lib/view/auth/email_login_form.dart index 03db388..eff0222 100644 --- a/lib/view/auth/email_login_form.dart +++ b/lib/view/auth/email_login_form.dart @@ -8,7 +8,7 @@ import 'package:marco/helpers/widgets/my_button.dart'; import 'package:marco/helpers/widgets/my_spacing.dart'; import 'package:marco/helpers/widgets/my_text.dart'; import 'package:marco/helpers/widgets/my_text_style.dart'; -import 'package:marco/view/auth/request_demo_bottom_sheet.dart'; + import 'package:marco/helpers/services/api_endpoints.dart'; class EmailLoginForm extends StatefulWidget { @@ -136,22 +136,7 @@ class _EmailLoginFormState extends State with UIMixin { ), ), ), - MySpacing.height(16), - Center( - child: MyButton.text( - onPressed: () { - OrganizationFormBottomSheet.show(context); - }, - elevation: 0, - padding: MySpacing.xy(12, 8), - splashColor: contentTheme.secondary.withAlpha(30), - child: MyText.bodySmall( - "Request a Demo", - color: contentTheme.brandRed, - fontWeight: 600, - ), - ), - ), + ], ), ); diff --git a/lib/view/auth/login_option_screen.dart b/lib/view/auth/login_option_screen.dart index 00e0135..9b25cc3 100644 --- a/lib/view/auth/login_option_screen.dart +++ b/lib/view/auth/login_option_screen.dart @@ -5,6 +5,7 @@ import 'package:marco/images.dart'; import 'package:marco/view/auth/email_login_form.dart'; import 'package:marco/view/auth/otp_login_form.dart'; import 'package:marco/helpers/services/api_endpoints.dart'; +import 'package:marco/view/auth/request_demo_bottom_sheet.dart'; enum LoginOption { email, otp } @@ -26,21 +27,25 @@ class WelcomeScreen extends StatelessWidget { builder: (_) => Dialog( shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(16)), insetPadding: const EdgeInsets.all(24), - child: Padding( - padding: const EdgeInsets.all(24), - child: ConstrainedBox( - constraints: const BoxConstraints(maxWidth: 420), - child: Column( - mainAxisSize: MainAxisSize.min, - children: [ - MyText( - option == LoginOption.email ? "Login with Email" : "Login with OTP", - fontSize: 20, - fontWeight: 700, - ), - const SizedBox(height: 20), - option == LoginOption.email ? EmailLoginForm() : const OTPLoginScreen(), - ], + child: SingleChildScrollView( + child: Padding( + padding: const EdgeInsets.all(24), + child: ConstrainedBox( + constraints: const BoxConstraints(maxWidth: 420), + child: Column( + mainAxisSize: MainAxisSize.min, + children: [ + MyText( + option == LoginOption.email ? "Login with Email" : "Login with OTP", + fontSize: 20, + fontWeight: 700, + ), + const SizedBox(height: 20), + option == LoginOption.email + ? EmailLoginForm() + : const OTPLoginScreen(), + ], + ), ), ), ), @@ -59,17 +64,21 @@ class WelcomeScreen extends StatelessWidget { child: SingleChildScrollView( padding: const EdgeInsets.all(24), child: ConstrainedBox( - constraints: BoxConstraints(maxWidth: screenWidth < 500 ? double.infinity : 420), + constraints: BoxConstraints( + maxWidth: screenWidth < 500 ? double.infinity : 420, + ), child: Column( crossAxisAlignment: CrossAxisAlignment.center, children: [ - // App Logo + // Logo Container( padding: const EdgeInsets.all(16), decoration: BoxDecoration( color: Colors.white, borderRadius: BorderRadius.circular(20), - boxShadow: const [BoxShadow(color: Colors.black26, blurRadius: 8)], + boxShadow: const [ + BoxShadow(color: Colors.black26, blurRadius: 8), + ], ), child: Image.asset(Images.logoDark, height: 60), ), @@ -112,22 +121,27 @@ class WelcomeScreen extends StatelessWidget { const SizedBox(height: 36), // Login Buttons - _buildLoginButton( + _buildActionButton( context, label: "Login with Username", icon: LucideIcons.mail, option: LoginOption.email, ), const SizedBox(height: 16), - _buildLoginButton( + _buildActionButton( context, label: "Login with OTP", icon: LucideIcons.message_square, option: LoginOption.otp, ), - + const SizedBox(height: 16), + _buildActionButton( + context, + label: "Request a Demo", + icon: LucideIcons.phone_call, + option: null, + ), const SizedBox(height: 36), - // Version Info MyText( 'App version 1.0.0', @@ -143,24 +157,41 @@ class WelcomeScreen extends StatelessWidget { ); } - Widget _buildLoginButton(BuildContext context, - {required String label, required IconData icon, required LoginOption option}) { + Widget _buildActionButton( + BuildContext context, { + required String label, + required IconData icon, + LoginOption? option, // nullable for "Request a Demo" + }) { return SizedBox( width: double.infinity, child: ElevatedButton.icon( icon: Icon(icon, size: 20, color: Colors.white), label: Padding( padding: const EdgeInsets.symmetric(vertical: 12), - child: MyText(label, fontSize: 16, fontWeight: 600, color: Colors.white), + child: MyText( + label, + fontSize: 16, + fontWeight: 600, + color: Colors.white, + ), ), style: ElevatedButton.styleFrom( backgroundColor: const Color(0xFFB71C1C), side: const BorderSide(color: Colors.white70), - shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)), + shape: RoundedRectangleBorder( + borderRadius: BorderRadius.circular(12), + ), elevation: 4, ), - onPressed: () => _showLoginDialog(context, option), + onPressed: () { + if (option == null) { + OrganizationFormBottomSheet.show(context); + } else { + _showLoginDialog(context, option); + } + }, ), ); } -} \ No newline at end of file +}