fix: unify ways of presenting chips in the app

.fvmrc

@@ -1,3 +1,3 @@
 {
-  "flutter": "3.32.0"
+  "flutter": "3.32.2"
 }

.github/workflows/ci.yaml

@@ -5,7 +5,7 @@ on:
     branches: [main]
 
 env:
-  FLUTTER_VERSION: '3.32.0'
+  FLUTTER_VERSION: '3.32.2'
 
 jobs:
   analyze:

.github/workflows/release.yml

@@ -7,7 +7,7 @@ on:
   workflow_dispatch:
 
 env:
-  FLUTTER_VERSION: '3.32.0'
+  FLUTTER_VERSION: '3.32.2'
 
 jobs:
   release_with_macos_dmg:

lib/common/view/common_control_panel.dart

@@ -0,0 +1,36 @@
+import 'package:flutter/material.dart';
+import 'package:yaru/yaru.dart';
+
+import 'icons.dart';
+import 'theme.dart';
+
+class CommonControlPanel extends StatelessWidget {
+  const CommonControlPanel({
+    super.key,
+    required this.labels,
+    required this.isSelected,
+    required this.onSelected,
+  });
+
+  final List<Widget> labels;
+  final List<bool> isSelected;
+  final void Function(int index)? onSelected;
+
+  @override
+  Widget build(BuildContext context) => Align(
+    alignment: Alignment.center,
+    child: YaruChoiceChipBar(
+      clearOnSelect: false,
+      selectedFirst: false,
+      showCheckMarks: false,
+      style: YaruChoiceChipBarStyle.stack,
+      shrinkWrap: true,
+      goNextIcon: Icon(Iconz.goNext),
+      goPreviousIcon: Icon(Iconz.goBack),
+      chipHeight: chipHeight,
+      labels: labels,
+      isSelected: isSelected,
+      onSelected: onSelected,
+    ),
+  );
+}

lib/common/view/sliver_audio_tile_list.dart

@@ -16,17 +16,19 @@ class SliverAudioTileList extends StatelessWidget with WatchItMixin {
     this.onSubTitleTab,
     required this.audioPageType,
     this.selectedColor,
+    this.constraints,
   });
 
   final List<Audio> audios;
   final String pageId;
   final AudioPageType audioPageType;
   final void Function(String text)? onSubTitleTab;
   final Color? selectedColor;
+  final BoxConstraints? constraints;
 
   @override
   Widget build(BuildContext context) {
-    final mqSize = context.mediaQuerySize.width;
+    final mqSize = constraints?.maxWidth ?? context.mediaQuerySize.width;
     final playerToTheRight = mqSize > kSideBarThreshHold;
     final width = playerToTheRight ? mqSize - kSideBarPlayerWidth : mqSize;
 

lib/common/view/sliver_body.dart

@@ -0,0 +1,58 @@
+import 'package:flutter/material.dart';
+
+import 'adaptive_container.dart';
+import 'sliver_filter_app_bar.dart';
+import 'theme.dart';
+import 'ui_constants.dart';
+
+class SliverBody extends StatelessWidget {
+  const SliverBody({
+    super.key,
+    required this.controlPanel,
+    required this.contentBuilder,
+    this.onStretchTrigger,
+    this.controlPanelSuffix,
+    this.onNotification,
+  });
+
+  final Widget controlPanel;
+  final Widget? controlPanelSuffix;
+
+  final Widget Function(BuildContext context, BoxConstraints constraints)
+  contentBuilder;
+  final Future<void> Function()? onStretchTrigger;
+  final bool Function(ScrollNotification event)? onNotification;
+
+  @override
+  Widget build(BuildContext context) => LayoutBuilder(
+    builder: (context, constraints) => NotificationListener(
+      onNotification: onNotification,
+      child: CustomScrollView(
+        slivers: [
+          SliverFilterAppBar(
+            padding: getAdaptiveHorizontalPadding(constraints: constraints)
+                .copyWith(
+                  bottom: filterPanelPadding.bottom,
+                  top: filterPanelPadding.top,
+                ),
+
+            title: controlPanel,
+            actions: [
+              if (controlPanelSuffix != null) ...[
+                controlPanelSuffix!,
+                const SizedBox(width: kSmallestSpace),
+              ],
+            ],
+            onStretchTrigger: onStretchTrigger,
+          ),
+          SliverPadding(
+            padding: getAdaptiveHorizontalPadding(
+              constraints: constraints,
+            ).copyWith(bottom: bottomPlayerPageGap),
+            sliver: contentBuilder(context, constraints),
+          ),
+        ],
+      ),
+    ),
+  );
+}

lib/l10n/app_localizations_et.dart

@@ -2159,9 +2159,10 @@ class AppLocalizationsEt extends AppLocalizations {
   }
 
   @override
-  String get useBlurredPlayerBackgroundTitle => 'Use blurred player background';
+  String get useBlurredPlayerBackgroundTitle =>
+      'Kasuta meediaesitajal hägustatud tausta';
 
   @override
   String get useBlurredPlayerBackgroundDescription =>
-      'This will blur the background of the player. This might lead to lower performance on some devices.';
+      'Selle valikuga kuvatakse meediaesitaja taust hägusena, kuid mõnedes seadmetes võib see tekitada jõudlusprobleeme.';
 }

