Merge pull request #274 from sultson/main

Fix docs to improve guidance on subscription hooks usage

docs/pages/postgrest/custom-cache-updates.mdx

@@ -56,7 +56,7 @@ Upsert a postgrest entity into the cache. Note that you have to pass a value for
     import { useUpsertItem } from "@supabase-cache-helpers/postgrest-swr";
 
     function Page() {
-        const deleteItem = useDeleteItem({
+        const upsertItem = useUpsertItem({
           primaryKeys: ['id'],
           table: 'contact',
           schema: 'public',
@@ -73,7 +73,7 @@ Upsert a postgrest entity into the cache. Note that you have to pass a value for
     import { useUpsertItem } from "@supabase-cache-helpers/postgrest-react-query";
 
     function Page() {
-        const deleteItem = useDeleteItem({
+        const upsertItem = useUpsertItem({
           primaryKeys: ['id'],
           table: 'contact',
           schema: 'public',

docs/pages/postgrest/getting-started.mdx

@@ -145,7 +145,8 @@ The query cache will automatically be updated when new data comes in. If you use
 
     function Page() {
       const { status } = useSubscription(
-        client.channel("random"),
+        client,
+        `insert-channel-name`,
         {
           event: "*",
           table: "contact",
@@ -170,7 +171,8 @@ The query cache will automatically be updated when new data comes in. If you use
 
     function Page() {
       const { status } = useSubscription(
-        client.channel("random"),
+        client,
+        `insert-channel-name`,
         {
           event: "*",
           table: "contact",

docs/pages/postgrest/subscriptions.mdx

@@ -6,7 +6,7 @@ The cache helpers subscription hooks are simple `useEffect`-based hooks that man
 
 ## `useSubscription`
 
-The `useSubscription` hook simply manages a realtime subscription. Upon retrieval of an update, it updates the cache with the retrieved data the same way the mutation hooks do. It exposes all params of the .on() method, including the callback, as well as the mutation options of the respective library.
+The `useSubscription` hook simply manages a realtime subscription. Upon retrieval of an update, it updates the cache with the retrieved data the same way the mutation hooks do. It exposes all params of the .on() method, including the callback, as well as the mutation options of the respective library. NOTE: Channel names must be unique when using multiple subscription hooks.
 
 <Tabs items={['SWR', 'React Query']}>
   <Tab>
@@ -23,7 +23,7 @@ The `useSubscription` hook simply manages a realtime subscription. Upon retrieva
     function Page() {
       const { status } = useSubscription(
         client,
-        `random`,
+        `insert-channel-name`,
         {
           event: '*',
           table: 'contact',
@@ -52,7 +52,7 @@ The `useSubscription` hook simply manages a realtime subscription. Upon retrieva
     function Page() {
       const { status } = useSubscription(
         client,
-        `random`,
+        `insert-channel-name`,
         {
           event: '*',
           table: 'contact',
@@ -88,7 +88,7 @@ The `useSubscriptionQuery` hook does exactly the same as the `useSubscription` h
     function Page() {
       const { status } = useSubscriptionQuery(
         client,
-        `random`,
+        `insert-channel-name`,
         {
           event: '*',
           table: 'contact',
@@ -118,7 +118,7 @@ The `useSubscriptionQuery` hook does exactly the same as the `useSubscription` h
     function Page() {
       const { status } = useSubscriptionQuery(
         client,
-        `random`,
+        `insert-channel-name`,
         {
           event: '*',
           table: 'contact',