chore: update readme

Author: tmm

.github/ISSUE_TEMPLATE/config.yml

@@ -1,5 +1,5 @@
 blank_issues_enabled: false
 contact_links:
-  - name: Ask Question
-    url: https://github.com/tmm/react-supabase/discussions
-    about: Ask questions and discuss with other community members
+    - name: Ask Question
+      url: https://github.com/tmm/react-supabase/discussions
+      about: Ask questions and discuss with other community members

README.md

@@ -2,12 +2,12 @@
 
 `react-supabase` is a React Hooks library for [Supabase](https://supabase.io).
 
+With `react-supabase`, components can request and access data declaratively without needing to handle state updates on their own.
+
 <br/>
 
 ## Installation
 
-Inside your React project directory, install:
-
 ```
 yarn add react-supabase @supabase/supabase-js
 # or
@@ -33,7 +33,7 @@ const App = () => (
 )
 ```
 
-Now every component and element inside and under the `Provider` can use the Supabase client:
+Now every component inside and under the `Provider` can use the Supabase client:
 
 ```js
 import { useSelect } from 'react-supabase'
@@ -57,6 +57,82 @@ const Todos = () => {
 
 <br/>
 
+### API
+
+#### Auth
+
+```js
+useAuthStateChange((event, session) => {
+  console.log(`Supbase auth event: ${event}`, session)
+})
+```
+
+```js
+const [{ error, fetching }, resetPassword] = useResetPassword({
+  options: {
+    redirectTo: 'https://example.com/welcome',
+  },
+})
+
+const { error } = await resetPassword('user@example.com', {
+  redirectTo: 'https://example.com/reset',
+})
+```
+
+```js
+const [{ error, fetching, user, session }, signIn] = useSignIn({
+  // provider: 'github',
+  options: {
+    redirectTo: 'https://example.com/dashboard',
+    // scopes: 'repo gist notifications',
+  },
+})
+
+const { error, session, user } = await signIn(
+  {
+    email: 'user@example.com',
+    password: 'foobarbaz', // omit for magic link
+    // provider: 'github',
+  },
+  {
+    redirectTo: 'https://example.com/dashboard',
+    // scopes: 'repo gist notifications',
+  },
+)
+```
+
+```js
+const [{ error, fetching }, signOut] = useSignOut()
+
+const { error } = await signOut()
+```
+
+```js
+const [{ error, fetching, user, session }, signUp] = useSignUp({
+  options: {
+    redirectTo: 'https://example.com/dashboard',
+  },
+})
+
+const { error, session, user } = await signUp(
+  {
+    email: 'user@example.com',
+    password: 'foobarbaz',
+  },
+  {
+    redirectTo: 'https://example.com/dashboard',
+  },
+)
+```
+
+#### Data
+
+#### Realtime
+
+#### Storage
+
+<br/>
+
 ## License
 
 The MIT License.

src/hooks/data/use-select.ts

@@ -1,4 +1,4 @@
-import { useCallback, useEffect, useMemo, useRef, useState } from 'react'
+import { useCallback, useEffect, useRef, useState } from 'react'
 
 import { Count, Filter, PostgrestError } from '../../types'
 import { useClient } from '../use-client'
@@ -35,19 +35,18 @@ export function useSelect<Data = any>(
     const isMounted = useRef(false)
     const [state, setState] = useState<UseSelectState>(initialState)
 
-    const source = useMemo(() => {
-        const { columns, filter, options } = config
-        const source = client.from<Data>(table).select(columns, options)
-        return filter ? filter(source) : source
-    }, [client, config, table])
-
     const execute = useCallback(async () => {
         setState({ ...initialState, fetching: true })
-        const { count, data, error } = await source
+        const source = client
+            .from<Data>(table)
+            .select(config.columns, config.options)
+        const { count, data, error } = await (config.filter
+            ? config.filter(source)
+            : source)
         const res = { count, data, error }
         if (isMounted.current) setState({ ...res, fetching: false })
         return res
-    }, [source])
+    }, [client, config, table])
 
     /* eslint-disable react-hooks/exhaustive-deps */
     useEffect(() => {