13th Dec, 2023
Create and retrieve a record with supabase.js
Creating a new record in supabase is pretty straight forward:
const { error } = await supabase.from('results').insert({
wpm: results.wpm,
errorRate: results.errorRate,
quote_id: results.quoteId,
})
When creating a single resource, I often times want to use it right away. However,
supabase's insert()
only will only tell you if inserting was successful or not.
In the documentation you
can toggle a (not very obvious) tab that will show you what to do if you want to
use the created record right away:
const { data: result, error } = await supabase
.from('results')
.insert({
wpm: results.wpm,
errorRate: results.errorRate,
quote_id: results.quoteId,
})
.select()
This will return an array (with only one entry in this case) though.
return result
// ^
// const result: {
// created_at: string;
// errorRate: number | null;
// id: number;
// quote_id: number | null;
// wpm: number;
// }[]
So we use single()
to tell supbase that we're only expecting one row. Full call
looks like this:
const { data: result, error } = await supabase
.from('results')
.insert({
wpm: results.wpm,
errorRate: results.errorRate,
quote_id: results.quoteId,
})
.select()
.single()
if (error) {
// error handling
}
return result.id
Since I keep forgetting this, hopefully this will help me remember.