lib/l10n/app_localizations_eu.dart

@@ -2168,9 +2168,10 @@ class AppLocalizationsEu extends AppLocalizations {
   }
 
   @override
-  String get useBlurredPlayerBackgroundTitle => 'Use blurred player background';
+  String get useBlurredPlayerBackgroundTitle =>
+      'Erabili erreproduzitzailearen atzeko plano lausoa';
 
   @override
   String get useBlurredPlayerBackgroundDescription =>
-      'This will blur the background of the player. This might lead to lower performance on some devices.';
+      'Honek erreproduzitzailearen atzeko planoa lausotuko du. Honek errendimendua txikiagoa izan dezake gailu batzuetan.';
 }

lib/l10n/app_localizations_fr.dart

@@ -2168,13 +2168,13 @@ class AppLocalizationsFr extends AppLocalizations {
 
   @override
   String downloadsOfLatestRelease(String latestRelease) {
-    return 'Downloaded $latestRelease times outside of snapstore and flathub';
+    return 'Téléchargé $latestRelease fois en dehors du snapstore et de flathub';
   }
 
   @override
-  String get useBlurredPlayerBackgroundTitle => 'Use blurred player background';
+  String get useBlurredPlayerBackgroundTitle => 'Flouter le fond du lecteur';
 
   @override
   String get useBlurredPlayerBackgroundDescription =>
-      'This will blur the background of the player. This might lead to lower performance on some devices.';
+      'Cela va flouter l\'arrière-plan du lecteur. Les performances de certains appareils peuvent être affectées.';
 }

lib/l10n/app_localizations_it.dart

@@ -2155,9 +2155,10 @@ class AppLocalizationsIt extends AppLocalizations {
   }
 
   @override
-  String get useBlurredPlayerBackgroundTitle => 'Use blurred player background';
+  String get useBlurredPlayerBackgroundTitle =>
+      'Usa sfondo riproduttore sfocato';
 
   @override
   String get useBlurredPlayerBackgroundDescription =>
-      'This will blur the background of the player. This might lead to lower performance on some devices.';
+      'Ciò offuscerà lo sfondo del riproduttore. Ciò potrebbe portare in alcuni dispositivi a prestazioni più basse.';
 }

lib/l10n/app_localizations_sk.dart

@@ -2157,9 +2157,10 @@ class AppLocalizationsSk extends AppLocalizations {
   }
 
   @override
-  String get useBlurredPlayerBackgroundTitle => 'Use blurred player background';
+  String get useBlurredPlayerBackgroundTitle =>
+      'Použiť rozmazané pozadie prehrávača';
 
   @override
   String get useBlurredPlayerBackgroundDescription =>
-      'This will blur the background of the player. This might lead to lower performance on some devices.';
+      'Týmto sa rozmaže pozadie prehrávača. Na niektorých zariadeniach to môže viesť k nižšiemu výkonu.';
 }

lib/l10n/app_localizations_sv.dart

@@ -2152,9 +2152,10 @@ class AppLocalizationsSv extends AppLocalizations {
   }
 
   @override
-  String get useBlurredPlayerBackgroundTitle => 'Use blurred player background';
+  String get useBlurredPlayerBackgroundTitle =>
+      'Använd suddig bakgrund för spelaren';
 
   @override
   String get useBlurredPlayerBackgroundDescription =>
-      'This will blur the background of the player. This might lead to lower performance on some devices.';
+      'Detta gör spelarens bakgrund suddig. Detta kan leda till lägre prestanda på vissa enheter.';
 }

lib/l10n/app_localizations_zh.dart

@@ -587,7 +587,7 @@ class AppLocalizationsZh extends AppLocalizations {
   String get system => '系统';
 
   @override
-  String get dark => '浅色';
+  String get dark => '深色';
 
   @override
   String get podcastProvider => '播客提供商';

lib/local_audio/view/local_audio_body.dart

@@ -19,6 +19,7 @@ class LocalAudioBody extends StatelessWidget {
     required this.playlists,
     this.noResultMessage,
     this.noResultIcon,
+    this.constraints,
   });
 
   final LocalAudioView localAudioView;
