Krow/Krow-workspace
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Refactor onboarding experience and personal info pages

Browse Source 
- Updated ExperiencePage to include subtitles in ExperienceSectionTitle.
- Modified ExperienceSectionTitle widget to accept an optional subtitle parameter.
- Refactored PersonalInfoPage to improve imports and structure.
- Removed unused PersonalInfoContent and PersonalInfoForm widgets.
- Introduced new widgets: EditableField, FieldLabel, ReadOnlyField, TappableRow, and LanguageSelector for better modularity.
- Added AccountCard and SecurityNotice widgets for bank account section.
- Enhanced SaveButton to utilize UiButton for consistency.
This commit is contained in:
Achintha Isuru
2026-03-01 03:06:28 -05:00
parent ea6b3fcc76
commit 015f1fbc1b
18 changed files with 562 additions and 530 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
apps/mobile/packages/features/staff/profile_sections/onboarding/experience/lib/src/presentation/pages/experience_page.dart
View File

@@ -116,10 +116,9 @@ class ExperiencePage extends StatelessWidget {
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
ExperienceSectionTitle(title: i18n.industries_title),
Text(
i18n.industries_subtitle,
style: UiTypography.body2m.textSecondary,
ExperienceSectionTitle(
title: i18n.industries_title,
subtitle: i18n.industries_subtitle,
),
const SizedBox(height: UiConstants.space3),
Wrap(
@@ -142,11 +141,10 @@ class ExperiencePage extends StatelessWidget {
)
.toList(),
),
const SizedBox(height: UiConstants.space6),
ExperienceSectionTitle(title: i18n.skills_title),
Text(
i18n.skills_subtitle,
style: UiTypography.body2m.textSecondary,
const SizedBox(height: UiConstants.space10),
ExperienceSectionTitle(
title: i18n.skills_title,
subtitle: i18n.skills_subtitle,
),
const SizedBox(height: UiConstants.space3),
Wrap(

26
apps/mobile/packages/features/staff/profile_sections/onboarding/experience/lib/src/presentation/widgets/experience_section_title.dart
View File

@@ -3,17 +3,31 @@ import 'package:flutter/material.dart';
class ExperienceSectionTitle extends StatelessWidget {
final String title;
const ExperienceSectionTitle({super.key, required this.title});
final String? subtitle;
const ExperienceSectionTitle({
super.key,
required this.title,
this.subtitle,
});
@override
Widget build(BuildContext context) {
return Padding(
padding: EdgeInsets.only(bottom: UiConstants.space2),
child: Text(
title,
style: UiTypography.title2m.copyWith(
color: UiColors.textPrimary,
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
title,
style: UiTypography.title2m,
),
if (subtitle != null) ...[
Text(
subtitle!,
style: UiTypography.body2r.textSecondary,
),
],
],
),
);
}

6
apps/mobile/packages/features/staff/profile_sections/onboarding/profile_info/lib/src/presentation/pages/personal_info_page.dart
View File

@@ -4,10 +4,10 @@ import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:flutter_modular/flutter_modular.dart';
import 'package:krow_core/core.dart';
import 'package:staff_profile_info/src/presentation/blocs/personal_info_bloc.dart';
import 'package:staff_profile_info/src/presentation/blocs/personal_info_state.dart';
import 'package:staff_profile_info/src/presentation/widgets/personal_info_page/personal_info_content.dart';
import '../blocs/personal_info_bloc.dart';
import '../blocs/personal_info_state.dart';
import '../widgets/personal_info_content.dart';
/// The Personal Info page for staff onboarding.
///

293
apps/mobile/packages/features/staff/profile_sections/onboarding/profile_info/lib/src/presentation/widgets/personal_info_form.dart
View File

@@ -1,293 +0,0 @@
import 'package:flutter/material.dart';
import 'package:core_localization/core_localization.dart';
import 'package:design_system/design_system.dart';
import 'package:flutter_modular/flutter_modular.dart';
import 'package:krow_core/core.dart';
/// A form widget containing all personal information fields.
///
/// Includes read-only fields for full name,
/// and editable fields for email and phone.
/// The Preferred Locations row navigates to a dedicated Uber-style page.
/// Uses only design system tokens for colors, typography, and spacing.
class PersonalInfoForm extends StatelessWidget {
/// Creates a [PersonalInfoForm].
const PersonalInfoForm({
super.key,
required this.fullName,
required this.email,
required this.emailController,
required this.phoneController,
required this.currentLocations,
this.enabled = true,
});
/// The staff member's full name (read-only).
final String fullName;
/// The staff member's email (read-only).
final String email;
/// Controller for the email field.
final TextEditingController emailController;
/// Controller for the phone number field.
final TextEditingController phoneController;
/// Current preferred locations list to show in the summary row.
final List<String> currentLocations;
/// Whether the form fields are enabled for editing.
final bool enabled;
@override
Widget build(BuildContext context) {
final TranslationsStaffOnboardingPersonalInfoEn i18n =
t.staff.onboarding.personal_info;
final String locationSummary = currentLocations.isEmpty
? i18n.locations_summary_none
: currentLocations.join(', ');
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
_FieldLabel(text: i18n.full_name_label),
const SizedBox(height: UiConstants.space2),
_ReadOnlyField(value: fullName),
const SizedBox(height: UiConstants.space4),
_FieldLabel(text: i18n.email_label),
const SizedBox(height: UiConstants.space2),
_EditableField(
controller: emailController,
hint: i18n.email_label,
enabled: enabled,
keyboardType: TextInputType.emailAddress,
autofillHints: const <String>[AutofillHints.email],
),
const SizedBox(height: UiConstants.space4),
_FieldLabel(text: i18n.phone_label),
const SizedBox(height: UiConstants.space2),
_EditableField(
controller: phoneController,
hint: i18n.phone_hint,
enabled: enabled,
keyboardType: TextInputType.phone,
),
const SizedBox(height: UiConstants.space4),
_FieldLabel(text: i18n.locations_label),
const SizedBox(height: UiConstants.space2),
// Uber-style tappable row → navigates to PreferredLocationsPage
_TappableRow(
value: locationSummary,
hint: i18n.locations_hint,
icon: UiIcons.mapPin,
enabled: enabled,
onTap: enabled ? () => Modular.to.toPreferredLocations() : null,
),
const SizedBox(height: UiConstants.space4),
const _FieldLabel(text: 'Language'),
const SizedBox(height: UiConstants.space2),
_LanguageSelector(enabled: enabled),
],
);
}
}
/// An Uber-style tappable row for navigating to a sub-page editor.
/// Displays the current value (or hint if empty) and a chevron arrow.
class _TappableRow extends StatelessWidget {
const _TappableRow({
required this.value,
required this.hint,
required this.icon,
this.onTap,
this.enabled = true,
});
final String value;
final String hint;
final IconData icon;
final VoidCallback? onTap;
final bool enabled;
@override
Widget build(BuildContext context) {
final bool hasValue = value.isNotEmpty;
return GestureDetector(
onTap: enabled ? onTap : null,
child: Container(
width: double.infinity,
padding: const EdgeInsets.symmetric(
horizontal: UiConstants.space3,
vertical: UiConstants.space3,
),
decoration: BoxDecoration(
color: enabled ? UiColors.bgPopup : UiColors.bgSecondary,
borderRadius: BorderRadius.circular(UiConstants.radiusMdValue),
border: Border.all(
color: enabled
? UiColors.border
: UiColors.border.withValues(alpha: 0.5),
),
),
child: Row(
children: <Widget>[
Icon(icon, size: 18, color: UiColors.iconSecondary),
const SizedBox(width: UiConstants.space2),
Expanded(
child: Text(
hasValue ? value : hint,
style: hasValue
? UiTypography.body2r.textPrimary
: UiTypography.body2r.textSecondary,
maxLines: 1,
overflow: TextOverflow.ellipsis,
),
),
if (enabled)
const Icon(
UiIcons.chevronRight,
size: 18,
color: UiColors.iconSecondary,
),
],
),
),
);
}
}
/// A language selector widget that displays the current language and navigates to language selection page.
class _LanguageSelector extends StatelessWidget {
const _LanguageSelector({this.enabled = true});
final bool enabled;
@override
Widget build(BuildContext context) {
final String currentLocale = Localizations.localeOf(context).languageCode;
final String languageName = currentLocale == 'es' ? 'Español' : 'English';
return GestureDetector(
onTap: enabled ? () => Modular.to.toLanguageSelection() : null,
child: Container(
padding: const EdgeInsets.symmetric(
horizontal: UiConstants.space3,
vertical: UiConstants.space3,
),
decoration: BoxDecoration(
color: enabled ? UiColors.bgPopup : UiColors.bgSecondary,
borderRadius: BorderRadius.circular(UiConstants.radiusMdValue),
border: Border.all(
color: enabled
? UiColors.border
: UiColors.border.withValues(alpha: 0.5),
),
),
child: Row(
children: <Widget>[
const Icon(
UiIcons.settings,
size: 18,
color: UiColors.iconSecondary,
),
const SizedBox(width: UiConstants.space3),
Expanded(
child: Text(languageName, style: UiTypography.body2r.textPrimary),
),
if (enabled)
const Icon(
UiIcons.chevronRight,
size: 18,
color: UiColors.iconSecondary,
),
],
),
),
);
}
}
class _FieldLabel extends StatelessWidget {
const _FieldLabel({required this.text});
final String text;
@override
Widget build(BuildContext context) {
return Text(text, style: UiTypography.titleUppercase3m.textSecondary);
}
}
class _ReadOnlyField extends StatelessWidget {
const _ReadOnlyField({required this.value});
final String value;
@override
Widget build(BuildContext context) {
return Container(
width: double.infinity,
padding: const EdgeInsets.symmetric(
horizontal: UiConstants.space3,
vertical: UiConstants.space3,
),
decoration: BoxDecoration(
color: UiColors.bgSecondary,
borderRadius: BorderRadius.circular(UiConstants.radiusMdValue),
border: Border.all(color: UiColors.border),
),
child: Text(value, style: UiTypography.body2r.textInactive),
);
}
}
class _EditableField extends StatelessWidget {
const _EditableField({
required this.controller,
required this.hint,
this.enabled = true,
this.keyboardType,
this.autofillHints,
});
final TextEditingController controller;
final String hint;
final bool enabled;
final TextInputType? keyboardType;
final Iterable<String>? autofillHints;
@override
Widget build(BuildContext context) {
return TextField(
controller: controller,
enabled: enabled,
keyboardType: keyboardType,
autofillHints: autofillHints,
style: UiTypography.body2r.textPrimary,
decoration: InputDecoration(
hintText: hint,
hintStyle: UiTypography.body2r.textSecondary,
contentPadding: const EdgeInsets.symmetric(
horizontal: UiConstants.space3,
vertical: UiConstants.space3,
),
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(UiConstants.radiusMdValue),
borderSide: const BorderSide(color: UiColors.border),
),
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(UiConstants.radiusMdValue),
borderSide: const BorderSide(color: UiColors.border),
),
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(UiConstants.radiusMdValue),
borderSide: const BorderSide(color: UiColors.primary),
),
fillColor: enabled ? UiColors.bgPopup : UiColors.bgSecondary,
filled: true,
),
);
}
}

