use-supabase-hooks v0.1.4
⚠️ Usage of this package isn't advised considering the new auth helpers (https://supabase.com/docs/guides/auth/auth-helpers) provided by supabase.
use-supabase-hooks
use-supabase-hooks contains react hooks for common supabase functions, with type safety!
Website: https://use-supabase-hooks.vercel.app
Installation
use-supabase-hooks is available as a npm package, you can install it using your preferred package manager.
$ npm i use-supabase-hooksUsage
Currently use-supabase-hooks exports a total of 8 hooks, using them is pretty straight forward. The list of hooks along with their usage is below:
using the useUser hook:
import { useUser } from "use-supabase-hooks";
const { user, loading, error } = useUser(client);In the above example, client is the Supabase client, and the hook returns the current user, loading and error state.
using the useAuth hook
Signing Up using email and password combination:
import { useAuth } from "use-supabase-hooks";
const { signIn, signUp } = useAuth(client);
const { user, session, error } = await signIn({
email: "eddiemunson@st.com",
password: "dusty-bun",
});Signing In using email and password combination:
import { useAuth } from "use-supabase-hooks";
const { signIn } = useAuth(client);
const { user, session, error } = await signIn({
email: "eddiemunson@st.com",
password: "dusty-bun",
redirectTo: "http://localhost:3000/dashboard",
});Signing In using third party providers
import { useAuth } from "use-supabase-hooks";
const { signIn } = useAuth(client);
const { user, session, error } = await signIn({
provider: "google", // accepts any valid supabase provider
redirectTo: "http://localhost:3000/dashboard",
});using the useSelectData hook:
import { useSelectData } from "use-supabase-hooks";
const { data, loading, error } = useSelectData(client, "users", {
picks: ["name", "email"], // columns to pick
eqs: ["id", 1], // equality conditions
});using the useInsertData hook:
import { useInsertData } from "use-supabase-hooks";
const { data, loading, error } = useInsertData(client, "users", data: {
id: 1,
name: "Eddie Munson",
email: "eddiemunson@st.com",
});using the useUpdateData hook:
import { useUpdateData } from "use-supabase-hooks";
const { data, loading, error } = useUpdateData(client, "users", data: {
id: 1,
name: "Eddie the Banished",
email: "eddiemunson@st.com",
}, eqs: ["id", 1]);using the useUpsertData hook:
import { useUpsertData } from "use-supabase-hooks";
const { data, loading, error } = useUpsertData(client, "users", data: {
id: 1,
name: "Steve Harrington",
email: "steve@st.com",
});using the useDeleteData hook:
import { useDeleteData } from "use-supabase-hooks";
const { data, loading, error } = useDeleteData(client, "users", eqs: ["id", 1]);And thats a wrap for this one! Hope you find this useful!