harsh-harlequin

Correctly typing data on `placeholderData`

I want to use an object which is a partial of the data to display a better loading state. Imagine a blog post index that only has the title, when routing to the post it starts fetching the full post, but meanwhile I'd love to use the partial post from the index as placeholderData. However, while loading the type of data is not partial. Any thoughts, am I doing it wrong?

3 Replies

generous-apricot•4y ago

placeholderData needs to still confirm to the type of data that is returned form the queryFn.

harsh-harlequinOP•4y ago

Got it. Interestingly Prisma's two different payload types seem to both satisfy placeholderData placeholder is

type DBOrder = Order & {
    user: User & {
        messages: Message[];
    };
    _count: {
        lineItems: number;
    };

type DBOrder = Order & {
    user: User & {
        messages: Message[];
    };
    _count: {
        lineItems: number;
    };

the data one is

const data: (Order & {
    lineItems: LineItem[];
    hurryTasks: HurryTask[];
}) | undefined

const data: (Order & {
    lineItems: LineItem[];
    hurryTasks: HurryTask[];
}) | undefined

no idea why the placeholder, which doesn't have lineItems or hurryTasks passes the type check Probably a Prisma thing, how it generates the types

generous-apricot•4y ago

yeah, weird

Gaming

Programming

Correctly typing data on `placeholderData`

Did you find this page helpful?