Remix js, что происходит с типами?

Question

[JeanPaulBelmondo]

используется remixjs, получаю данные из loader'a

const { themes: { all, selectedId } } = useLoaderData<typeof loader>();

там с типами всё ок, правда не очень понимаю что такое JsonifyObject, но видимо ремиксу ножно

(property) themes: JsonifyObject<{
all: Theme[];
selectedId: string;
}>

после я пытаюсь использовать "all", но там уже какое-то Body, отродясь у меня такого типа не было

const all: Body[]

что это такое и куда копать?

Answer 1

[Nik Faraday]

Вот сюда копайте

Answer 2

[mscmls]

Первая ссылка в гугле.

Попробуй использовать хэлпер "json" из ремикса и в возврате лоадера отдавай не просто объект, а оборачивай его в json({ /* ... */ }). Не пробовал, но насколько я правильно ответ понял на SO - может быть из-за этого.

P.S. А вообще - смысл оборачивать всё в JsonifyObject и т.д., если можно явно описать ожидаемый/неожиданный объект? Например:

import { useLoaderData } from 'react-router-dom'

type LoaderProps = {
    themes: {
        all: string[],
        selectedId: string
    }
} | null

export const Component = () => {
    const data = useLoaderData() as LoaderProps
    return data?.themes ? (
        <>
            Selected theme Id: { data.themes.selectedId }
            All themes: { JSON.stringify(data.themes.all) }
        </>
    ) : (
        <>No themes</>
    )
}

/// 

export const routes = [
    {
        path: '/',
        element: <Component/>,
        loader: () => ({
            themes: {
                all: [
                    'light',
                    'dark'
                ],
                selectedId: 'light'
            }
        })
    }
    /* ... */
]