63
apps/mobile/packages/features/staff/profile_sections/onboarding/profile_info/lib/src/presentation/widgets/personal_info_page/editable_field.dart Normal file
View File

@@ -0,0 +1,63 @@
import 'package:design_system/design_system.dart';
import 'package:flutter/material.dart';
/// An editable text field widget.
class EditableField extends StatelessWidget {
/// Creates an [EditableField].
const EditableField({
super.key,
required this.controller,
required this.hint,
this.enabled = true,
this.keyboardType,
this.autofillHints,
});
/// The text editing controller.
final TextEditingController controller;
/// The hint text to display when empty.
final String hint;
/// Whether the field is enabled for editing.
final bool enabled;
/// The keyboard type for the field.
final TextInputType? keyboardType;
/// Autofill hints for the field.
final Iterable<String>? autofillHints;
@override
Widget build(BuildContext context) {
return TextField(
controller: controller,
enabled: enabled,
keyboardType: keyboardType,
autofillHints: autofillHints,
style: UiTypography.body2r.textPrimary,
decoration: InputDecoration(
hintText: hint,
hintStyle: UiTypography.body2r.textSecondary,
contentPadding: const EdgeInsets.symmetric(
horizontal: UiConstants.space3,
vertical: UiConstants.space3,
),
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(UiConstants.radiusMdValue),
borderSide: const BorderSide(color: UiColors.border),
),
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(UiConstants.radiusMdValue),
borderSide: const BorderSide(color: UiColors.border),
),
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(UiConstants.radiusMdValue),
borderSide: const BorderSide(color: UiColors.primary),
),
fillColor: enabled ? UiColors.bgPopup : UiColors.bgSecondary,
filled: true,
),
);
}
}

