Calendar screen

This screen shows a list of activities in chronological order, grouped by day. The list is infinitely scrollable in both directions.

import { useSearch } from '@healthblocks-io/core/fhir'
import Calendar from '@healthblocks-io/native/Calendar'
import { CalendarContext } from '@healthblocks-io/native/CalendarContext'
import Loading from '@healthblocks-io/native/Loading'

export default function CalendarLoadingScreen() {
  // Query relevant data
  const search = useSearch<CarePlanActivity>({ type: 'CarePlan.Activity' })
  const activities = search.data?.entry

  // Context for actions on the cards
  const value = useMemo(() => ({ refresh: () => search.mutate() }), [])

  // Show error state
  if (search.error) return null

  // Show loading state
  if (!activities) return <Loading />

  // Show empty state
  if (!activities.length) return null

  return (
    <CalendarContext.Provider value={value}>
      <Calendar activities={activities} />
    </CalendarContext.Provider>
  )
}