<script lang="ts">
  import { getDrill } from '../drills'
  import NotFound from './NotFound.svelte'
  import StrumView from '../components/views/StrumView.svelte'

  interface Props {
    code: string
    params: URLSearchParams
  }

  let { code, params }: Props = $props()
  let drill = $derived(getDrill(code))
</script>

{#if !drill}
  <NotFound {code} />
{:else if drill.kind === 'strum'}
  {#key drill.code}
    <StrumView {drill} {params} />
  {/key}
{:else}
  <NotFound {code} />
{/if}