16
apps/mobile/packages/features/staff/profile_sections/onboarding/profile_info/lib/src/presentation/widgets/personal_info_page/field_label.dart Normal file
View File

@@ -0,0 +1,16 @@
import 'package:design_system/design_system.dart';
import 'package:flutter/material.dart';
/// A label widget for form fields.
class FieldLabel extends StatelessWidget {
/// Creates a [FieldLabel].
const FieldLabel({super.key, required this.text});
/// The label text to display.
final String text;
@override
Widget build(BuildContext context) {
return Text(text, style: UiTypography.titleUppercase2b.textSecondary);
}
}

54
apps/mobile/packages/features/staff/profile_sections/onboarding/profile_info/lib/src/presentation/widgets/personal_info_page/language_selector.dart Normal file
View File

@@ -0,0 +1,54 @@
import 'package:design_system/design_system.dart';
import 'package:flutter/material.dart';
import 'package:flutter_modular/flutter_modular.dart';
import 'package:krow_core/core.dart';
import 'package:staff_profile_info/src/presentation/widgets/personal_info_page/field_label.dart';
/// A language selector widget that displays the current language and navigates to language selection page.
class LanguageSelector extends StatelessWidget {
/// Creates a [LanguageSelector].
const LanguageSelector({super.key, this.enabled = true});
/// Whether the selector is enabled for interaction.
final bool enabled;
@override
Widget build(BuildContext context) {
final String currentLocale = Localizations.localeOf(context).languageCode;
final String languageName = currentLocale == 'es' ? 'Español' : 'English';
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
spacing: UiConstants.space3,
children: [
const FieldLabel(text: 'Language'),
GestureDetector(
onTap: enabled ? () => Modular.to.toLanguageSelection() : null,
child: Row(
children: <Widget>[
const Icon(
UiIcons.settings,
size: 18,
color: UiColors.iconSecondary,
),
const SizedBox(width: UiConstants.space3),
Expanded(
child: Text(
languageName,
style: UiTypography.body2r.textPrimary,
),
),
if (enabled)
const Icon(
UiIcons.chevronRight,
size: 16,
color: UiColors.iconSecondary,
),
],
),
),
],
);
}
}

