feat: Implement notice and file types banners for attire upload and enhance incomplete profile messaging
This commit is contained in:
@@ -10,6 +10,7 @@ import 'package:krow_domain/krow_domain.dart';
|
||||
import 'package:staff_attire/src/presentation/blocs/attire_capture/attire_capture_cubit.dart';
|
||||
import 'package:staff_attire/src/presentation/blocs/attire_capture/attire_capture_state.dart';
|
||||
|
||||
import '../widgets/attire_capture_page/file_types_banner.dart';
|
||||
import '../widgets/attire_capture_page/footer_section.dart';
|
||||
import '../widgets/attire_capture_page/image_preview_section.dart';
|
||||
import '../widgets/attire_capture_page/info_section.dart';
|
||||
@@ -286,7 +287,7 @@ class _AttireCapturePageState extends State<AttireCapturePage> {
|
||||
padding: const EdgeInsets.all(UiConstants.space5),
|
||||
child: Column(
|
||||
children: <Widget>[
|
||||
_FileTypesBanner(
|
||||
FileTypesBanner(
|
||||
message: t
|
||||
.staff_profile_attire
|
||||
.upload_file_types_banner,
|
||||
@@ -335,35 +336,3 @@ class _AttireCapturePageState extends State<AttireCapturePage> {
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
/// Banner displaying accepted file types and size limit for attire upload.
|
||||
class _FileTypesBanner extends StatelessWidget {
|
||||
const _FileTypesBanner({required this.message});
|
||||
|
||||
final String message;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Container(
|
||||
width: double.infinity,
|
||||
padding: const EdgeInsets.symmetric(
|
||||
horizontal: UiConstants.space4,
|
||||
vertical: UiConstants.space3,
|
||||
),
|
||||
decoration: BoxDecoration(
|
||||
color: UiColors.primary.withAlpha(20),
|
||||
borderRadius: BorderRadius.circular(UiConstants.radiusBase),
|
||||
),
|
||||
child: Row(
|
||||
crossAxisAlignment: CrossAxisAlignment.center,
|
||||
children: <Widget>[
|
||||
const Icon(UiIcons.info, size: 20, color: UiColors.primary),
|
||||
const SizedBox(width: UiConstants.space3),
|
||||
Expanded(
|
||||
child: Text(message, style: UiTypography.body2r.textSecondary),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -0,0 +1,36 @@
|
||||
import 'package:design_system/design_system.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
/// Banner displaying accepted file types and size limit for attire upload.
|
||||
class FileTypesBanner extends StatelessWidget {
|
||||
/// Creates a [FileTypesBanner].
|
||||
const FileTypesBanner({super.key, required this.message});
|
||||
|
||||
/// The message to display in the banner.
|
||||
final String message;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Container(
|
||||
width: double.infinity,
|
||||
padding: const EdgeInsets.symmetric(
|
||||
horizontal: UiConstants.space4,
|
||||
vertical: UiConstants.space3,
|
||||
),
|
||||
decoration: BoxDecoration(
|
||||
color: UiColors.primary.withAlpha(20),
|
||||
borderRadius: BorderRadius.circular(UiConstants.radiusBase),
|
||||
),
|
||||
child: Row(
|
||||
crossAxisAlignment: CrossAxisAlignment.center,
|
||||
children: <Widget>[
|
||||
const Icon(UiIcons.info, size: 20, color: UiColors.primary),
|
||||
const SizedBox(width: UiConstants.space3),
|
||||
Expanded(
|
||||
child: Text(message, style: UiTypography.body2r.textSecondary),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -7,35 +7,10 @@ class AttireInfoCard extends StatelessWidget {
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Container(
|
||||
padding: const EdgeInsets.all(UiConstants.space4),
|
||||
decoration: BoxDecoration(
|
||||
color: UiColors.primary.withValues(alpha: 0.08),
|
||||
borderRadius: UiConstants.radiusLg,
|
||||
),
|
||||
child: Row(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: <Widget>[
|
||||
const Icon(UiIcons.shirt, color: UiColors.primary, size: 24),
|
||||
const SizedBox(width: UiConstants.space3),
|
||||
Expanded(
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: <Widget>[
|
||||
Text(
|
||||
t.staff_profile_attire.info_card.title,
|
||||
style: UiTypography.body2m.textPrimary,
|
||||
),
|
||||
const SizedBox(height: 2),
|
||||
Text(
|
||||
t.staff_profile_attire.info_card.description,
|
||||
style: UiTypography.body2r.textSecondary,
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
return UiNoticeBanner(
|
||||
icon: UiIcons.shirt,
|
||||
title: t.staff_profile_attire.info_card.title,
|
||||
description: t.staff_profile_attire.info_card.description,
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,14 +1,13 @@
|
||||
import 'package:core_localization/core_localization.dart';
|
||||
import 'package:design_system/design_system.dart';
|
||||
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:geolocator/geolocator.dart';
|
||||
import 'package:krow_domain/krow_domain.dart';
|
||||
import 'package:core_localization/core_localization.dart';
|
||||
|
||||
import '../../blocs/shifts/shifts_bloc.dart';
|
||||
import '../my_shift_card.dart';
|
||||
import '../shared/empty_state_view.dart';
|
||||
import 'package:geolocator/geolocator.dart';
|
||||
|
||||
class FindShiftsTab extends StatefulWidget {
|
||||
final List<Shift> availableJobs;
|
||||
@@ -316,11 +315,21 @@ class _FindShiftsTabState extends State<FindShiftsTab> {
|
||||
children: [
|
||||
// Incomplete profile banner
|
||||
if (!widget.profileComplete) ...[
|
||||
_IncompleteProfileBanner(
|
||||
title: context.t.staff_shifts.find_shifts.incomplete_profile_banner_title,
|
||||
message: context.t.staff_shifts.find_shifts.incomplete_profile_banner_message,
|
||||
ctaText: context.t.staff_shifts.find_shifts.incomplete_profile_cta,
|
||||
onCtaPressed: () => Modular.to.toProfile(),
|
||||
Container(
|
||||
padding: const EdgeInsets.all(UiConstants.space4),
|
||||
child: UiNoticeBanner(
|
||||
icon: UiIcons.sparkles,
|
||||
title: context
|
||||
.t
|
||||
.staff_shifts
|
||||
.find_shifts
|
||||
.incomplete_profile_banner_title,
|
||||
description: context
|
||||
.t
|
||||
.staff_shifts
|
||||
.find_shifts
|
||||
.incomplete_profile_banner_message,
|
||||
),
|
||||
),
|
||||
],
|
||||
// Search and Filters
|
||||
@@ -462,9 +471,7 @@ class _FindShiftsTabState extends State<FindShiftsTab> {
|
||||
? () {
|
||||
BlocProvider.of<ShiftsBloc>(
|
||||
context,
|
||||
).add(
|
||||
AcceptShiftEvent(shift.id),
|
||||
);
|
||||
).add(AcceptShiftEvent(shift.id));
|
||||
UiSnackbar.show(
|
||||
context,
|
||||
message: context
|
||||
@@ -488,54 +495,3 @@ class _FindShiftsTabState extends State<FindShiftsTab> {
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
/// Banner shown when the worker's profile is incomplete.
|
||||
class _IncompleteProfileBanner extends StatelessWidget {
|
||||
const _IncompleteProfileBanner({
|
||||
required this.title,
|
||||
required this.message,
|
||||
required this.ctaText,
|
||||
required this.onCtaPressed,
|
||||
});
|
||||
|
||||
final String title;
|
||||
final String message;
|
||||
final String ctaText;
|
||||
final VoidCallback onCtaPressed;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Container(
|
||||
width: double.infinity,
|
||||
margin: const EdgeInsets.all(UiConstants.space5),
|
||||
padding: const EdgeInsets.all(UiConstants.space4),
|
||||
decoration: BoxDecoration(
|
||||
color: UiColors.tagPending,
|
||||
borderRadius: BorderRadius.circular(UiConstants.radiusBase),
|
||||
border: Border.all(
|
||||
color: UiColors.textWarning.withValues(alpha: 0.5),
|
||||
),
|
||||
),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: <Widget>[
|
||||
Text(
|
||||
title,
|
||||
style: UiTypography.body2b.textPrimary,
|
||||
),
|
||||
const SizedBox(height: UiConstants.space2),
|
||||
Text(
|
||||
message,
|
||||
style: UiTypography.body3r.textSecondary,
|
||||
),
|
||||
const SizedBox(height: UiConstants.space4),
|
||||
UiButton.primary(
|
||||
text: ctaText,
|
||||
onPressed: onCtaPressed,
|
||||
size: UiButtonSize.small,
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user