Typesafe way to render conditionally based on whether array has zero, one or many elements?

if (array.length === 0) {
  // return emtpy sate
}

if (array[0] && array.length === 1) {
  const item = array[0] // this has a non-null type
  // return jsx
}

return array.map(...)

<Switch>
  <Match when={array.length === 0}>...</Match>
  <Match when={array.length === 1}>
    <Show when={array[0]}>
      {(item) => (<>
        {/* Here `item` is typed */}
        <p>{item().foo}</p>
      </>)}
    </Show>
  </Match>
  <Match when={array.length > 1}>...</Match>
</Switch>