~repos /only-bible-app

import "package:flutter/material.dart";
import "package:only_bible_app/gen/bible.gen.dart";
import "package:only_bible_app/store/app_state.dart";
import "package:only_bible_app/store/actions_state.dart";
import "package:only_bible_app/store/actions_navigation.dart";
import "package:only_bible_app/theme.dart";
import "package:only_bible_app/widgets/highlight_button.dart";

class MenuOverlay extends StatelessWidget {
  final Bible bible;

  const MenuOverlay({super.key, required this.bible});

  @override
  Widget build(BuildContext context) {
    final darkMode = context.select((s) => s.darkMode);
    final isPlaying = context.isWaiting(TogglePlayAction);
    final iconColor = darkMode ? Colors.white.withOpacity(0.9) : Colors.black.withOpacity(0.9);
    final audioIcon = isPlaying ? Icons.pause_circle_outline : Icons.play_circle_outline;

    void onHighlight(int index) {
      context.dispatch(
        SetHighlightAction(
          List<Verse>.from(context.read().selectedVerses),
          index,
        ),
      );
    }

    return Material(
      elevation: 1,
      color: Theme.of(context).colorScheme.surface,
      shadowColor: Theme.of(context).colorScheme.shadow,
      shape: RoundedRectangleBorder(
        borderRadius: BorderRadius.circular(28),
        side: BorderSide(color: Theme.of(context).colorScheme.outline, width: 1),
      ),
      child: Container(
        height: 50,
        padding: const EdgeInsets.only(left: 8, right: 8),
        child: Row(
          mainAxisSize: MainAxisSize.min,
          children: [
            IconButton(
              padding: EdgeInsets.zero,
              onPressed: () {
                context.dispatch(
                  RemoveHighlightAction(
                    List<Verse>.from(context.read().selectedVerses),
                  ),
                );
              },
              icon: Icon(Icons.cancel_outlined, size: 28, color: iconColor),
            ),
            HighlightButton(
              index: 0,
              color: darkMode ? darkHighlights[0] : lightHighlights[0],
              onHighlightSelected: onHighlight,
            ),
            HighlightButton(
              index: 1,
              color: darkMode ? darkHighlights[1] : lightHighlights[1],
              onHighlightSelected: onHighlight,
            ),
            HighlightButton(
              index: 2,
              color: darkMode ? darkHighlights[2] : lightHighlights[2],
              onHighlightSelected: onHighlight,
            ),
            HighlightButton(
              index: 3,
              color: darkMode ? darkHighlights[3] : lightHighlights[3],
              onHighlightSelected: onHighlight,
            ),
            IconButton(
              padding: EdgeInsets.zero,
              onPressed: () {
                context.dispatch(TogglePlayAction(context, bible));
              },
              icon: Icon(audioIcon, size: 34, color: iconColor),
            ),
            IconButton(
              padding: EdgeInsets.zero,
              onPressed: () {
                final verses = context.read().selectedVerses;
                context.dispatch(ShareVersesAction(
                  verses,
                  bible.books![verses.first.book].name!,
                ));
              },
              icon: Icon(Icons.share_outlined, size: 34, color: iconColor),
            ),
          ],
        ),
      ),
    );
  }
}