fix: move all .of(context) out of the widget tree and into a variable

At some places <something>.of(context) was used multiple times in the
same widget. This, although small, can have an impact on performance
that's just plain unnecessary. It's better to just get things you need
out of the context first before you do anything else.

lib/app/buttons.dart

@@ -32,6 +32,8 @@ class RadioPlayFab extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
+    final theme = Theme.of(context);
+
     return FloatingActionButton(
       heroTag: null,
       onPressed: onPressed,
@@ -44,7 +46,7 @@ class RadioPlayFab extends StatelessWidget {
             right: -10,
             child: Icon(
               Icons.play_arrow_rounded,
-              color: Theme.of(context).colorScheme.primaryContainer,
+              color: theme.colorScheme.primaryContainer,
               size: 26,
             ),
           ),

lib/app/context_menus.dart

@@ -327,8 +327,9 @@ class _DownloadAction extends HookConsumerWidget {
 
   @override
   Widget build(BuildContext context, WidgetRef ref) {
+    final l = AppLocalizations.of(context);
     return _MenuItem(
-      title: _actionText(AppLocalizations.of(context)),
+      title: _actionText(l),
       icon: downloadAction.iconBuilder(context),
       onTap: downloadAction.action,
     );

lib/app/gradient.dart

@@ -54,11 +54,12 @@ class BackgroundGradient extends HookConsumerWidget {
 
   @override
   Widget build(BuildContext context, WidgetRef ref) {
+    final mediaQuery = MediaQuery.of(context);
     final base = ref.watch(baseThemeProvider);
 
     return SizedBox(
       width: double.infinity,
-      height: MediaQuery.of(context).size.height,
+      height: mediaQuery.size.height,
       child: Container(
         decoration: BoxDecoration(
           gradient: LinearGradient(

lib/app/images.dart

@@ -103,6 +103,8 @@ class ArtistArtImage extends HookConsumerWidget {
 
   @override
   Widget build(BuildContext context, WidgetRef ref) {
+    final theme = Theme.of(context);
+
     final cache = ref.watch(_artistArtUriCacheInfoProvider(
       artistId: artistId,
       thumbnail: thumbnail,
@@ -123,7 +125,7 @@ class ArtistArtImage extends HookConsumerWidget {
         width: width,
       ),
       loading: () => Container(
-        color: Theme.of(context).colorScheme.secondaryContainer,
+        color: theme.colorScheme.secondaryContainer,
         height: height,
         width: width,
       ),
@@ -211,9 +213,11 @@ class CardClip extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     final cardShape = Theme.of(context).cardTheme.shape;
+
     return ClipRRect(
-      borderRadius:
+      borderRadius: cardShape is RoundedRectangleBorder
-          cardShape is RoundedRectangleBorder ? cardShape.borderRadius : BorderRadius.zero,
+          ? cardShape.borderRadius
+          : BorderRadius.zero,
       child: !square
           ? child
           : AspectRatio(
@@ -247,6 +251,8 @@ class UriCacheInfoImage extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
+    final theme = Theme.of(context);
+
     return CachedNetworkImage(
       imageUrl: cache.uri.toString(),
       cacheKey: cache.cacheKey,
@@ -260,7 +266,7 @@ class UriCacheInfoImage extends StatelessWidget {
           placeholderStyle == PlaceholderStyle.spinner
               ? Container()
               : Container(
-                  color: Theme.of(context).colorScheme.secondaryContainer,
+                  color: theme.colorScheme.secondaryContainer,
                 ),
       errorWidget: (context, url, error) => PlaceholderImage(
         fit: fit,

lib/app/items.dart

@@ -204,12 +204,14 @@ class ArtistListTile extends HookConsumerWidget {
 
   @override
   Widget build(BuildContext context, WidgetRef ref) {
+    final l = AppLocalizations.of(context);
+
     return ListTile(
       leading: CircleClip(
         child: ArtistArtImage(artistId: artist.id),
       ),
       title: Text(artist.name),
-      subtitle: Text(AppLocalizations.of(context).resourcesAlbumCount(
+      subtitle: Text(l.resourcesAlbumCount(
         artist.albumCount,
       )),
       onTap: onTap,
@@ -239,6 +241,8 @@ class PlaylistListTile extends HookConsumerWidget {
 
   @override
   Widget build(BuildContext context, WidgetRef ref) {
+    final l = AppLocalizations.of(context);
+
     // generate the palette used in other views ahead of time
     ref.watch(playlistArtPaletteProvider(playlist.id));
     final cache = ref.watch(cacheServiceProvider).playlistArt(playlist);
@@ -248,7 +252,7 @@ class PlaylistListTile extends HookConsumerWidget {
         child: UriCacheInfoImage(cache: cache),
       ),
       title: Text(playlist.name),
-      subtitle: Text(AppLocalizations.of(context).resourcesSongCount(
+      subtitle: Text(l.resourcesSongCount(
         playlist.songCount,
       )),
       onTap: onTap,

lib/app/lists.dart

@@ -72,6 +72,8 @@ class PagedGridQueryView<T> extends HookConsumerWidget {
 
   @override
   Widget build(BuildContext context, WidgetRef ref) {
+    final mediaQuery = MediaQuery.of(context);
+
     SliverGridDelegate gridDelegate;
     double spacing;
 
@@ -92,7 +94,7 @@ class PagedGridQueryView<T> extends HookConsumerWidget {
     }
 
     final listView = PagedGridView<int, T>(
-      padding: MediaQuery.of(context).padding + EdgeInsets.all(spacing),
+      padding: mediaQuery.padding + EdgeInsets.all(spacing),
       pagingController: pagingController,
       builderDelegate: PagedChildBuilderDelegate(
         itemBuilder: (context, item, index) =>

lib/app/now_playing_bar.dart

@@ -112,6 +112,8 @@ class _TrackInfo extends HookConsumerWidget {
 
   @override
   Widget build(BuildContext context, WidgetRef ref) {
+    final theme = Theme.of(context);
+
     final item = ref.watch(mediaItemProvider);
 
     return Column(
@@ -125,11 +127,11 @@ class _TrackInfo extends HookConsumerWidget {
             //   maxLines: 1,
             //   softWrap: false,
             //   overflow: TextOverflow.fade,
-            //   style: Theme.of(context).textTheme.labelLarge,
+            //   style: theme.textTheme.labelLarge,
             // ),
             ScrollableText(
               data?.title ?? 'Nothing!!!',
-              style: Theme.of(context).textTheme.labelLarge,
+              style: theme.textTheme.labelLarge,
             ),
             const SizedBox(height: 2),
             Text(
@@ -137,7 +139,7 @@ class _TrackInfo extends HookConsumerWidget {
               maxLines: 1,
               softWrap: false,
               overflow: TextOverflow.fade,
-              style: Theme.of(context).textTheme.labelMedium,
+              style: theme.textTheme.labelMedium,
             ),
           ],
           error: (_, __) => const [Text('Error!')],
@@ -158,6 +160,8 @@ class PlayPauseButton extends HookConsumerWidget {
 
   @override
   Widget build(BuildContext context, WidgetRef ref) {
+    final theme = Theme.of(context);
+
     final playing = ref.watch(playingProvider);
     final state = ref.watch(processingStateProvider);
 
@@ -173,7 +177,7 @@ class PlayPauseButton extends HookConsumerWidget {
             width: size / 3,
             child: CircularProgressIndicator(
               strokeWidth: size / 16,
-              color: Theme.of(context).colorScheme.surface,
+              color: theme.colorScheme.surface,
             ),
           ),
         ],
@@ -195,7 +199,7 @@ class PlayPauseButton extends HookConsumerWidget {
         }
       },
       icon: icon,
-      color: Theme.of(context).colorScheme.surface,
+      color: theme.colorScheme.surface,
     );
   }
 }

lib/app/pages/artist_page.dart

@@ -118,10 +118,11 @@ class _Title extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
+    final theme = Theme.of(context);
     return Text(
       text,
       textAlign: TextAlign.center,
-      style: Theme.of(context).textTheme.displayMedium!.copyWith(
+      style: theme.textTheme.displayMedium!.copyWith(
         fontWeight: FontWeight.bold,
         color: Colors.white,
         shadows: [

lib/app/pages/bottom_nav_page.dart

@@ -46,6 +46,8 @@ class BottomNavTabsPage extends HookConsumerWidget {
 
   @override
   Widget build(BuildContext context, WidgetRef ref) {
+    final theme = Theme.of(context);
+
     final observer = ref.watch(bottomTabObserverProvider);
     const navElevation = 3.0;
 
@@ -63,8 +65,8 @@ class BottomNavTabsPage extends HookConsumerWidget {
         return AnnotatedRegion<SystemUiOverlayStyle>(
           value: SystemUiOverlayStyle.light.copyWith(
             systemNavigationBarColor: ElevationOverlay.applySurfaceTint(
-              Theme.of(context).colorScheme.surface,
+              theme.colorScheme.surface,
-              Theme.of(context).colorScheme.surfaceTint,
+              theme.colorScheme.surfaceTint,
               navElevation,
             ),
             statusBarColor: Colors.transparent,
@@ -136,7 +138,6 @@ class OfflineIndicator extends HookConsumerWidget {
                 padding: EdgeInsets.only(left: 2, bottom: 2),
                 child: Icon(
                   Icons.cloud_off_rounded,
-                  // color: Theme.of(context).colorScheme.secondary,
                   size: 20,
                 ),
               ),
@@ -154,6 +155,7 @@ class _BottomNavBar extends HookConsumerWidget {
 
   @override
   Widget build(BuildContext context, WidgetRef ref) {
+    final iconTheme = IconTheme.of(context);
     final tabsRouter = AutoTabsRouter.of(context);
 
     useListenableSelector(tabsRouter, () => tabsRouter.activeIndex);
@@ -190,9 +192,7 @@ class _BottomNavBar extends HookConsumerWidget {
                 return SvgPicture.asset(
                   'assets/tag_FILL0_wght400_GRAD0_opsz24.svg',
                   colorFilter: ColorFilter.mode(
-                    IconTheme.of(context).color!.withOpacity(
+                    iconTheme.color!.withOpacity(iconTheme.opacity ?? 1),
-                          IconTheme.of(context).opacity ?? 1,
-                        ),
                     BlendMode.srcIn,
                   ),
                   height: 28,

lib/app/pages/browse_page.dart

@@ -249,6 +249,8 @@ class _Category extends HookConsumerWidget {
 
   @override
   Widget build(BuildContext context, WidgetRef ref) {
+    final theme = Theme.of(context);
+
     return MultiSliver(
       children: [
         SliverToBoxAdapter(
@@ -256,7 +258,7 @@ class _Category extends HookConsumerWidget {
             padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 16),
             child: Text(
               title,
-              style: Theme.of(context).textTheme.headlineMedium,
+              style: theme.textTheme.headlineMedium,
             ),
           ),
         ),

lib/app/pages/library_page.dart

@@ -228,6 +228,8 @@ class _LibraryFilterFab extends HookConsumerWidget {
 
   @override
   Widget build(BuildContext context, WidgetRef ref) {
+    final theme = Theme.of(context);
+
     final tabsRouter = AutoTabsRouter.of(context);
     final activeIndex =
         useListenableSelector(tabsRouter, () => tabsRouter.activeIndex);
@@ -242,7 +244,7 @@ class _LibraryFilterFab extends HookConsumerWidget {
           end: 0,
           child: Icon(
             Icons.circle,
-            color: Theme.of(context).colorScheme.primaryContainer,
+            color: theme.colorScheme.primaryContainer,
             size: 11,
           ),
         ),
@@ -449,6 +451,8 @@ class ListSortFilterOptions extends HookConsumerWidget {
 
   @override
   Widget build(BuildContext context, WidgetRef ref) {
+    final theme = Theme.of(context);
+
     final list = ref.watch(libraryListQueryProvider(index));
 
     return SliverList(
@@ -457,7 +461,7 @@ class ListSortFilterOptions extends HookConsumerWidget {
           padding: const EdgeInsets.symmetric(horizontal: 16),
           child: Text(
             'Sort by',
-            style: Theme.of(context).textTheme.titleLarge,
+            style: theme.textTheme.titleLarge,
           ),
         ),
         const SizedBox(height: 8),
@@ -480,7 +484,7 @@ class ListSortFilterOptions extends HookConsumerWidget {
           padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
           child: Text(
             'Filter',
-            style: Theme.of(context).textTheme.titleLarge,
+            style: theme.textTheme.titleLarge,
           ),
         ),
         for (var column in list.options.filterColumns)

lib/app/pages/now_playing_page.dart

@@ -215,6 +215,8 @@ class _Progress extends HookConsumerWidget {
 
   @override
   Widget build(BuildContext context, WidgetRef ref) {
+    final theme = Theme.of(context);
+
     final colors = ref.watch(mediaItemThemeProvider).valueOrNull;
     final position = ref.watch(positionProvider);
     final duration = ref.watch(durationProvider);
@@ -246,7 +248,7 @@ class _Progress extends HookConsumerWidget {
         Padding(
           padding: const EdgeInsets.symmetric(horizontal: 24),
           child: DefaultTextStyle(
-            style: Theme.of(context).textTheme.titleMedium!,
+            style: theme.textTheme.titleMedium!,
             child: Row(
               mainAxisAlignment: MainAxisAlignment.spaceBetween,
               children: [

lib/app/pages/search_page.dart

@@ -131,11 +131,11 @@ class _SectionHeader extends HookConsumerWidget {
 
   @override
   Widget build(BuildContext context, WidgetRef ref) {
-    final theme = Theme.of(context).textTheme;
+    final theme = Theme.of(context);
 
     return Padding(
       padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
-      child: Text(title, style: theme.headlineMedium),
+      child: Text(title, style: theme.textTheme.headlineMedium),
     );
   }
 }