14
apps/mobile/packages/features/staff/profile_sections/onboarding/profile_info/lib/src/presentation/widgets/personal_info_content.dart → apps/mobile/packages/features/staff/profile_sections/onboarding/profile_info/lib/src/presentation/widgets/personal_info_page/personal_info_content.dart
View File

@@ -3,14 +3,12 @@ import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:core_localization/core_localization.dart';
import 'package:design_system/design_system.dart';
import 'package:krow_domain/krow_domain.dart';
import '../blocs/personal_info_bloc.dart';
import '../blocs/personal_info_event.dart';
import '../blocs/personal_info_state.dart';
import 'profile_photo_widget.dart';
import 'personal_info_form.dart';
import 'save_button.dart';
import 'package:staff_profile_info/src/presentation/blocs/personal_info_bloc.dart';
import 'package:staff_profile_info/src/presentation/blocs/personal_info_event.dart';
import 'package:staff_profile_info/src/presentation/blocs/personal_info_state.dart';
import 'package:staff_profile_info/src/presentation/widgets/personal_info_page/personal_info_form.dart';
import 'package:staff_profile_info/src/presentation/widgets/profile_photo_widget.dart';
import 'package:staff_profile_info/src/presentation/widgets/save_button.dart';
/// Content widget that displays and manages the staff profile form.
///