@@ -29,10 +30,12 @@ class LocalAudioBody extends StatelessWidget {
   final List<String>? genres;
   final List<String>? playlists;
   final Widget? noResultMessage, noResultIcon;
+  final BoxConstraints? constraints;
 
   @override
   Widget build(BuildContext context) => switch (localAudioView) {
     LocalAudioView.titles => TitlesView(
+      constraints: constraints,
       audios: titles,
       noResultMessage: noResultMessage,
       noResultIcon: noResultIcon,

lib/local_audio/view/local_audio_control_panel.dart

@@ -1,9 +1,7 @@
 import 'package:flutter/material.dart';
 import 'package:watch_it/watch_it.dart';
-import 'package:yaru/yaru.dart';
 
-import '../../common/view/icons.dart';
-import '../../common/view/ui_constants.dart';
+import '../../common/view/common_control_panel.dart';
 import '../../l10n/l10n.dart';
 import '../local_audio_model.dart';
 import '../local_audio_view.dart';
@@ -16,29 +14,16 @@ class LocalAudioControlPanel extends StatelessWidget with WatchItMixin {
     final index = watchPropertyValue((LocalAudioModel m) => m.localAudioindex);
     final audios = watchPropertyValue((LocalAudioModel m) => m.audios);
 
-    return Padding(
-      padding: const EdgeInsets.symmetric(horizontal: kSmallestSpace),
-      child: SingleChildScrollView(
-        scrollDirection: Axis.horizontal,
-        child: YaruChoiceChipBar(
-          showCheckMarks: false,
-          shrinkWrap: true,
-          goNextIcon: Icon(Iconz.goNext),
-          goPreviousIcon: Icon(Iconz.goBack),
-          style: YaruChoiceChipBarStyle.wrap,
-          selectedFirst: false,
-          clearOnSelect: false,
-          labels: LocalAudioView.values
-              .map((e) => Text(e.localize(context.l10n)))
-              .toList(),
-          isSelected: LocalAudioView.values
-              .map((e) => e == LocalAudioView.values[index])
-              .toList(),
-          onSelected: audios == null
-              ? null
-              : di<LocalAudioModel>().setLocalAudioindex,
-        ),
-      ),
+    return CommonControlPanel(
+      labels: LocalAudioView.values
+          .map((e) => Text(e.localize(context.l10n)))
+          .toList(),
+      isSelected: LocalAudioView.values
+          .map((e) => e == LocalAudioView.values[index])
+          .toList(),
+      onSelected: audios == null
+          ? null
+          : di<LocalAudioModel>().setLocalAudioindex,
     );
   }
 }

lib/local_audio/view/local_audio_page.dart

@@ -5,11 +5,10 @@ import 'package:watch_it/watch_it.dart';
 import '../../app/view/routing_manager.dart';
 import '../../common/data/audio_type.dart';
 import '../../common/page_ids.dart';
-import '../../common/view/adaptive_container.dart';
 import '../../common/view/header_bar.dart';
 import '../../common/view/no_search_result_page.dart';
 import '../../common/view/search_button.dart';
-import '../../common/view/sliver_filter_app_bar.dart';
+import '../../common/view/sliver_body.dart';
 import '../../common/view/theme.dart';
 import '../../common/view/ui_constants.dart';
 import '../../l10n/l10n.dart';
@@ -82,46 +81,30 @@ class _LocalAudioPageState extends State<LocalAudioPage> {
         ],
         title: Text(context.l10n.localAudio),
       ),
-      body: LayoutBuilder(
-        builder: (context, constraints) {
-          return CustomScrollView(
-            slivers: [
-              SliverFilterAppBar(
-                padding: getAdaptiveHorizontalPadding(constraints: constraints)
-                    .copyWith(
-                      bottom: filterPanelPadding.bottom,
-                      top: filterPanelPadding.top,
-                    ),
-                title: const LocalAudioControlPanel(),
+      body: SliverBody(
+        controlPanel: const LocalAudioControlPanel(),
+        contentBuilder: (context, constraints) =>
+            audios != null && audios.isEmpty
+            ? SliverNoSearchResultPage(
+                icon: const AnimatedEmoji(AnimatedEmojis.bird),
+                message: Column(
+                  mainAxisSize: MainAxisSize.min,
+                  children: [
+                    Text(context.l10n.noLocalTitlesFound),
+                    const SizedBox(height: kLargestSpace),
+                    const SettingsButton.important(scrollIndex: 2),
+                  ],
+                ),
+              )
+            : LocalAudioBody(
+                constraints: constraints,
+                localAudioView: localAudioView,
+                titles: audios,
+                albumIDs: allAlbumIDs,
+                artists: allArtists,
+                genres: allGenres,
+                playlists: playlists,
               ),
-              SliverPadding(
-                padding: getAdaptiveHorizontalPadding(
-                  constraints: constraints,
-                ).copyWith(bottom: bottomPlayerPageGap),
-                sliver: audios != null && audios.isEmpty
-                    ? SliverNoSearchResultPage(
-                        icon: const AnimatedEmoji(AnimatedEmojis.bird),
-                        message: Column(
-                          mainAxisSize: MainAxisSize.min,
-                          children: [
-                            Text(context.l10n.noLocalTitlesFound),
-                            const SizedBox(height: kLargestSpace),
-                            const SettingsButton.important(scrollIndex: 2),
-                          ],
-                        ),
-                      )
-                    : LocalAudioBody(
-                        localAudioView: localAudioView,
-                        titles: audios,
-                        albumIDs: allAlbumIDs,
-                        artists: allArtists,
-                        genres: allGenres,
-                        playlists: playlists,
-                      ),
-              ),
-            ],
-          );
-        },
       ),
     );
   }