export default function CategoriesPage(props: Route.ComponentProps) {
console.log("props.loaderData", props.loaderData);
const categories =
// @ts-expect-error - loaderData is not null
props.loaderData.categories ?? props.loaderData?.data?.categories;in the above example, I am fetching categories in my loader, and returning it using data api, example below.
export async function loader(requestArgs: Route.LoaderArgs) {
return await partnerAuthLoader(requestArgs, async (authArgs) => {
authArgs.auth.accessToken;
const headers = await getDefaultHeaders(authArgs.request, authArgs.auth);
const res = await getCategories({
headers,
});
return data({ categories: res.data });
});
}If I don't do the hack mentioned above, I'll have to manually refresh the page to get any data, as HMR do not work. another issue with that is I lose my type support and have to assign it manualy.
in the above example, I am fetching
categoriesin my loader, and returning it usingdataapi, example below.If I don't do the hack mentioned above, I'll have to manually refresh the page to get any data, as HMR do not work. another issue with that is I lose my type support and have to assign it manualy.