99
apps/mobile/packages/features/staff/profile_sections/onboarding/profile_info/lib/src/presentation/widgets/personal_info_page/personal_info_form.dart Normal file
View File

@@ -0,0 +1,99 @@
import 'package:flutter/material.dart';
import 'package:core_localization/core_localization.dart';
import 'package:design_system/design_system.dart';
import 'package:flutter_modular/flutter_modular.dart';
import 'package:krow_core/core.dart';
import 'package:staff_profile_info/src/presentation/widgets/personal_info_page/editable_field.dart';
import 'package:staff_profile_info/src/presentation/widgets/personal_info_page/field_label.dart';
import 'package:staff_profile_info/src/presentation/widgets/personal_info_page/language_selector.dart';
import 'package:staff_profile_info/src/presentation/widgets/personal_info_page/read_only_field.dart';
import 'package:staff_profile_info/src/presentation/widgets/personal_info_page/tappable_row.dart';
/// A form widget containing all personal information fields.
///
/// Includes read-only fields for full name,
/// and editable fields for email and phone.
/// The Preferred Locations row navigates to a dedicated Uber-style page.
/// Uses only design system tokens for colors, typography, and spacing.
class PersonalInfoForm extends StatelessWidget {
/// Creates a [PersonalInfoForm].
const PersonalInfoForm({
super.key,
required this.fullName,
required this.email,
required this.emailController,
required this.phoneController,
required this.currentLocations,
this.enabled = true,
});
/// The staff member's full name (read-only).
final String fullName;
/// The staff member's email (read-only).
final String email;
/// Controller for the email field.
final TextEditingController emailController;
/// Controller for the phone number field.
final TextEditingController phoneController;
/// Current preferred locations list to show in the summary row.
final List<String> currentLocations;
/// Whether the form fields are enabled for editing.
final bool enabled;
@override
Widget build(BuildContext context) {
final TranslationsStaffOnboardingPersonalInfoEn i18n =
t.staff.onboarding.personal_info;
final String locationSummary = currentLocations.isEmpty
? i18n.locations_summary_none
: currentLocations.join(', ');
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
FieldLabel(text: i18n.full_name_label),
const SizedBox(height: UiConstants.space2),
ReadOnlyField(value: fullName),
const SizedBox(height: UiConstants.space4),
FieldLabel(text: i18n.email_label),
const SizedBox(height: UiConstants.space2),
EditableField(
controller: emailController,
hint: i18n.email_label,
enabled: enabled,
keyboardType: TextInputType.emailAddress,
autofillHints: const <String>[AutofillHints.email],
),
const SizedBox(height: UiConstants.space4),
FieldLabel(text: i18n.phone_label),
const SizedBox(height: UiConstants.space2),
EditableField(
controller: phoneController,
hint: i18n.phone_hint,
enabled: enabled,
keyboardType: TextInputType.phone,
),
const SizedBox(height: UiConstants.space4),
TappableRow(
value: locationSummary,
hint: i18n.locations_hint,
icon: UiIcons.mapPin,
enabled: enabled,
onTap: enabled ? () => Modular.to.toPreferredLocations() : null,
),
const SizedBox(height: UiConstants.space6),
const Divider(),
const SizedBox(height: UiConstants.space6),
LanguageSelector(enabled: enabled),
],
);
}
}

28
apps/mobile/packages/features/staff/profile_sections/onboarding/profile_info/lib/src/presentation/widgets/personal_info_page/read_only_field.dart Normal file
View File

