/**
 * I comandi della ricetta nel pannello di destra degli schermi larghi
 * (l'iPad, l'iPhone Duo aperto), sull'iPhone e sull'iPad.
 *
 * Lì una barra di sistema non c'è: il pannello sta accanto alla pila dello
 * sfoglia, non dentro una pila sua. Al posto della nostra Barra, che col
 * vetro intorno sembrava di un'altra app, i comandi stanno in una capsula di
 * vetro che galleggia in alto a destra: è il «bottone di vetro sopra il
 * contenuto» che Apple prevede per i comandi personalizzati (glassEffect di
 * SwiftUI), con gli stessi simboli e lo stesso menù della barra di sistema.
 */
import { Button as BottoneSwift, HStack, Host, Menu as MenuSwift } from '@expo/ui/swift-ui';
import { frame, glassEffect, labelStyle, padding, tint } from '@expo/ui/swift-ui/modifiers';
import type { StyleProp, ViewStyle } from 'react-native';

import type { ComandoIntestazione } from '../logica-intestazione.ts';
import { useColori, useSchema } from '../tema.ts';

export function ComandiDiVetro({ comandi, style }: { comandi: ComandoIntestazione[]; style?: StyleProp<ViewStyle> }) {
  const colori = useColori();
  const schema = useSchema();
  const misura = [labelStyle('iconOnly'), frame({ width: 40, height: 40 }), tint(colori.testo)];
  return (
    <Host matchContents colorScheme={schema} style={style}>
      <HStack
        spacing={2}
        modifiers={[
          padding({ horizontal: 4, vertical: 2 }),
          glassEffect({ glass: { variant: 'regular', interactive: true }, shape: 'capsule' }),
        ]}
      >
        {comandi.map((c) =>
          c.voci !== undefined ? (
            <MenuSwift key={c.etichetta} label={c.etichetta} systemImage={c.simbolo as never} modifiers={misura}>
              {c.voci.map((v) => (
                <BottoneSwift
                  key={v.etichetta}
                  label={v.etichetta}
                  systemImage={v.simbolo as never}
                  role={v.pericolo === true ? 'destructive' : undefined}
                  onPress={v.azione}
                />
              ))}
            </MenuSwift>
          ) : (
            <BottoneSwift
              key={c.etichetta}
              label={c.etichetta}
              systemImage={c.simbolo as never}
              onPress={c.azione}
              modifiers={misura}
            />
          ),
        )}
      </HStack>
    </Host>
  );
}