fix(windows): windows global title bar

lib/components/shared/page_window_title_bar.dart

@@ -1,40 +1,114 @@
 import 'package:bitsdojo_window/bitsdojo_window.dart';
 import 'package:flutter/material.dart';
+import 'package:flutter_hooks/flutter_hooks.dart';
+import 'package:hooks_riverpod/hooks_riverpod.dart';
 import 'package:platform_ui/platform_ui.dart';
 import 'package:spotube/utils/platform.dart';
 
-class PageWindowTitleBar extends PlatformAppBar {
+class PageWindowTitleBar extends StatefulHookWidget with PreferredSizeWidget {
+  final Widget? leading;
+  final bool automaticallyImplyLeading;
+  final Widget? title;
+  final List<Widget>? actions;
+  final Color? backgroundColor;
+  final Color? foregroundColor;
+  final IconThemeData? actionsIconTheme;
+  final bool? centerTitle;
+  final double? titleSpacing;
+  final double toolbarOpacity;
+  final double? leadingWidth;
+  final TextStyle? toolbarTextStyle;
+  final TextStyle? titleTextStyle;
+  final double? titleWidth;
+  final Widget? center;
+  final bool hideWhenWindows;
+
   PageWindowTitleBar({
-    super.backgroundColor,
+    Key? key,
-    List<Widget>? actions,
+    this.title,
-    super.actionsIconTheme,
+    this.actions,
-    super.automaticallyImplyLeading = false,
+    this.center,
-    super.centerTitle,
+    this.toolbarOpacity = 1,
-    super.foregroundColor,
+    this.backgroundColor,
-    super.key,
+    this.actionsIconTheme,
-    super.leading,
+    this.automaticallyImplyLeading = false,
-    super.leadingWidth,
+    this.centerTitle,
-    Widget? center,
+    this.foregroundColor,
-    super.titleSpacing,
+    this.leading,
-    super.titleTextStyle,
+    this.leadingWidth,
-    super.titleWidth,
+    this.titleSpacing,
-    super.toolbarOpacity,
+    this.titleTextStyle,
-    super.toolbarTextStyle,
+    this.titleWidth,
-  }) : super(
+    this.toolbarTextStyle,
-          actions: [
+    this.hideWhenWindows = true,
-            ...?actions,
+  }) : super(key: key);
-            if (!kIsMacOS && !kIsMobile)
-              platform == TargetPlatform.linux
-                  ? MoveWindow(child: const PlatformWindowButtons())
-                  : const PlatformWindowButtons(),
-          ],
-          title: platform == TargetPlatform.linux
-              ? MoveWindow(child: Center(child: center))
-              : center,
-        );
 
+  @override
+  Size get preferredSize => Size.fromHeight(
+        platform == TargetPlatform.windows ? 33 : kToolbarHeight,
+      );
+
+  @override
+  State<PageWindowTitleBar> createState() => _PageWindowTitleBarState();
+}
+
+class _PageWindowTitleBarState extends State<PageWindowTitleBar> {
   @override
   Widget build(BuildContext context) {
-    return MoveWindow(child: super.build(context));
+    useEffect(() {
+      if (platform == TargetPlatform.windows &&
+          widget.hideWhenWindows &&
+          Navigator.of(context).canPop()) {
+        final entry = OverlayEntry(
+          builder: (context) => const Positioned(
+            left: 5,
+            top: 5,
+            child: PlatformBackButton(),
+          ),
+        );
+
+        WidgetsBinding.instance.addPostFrameCallback((_) {
+          Overlay.of(context)?.insert(entry);
+        });
+
+        return () {
+          entry.remove();
+        };
+      }
+      return null;
+    }, [platform, widget.hideWhenWindows]);
+
+    var appBar = PlatformAppBar(
+      actions: [
+        ...?widget.actions,
+        if (!kIsMacOS && !kIsMobile)
+          platform == TargetPlatform.linux
+              ? MoveWindow(child: const PlatformWindowButtons())
+              : const PlatformWindowButtons(),
+      ],
+      title: platform == TargetPlatform.linux
+          ? MoveWindow(child: Center(child: widget.center))
+          : widget.center,
+      toolbarOpacity: widget.toolbarOpacity,
+      backgroundColor: widget.backgroundColor,
+      actionsIconTheme: widget.actionsIconTheme,
+      automaticallyImplyLeading: widget.automaticallyImplyLeading,
+      centerTitle: widget.centerTitle,
+      foregroundColor: widget.foregroundColor,
+      leading: widget.leading,
+      leadingWidth: widget.leadingWidth,
+      titleSpacing: widget.titleSpacing,
+      titleTextStyle: widget.titleTextStyle,
+      titleWidth: widget.titleWidth,
+      toolbarTextStyle: widget.toolbarTextStyle,
+    );
+
+    if (platform == TargetPlatform.windows && widget.hideWhenWindows) {
+      return const SizedBox.shrink();
+    }
+
+    return MoveWindow(
+      child: appBar,
+    );
   }
 }

lib/pages/library/library.dart

@@ -23,26 +23,32 @@ class LibraryPage extends HookConsumerWidget {
       const UserAlbums(),
     ][index.value];
 