@@ -0,0 +1,28 @@
import 'package:design_system/design_system.dart';
import 'package:flutter/material.dart';
/// A read-only text field widget.
class ReadOnlyField extends StatelessWidget {
/// Creates a [ReadOnlyField].
const ReadOnlyField({super.key, required this.value});
/// The value to display.
final String value;
@override
Widget build(BuildContext context) {
return Container(
width: double.infinity,
padding: const EdgeInsets.symmetric(
horizontal: UiConstants.space3,
vertical: UiConstants.space3,
),
decoration: BoxDecoration(
color: UiColors.bgSecondary,
borderRadius: BorderRadius.circular(UiConstants.radiusMdValue),
border: Border.all(color: UiColors.border),
),
child: Text(value, style: UiTypography.body2r.textInactive),
);
}
}

75
apps/mobile/packages/features/staff/profile_sections/onboarding/profile_info/lib/src/presentation/widgets/personal_info_page/tappable_row.dart Normal file
View File

@@ -0,0 +1,75 @@
import 'package:core_localization/core_localization.dart';
import 'package:design_system/design_system.dart';
import 'package:flutter/material.dart';
import 'package:staff_profile_info/src/presentation/widgets/personal_info_page/field_label.dart';
/// An Uber-style tappable row for navigating to a sub-page editor.
/// Displays the current value (or hint if empty) and a chevron arrow.
class TappableRow extends StatelessWidget {
/// Creates a [TappableRow].
const TappableRow({
super.key,
required this.value,
required this.hint,
required this.icon,
this.onTap,
this.enabled = true,
});
/// The current value to display.
final String value;
/// The hint text to display when value is empty.
final String hint;
/// The icon to display on the left.
final IconData icon;
/// Callback when the row is tapped.
final VoidCallback? onTap;
/// Whether the row is enabled for tapping.
final bool enabled;
@override
Widget build(BuildContext context) {
final bool hasValue = value.isNotEmpty;
final TranslationsStaffOnboardingPersonalInfoEn i18n =
t.staff.onboarding.personal_info;
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
spacing: UiConstants.space3,
children: [
FieldLabel(text: i18n.locations_label),
GestureDetector(
onTap: enabled ? onTap : null,
child: Container(
width: double.infinity,
child: Row(
children: <Widget>[
Icon(icon, size: 18, color: UiColors.iconSecondary),
const SizedBox(width: UiConstants.space2),
Expanded(
child: Text(
hasValue ? value : hint,
style: hasValue
? UiTypography.body2r.textPrimary
: UiTypography.body2r.textSecondary,
maxLines: 1,
overflow: TextOverflow.ellipsis,
),
),
if (enabled)
const Icon(
UiIcons.chevronRight,
size: 16,
color: UiColors.iconSecondary,
),
],
),
),
),
],
);
}
}

46
apps/mobile/packages/features/staff/profile_sections/onboarding/profile_info/lib/src/presentation/widgets/save_button.dart
View File

@@ -1,5 +1,5 @@
import 'package:flutter/material.dart';
import 'package:design_system/design_system.dart';
import 'package:flutter/material.dart';
/// A save button widget for the bottom of the personal info page.
@@ -31,47 +31,15 @@ class SaveButton extends StatelessWidget {
decoration: const BoxDecoration(
color: UiColors.bgPopup,
border: Border(
top: BorderSide(color: UiColors.border),
top: BorderSide(color: UiColors.border, width: 0.5),
),
),
child: SafeArea(
child: SizedBox(
width: double.infinity,
height: 48,
child: ElevatedButton(
onPressed: onPressed,
style: ElevatedButton.styleFrom(
backgroundColor: UiColors.primary,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(UiConstants.radiusMdValue),
),
elevation: 0,
),
child: isLoading
? const SizedBox(
width: 20,
height: 20,
child: CircularProgressIndicator(
strokeWidth: 2,
valueColor: AlwaysStoppedAnimation<Color>(
UiColors.bgPopup,
),
),
)
: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
const Icon(UiIcons.check, color: UiColors.bgPopup, size: 20),
const SizedBox(width: UiConstants.space2),
Text(
label,
style: UiTypography.body1m.copyWith(
color: UiColors.bgPopup,
),
),
],
),
),
child: UiButton.primary(
fullWidth: true,
onPressed: onPressed,
text: label,
isLoading: isLoading,
),
),
);