diff --git a/frontend/lib/providers/name_of_selected_stage.dart b/frontend/lib/providers/name_of_selected_stage.dart index 37b272d7..d879a65e 100644 --- a/frontend/lib/providers/name_of_selected_stage.dart +++ b/frontend/lib/providers/name_of_selected_stage.dart @@ -4,5 +4,5 @@ part 'name_of_selected_stage.g.dart'; @riverpod String nameOfSelectedStage(NameOfSelectedStageRef ref) { - throw Exception('No stage selected yet'); + throw Exception('Name of selected stage not set yet'); } diff --git a/frontend/lib/providers/names_of_stages.dart b/frontend/lib/providers/names_of_stages.dart new file mode 100644 index 00000000..58cc886c --- /dev/null +++ b/frontend/lib/providers/names_of_stages.dart @@ -0,0 +1,8 @@ +import 'package:riverpod_annotation/riverpod_annotation.dart'; + +part 'names_of_stages.g.dart'; + +@riverpod +List namesOfStages(NamesOfStagesRef ref) { + throw Exception('Names of stages not set yet'); +} diff --git a/frontend/lib/ui/dashboard/artefact_dialog.dart b/frontend/lib/ui/dashboard/artefact_dialog.dart index fa3b07d7..5931a0ea 100644 --- a/frontend/lib/ui/dashboard/artefact_dialog.dart +++ b/frontend/lib/ui/dashboard/artefact_dialog.dart @@ -3,6 +3,7 @@ import 'dart:math'; import 'package:flutter/material.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:intersperse/intersperse.dart'; +import 'package:yaru/yaru.dart'; import 'package:yaru_icons/yaru_icons.dart'; import 'package:yaru_widgets/widgets.dart'; @@ -11,6 +12,7 @@ import '../../models/artefact_build.dart'; import '../../models/test_execution.dart'; import '../../providers/artefact_builds.dart'; import '../../providers/name_of_selected_stage.dart'; +import '../../providers/names_of_stages.dart'; import '../inline_url_text.dart'; import '../spacing.dart'; @@ -84,7 +86,8 @@ class _ArtefactInfoSection extends ConsumerWidget { @override Widget build(BuildContext context, WidgetRef ref) { - final stageName = ref.watch(nameOfSelectedStageProvider); + final selectedStageName = ref.watch(nameOfSelectedStageProvider); + final namesOfStages = ref.watch(namesOfStagesProvider); final artefactDetails = [ 'version: ${artefact.version}', @@ -98,8 +101,25 @@ class _ArtefactInfoSection extends ConsumerWidget { Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ - Text(stageName), - const SizedBox(height: Spacing.level2), + Row( + children: namesOfStages + .map( + (stageName) => Text( + stageName, + style: Theme.of(context).textTheme.bodyLarge?.apply( + color: stageName == selectedStageName + ? YaruColors.orange + : null, + ), + ), + ) + .toList() + .intersperse( + Text(' > ', style: Theme.of(context).textTheme.bodyLarge), + ) + .toList(), + ), + const SizedBox(height: Spacing.level3), ...artefactDetails .map( (detail) => Text( @@ -108,7 +128,7 @@ class _ArtefactInfoSection extends ConsumerWidget { ), ) .toList() - .intersperse(const SizedBox(height: Spacing.level2)) + .intersperse(const SizedBox(height: Spacing.level3)) .toList() ], ), diff --git a/frontend/lib/ui/dashboard/dashboard_body.dart b/frontend/lib/ui/dashboard/dashboard_body.dart index 871a86e6..d44ce15a 100644 --- a/frontend/lib/ui/dashboard/dashboard_body.dart +++ b/frontend/lib/ui/dashboard/dashboard_body.dart @@ -5,6 +5,7 @@ import 'package:intersperse/intersperse.dart'; import '../../models/artefact.dart'; import '../../models/stage.dart'; import '../../providers/name_of_selected_stage.dart'; +import '../../providers/names_of_stages.dart'; import '../spacing.dart'; import 'artefact_dialog.dart'; @@ -15,13 +16,19 @@ class DashboardBody extends StatelessWidget { @override Widget build(BuildContext context) { - return ListView.separated( - padding: - const EdgeInsets.symmetric(horizontal: Spacing.pageHorizontalPadding), - scrollDirection: Axis.horizontal, - itemBuilder: (_, i) => _StageColumn(stage: stages[i]), - separatorBuilder: (_, __) => const SizedBox(width: Spacing.level5), - itemCount: stages.length, + return ProviderScope( + overrides: [ + namesOfStagesProvider + .overrideWithValue(stages.map((stage) => stage.name).toList()) + ], + child: ListView.separated( + padding: const EdgeInsets.symmetric( + horizontal: Spacing.pageHorizontalPadding), + scrollDirection: Axis.horizontal, + itemBuilder: (_, i) => _StageColumn(stage: stages[i]), + separatorBuilder: (_, __) => const SizedBox(width: Spacing.level5), + itemCount: stages.length, + ), ); } }