hey guys, i've got supabase set up with my remix a...
# help
r
hey guys, i've got supabase set up with my remix app.. but for some reason doing:
Copy code
const { error, data } = await supabase.from("jobs").select("*");
  return { data };
isn't grabbing any data from the specified table (it's set up and has a single row of data) my supabase client is all set up correctly, I'm currently using it for authentication - so I'm not 100% sure as to why it's not returning any results, any help would be appreciated!
j
hey guys, i've got supabase set up with my remix app.. but for some reason doing:
Copy code
const { error, data } = await supabase.from("jobs").select("*");
  return { data };
isn't grabbing any data from the specified table (it's set up and has a single row of data) my supabase client is all set up correctly, I'm currently using it for authentication - so I'm not 100% sure as to why it's not returning any results, any help would be appreciated!
If data is
null
, then what is the value of
error
?
if data is not null, then is it an empty array?
r
Both are undefined... very odd
j
yeah that is interesting
well if you can provide a bit more context I can likely help you out. I've deployed about 6 remix/supabase apps in the last couple months.
I don't have any insight into how you are creating your supabase instance, I don't know if any RLS is setup
r
Sure! Give me a few minutes, I'll send some stuff over - I haven't set up RLS, there are no policies in place, I've just set up the instance, set up auth (I will later enable RLS), and got started
j
supabase queries
r
Copy code
import { createClient } from "@supabase/supabase-js";
import { getSession } from "./session.server";

const supabaseUrl = process.env.SUPABASE_URL;
const supabaseKey = process.env.SUPABASE_ANON_KEY;

export const supabase = createClient(supabaseUrl, supabaseKey);
Here's how I create my instance
SUPABASE_URL and SUPABASE_ANON_KEY are set correctly as far as I know, will have to check
j
ok, cool so that is pretty standard
i should work with remix, although that is a module side effect which they recommend against (I can talk about that more after we figure out why your basic query isn't working)
r
Some further context:
Copy code
import { useState } from "react";
import { Form, LoaderFunction, useLoaderData } from "remix";
import { supabase } from "~/utils/db.server";
import JobList from "./JobList";

export const loader: LoaderFunction = async ({ request }) => {
  //   const [loading, setLoading] = useState(false);
  const { error, data } = await supabase.from("jobs").select();
  return { data };
};

export default function JobSearch() {
  const jobs = useLoaderData();

  console.log(jobs);

...
I've tried all variations of
.select()
j
Ok, and in this case
jobs
is
{ data: undefined }
?
r
indeed
j
and when you console log in the loader
you get undefined for both error and data?
in the terminal output
r
just checking...
I'm not getting any output now...
when i
console.log
jobs, it comes out as undefined
for context,
jobs
is a brand new table, with one row of data
j
Yeah, I find that the quickest way to find the issue with the integration between client and supabase is to get access to that
error
var. When we can see that it is null, we can determine what side the issue is on.
So it would be very useful to be able to log from that loader.
r
AH
got it.. haha
i was loading the data inside of a nested child component... eesh
-.-
j
Oh I see.
Not a route?
r
correct, I should learn Remix a little better 😉
j
I have a bunch of examples
r
I just moved the loaderfunction to the route, and problem solved
r
Will definitely take a look
j
I was going to suggest reading about module side effects. I had to change my supabase creation to a method.
So that talks about modules with side effects
r
Hmm, makes sense
j
Lately I'm self hosting supabase and have a custom version of GoTrue that allows for serverside only auth.
So my newer examples don't work with the managed supabase.
auth part at least
r
Yeah, I find that there aren't many good examples for auth with supabase and remix yet, I did see a package come out recently forked from sergiodxa's remix-auth package, but when I tried using it, it wasn't very flexible
So I just decided to roll my own
j
I've spent a lot of time trying a bunch of stuff. I found that the client side was flaky for some people. Seemed it wouldn't set the cookie if they had an add blocker.
r
Yeah! I think that was one of my issues... hahaha
j
well, I've been having good results with my changes.
r
I'll definitely read through some of your stuff, appreciate the help 🙂
j
No problem. Good luck