Restore opening name in explorer

Closes #1247

lib/src/view/analysis/analysis_screen.dart

@@ -4,6 +4,7 @@ import 'package:flutter/material.dart';
 import 'package:flutter_riverpod/flutter_riverpod.dart';
 import 'package:lichess_mobile/src/model/analysis/analysis_controller.dart';
 import 'package:lichess_mobile/src/model/analysis/analysis_preferences.dart';
+import 'package:lichess_mobile/src/model/analysis/opening_service.dart';
 import 'package:lichess_mobile/src/model/common/chess.dart';
 import 'package:lichess_mobile/src/model/game/game_share_service.dart';
 import 'package:lichess_mobile/src/network/http.dart';
@@ -224,6 +225,15 @@ class _Body extends ConsumerWidget {
       children: [
         OpeningExplorerView(
           position: currentNode.position,
+          opening: kOpeningAllowedVariants.contains(analysisState.variant)
+              ? analysisState.currentNode.isRoot
+                  ? LightOpening(
+                      eco: '',
+                      name: context.l10n.startPosition,
+                    )
+                  : analysisState.currentNode.opening ??
+                      analysisState.currentBranchOpening
+              : null,
           onMoveSelected: (move) {
             ref.read(ctrlProvider.notifier).onUserMove(move);
           },

lib/src/view/analysis/tree_view.dart

@@ -2,9 +2,6 @@ import 'package:flutter/material.dart';
 import 'package:flutter_riverpod/flutter_riverpod.dart';
 import 'package:lichess_mobile/src/model/analysis/analysis_controller.dart';
 import 'package:lichess_mobile/src/model/analysis/analysis_preferences.dart';
-import 'package:lichess_mobile/src/model/analysis/opening_service.dart';
-import 'package:lichess_mobile/src/model/common/chess.dart';
-import 'package:lichess_mobile/src/utils/l10n_context.dart';
 import 'package:lichess_mobile/src/widgets/pgn.dart';
 
 const kOpeningHeaderHeight = 32.0;
@@ -18,9 +15,6 @@ class AnalysisTreeView extends ConsumerWidget {
   Widget build(BuildContext context, WidgetRef ref) {
     final ctrlProvider = analysisControllerProvider(options);
 
-    final variant = ref.watch(
-      ctrlProvider.select((value) => value.requireValue.variant),
-    );
     final root =
         ref.watch(ctrlProvider.select((value) => value.requireValue.root));
     final currentPath = ref
@@ -36,8 +30,6 @@ class AnalysisTreeView extends ConsumerWidget {
     return ListView(
       padding: EdgeInsets.zero,
       children: [
-        if (kOpeningAllowedVariants.contains(variant))
-          _OpeningHeader(ctrlProvider),
         DebouncedPgnTreeView(
           root: root,
           currentPath: currentPath,
@@ -52,47 +44,3 @@ class AnalysisTreeView extends ConsumerWidget {
     );
   }
 }
-
-class _OpeningHeader extends ConsumerWidget {
-  const _OpeningHeader(this.ctrlProvider);
-
-  final AnalysisControllerProvider ctrlProvider;
-
-  @override
-  Widget build(BuildContext context, WidgetRef ref) {
-    final isRootNode = ref.watch(
-      ctrlProvider.select((s) => s.requireValue.currentNode.isRoot),
-    );
-    final nodeOpening = ref
-        .watch(ctrlProvider.select((s) => s.requireValue.currentNode.opening));
-    final branchOpening = ref
-        .watch(ctrlProvider.select((s) => s.requireValue.currentBranchOpening));
-    final contextOpening =
-        ref.watch(ctrlProvider.select((s) => s.requireValue.contextOpening));
-    final opening = isRootNode
-        ? LightOpening(
-            eco: '',
-            name: context.l10n.startPosition,
-          )
-        : nodeOpening ?? branchOpening ?? contextOpening;
-
-    return opening != null
-        ? Container(
-            height: kOpeningHeaderHeight,
-            width: double.infinity,
-            decoration: BoxDecoration(
-              color: Theme.of(context).colorScheme.secondaryContainer,
-            ),
-            child: Padding(
-              padding: const EdgeInsets.symmetric(horizontal: 8.0),
-              child: Center(
-                child: Text(
-                  opening.name,
-                  overflow: TextOverflow.ellipsis,
-                ),
-              ),
-            ),
-          )
-        : const SizedBox.shrink();
-  }
-}

lib/src/view/opening_explorer/opening_explorer_screen.dart

@@ -4,6 +4,7 @@ import 'package:flutter/material.dart';
 import 'package:flutter_riverpod/flutter_riverpod.dart';
 import 'package:lichess_mobile/src/constants.dart';
 import 'package:lichess_mobile/src/model/analysis/analysis_controller.dart';
+import 'package:lichess_mobile/src/model/common/chess.dart';
 import 'package:lichess_mobile/src/model/opening_explorer/opening_explorer.dart';
 import 'package:lichess_mobile/src/model/opening_explorer/opening_explorer_preferences.dart';
 import 'package:lichess_mobile/src/styles/styles.dart';
@@ -181,6 +182,13 @@ class _Body extends ConsumerWidget {
                       ),
                       OpeningExplorerView(
                         position: state.position,
+                        opening: state.currentNode.isRoot
+                            ? LightOpening(
+                                eco: '',
+                                name: context.l10n.startPosition,
+                              )
+                            : state.currentNode.opening ??
+                                state.currentBranchOpening,
                         onMoveSelected: (move) {
                           ref
                               .read(

lib/src/view/opening_explorer/opening_explorer_view.dart

@@ -1,6 +1,7 @@
 import 'package:dartchess/dartchess.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_riverpod/flutter_riverpod.dart';
+import 'package:lichess_mobile/src/model/common/chess.dart';
 import 'package:lichess_mobile/src/model/opening_explorer/opening_explorer.dart';
 import 'package:lichess_mobile/src/model/opening_explorer/opening_explorer_preferences.dart';
 import 'package:lichess_mobile/src/model/opening_explorer/opening_explorer_repository.dart';
@@ -9,13 +10,6 @@ import 'package:lichess_mobile/src/utils/l10n_context.dart';
 import 'package:lichess_mobile/src/view/opening_explorer/opening_explorer_widgets.dart';
 import 'package:lichess_mobile/src/widgets/shimmer.dart';
 
-const _kTableRowVerticalPadding = 12.0;
-const _kTableRowHorizontalPadding = 8.0;
-const _kTableRowPadding = EdgeInsets.symmetric(
-  horizontal: _kTableRowHorizontalPadding,
-  vertical: _kTableRowVerticalPadding,
-);
-
 /// Displays an opening explorer for the given position.
 ///
 /// It shows the top moves, games, and recent games for the given position in a list view.
@@ -28,10 +22,12 @@ class OpeningExplorerView extends ConsumerStatefulWidget {
   const OpeningExplorerView({
     required this.position,
     required this.onMoveSelected,
+    this.opening,
     this.scrollable = true,
   });
 
   final Position position;
+  final Opening? opening;
   final void Function(NormalMove) onMoveSelected;
   final bool scrollable;
 
@@ -49,23 +45,17 @@ class _OpeningExplorerState extends ConsumerState<OpeningExplorerView> {
   @override
   Widget build(BuildContext context) {
     if (widget.position.ply >= 50) {
-      return Padding(
-        padding: _kTableRowPadding,
-        child: Center(
-          child: Text(context.l10n.maxDepthReached),
-        ),
+      return Center(
+        child: Text(context.l10n.maxDepthReached),
       );
     }
 
     final prefs = ref.watch(openingExplorerPreferencesProvider);
 
     if (prefs.db == OpeningDatabase.player && prefs.playerDb.username == null) {
-      return const Padding(
-        padding: _kTableRowPadding,
-        child: Center(
-          // TODO: l10n
-          child: Text('Select a Lichess player in the settings.'),
-        ),
+      return const Center(
+        // TODO: l10n
+        child: Text('Select a Lichess player in the settings.'),
       );
     }
 
@@ -117,6 +107,8 @@ class _OpeningExplorerState extends ConsumerState<OpeningExplorerView> {
         final ply = widget.position.ply;
 
         final children = [
+          if (widget.opening != null)
+            OpeningNameHeader(opening: widget.opening!),
           OpeningExplorerMoveTable(
             moves: value.entry.moves,
             whiteWins: value.entry.white,

lib/src/view/opening_explorer/opening_explorer_widgets.dart

@@ -3,11 +3,13 @@ import 'package:fast_immutable_collections/fast_immutable_collections.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_riverpod/flutter_riverpod.dart';
 import 'package:intl/intl.dart';
+import 'package:lichess_mobile/src/model/common/chess.dart';
 import 'package:lichess_mobile/src/model/opening_explorer/opening_explorer.dart';
 import 'package:lichess_mobile/src/utils/l10n_context.dart';
 import 'package:lichess_mobile/src/utils/navigation.dart';
 import 'package:lichess_mobile/src/view/game/archived_game_screen.dart';
 import 'package:lichess_mobile/src/widgets/buttons.dart';
+import 'package:url_launcher/url_launcher.dart';
 
 const _kTableRowVerticalPadding = 10.0;
 const _kTableRowHorizontalPadding = 8.0;
@@ -27,6 +29,52 @@ Color _blackBoxColor(BuildContext context) =>
         ? Colors.black.withValues(alpha: 0.7)
         : Colors.black;
 
+class OpeningNameHeader extends StatelessWidget {
+  const OpeningNameHeader({required this.opening, super.key});
+
+  final Opening opening;
+
+  @override
+  Widget build(BuildContext context) {
+    return Container(
+      padding: _kTableRowPadding,
+      decoration: BoxDecoration(
+        color: Theme.of(context).colorScheme.secondaryContainer,
+      ),
+      child: GestureDetector(
+        onTap: opening.name == context.l10n.startPosition
+            ? null
+            : () => launchUrl(
+                  Uri.parse(
+                    'https://lichess.org/opening/${opening.name}',
+                  ),
+                ),
+        child: Row(
+          children: [
+            if (opening.name != context.l10n.startPosition) ...[
+              Icon(
+                Icons.open_in_browser_outlined,
+                color: Theme.of(context).colorScheme.onSecondaryContainer,
+              ),
+              const SizedBox(width: 6.0),
+            ],
+            Expanded(
+              child: Text(
+                opening.name,
+                style: TextStyle(
+                  color: Theme.of(context).colorScheme.onSecondaryContainer,
+                  fontWeight: FontWeight.bold,
+                ),
+                maxLines: 1,
+              ),
+            ),
+          ],
+        ),
+      ),
+    );
+  }
+}
+
 /// Table of moves for the opening explorer.
 class OpeningExplorerMoveTable extends ConsumerWidget {
   const OpeningExplorerMoveTable({