mirror of
https://github.com/hanzo-apps/hanzo.ai.git
synced 2026-10-29 07:20:43 +00:00
zeekay
6c65e3e941
Every import, the catalog pin and the docs name @hanzo/app and github.com/hanzoai/app. lib/rooms.ts is lib/app.ts and components/rooms.tsx is components/app.tsx.
27 lines
1.1 KiB
TypeScript
27 lines
1.1 KiB
TypeScript
'use client'
|
|
|
|
import { lazy, Suspense, type ComponentProps } from 'react'
|
|
import { View } from '@/components/ui'
|
|
|
|
/**
|
|
* ProviderMark, the one mark table, fetched when a mark is first drawn. Its
|
|
* bodies are about 32 KB after brotli, and a client component that imported the
|
|
* table put all of it in its page's first load (the landing, /dev, /gen,
|
|
* /templates, the rooms' Home and Inbox) for a handful of marks below the fold.
|
|
* A server page renders ProviderMark itself and ships none of it.
|
|
*/
|
|
const Table = lazy(() => import('@hanzo/app/ProviderMark').then((m) => ({ default: m.ProviderMark })))
|
|
|
|
/** ProviderMark's own props: the lab, the model, the edge in px (32 by default), and the page's ink. */
|
|
export type MarkProps = ComponentProps<typeof Table>
|
|
|
|
/** A lab's mark, its footprint standing empty while the table loads, so nothing beside it moves. */
|
|
export function Mark(props: MarkProps) {
|
|
const size = props.size ?? 32
|
|
return (
|
|
<Suspense fallback={<View aria-hidden width={size} height={size} shrink={0} />}>
|
|
<Table {...props} />
|
|
</Suspense>
|
|
)
|
|
}
|