22 lines
596 B
TypeScript
22 lines
596 B
TypeScript
import React from "react";
|
|
import { useLiveQuery } from "../../src";
|
|
import { Item } from "../models/Item";
|
|
import { ItemComponent } from "./ItemComponent";
|
|
|
|
export interface Props {
|
|
id: number;
|
|
loadItem: (id: number) => Promise<Item | undefined>;
|
|
}
|
|
|
|
export function ItemLoaderComponent({ id, loadItem }: Props) {
|
|
const item = useLiveQuery(() => loadItem(id), [id], "loading");
|
|
if (item === "loading") return <p>Loading...</p>;
|
|
if (!item)
|
|
return (
|
|
<p className="not-found-item">
|
|
<span>NOT_FOUND</span>: {id}
|
|
</p>
|
|
);
|
|
return <ItemComponent item={item} />;
|
|
}
|