Skip to content

Commit 158c281

Browse files
committed
feat(content): add loading state to source dropdowns
Refactors the create source page to conditionally disable the language and country dropdowns while their respective full lists are being fetched in the background. This aligns the UI behavior with the create/edit headline pages, providing a better user experience by preventing interaction with incomplete data.
1 parent 37a5791 commit 158c281

File tree

1 file changed

+70
-49
lines changed

1 file changed

+70
-49
lines changed

lib/content_management/view/create_source_page.dart

Lines changed: 70 additions & 49 deletions
Original file line numberDiff line numberDiff line change
@@ -168,24 +168,35 @@ class _CreateSourceViewState extends State<_CreateSourceView> {
168168
.add(CreateSourceUrlChanged(value)),
169169
),
170170
const SizedBox(height: AppSpacing.lg),
171-
DropdownButtonFormField<Language?>(
172-
value: state.language,
173-
decoration: InputDecoration(
174-
labelText: l10n.language,
175-
border: const OutlineInputBorder(),
176-
),
177-
items: [
178-
DropdownMenuItem(value: null, child: Text(l10n.none)),
179-
...state.languages.map(
180-
(language) => DropdownMenuItem(
181-
value: language,
182-
child: Text(language.name),
171+
BlocBuilder<ContentManagementBloc, ContentManagementState>(
172+
builder: (context, contentState) {
173+
final isLoading = contentState.allLanguagesStatus ==
174+
ContentManagementStatus.loading;
175+
return DropdownButtonFormField<Language?>(
176+
value: state.language,
177+
decoration: InputDecoration(
178+
labelText: l10n.language,
179+
border: const OutlineInputBorder(),
180+
helperText:
181+
isLoading ? l10n.loadingFullList : null,
183182
),
184-
),
185-
],
186-
onChanged: (value) => context
187-
.read<CreateSourceBloc>()
188-
.add(CreateSourceLanguageChanged(value)),
183+
items: [
184+
DropdownMenuItem(
185+
value: null, child: Text(l10n.none)),
186+
...state.languages.map(
187+
(language) => DropdownMenuItem(
188+
value: language,
189+
child: Text(language.name),
190+
),
191+
),
192+
],
193+
onChanged: isLoading
194+
? null
195+
: (value) => context
196+
.read<CreateSourceBloc>()
197+
.add(CreateSourceLanguageChanged(value)),
198+
);
199+
},
189200
),
190201
const SizedBox(height: AppSpacing.lg),
191202
DropdownButtonFormField<SourceType?>(
@@ -208,40 +219,50 @@ class _CreateSourceViewState extends State<_CreateSourceView> {
208219
.add(CreateSourceTypeChanged(value)),
209220
),
210221
const SizedBox(height: AppSpacing.lg),
211-
DropdownButtonFormField<Country?>(
212-
value: state.headquarters,
213-
decoration: InputDecoration(
214-
labelText: l10n.headquarters,
215-
border: const OutlineInputBorder(),
216-
),
217-
items: [
218-
DropdownMenuItem(value: null, child: Text(l10n.none)),
219-
...state.countries.map(
220-
(country) => DropdownMenuItem(
221-
value: country,
222-
child: Row(
223-
children: [
224-
SizedBox(
225-
width: 32,
226-
height: 20,
227-
child: Image.network(
228-
country.flagUrl,
229-
fit: BoxFit.cover,
230-
errorBuilder:
231-
(context, error, stackTrace) =>
232-
const Icon(Icons.flag),
233-
),
222+
BlocBuilder<ContentManagementBloc, ContentManagementState>(
223+
builder: (context, contentState) {
224+
final isLoading = contentState.allCountriesStatus ==
225+
ContentManagementStatus.loading;
226+
return DropdownButtonFormField<Country?>(
227+
value: state.headquarters,
228+
decoration: InputDecoration(
229+
labelText: l10n.headquarters,
230+
border: const OutlineInputBorder(),
231+
helperText:
232+
isLoading ? l10n.loadingFullList : null,
233+
),
234+
items: [
235+
DropdownMenuItem(
236+
value: null, child: Text(l10n.none)),
237+
...state.countries.map(
238+
(country) => DropdownMenuItem(
239+
value: country,
240+
child: Row(
241+
children: [
242+
SizedBox(
243+
width: 32,
244+
height: 20,
245+
child: Image.network(
246+
country.flagUrl,
247+
fit: BoxFit.cover,
248+
errorBuilder:
249+
(context, error, stackTrace) =>
250+
const Icon(Icons.flag),
251+
),
252+
),
253+
const SizedBox(width: AppSpacing.md),
254+
Text(country.name),
255+
],
234256
),
235-
const SizedBox(width: AppSpacing.md),
236-
Text(country.name),
237-
],
257+
),
238258
),
239-
),
240-
),
241-
],
242-
onChanged: (value) => context
243-
.read<CreateSourceBloc>()
244-
.add(CreateSourceHeadquartersChanged(value)),
259+
],
260+
onChanged: isLoading
261+
? null
262+
: (value) => context.read<CreateSourceBloc>().add(
263+
CreateSourceHeadquartersChanged(value)),
264+
);
265+
},
245266
),
246267
const SizedBox(height: AppSpacing.lg),
247268
DropdownButtonFormField<ContentStatus>(

0 commit comments

Comments
 (0)