How can I call the Supabase Function inside the component (not the start .tsx)?
I have index.tsx like this
import MediaBackgroundC from "@/components/index_c/media_background_c/MediaBackgroundC";
import RecommendedListC from "@/components/index_c/recommended_list_c/RecommendedListC";
import { adsFn } from "@/z_data/supa.data/ad.data";
import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
import { createFileRoute } from "@tanstack/react-router";
const queryClient = new QueryClient();
export const Route = createFileRoute("/")({
component: App,
loader: () => adsFn(),
});
function App() {
const ads = Route.useLoaderData() as string[] | null;
return (
<div className="">
<ListOfAdsC ads={ads} />
<div className="h-screen" />
<QueryClientProvider client={queryClient}>
<ListOfProfilesC />
</QueryClientProvider>
</div>
);
}
And then I want to call the supabase function inside the <ListOfProfilesC />.
export default function ListOfProfilesC() {
const pQuery = useQuery({
queryKey: ["p-list", "p"],
queryFn: () => getProfileListFn("p", 10),
});
return (
<div className="min-h-screen bg-linear-to-b from-black to-slate-700 p-4">{....}
</div>
);
export const getProfileListFn = async (id: string,) => {
const { data, error } = await supaDB
.from("user_activity")
.select("id")
.eq("id", id);
if (error || !data) {
return null;
}
return data as string[];
};
But this one causing
[plugin:vite:import-analysis] Failed to resolve import "tanstack-start-injected-head-scripts:v" from "node_modules/@tanstack/start-server-core/dist/esm/router-manifest.js?v=6f23d131". Does the file exist?
../../src/router-manifest.ts:22:6
Click outside, press Esc key, or fix the code to dismiss.
You can also disable this overlay by setting server.hmr.overlay to false in vite.config.ts. <---
I tried to add like "use client" or <QueryClientProvider client={queryClient}> but it does not do anything ;"(
3 Replies
unwilling-turquoise•2w ago
I am not familiar with supabase, is
supaDB accessible from client side?
how is your adsFn implementation?absent-sapphireOP•2w ago
adsFn is also supabase but implemted to the loader. It works great
However, I am trying to get more data after index.tsx is initialized
unwilling-turquoise•2w ago
Hmmm.... the error happens when you used server utilities (
getCookie, getRequest, etc) in the client
Do you have any of those?
https://discord.com/channels/719702312431386674/1428069802299097128/1428069802299097128