+    var tabbar = PlatformTabBar(
+      androidIsScrollable: true,
+      selectedIndex: index.value,
+      onSelectedIndexChanged: (value) => index.value = value,
+      isNavigational:
+          PlatformProperty.byPlatformGroup(mobile: false, desktop: true),
+      tabs: [
+        PlatformTab(label: 'Playlists', icon: const SizedBox.shrink()),
+        PlatformTab(label: 'Tracks', icon: const SizedBox.shrink()),
+        PlatformTab(label: 'Downloads', icon: const SizedBox.shrink()),
+        PlatformTab(label: 'Artists', icon: const SizedBox.shrink()),
+        PlatformTab(label: 'Albums', icon: const SizedBox.shrink()),
+      ],
+    );
     return SafeArea(
       child: PlatformScaffold(
-        appBar: PageWindowTitleBar(
+        appBar: platform == TargetPlatform.windows
-          titleWidth: 347,
+            ? PreferredSize(
-          centerTitle: true,
+                preferredSize: const Size.fromHeight(40),
-          center: PlatformTabBar(
+                child: tabbar,
-            androidIsScrollable: true,
+              )
-            selectedIndex: index.value,
+            : PageWindowTitleBar(
-            onSelectedIndexChanged: (value) => index.value = value,
+                titleWidth: 347,
-            isNavigational:
+                centerTitle: true,
-                PlatformProperty.byPlatformGroup(mobile: false, desktop: true),
+                center: tabbar,
-            tabs: [
+              ),
-              PlatformTab(label: 'Playlists', icon: const SizedBox.shrink()),
-              PlatformTab(label: 'Tracks', icon: const SizedBox.shrink()),
-              PlatformTab(label: 'Downloads', icon: const SizedBox.shrink()),
-              PlatformTab(label: 'Artists', icon: const SizedBox.shrink()),
-              PlatformTab(label: 'Albums', icon: const SizedBox.shrink()),
-            ],
-          ),
-        ),
         body: body,
       ),
     );

lib/pages/lyrics/lyrics.dart

@@ -42,33 +42,37 @@ class LyricsPage extends HookConsumerWidget {
       GeniusLyrics(palette: palette),
     ][index.value];
 
+    final tabbar = PreferredSize(
+      preferredSize: const Size.fromHeight(40),
+      child: PlatformTabBar(
+        isNavigational: PlatformProperty.only(linux: true, other: false),
+        selectedIndex: index.value,
+        onSelectedIndexChanged: (value) => index.value = value,
+        backgroundColor: PlatformTheme.of(context).scaffoldBackgroundColor,
+        tabs: [
+          PlatformTab(
+            label: "Synced",
+            icon: const SizedBox.shrink(),
+            color: PlatformTextTheme.of(context).caption?.color,
+          ),
+          PlatformTab(
+            label: "Genius",
+            icon: const SizedBox.shrink(),
+            color: PlatformTextTheme.of(context).caption?.color,
+          ),
+        ],
+      ),
+    );
     return PlatformScaffold(
       extendBodyBehindAppBar: true,
       appBar: !kIsMacOS
-          ? PageWindowTitleBar(
+          ? (platform != TargetPlatform.windows
-              toolbarOpacity: 0,
+              ? PageWindowTitleBar(
-              backgroundColor: Colors.transparent,
+                  toolbarOpacity: 0,
-              center: PlatformTabBar(
+                  backgroundColor: Colors.transparent,
-                isNavigational:
+                  center: tabbar,
-                    PlatformProperty.only(linux: true, other: false),
+                )
-                selectedIndex: index.value,
+              : tabbar)
-                onSelectedIndexChanged: (value) => index.value = value,
-                backgroundColor:
-                    PlatformTheme.of(context).scaffoldBackgroundColor,
-                tabs: [
-                  PlatformTab(
-                    label: "Synced",
-                    icon: const SizedBox.shrink(),
-                    color: PlatformTextTheme.of(context).caption?.color,
-                  ),
-                  PlatformTab(
-                    label: "Genius",
-                    icon: const SizedBox.shrink(),
-                    color: PlatformTextTheme.of(context).caption?.color,
-                  ),
-                ],
-              ),
-            )
           : null,
       body: Container(
         clipBehavior: Clip.hardEdge,

lib/pages/root/root_app.dart

@@ -8,6 +8,7 @@ import 'package:spotube/components/shared/dialogs/replace_downloaded_dialog.dart
 import 'package:spotube/components/root/bottom_player.dart';
 import 'package:spotube/components/root/sidebar.dart';
 import 'package:spotube/components/root/spotube_navigation_bar.dart';
+import 'package:spotube/components/shared/page_window_title_bar.dart';
 import 'package:spotube/hooks/use_update_checker.dart';
 import 'package:spotube/provider/downloader_provider.dart';
 
@@ -63,6 +64,9 @@ class RootApp extends HookConsumerWidget {
     }, [backgroundColor]);
 
     return PlatformScaffold(
+      appBar: platform == TargetPlatform.windows
+          ? PageWindowTitleBar(hideWhenWindows: false)
+          : null,
       body: Sidebar(
         selectedIndex: index.value,
         onSelectedIndexChanged: (i) {