diff --git a/DEVELOPERS.md b/DEVELOPERS.md
index 585e7359e3d..9d769ccb70e 100644
--- a/DEVELOPERS.md
+++ b/DEVELOPERS.md
@@ -35,8 +35,6 @@ We are in the process of migrating this repository to monorepo, using [Turborepo
 
 Eventually, all the apps will be run using [Turborepo](https://turborepo.org/docs), which will significantly improve the developer workflow.
 
-If you are working on the ([docs site](https://supabase.com/docs)), please refer to this [developers guide](https://github.com/supabase/supabase/tree/master/apps/reference/DEVELOPERS.md).
-
 ### Fork the repository
 
 To contribute code to [Supabase](https://supabase.com), you must fork the [Supabase Repository](https://github.com/supabase/supabase).
@@ -71,11 +69,11 @@ To contribute code to [Supabase](https://supabase.com), you must fork the [Supab
 
 Then visit, and edit, any of the following sites:
 
-| Site                                           | Directory      | Scope name | Description                          | Local development server |
-| ---------------------------------------------- | -------------- | ---------- | ------------------------------------ | ------------------------ |
-| [supabase.com](https://supabase.com)           | `/apps/www`    | www        | The main website                     | http://localhost:3000    |
-| [app.supabase.com](https://app.supabase.com)   | `/studio`      | studio     | Studio dashboard                     | http://localhost:8082    |
-| [supabase.com/docs](https://supabase.com/docs) | `/apps/docs`   | docs       | Guides and Reference (Next.js based) | http://localhost:3001    |
+| Site                                           | Directory    | Scope name | Description                          | Local development server   |
+| ---------------------------------------------- | ------------ | ---------- | ------------------------------------ | -------------------------- |
+| [supabase.com](https://supabase.com)           | `/apps/www`  | www        | The main website                     | http://localhost:3000      |
+| [app.supabase.com](https://app.supabase.com)   | `/studio`    | studio     | Studio dashboard                     | http://localhost:8082      |
+| [supabase.com/docs](https://supabase.com/docs) | `/apps/docs` | docs       | Guides and Reference (Next.js based) | http://localhost:3001/docs |
 
 #### Running sites individually
 
diff --git a/apps/docs/components/Navigation/Navigation.constants.ts b/apps/docs/components/Navigation/Navigation.constants.ts
index 3c407085da2..5db85450719 100644
--- a/apps/docs/components/Navigation/Navigation.constants.ts
+++ b/apps/docs/components/Navigation/Navigation.constants.ts
@@ -245,7 +245,9 @@ export const menuItems: NavMenu = {
       label: 'Storage',
       items: [
         { name: 'Overview', url: '/guides/storage', items: [] },
-        { name: 'CDN', url: '/guides/storage-cdn', items: [] },
+        { name: 'Quickstart', url: '/guides/storage/quickstart', items: [] },
+        { name: 'Access Control', url: '/guides/storage/access-control', items: [] },
+        { name: 'CDN', url: '/guides/storage/cdn', items: [] },
       ],
     },
     {
diff --git a/apps/docs/pages/guides/auth/auth-helpers/remix.mdx b/apps/docs/pages/guides/auth/auth-helpers/remix.mdx
index 6df649ea7b1..0aa105dd66a 100644
--- a/apps/docs/pages/guides/auth/auth-helpers/remix.mdx
+++ b/apps/docs/pages/guides/auth/auth-helpers/remix.mdx
@@ -9,6 +9,8 @@ export const meta = {
 
 This submodule provides convenience helpers for implementing user authentication in Remix applications.
 
+> Check out [this repo](https://github.com/supabase/auth-helpers/tree/main/examples/remix) for a full example.
+
 ## Install the Remix helper library
 
 <Tabs
@@ -50,7 +52,13 @@ SUPABASE_URL=YOUR_SUPABASE_URL
 SUPABASE_ANON_KEY=YOUR_SUPABASE_ANON_KEY
 ```
 
-## Loader
+## Server-side
+
+The Supabase client can now be used server-side - in loaders and actions - by calling the `createServerClient` function.
+
+### Loader
+
+Loader functions run on the server immediately before the component is rendered. They respond to all GET requests on a route. You can create an authenticated Supabase client by calling the `createServerClient` function and passing it your `SUPABASE_URL`, `SUPABASE_ANON_KEY`, and a `Request` and `Response`.
 
 <Tabs
   scrollable
@@ -60,8 +68,6 @@ SUPABASE_ANON_KEY=YOUR_SUPABASE_ANON_KEY
 >
 <TabPanel id="js" label="JavaScript">
 
-Loader functions run on the server immediately before the component is rendered. They respond to all GET requests on a route. You can create an authenticated Supabase client by calling the `createServerClient` function and passing it your `SUPABASE_URL`, `SUPABASE_ANON_KEY`, and a `Request` and `Response`.
-
 ```jsx
 import { json } from '@remix-run/node' // change this import to whatever runtime you are using
 import { createServerClient } from '@supabase/auth-helpers-remix'
@@ -95,17 +101,17 @@ export const loader = async ({ request }) => {
 </TabPanel>
 <TabPanel id="ts" label="TypeScript">
 
-Loader functions run on the server immediately before the component is rendered. You can create an authenticated Supabase client by calling the `createServerClient` function and passing it your `SUPABASE_URL`, `SUPABASE_ANON_KEY`, and a `Request` and `Response`.
-
 ```jsx
-import { LoaderFunction, json } from '@remix-run/node' // change this import to whatever runtime you are using
+import { json } from '@remix-run/node' // change this import to whatever runtime you are using
 import { createServerClient } from '@supabase/auth-helpers-remix'
 
-export const loader: LoaderFunction = async ({ request }: { request: Request }) => {
+import type { LoaderArgs } from '@remix-run/node' // change this import to whatever runtime you are using
+
+export const loader = async ({ request }: LoaderArgs) => {
   const response = new Response()
   const supabaseClient = createServerClient(
-    process.env.SUPABASE_URL,
-    process.env.SUPABASE_ANON_KEY,
+    process.env.SUPABASE_URL!,
+    process.env.SUPABASE_ANON_KEY!,
     { request, response }
   )
 
@@ -125,7 +131,9 @@ export const loader: LoaderFunction = async ({ request }: { request: Request })
 </TabPanel>
 </Tabs>
 
-## Action
+### Action
+
+Action functions run on the server and respond to HTTP requests to a route, other than GET - POST, PUT, PATCH, DELETE etc. You can create an authenticated Supabase client by calling the `createServerClient` function and passing it your `SUPABASE_URL`, `SUPABASE_ANON_KEY`, and a `Request` and `Response`.
 
 <Tabs
   scrollable
@@ -135,8 +143,6 @@ export const loader: LoaderFunction = async ({ request }: { request: Request })
 >
 <TabPanel id="js" label="JavaScript">
 
-Action functions run on the server and respond to HTTP requests to a route, other than GET - POST, PUT, PATCH, DELETE etc. You can create an authenticated Supabase client by calling the `createServerClient` function and passing it your `SUPABASE_URL`, `SUPABASE_ANON_KEY`, and a `Request` and `Response`.
-
 ```jsx
 import { json } from '@remix-run/node' // change this import to whatever runtime you are using
 import { createServerClient } from '@supabase/auth-helpers-remix'
@@ -166,18 +172,18 @@ export const action = async ({ request }) => {
 </TabPanel>
 <TabPanel id="ts" label="TypeScript">
 
-Action functions run on the server and respond to HTTP requests to a route, other than GET - POST, PUT, PATCH, DELETE etc. You can create an authenticated Supabase client by calling the `createServerClient` function and passing it your `SUPABASE_URL`, `SUPABASE_ANON_KEY`, and a `Request` and `Response`.
-
 ```jsx
-import { ActionFunction, json } from '@remix-run/node' // change this import to whatever runtime you are using
+import { json } from '@remix-run/node' // change this import to whatever runtime you are using
 import { createServerClient } from '@supabase/auth-helpers-remix'
 
-export const action: ActionFunction = async ({ request }: { request: Request }) => {
+import type { ActionArgs } from '@remix-run/node' // change this import to whatever runtime you are using
+
+export const action = async ({ request }: ActionArgs) => {
   const response = new Response()
 
   const supabaseClient = createServerClient(
-    process.env.SUPABASE_URL,
-    process.env.SUPABASE_ANON_KEY,
+    process.env.SUPABASE_URL!,
+    process.env.SUPABASE_ANON_KEY!,
     { request, response }
   )
 
@@ -213,10 +219,22 @@ The session contains a user property.
 const user = session?.user
 ```
 
-> This is the recommended way for accessing the logged in user. There is also a `getUser()` function but this does not refresh the session if it has expired.
+Or, if you don't need the session, you can call the `getUser()` function.
+
+```jsx
+const {
+  data: { user },
+} = await supabaseClient.auth.getUser()
+```
 
 ## Client-side
 
+We still need to use Supabase client-side for things like authentication and realtime subscriptions. Anytime we use Supabase client-side it needs to be a single instance.
+
+### Creating a singleton Supabase client
+
+Since our environment variables are not available client-side, we need to plumb them through from the loader.
+
 <Tabs
   scrollable
   size="small"
@@ -225,658 +243,472 @@ const user = session?.user
 >
 <TabPanel id="js" label="JavaScript">
 
-In order to use the Supabase client in the browser - fetching data in `useEffect` or subscribing to realtime events - we need to do a little more plumbing. Remix does not include a way to make environment variables available to the browser, so we need to pipe them through from a `loader` function in our `root.jsx` route and attach them to the `window`.
-
 ```jsx title=app/root.jsx
 export const loader = () => {
-  const { SUPABASE_URL, SUPABASE_ANON_KEY } = process.env
-  return json({
-    env: {
-      SUPABASE_URL,
-      SUPABASE_ANON_KEY,
-    },
-  })
-}
-```
-
-> These may not be stored in `process.env` for environments other than Node.
-
-Next, we call the `useLoaderData` hook in our component to get the `env` object.
-
-```jsx title=app/root.jsx
-const { env } = useLoaderData()
-```
-
-And then, add a `<script>` tag to attach these environment variables to the `window`. This should be placed immediately before the `<Scripts />` component in `app/root.jsx`
-
-```jsx title=app/root.jsx
-<script
-  dangerouslySetInnerHTML={{
-    __html: `window.env = ${JSON.stringify(env)}`,
-  }}
-/>
-```
-
-Full example for Node:
-
-```jsx title=app/root.jsx
-import { json } from '@remix-run/node' // change this import to whatever runtime you are using
-import {
-  Form,
-  Links,
-  LiveReload,
-  Meta,
-  Outlet,
-  Scripts,
-  ScrollRestoration,
-  useLoaderData,
-} from '@remix-run/react'
-import { createBrowserClient, createServerClient } from '@supabase/auth-helpers-remix'
-
-export const meta = () => ({
-  charset: 'utf-8',
-  title: 'New Remix App',
-  viewport: 'width=device-width,initial-scale=1',
-})
-
-export const loader = () => {
-  const { SUPABASE_URL, SUPABASE_ANON_KEY } = process.env
-  return json({
-    env: {
-      SUPABASE_URL,
-      SUPABASE_ANON_KEY,
-    },
-  })
-}
-
-export default function App() {
-  const { env } = useLoaderData()
-
-  return (
-    <html lang="en">
-      <head>
-        <Meta />
-        <Links />
-      </head>
-      <body>
-        <Outlet />
-        <ScrollRestoration />
-        <script
-          dangerouslySetInnerHTML={{
-            __html: `window.env = ${JSON.stringify(env)}`,
-          }}
-        />
-        <Scripts />
-        <LiveReload />
-      </body>
-    </html>
-  )
-}
-```
-
-Now we can call `createBrowserClient` in our components to fetch data client-side, or subscribe to realtime events - changes in the database.
-
-</TabPanel>
-<TabPanel id="ts" label="TypeScript">
-
-In order to use the Supabase client in the browser - fetching data in `useEffect` or subscribing to realtime events - we need to do a little more plumbing. Remix does not include a way to make environment variables available to the browser, so we need to pipe them through from a `loader` function in our `root.tsx` route and attach them to the `window`.
-
-```jsx title=app/root.tsx
-export const loader = () => {
-  const { SUPABASE_URL, SUPABASE_ANON_KEY } = process.env
-  return json({
-    env: {
-      SUPABASE_URL,
-      SUPABASE_ANON_KEY,
-    },
-  })
-}
-```
-
-> These may not be stored in `process.env` for environments other than Node.
-
-Next, we call the `useLoaderData` hook in our component to get the `env` object.
-
-```jsx title=app/root.tsx
-const { env } = useLoaderData()
-```
-
-And then, add a `<script>` tag to attach these environment variables to the `window`. This should be placed immediately before the `<Scripts />` component in `app/root.tsx`
-
-```jsx title=app/root.tsx
-<script
-  dangerouslySetInnerHTML={{
-    __html: `window.env = ${JSON.stringify(env)}`,
-  }}
-/>
-```
-
-Full example for Node:
-
-```jsx title=app/root.tsx
-import { json, MetaFunction, LoaderFunction } from '@remix-run/node' // change this import to whatever runtime you are using
-import {
-  Form,
-  Links,
-  LiveReload,
-  Meta,
-  Outlet,
-  Scripts,
-  ScrollRestoration,
-  useLoaderData,
-} from '@remix-run/react'
-import { createBrowserClient, createServerClient } from '@supabase/auth-helpers-remix'
-
-export const meta: MetaFunction = () => ({
-  charset: 'utf-8',
-  title: 'New Remix App',
-  viewport: 'width=device-width,initial-scale=1',
-})
-
-export const loader: LoaderFunction = () => {
-  const { SUPABASE_URL, SUPABASE_ANON_KEY } = process.env
-  return json({
-    env: {
-      SUPABASE_URL,
-      SUPABASE_ANON_KEY,
-    },
-  })
-}
-
-export default function App() {
-  const { env } = useLoaderData()
-
-  return (
-    <html lang="en">
-      <head>
-        <Meta />
-        <Links />
-      </head>
-      <body>
-        <Outlet />
-        <ScrollRestoration />
-        <script
-          dangerouslySetInnerHTML={{
-            __html: `window.env = ${JSON.stringify(env)}`,
-          }}
-        />
-        <Scripts />
-        <LiveReload />
-      </body>
-    </html>
-  )
-}
-```
-
-Now we can call `createBrowserClient` in our components to fetch data client-side, or subscribe to realtime events - changes in the database.
-
-</TabPanel>
-</Tabs>
-
-## Authentication
-
-Now that authentication is based on cookies, users can sign in and out server-side with actions.
-
-Given this Remix `<Form />` component.
-
-```jsx
-<Form method="post">
-  <input type="text" name="email" />
-  <input type="password" name="password" />
-  <button type="submit">Go!</button>
-</Form>
-```
-
-### Signing Up
-
-<Tabs
-  scrollable
-  size="small"
-  type="underlined"
-  defaultActiveId="js"
->
-<TabPanel id="js" label="JavaScript">
-
-Any of the [supported authentication strategies from `supabase-js`](/docs/reference/javascript/auth-signup) will work server-side. This is how you would handle simple `email` and `password` auth.
-
-```jsx
-export const action = async ({ request }) => {
-  const { email, password } = Object.fromEntries(await request.formData())
-  const response = new Response()
-
-  const supabaseClient = createServerClient(
-    process.env.SUPABASE_URL,
-    process.env.SUPABASE_ANON_KEY,
-    { request, response }
-  )
-
-  const { data, error } = await supabaseClient.auth.signUp({
-    email,
-    password,
-  })
-
-  // in order for the set-cookie header to be set,
-  // headers must be returned as part of the loader response
-  return json(
-    { data, error },
-    {
-      headers: response.headers,
-    }
-  )
-}
-```
-
-</TabPanel>
-<TabPanel id="ts" label="TypeScript">
-
-Any of the [supported authentication strategies from `supabase-js`](/docs/reference/javascript/auth-signup) will work server-side. This is how you would handle simple `email` and `password` auth.
-
-```jsx
-export const action: ActionFunction = async ({
-  request
-}: {
-  request: Request;
-}) => {
-  const { email, password } = Object.fromEntries(await request.formData());
-  const response = new Response();
-
-  const supabaseClient = createServerClient(
-    process.env.SUPABASE_URL!,
-    process.env.SUPABASE_ANON_KEY!,
-    { request, response }
-  );
-
-  const { data, error } = await supabaseClient.auth.signUp({
-    email: String(registerEmail),
-    password: String(registerPassword)
-  });
-
-  // in order for the set-cookie header to be set,
-  // headers must be returned as part of the loader response
-  return json(
-    { data, error },
-    {
-      headers: response.headers
-    }
-  );
-};
-```
-
-</TabPanel>
-</Tabs>
-
-### Login
-
-<Tabs
-  scrollable
-  size="small"
-  type="underlined"
-  defaultActiveId="js"
->
-<TabPanel id="js" label="JavaScript">
-
-Any of the [supported authentication strategies from `supabase-js`](/docs/reference/javascript/auth-signinwithpassword) will work server-side. This is how you would handle simple `email` and `password` auth.
-
-```jsx
-export const action = async ({ request }) => {
-  const { email, password } = Object.fromEntries(await request.formData())
-  const response = new Response()
-
-  const supabaseClient = createServerClient(
-    process.env.SUPABASE_URL,
-    process.env.SUPABASE_ANON_KEY,
-    { request, response }
-  )
-
-  const { data, error } = await supabaseClient.auth.signInWithPassword({
-    email: String(loginEmail),
-    password: String(loginPassword),
-  })
-
-  // in order for the set-cookie header to be set,
-  // headers must be returned as part of the loader response
-  return json(
-    { data, error },
-    {
-      headers: response.headers,
-    }
-  )
-}
-```
-
-</TabPanel>
-<TabPanel id="ts" label="TypeScript">
-
-Any of the [supported authentication strategies from `supabase-js`](/docs/reference/javascript/auth-signinwithpassword) will work server-side. This is how you would handle simple `email` and `password` auth.
-
-```jsx
-export const action: ActionFunction = async ({
-  request
-}: {
-  request: Request;
-}) => {
-  const { email, password } = Object.fromEntries(await request.formData());
-  const response = new Response();
-
-  const supabaseClient = createServerClient(
-    process.env.SUPABASE_URL!,
-    process.env.SUPABASE_ANON_KEY!,
-    { request, response }
-  );
-
-  const { data, error } = await supabaseClient.auth.signInWithPassword({
-    email: String(loginEmail),
-    password: String(loginPassword)
-  });
-
-  // in order for the set-cookie header to be set,
-  // headers must be returned as part of the loader response
-  return json(
-    { data, error },
-    {
-      headers: response.headers
-    }
-  );
-};
-```
-
-</TabPanel>
-</Tabs>
-
-### Logout
-
-<Tabs
-  scrollable
-  size="small"
-  type="underlined"
-  defaultActiveId="js"
->
-<TabPanel id="js" label="JavaScript">
-
-```jsx
-export const action = async ({ request }) => {
-  const { email, password } = Object.fromEntries(await request.formData())
-  const response = new Response()
-
-  const supabaseClient = createServerClient(
-    process.env.SUPABASE_URL,
-    process.env.SUPABASE_ANON_KEY,
-    { request, response }
-  )
-
-  const { error } = await supabaseClient.auth.signOut()
-
-  // in order for the set-cookie header to be set,
-  // headers must be returned as part of the loader response
-  return json(
-    { error },
-    {
-      headers: response.headers,
-    }
-  )
-}
-```
-
-</TabPanel>
-<TabPanel id="ts" label="TypeScript">
-
-```jsx
-export const action: ActionFunction = async ({
-  request
-}: {
-  request: Request;
-}) => {
-  const { email, password } = Object.fromEntries(await request.formData());
-  const response = new Response();
-
-  const supabaseClient = createServerClient(
-    process.env.SUPABASE_URL!,
-    process.env.SUPABASE_ANON_KEY!,
-    { request, response }
-  );
-
-  const { error } = await supabaseClient.auth.signOut();
-
-  // in order for the set-cookie header to be set,
-  // headers must be returned as part of the loader response
-  return json(
-    { error },
-    {
-      headers: response.headers
-    }
-  );
-};
-```
-
-</TabPanel>
-</Tabs>
-
-## Subscribe to realtime events
-
-```jsx
-import { createBrowserClient } from '@supabase/auth-helpers-remix'
-import { useState, useEffect } from 'react'
-
-export default function SubscribeToRealtime() {
-  const [data, setData] = useState([])
-
-  useEffect(() => {
-    const supabaseClient = createBrowserClient(
-      window.env.SUPABASE_URL,
-      window.env.SUPABASE_ANON_KEY
-    )
-    const channel = supabaseClient
-      .channel('test')
-      .on('postgres_changes', { event: 'INSERT', schema: 'public', table: 'test' }, (payload) => {
-        setData((data) => [...data, payload.new])
-      })
-      .subscribe()
-
-    return () => {
-      supabaseClient.removeChannel(channel)
-    }
-  }, [session])
-
-  return <pre>{JSON.stringify({ data }, null, 2)}</pre>
-}
-```
-
-> Note: `window.env` is not automatically populated by Remix. Check out the "Client-side" instructions above to configure this.
-
-In this example we are listening to `INSERT` events on the `test` table. Anytime new rows are added to Supabase's `test` table, our UI will automatically update new data.
-
-## Merge server and client state on realtime events
-
-```jsx
-import { json, LoaderFunction } from '@remix-run/node';
-import { useLoaderData, useNavigate } from '@remix-run/react';
-import {
-  createServerClient,
-  createBrowserClient
-} from '@supabase/auth-helpers-remix';
-import { useEffect } from 'react';
-import { Database } from '../../db_types';
-
-// this route demonstrates how to subscribe to realtime updates
-// and synchronize data between server and client
-export const loader: LoaderFunction = async ({
-  request
-}: {
-  request: Request;
-}) => {
-  const response = new Response();
-  const supabaseClient = createServerClient<Database>(
-    process.env.SUPABASE_URL!,
-    process.env.SUPABASE_ANON_KEY!,
-    { request, response }
-  );
-
-  const {
-    data: { session }
-  } = await supabaseClient.auth.getSession();
-
-  const { data, error } = await supabaseClient.from('test').select('*');
-
-  if (error) {
-    throw error;
+  const env = {
+    SUPABASE_URL: process.env.SUPABASE_URL,
+    SUPABASE_ANON_KEY: process.env.SUPABASE_ANON_KEY,
   }
 
-  // in order for the set-cookie header to be set,
-  // headers must be returned as part of the loader response
-  return json(
-    { data, session },
-    {
-      headers: response.headers
-    }
-  );
-};
-
-export default function SubscribeToRealtime() {
-  const { data, session } = useLoaderData();
-  const navigate = useNavigate();
-
-  useEffect(() => {
-    // Note: window.env is not automatically populated by Remix
-    // Check out the [example in this repo](../root.tsx) or
-    // [Remix docs](https://remix.run/docs/en/v1/guides/envvars#browser-environment-variables) for more info
-    const supabaseClient = createBrowserClient<Database>(
-      window.env.SUPABASE_URL,
-      window.env.SUPABASE_ANON_KEY
-    );
-    // make sure you have enabled `Replication` for your table to receive realtime events
-    // https://supabase.com/docs/guides/database/replication
-    const channel = supabaseClient
-      .channel('test')
-      .on(
-        'postgres_changes',
-        { event: '*', schema: 'public', table: 'test' },
-        (payload: any) => {
-          // you could manually merge the `payload` with `data` here
-          // the `navigate` trick below causes all active loaders to be called again
-          // this handles inserts, updates and deletes, keeping everything in sync
-          // which feels more remix-y than manually merging state
-          // https://sergiodxa.com/articles/automatic-revalidation-in-remix
-          navigate('.', { replace: true });
-        }
-      )
-      .subscribe();
-
-    return () => {
-      supabaseClient.removeChannel(channel);
-    };
-  }, [session]);
-
-  return (
-    <div style={{ fontFamily: 'system-ui, sans-serif', lineHeight: '1.4' }}>
-      <pre>{JSON.stringify({ data }, null, 2)}</pre>
-    </div>
-  );
+  return json({ env })
 }
 ```
 
-> Note: `window.env` is not automatically populated by Remix. Check out the "Client-side" instructions above to configure this.
+> These may not be stored in `process.env` for environments other than Node.
 
-## Usage with TypeScript
+Next, we call the `useLoaderData` hook in our component to get the `env` object.
 
-You can pass types that were [generated with the Supabase CLI](/docs/reference/javascript/typescript-support#generating-types) to the `createServerClient` or `createBrowserClient` functions to get enhanced type safety and auto completion:
+```jsx title=app/root.jsx
+const { env } = useLoaderData()
+```
 
-### Server-side
+We then want to instantiate a single instance of a Supabase browser client, to be used across our client-side components.
 
-```ts
-import { createServerClient } from '@supabase/auth-helpers-remix'
-import { Database } from '../../db_types'
+```jsx title=app/root.jsx
+const [supabase] = useState(() => createBrowserClient(env.SUPABASE_URL, env.SUPABASE_ANON_KEY))
+```
 
-export const loader = async ({ request }) => {
-  const response = new Response()
+And then we can share this instance across our application with Outlet Context.
 
-  const supabaseClient = createServerClient<Database>(
-    process.env.SUPABASE_URL,
-    process.env.SUPABASE_ANON_KEY,
-    { request, response }
-  )
+```jsx title=app/root.jsx
+<Outlet context={{ supabase }} />
+```
+
+</TabPanel>
+<TabPanel id="ts" label="TypeScript">
+
+```tsx title=app/root.tsx
+export const loader = ({}: LoaderArgs) => {
+  const env = {
+    SUPABASE_URL: process.env.SUPABASE_URL!,
+    SUPABASE_ANON_KEY: process.env.SUPABASE_ANON_KEY!,
+  }
+
+  return json({ env })
 }
 ```
 
-### Client-side
+> These may not be stored in `process.env` for environments other than Node.
 
-```ts
-import { createBrowserClient } from '@supabase/auth-helpers-remix'
-import { Database } from '../../db_types'
+Next, we call the `useLoaderData` hook in our component to get the `env` object.
 
-const supabaseClient = createBrowserClient<Database>(
-  process.env.SUPABASE_URL,
-  process.env.SUPABASE_ANON_KEY
+```tsx title=app/root.tsx
+const { env } = useLoaderData<typeof loader>()
+```
+
+We then want to instantiate a single instance of a Supabase browser client, to be used across our client-side components.
+
+```tsx title=app/root.tsx
+const [supabase] = useState(() =>
+  createBrowserClient<Database>(env.SUPABASE_URL, env.SUPABASE_ANON_KEY)
 )
 ```
 
-## Server-side data fetching to OAuth APIs using `provider_token`
+And then we can share this instance across our application with Outlet Context.
 
-When using third-party auth providers, sessions are initiated with an additional `provider_token` field which is persisted in the auth cookie and can be accessed within the session object. The `provider_token` can be used to make API requests to the OAuth provider's API endpoints on behalf of the logged-in user.
+```tsx title=app/root.tsx
+<Outlet context={{ supabase }} />
+```
 
-```js
-import { json, LoaderFunction, redirect } from '@remix-run/node'; // change this import to whatever runtime you are using
-import { useLoaderData } from '@remix-run/react';
-import { createServerClient, User } from '@supabase/auth-helpers-remix';
-import { Database } from '../../db_types';
+</TabPanel>
+</Tabs>
 
-export const loader: LoaderFunction = async ({
-  request
-}: {
-  request: Request;
-}) => {
-  const response = new Response();
+### Syncing server and client state
 
-  const supabaseClient = createServerClient<Database>(
-    process.env.SUPABASE_URL!,
-    process.env.SUPABASE_ANON_KEY!,
-    { request, response }
-  );
+Since authentication happens client-side, we need to tell Remix to re-call all active loaders when the user signs in or out.
 
-  const {
-    data: { session }
-  } = await supabaseClient.auth.getSession();
+Remix does this automatically when an action completes. Let's create an empty action.
 
-  if (!session) {
-    // there is no session, therefore, we are redirecting
-    // to the landing page. we still need to return
-    // response.headers to attach the set-cookie header
-    return redirect('/', {
-      headers: response.headers
-    });
+<Tabs
+  scrollable
+  size="small"
+  type="underlined"
+  defaultActiveId="js"
+>
+
+<TabPanel id="js" label="JavaScript">
+
+```jsx title=app/routes/handle-supabase-auth.jsx
+export const action = () => null
+```
+
+</TabPanel>
+
+<TabPanel id="ts" label="TypeScript">
+
+```tsx title=app/routes/handle-supabase-auth.tsx
+export const action = () => null
+```
+
+</TabPanel>
+
+</Tabs>
+
+Now to determine when to submit a post request to this action, we need to compare the server and client state for the user's access token.
+
+Let's pipe that through from our loader.
+
+<Tabs
+  scrollable
+  size="small"
+  type="underlined"
+  defaultActiveId="js"
+>
+
+<TabPanel id="js" label="JavaScript">
+
+```jsx title=app/root.jsx
+export const loader = async ({ request }) => {
+  const env = {
+    SUPABASE_URL: process.env.SUPABASE_URL,
+    SUPABASE_ANON_KEY: process.env.SUPABASE_ANON_KEY,
   }
 
-  // Retrieve provider_token & logged in user's third-party id from metadata
-  const { provider_token, user } = session;
-  const userId = user.user_metadata.user_name;
+  const response = new Response()
 
-  const allRepos = await (
-    await fetch(`https://api.github.com/search/repositories?q=user:${userId}`, {
-      method: 'GET',
-      headers: {
-        Authorization: `token ${provider_token}`
-      }
-    })
-  ).json();
+  const supabase = createServerClient(process.env.SUPABASE_URL, process.env.SUPABASE_ANON_KEY, {
+    request,
+    response,
+  })
+
+  const {
+    data: { session },
+  } = await supabase.auth.getSession()
 
-  // in order for the set-cookie header to be set,
-  // headers must be returned as part of the loader response
   return json(
-    { user, allRepos },
     {
-      headers: response.headers
+      env,
+      session,
+    },
+    {
+      headers: response.headers,
     }
-  );
-};
-
-export default function ProtectedPage() {
-  // by fetching the user in the loader, we ensure it is available
-  // for first SSR render - no flashing of incorrect state
-  const { user, allRepos } = useLoaderData<{ user: User; allRepos: any }>();
-
-  return <pre>{JSON.stringify({ user, allRepos }, null, 2)}</pre>;
+  )
 }
 ```
 
+</TabPanel>
+
+<TabPanel id="ts" label="TypeScript">
+
+```tsx title=app/root.tsx
+export const loader = async ({ request }: LoaderArgs) => {
+  const env = {
+    SUPABASE_URL: process.env.SUPABASE_URL!,
+    SUPABASE_ANON_KEY: process.env.SUPABASE_ANON_KEY!,
+  }
+
+  const response = new Response()
+
+  const supabase = createServerClient(process.env.SUPABASE_URL!, process.env.SUPABASE_ANON_KEY!, {
+    request,
+    response,
+  })
+
+  const {
+    data: { session },
+  } = await supabase.auth.getSession()
+
+  return json(
+    {
+      env,
+      session,
+    },
+    {
+      headers: response.headers,
+    }
+  )
+}
+```
+
+</TabPanel>
+
+</Tabs>
+
+And then use a `fetcher` to simulate submitting a form to our action, inside the `onAuthStateChange` hook.
+
+<Tabs
+  scrollable
+  size="small"
+  type="underlined"
+  defaultActiveId="js"
+>
+
+<TabPanel id="js" label="JavaScript">
+
+```jsx title=app/root.jsx
+const { env, session } = useLoaderData()
+const fetcher = useFetcher()
+
+const [supabase] = useState(
+  () => createBrowserClient < Database > (env.SUPABASE_URL, env.SUPABASE_ANON_KEY)
+)
+
+const serverAccessToken = session?.access_token
+
+useEffect(() => {
+  const {
+    data: { subscription },
+  } = supabase.auth.onAuthStateChange((event, session) => {
+    if (session?.access_token !== serverAccessToken) {
+      fetcher.submit(null, {
+        method: 'post',
+        action: '/handle-supabase-auth',
+      })
+    }
+  })
+
+  return () => {
+    subscription.unsubscribe()
+  }
+}, [serverAccessToken, supabase, fetcher])
+```
+
+</TabPanel>
+
+<TabPanel id="ts" label="TypeScript">
+
+```tsx title=app/root.tsx
+const { env, session } = useLoaderData<typeof loader>()
+const fetcher = useFetcher()
+
+const [supabase] = useState(() =>
+  createBrowserClient<Database>(env.SUPABASE_URL, env.SUPABASE_ANON_KEY)
+)
+
+const serverAccessToken = session?.access_token
+
+useEffect(() => {
+  const {
+    data: { subscription },
+  } = supabase.auth.onAuthStateChange((event, session) => {
+    if (session?.access_token !== serverAccessToken) {
+      // server and client are out of sync.
+      // Remix recalls active loaders after actions complete
+      fetcher.submit(null, {
+        method: 'post',
+        action: '/handle-supabase-auth',
+      })
+    }
+  })
+
+  return () => {
+    subscription.unsubscribe()
+  }
+}, [serverAccessToken, supabase, fetcher])
+```
+
+</TabPanel>
+
+</Tabs>
+
+> Check out [this repo](https://github.com/supabase/auth-helpers/tree/main/examples/remix) for full implementation example
+
+### Authentication
+
+Now we can use our outlet context to access our single instance of Supabase and use any of the [supported authentication strategies from `supabase-js`](/docs/reference/javascript/auth-signup).
+
+<Tabs
+  scrollable
+  size="small"
+  type="underlined"
+  defaultActiveId="js"
+>
+
+<TabPanel id="js" label="JavaScript">
+
+```jsx title=app/components/login.jsx
+export default function Login() {
+  const { supabase } = useOutletContext()
+
+  const handleEmailLogin = async () => {
+    await supabase.auth.signInWithPassword({
+      email: 'jon@supabase.com',
+      password: 'password',
+    })
+  }
+
+  const handleGitHubLogin = async () => {
+    await supabase.auth.signInWithOAuth({
+      provider: 'github',
+    })
+  }
+
+  const handleLogout = async () => {
+    await supabase.auth.signOut()
+  }
+
+  return (
+    <>
+      <button onClick={handleEmailLogin}>Email Login</button>
+      <button onClick={handleGitHubLogin}>GitHub Login</button>
+      <button onClick={handleLogout}>Logout</button>
+    </>
+  )
+}
+```
+
+</TabPanel>
+
+<TabPanel id="ts" label="TypeScript">
+
+```tsx title=app/components/login.tsx
+export default function Login() {
+  const { supabase } = useOutletContext<{ supabase: SupabaseClient<Database> }>()
+
+  const handleEmailLogin = async () => {
+    await supabase.auth.signInWithPassword({
+      email: 'jon@supabase.com',
+      password: 'password',
+    })
+  }
+
+  const handleGitHubLogin = async () => {
+    await supabase.auth.signInWithOAuth({
+      provider: 'github',
+    })
+  }
+
+  const handleLogout = async () => {
+    await supabase.auth.signOut()
+  }
+
+  return (
+    <>
+      <button onClick={handleEmailLogin}>Email Login</button>
+      <button onClick={handleGitHubLogin}>GitHub Login</button>
+      <button onClick={handleLogout}>Logout</button>
+    </>
+  )
+}
+```
+
+</TabPanel>
+
+</Tabs>
+
+### Subscribe to realtime events
+
+<Tabs
+  scrollable
+  size="small"
+  type="underlined"
+  defaultActiveId="js"
+>
+
+<TabPanel id="js" label="JavaScript">
+
+```jsx title=app/routes/realtime.jsx
+import { useLoaderData, useOutletContext } from '@remix-run/react'
+import { createServerClient } from '@supabase/auth-helpers-remix'
+import { json } from '@remix-run/node'
+import { useEffect, useState } from 'react'
+
+export const loader = async ({ request }) => {
+  const response = new Response()
+  const supabase = createServerClient(process.env.SUPABASE_URL, process.env.SUPABASE_ANON_KEY, {
+    request,
+    response,
+  })
+
+  const { data } = await supabase.from('posts').select()
+
+  return json({ serverPosts: data ?? [] }, { headers: response.headers })
+}
+
+export default function Index() {
+  const { serverPosts } = useLoaderData()
+  const [posts, setPosts] = useState(serverPosts)
+  const { supabase } = useOutletContext()
+
+  useEffect(() => {
+    setPosts(serverPosts)
+  }, [serverPosts])
+
+  useEffect(() => {
+    const channel = supabase
+      .channel('*')
+      .on('postgres_changes', { event: 'INSERT', schema: 'public', table: 'posts' }, (payload) =>
+        setPosts([...posts, payload.new])
+      )
+      .subscribe()
+
+    return () => {
+      supabase.removeChannel(channel)
+    }
+  }, [supabase, posts, setPosts])
+
+  return <pre>{JSON.stringify(posts, null, 2)}</pre>
+}
+```
+
+</TabPanel>
+
+<TabPanel id="ts" label="TypeScript">
+
+```tsx title=app/routes/realtime.tsx
+import { useLoaderData, useOutletContext } from '@remix-run/react'
+import { createServerClient } from '@supabase/auth-helpers-remix'
+import { json } from '@remix-run/node'
+import { useEffect, useState } from 'react'
+
+import type { SupabaseClient } from '@supabase/auth-helpers-remix'
+import type { Database } from 'db_types'
+
+type Post = Database['public']['Tables']['posts']['Row']
+
+import type { LoaderArgs } from '@remix-run/node'
+
+export const loader = async ({ request }: LoaderArgs) => {
+  const response = new Response()
+  const supabase = createServerClient<Database>(
+    process.env.SUPABASE_URL!,
+    process.env.SUPABASE_ANON_KEY!,
+    {
+      request,
+      response,
+    }
+  )
+
+  const { data } = await supabase.from('posts').select()
+
+  return json({ serverPosts: data ?? [] }, { headers: response.headers })
+}
+
+export default function Index() {
+  const { serverPosts } = useLoaderData<typeof loader>()
+  const [posts, setPosts] = useState(serverPosts)
+  const { supabase } = useOutletContext<{ supabase: SupabaseClient<Database> }>()
+
+  useEffect(() => {
+    setPosts(serverPosts)
+  }, [serverPosts])
+
+  useEffect(() => {
+    const channel = supabase
+      .channel('*')
+      .on('postgres_changes', { event: 'INSERT', schema: 'public', table: 'posts' }, (payload) =>
+        setPosts([...posts, payload.new as Post])
+      )
+      .subscribe()
+
+    return () => {
+      supabase.removeChannel(channel)
+    }
+  }, [supabase, posts, setPosts])
+
+  return <pre>{JSON.stringify(posts, null, 2)}</pre>
+}
+```
+
+> `Database` is a TypeScript definitions file [generated by the Supabase CLI](/docs/reference/javascript/typescript-support#generating-types).
+
+</TabPanel>
+
+</Tabs>
+
+> Ensure you have [enabled replication](https://app.supabase.com/project/_/database/replication) on the table you are subscribing to.
+
 export const Page = ({ children }) => <Layout meta={meta} children={children} />
 
 export default Page
diff --git a/apps/docs/pages/guides/auth/auth-helpers/sveltekit.mdx b/apps/docs/pages/guides/auth/auth-helpers/sveltekit.mdx
index 62e6a0154e0..e6d1d141100 100644
--- a/apps/docs/pages/guides/auth/auth-helpers/sveltekit.mdx
+++ b/apps/docs/pages/guides/auth/auth-helpers/sveltekit.mdx
@@ -295,6 +295,7 @@ If you try to submit a form with the action `?/createPost` without a valid sessi
 import type { Actions } from './$types'
 import { invalid, redirect } from '@sveltejs/kit'
 import { getSupabase } from '@supabase/auth-helpers-sveltekit'
+import { AuthApiError } from '@supabase/supabase-js'
 
 export const actions: Actions = {
   signin: async (event) => {
diff --git a/apps/docs/pages/guides/database/extensions/pgnet.mdx b/apps/docs/pages/guides/database/extensions/pgnet.mdx
index d652be96ad8..f9b99c7e018 100644
--- a/apps/docs/pages/guides/database/extensions/pgnet.mdx
+++ b/apps/docs/pages/guides/database/extensions/pgnet.mdx
@@ -8,7 +8,7 @@ export const meta = {
 
 <Admonition type="caution">
 
-The pg_net API is in beta. Functions signatures may change.
+The pg_net API is in alpha. Functions signatures may change.
 
 </Admonition>
 
diff --git a/apps/docs/pages/guides/storage.mdx b/apps/docs/pages/guides/storage.mdx
index bbf3df61c91..fd024d292c8 100644
--- a/apps/docs/pages/guides/storage.mdx
+++ b/apps/docs/pages/guides/storage.mdx
@@ -34,342 +34,6 @@ keep all video files in a "video" bucket, and profile pictures in an "avatar" bu
   ></iframe>
 </div>
 
-## Getting started
-
-This is a quick guide that shows the basic functionality of Supabase Storage. Find a full
-[example application in GitHub](https://github.com/supabase/supabase/tree/master/examples/user-management/nextjs-ts-user-management),
-which you can deploy yourself.
-
-[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/git/external?repository-url=https%3A%2F%2Fgithub.com%2Fsupabase%2Fsupabase%2Ftree%2Fmaster%2Fexamples%2Fuser-management%2Fnextjs-ts-user-management&project-name=supabase-user-management&repository-name=supabase-user-management&demo-title=Supabase%20User%20Management&demo-description=An%20example%20web%20app%20using%20Supabase%20and%20Next.js&demo-url=https%3A%2F%2Fsupabase-nextjs-ts-user-management.vercel.app&demo-image=https%3A%2F%2Fi.imgur.com%2FZ3HkQqe.png&integration-ids=oac_jUduyjQgOyzev1fjrW83NYOv&external-id=nextjs-user-management)
-
-<Admonition type="note">
-
-File, Folder, and Bucket names **must follow** [AWS object key naming guidelines](https://docs.aws.amazon.com/AmazonS3/latest/userguide/object-keys.html) and avoid use of any other characters.
-
-</Admonition>
-
-### Create a bucket
-
-You can create a bucket using the Supabase Dashboard.
-Since the storage is interoperable with your Postgres database, you can also use SQL or our
-client libraries. Here we create a bucket called "avatars":
-
-<Tabs
-  scrollable
-  size="small"
-  type="underlined"
-  defaultActiveId="dashboard"
->
-<TabPanel id="dashboard" label="Dashboard">
-
-1. Go to the [Storage](https://app.supabase.com/project/_/storage/buckets) page in the Dashboard.
-2. Click **New Bucket** and enter a name for the bucket.
-3. Click **Create Bucket**.
-
-</TabPanel>
-<TabPanel id="sql" label="SQL">
-
-```sql
--- Use Postgres to create a bucket.
-
-insert into storage.buckets (id, name)
-values ('avatars', 'avatars');
-```
-
-</TabPanel>
-<TabPanel id="javascript" label="JavaScript">
-
-```js
-// Use the JS library to create a bucket.
-
-const { data, error } = await supabase.storage.createBucket('avatars')
-```
-
-[Reference.](/docs/reference/javascript/storage-createbucket)
-
-</TabPanel>
-<TabPanel id="dart" label="Dart">
-
-```dart
-void main() async {
-  final supabase = SupabaseClient('supabaseUrl', 'supabaseKey');
-
-  final storageResponse = await supabase
-      .storage
-      .createBucket('avatars');
-}
-```
-
-[Reference.](https://pub.dev/documentation/storage_client/latest/storage_client/SupabaseStorageClient/createBucket.html)
-
-</TabPanel>
-</Tabs>
-
-### Upload a file
-
-You can upload a file from the Dashboard, or within a browser using our JS libraries.
-
-<Tabs
-  scrollable
-  size="small"
-  type="underlined"
-  defaultActiveId="dashboard"
->
-<TabPanel id="dashboard" label="Dashboard">
-
-1. Go to the [Storage](https://app.supabase.com/project/_/storage/buckets) page in the Dashboard.
-2. Select the bucket you want to upload the file to.
-3. Click **Upload File**.
-4. Select the file you want to upload.
-
-</TabPanel>
-<TabPanel id="javascript" label="JavaScript">
-
-```js
-const avatarFile = event.target.files[0]
-const { data, error } = await supabase.storage
-  .from('avatars')
-  .upload('public/avatar1.png', avatarFile)
-```
-
-[Reference.](/docs/reference/javascript/storage-from-upload)
-
-</TabPanel>
-<TabPanel id="dart" label="Dart">
-
-```dart
-void main() async {
-  final supabase = SupabaseClient('supabaseUrl', 'supabaseKey');
-
-  // Create file `example.txt` and upload it in `public` bucket
-  final file = File('example.txt');
-  file.writeAsStringSync('File content');
-  final storageResponse = await supabase
-      .storage
-      .from('public')
-      .upload('example.txt', file);
-}
-```
-
-[Reference.](https://pub.dev/documentation/storage_client/latest/storage_client/SupabaseStorageClient/createBucket.html)
-
-</TabPanel>
-</Tabs>
-
-### Download a file
-
-You can download a file from the Dashboard, or within a browser using our JS libraries.
-
-<Tabs
-  scrollable
-  size="small"
-  type="underlined"
-  defaultActiveId="dashboard"
->
-<TabPanel id="dashboard" label="Dashboard">
-
-1. Go to the [Storage](https://app.supabase.com/project/_/storage/buckets) page in the Dashboard.
-2. Select the bucket that contains the file.
-3. Select the file that you want to download.
-4. Click **Download**.
-
-</TabPanel>
-<TabPanel id="javascript" label="JavaScript">
-
-```js
-// Use the JS library to download a file.
-
-const { data, error } = await supabase.storage.from('avatars').download('public/avatar1.png')
-```
-
-[Reference.](/docs/reference/javascript/storage-from-download)
-
-</TabPanel>
-<TabPanel id="dart" label="Dart">
-
-```dart
-void main() async {
-  final supabase = SupabaseClient('supabaseUrl', 'supabaseKey');
-
-  final storageResponse = await supabase
-      .storage
-      .from('public')
-      .download('example.txt');
-}
-```
-
-[Reference.](/docs/reference/dart/storage-from-download)
-
-</TabPanel>
-</Tabs>
-
-### Add security rules
-
-To restrict access to your files you can use either the Dashboard or SQL.
-
-<Tabs
-  scrollable
-  size="small"
-  type="underlined"
-  defaultActiveId="dashboard"
->
-<TabPanel id="dashboard" label="Dashboard">
-
-1. Go to the [Storage](https://app.supabase.com/project/_/storage/buckets) page in the Dashboard.
-2. Click **Policies** in the sidebar.
-3. Click **Add Policies** in the `OBJECTS` table to add policies for Files. You can also create policies for Buckets.
-4. Choose whether you want the policy to apply to downloads (SELECT), uploads (INSERT), updates (UPDATE), or deletes (DELETE).
-5. Give your policy a unique name.
-6. Write the policy using SQL.
-
-</TabPanel>
-<TabPanel id="sql" label="SQL">
-
-```sql
--- Use SQL to create a policy.
-
-create policy "Public Access"
-  on storage.objects for select
-  using ( bucket_id = 'public' );
-```
-
-</TabPanel>
-</Tabs>
-
-## Public and Private Buckets
-
-Storage buckets are private by default.
-
-For private buckets, you can access objects via the [download](/docs/reference/javascript/storage-from-download) method. This corresponds to `/object/auth/` API endpoint.
-Alternatively, you can create a publicly shareable URL with an expiry date using the [createSignedUrl](/docs/reference/javascript/storage-from-createsignedurl) method
-which calls the `/object/sign/` API.
-
-For public buckets, you can access the assets directly without a token or an Authorisation header. The [getPublicUrl](/docs/reference/javascript/storage-from-getpublicurl)
-helper method returns the full public URL for an asset. This calls the `/object/public/` API endpoint internally. While no authorization is required for accessing objects in a public bucket, proper [access control](#access-control) is required for other operations like uploading, deleting objects from public buckets as well.
-
-Public buckets also tend to have [better performance](/docs/guides/storage-cdn#public-vs-private-buckets).
-
-<details>
-<summary>Advanced: reverse proxy</summary>
-The URLs returned are proxied through the API Proxy. They are prefixed by <code>/storage/v1</code>.
-
-For example, on the hosted Platform they will be
-
-<code>https://[project_ref].supabase.co/storage/v1/object/public/[id]</code>
-
-You can access the storage API directly with the same endpoint. See the <a href="https://supabase.github.io/storage-api">API docs</a> for a full list of operations available.
-
-</details>
-
----
-
-## Access control
-
-Supabase Storage is integrated with your [Postgres Database](/docs/guides/database).
-This means that you can use the same [Row Level Security Policies](/docs/guides/auth#policies)
-for managing access to your files. Supabase Storage stores metadata in the `objects` and `buckets` table in the storage schema. To allow read access to files, the RLS policy must allow users to `SELECT` the `objects` table and for uploading a new object, the RLS policy must grant users access to `INSERT` into the `objects` table and so on. The mapping between the different API calls and the database permissions required is documented in the [Reference docs](/docs/reference/javascript/storage-createbucket).
-
-<Admonition type="note">
-
-Access control for Storage is mapped to CRUD operations on the `buckets` and `objects` table via RLS policies.
-
-</Admonition>
-
-<div className="video-container">
-  <iframe
-    src="https://www.youtube-nocookie.com/embed/4ERX__Y908k"
-    frameBorder="1"
-    allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
-    allowFullScreen
-  ></iframe>
-</div>
-
-## Helpers
-
-Supabase Storage provides SQL helper functions which you can use in your database queries and
-policies.
-
----
-
-#### `storage.filename()`
-
-Returns the name of a file.
-
-```sql
-select storage.filename(name)
-from storage.objects;
-```
-
-For example, if your file is stored in `public/subfolder/avatar.png` it would return:
-
-`'avatar.png'`
-
----
-
-#### `storage.foldername()`
-
-Returns an array path, with all of the subfolders that a file belongs to.
-
-```sql
-select storage.foldername(name)
-from storage.objects;
-```
-
-For example, if your file is stored in `public/subfolder/avatar.png` it would return:
-
-`[ 'public', 'subfolder' ]`
-
----
-
-#### `storage.extension()`
-
-Returns the extension of a file.
-
-```sql
-select storage.extension(name)
-from storage.objects;
-```
-
-For example, if your file is stored in `public/subfolder/avatar.png` it would return:
-
-`'png'`
-
----
-
-## Policy examples
-
-Here are some examples of storage policies.
-
-### Allow public access to a bucket
-
-```sql
--- 1. Allow public access to any files in the "public" bucket
-create policy "Public Access"
-on storage.objects for select
-using ( bucket_id = 'public' );
-```
-
-### Allow logged-in access to a bucket
-
-```sql
--- 1. Allow logged-in access to any files in the "restricted" bucket
-create policy "Restricted Access"
-on storage.objects for select
-using (
-  bucket_id = 'restricted'
-  and auth.role() = 'authenticated'
-);
-```
-
-### Allow individual access to a file
-
-```sql
--- 1. Allow a user to access their own files
-create policy "Individual user Access"
-on storage.objects for select
-using ( auth.uid() = owner );
-```
-
 ## See also
 
 - Read more about Supabase Storage in the [blog post](https://supabase.com/blog/supabase-storage)
diff --git a/apps/docs/pages/guides/storage/access-control.mdx b/apps/docs/pages/guides/storage/access-control.mdx
new file mode 100644
index 00000000000..58572bd789e
--- /dev/null
+++ b/apps/docs/pages/guides/storage/access-control.mdx
@@ -0,0 +1,137 @@
+import Layout from '~/layouts/DefaultGuideLayout'
+
+export const meta = {
+  id: 'storage-access-control',
+  title: 'Access Control',
+  description: 'Manage who can access your Supabase Storage files.',
+}
+
+Supabase Storage is integrated with your [Postgres Database](/docs/guides/database).
+This means that you can use the same [Row Level Security Policies](/docs/guides/auth#policies)
+for managing access to your files. Supabase Storage stores metadata in the `objects` and `buckets` table in the storage schema.
+
+To allow read access to files, the RLS policy must allow users to `SELECT` the `objects` table and for uploading a new object, the RLS policy must grant users access to `INSERT` into the `objects` table and so on. The mapping between the different API calls and the database permissions required is documented in the [Reference docs](/docs/reference/javascript/storage-createbucket).
+
+<Admonition type="note">
+
+Access control for Storage is mapped to CRUD operations on the `buckets` and `objects` table via RLS policies.
+
+</Admonition>
+
+<div className="video-container">
+  <iframe
+    src="https://www.youtube-nocookie.com/embed/4ERX__Y908k"
+    frameBorder="1"
+    allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
+    allowFullScreen
+  ></iframe>
+</div>
+
+## Public and private buckets
+
+Storage buckets are private by default. For private buckets, you can access objects via the [download](/docs/reference/javascript/storage-from-download) method. This corresponds to `/object/auth/` API endpoint.
+Alternatively, you can create a publicly shareable URL with an expiry date using the [createSignedUrl](/docs/reference/javascript/storage-from-createsignedurl) method
+which calls the `/object/sign/` API.
+
+For public buckets, you can access the assets directly without a token or an Authorisation header. The [getPublicUrl](/docs/reference/javascript/storage-from-getpublicurl)
+helper method returns the full public URL for an asset. This calls the `/object/public/` API endpoint internally. While no authorization is required for accessing objects in a public bucket, proper [access control](#access-control) is required for other operations like uploading, deleting objects from public buckets as well. Public buckets also tend to have [better performance](/docs/guides/storage-cdn#public-vs-private-buckets).
+
+<details>
+<summary>Advanced: reverse proxy</summary>
+The URLs returned are proxied through the API Proxy. They are prefixed by <code>/storage/v1</code>.
+
+For example, on the hosted Platform they will be
+
+<code>https://[project_ref].supabase.co/storage/v1/object/public/[id]</code>
+
+You can access the storage API directly with the same endpoint. See the <a href="https://supabase.github.io/storage-api">API docs</a> for a full list of operations available.
+
+</details>
+
+## Helper functions
+
+Supabase Storage provides SQL helper functions which you can use in your database queries and
+policies.
+
+---
+
+#### `storage.filename()`
+
+Returns the name of a file.
+
+```sql
+select storage.filename(name)
+from storage.objects;
+```
+
+For example, if your file is stored in `public/subfolder/avatar.png` it would return:
+
+`'avatar.png'`
+
+---
+
+#### `storage.foldername()`
+
+Returns an array path, with all of the subfolders that a file belongs to.
+
+```sql
+select storage.foldername(name)
+from storage.objects;
+```
+
+For example, if your file is stored in `public/subfolder/avatar.png` it would return:
+
+`[ 'public', 'subfolder' ]`
+
+---
+
+#### `storage.extension()`
+
+Returns the extension of a file.
+
+```sql
+select storage.extension(name)
+from storage.objects;
+```
+
+For example, if your file is stored in `public/subfolder/avatar.png` it would return:
+
+`'png'`
+
+---
+
+## Policy examples
+
+### Allow public access to a bucket
+
+```sql
+-- 1. Allow public access to any files in the "public" bucket
+create policy "Public Access"
+on storage.objects for select
+using ( bucket_id = 'public' );
+```
+
+### Allow logged-in access to a bucket
+
+```sql
+-- 1. Allow logged-in access to any files in the "restricted" bucket
+create policy "Restricted Access"
+on storage.objects for select
+using (
+  bucket_id = 'restricted'
+  and auth.role() = 'authenticated'
+);
+```
+
+### Allow individual access to a file
+
+```sql
+-- 1. Allow a user to access their own files
+create policy "Individual user Access"
+on storage.objects for select
+using ( auth.uid() = owner );
+```
+
+export const Page = ({ children }) => <Layout meta={meta} children={children} />
+
+export default Page
diff --git a/apps/docs/pages/guides/storage-cdn.mdx b/apps/docs/pages/guides/storage/cdn.mdx
similarity index 73%
rename from apps/docs/pages/guides/storage-cdn.mdx
rename to apps/docs/pages/guides/storage/cdn.mdx
index 4c11ca8fe64..1d5023c7dc0 100644
--- a/apps/docs/pages/guides/storage-cdn.mdx
+++ b/apps/docs/pages/guides/storage/cdn.mdx
@@ -3,27 +3,19 @@ import Layout from '~/layouts/DefaultGuideLayout'
 export const meta = {
   id: 'storage-cdn',
   title: 'Storage CDN',
-  description: 'How Supabase Storage caches objects with a CDN',
+  description: 'Learn how Supabase Storage caches objects with a CDN.',
   sidebar_label: 'CDN',
 }
 
-## CDN basics
+All assets uploaded to Supabase Storage are cached on a Content Delivery Network (CDN) to improve the latency for users all around the world. CDNs are a geographically distributed set of servers or **nodes** which caches content from an **origin server**. For Supabase Storage, the origin is the storage server running in the [same region as your project](https://app.supabase.com/project/_/settings/general). Aside from performance, CDNs also help with security and availability by mitigating Distributed Denial of Service and other application attacks.
 
-All assets uploaded to storage are cached on a Content Delivery Network (CDN).
-
-To improve the latency for users all around the world, Supabase uses a CDN. CDNs are a geographically distributed set of servers or **nodes** which caches content from an **origin server**. For Supabase Storage, the origin is the storage server running in the [same region as your project](https://app.supabase.com/project/_/settings/general).
+## Example
 
 Let’s walk through an example of how a CDN helps with performance. A new bucket is created for a Supabase project launched in Singapore. All requests to the Supabase Storage API first hit the CDN. A user from the United States requests an object and is routed to the U.S. CDN. At this point, that CDN node does not have the object in its cache and pings the origin server in Singapore. Another user, also in the United States, requests the same object and is served directly from the CDN cache in the United States instead of routing the request back to Singapore.
 
-Aside from performance, CDNs also help with security and availability by mitigating Distributed Denial of Service and other application attacks.
-
 ## Cache duration
 
-By default, assets are cached both in the CDN and in the user's browser for 1 hour. After this, the CDN nodes ping the storage server to see if an object has been updated.
-
-You can modify this cache time when you are [uploading](/docs/reference/javascript/storage-from-upload) or [updating](/docs/reference/javascript/storage-from-update) an object by modifying the `cacheControl` parameter.
-
-If you expect the object to not change at a given URL, setting a longer cache duration is preferable.
+By default, assets are cached both in the CDN and in the user's browser for 1 hour. After this, the CDN nodes ping the storage server to see if an object has been updated. You can modify this cache time when you are [uploading](/docs/reference/javascript/storage-from-upload) or [updating](/docs/reference/javascript/storage-from-update) an object by modifying the `cacheControl` parameter. If you expect the object to not change at a given URL, setting a longer cache duration is preferable.
 
 If you need to update the version of the object stored in the CDN, there are various cache-busting techniques you can use. The most common way to do this is to add a version query parameter in the URL. For example, you can use a URL like `/storage/v1/object/sign/profile-pictures/cat.jpg?token=eyJh...&version=1` in your applications and set a long cache time of 1 year. When you want to update the cat picture, you can increment the version query parameter in the URL. The CDN will treat `/storage/v1/object/sign/profile-pictures/cat.jpg?token=eyJh...&version=2` as a new object and pings the origin for the updated version.
 
diff --git a/apps/docs/pages/guides/storage/quickstart.mdx b/apps/docs/pages/guides/storage/quickstart.mdx
new file mode 100644
index 00000000000..20b99aee99f
--- /dev/null
+++ b/apps/docs/pages/guides/storage/quickstart.mdx
@@ -0,0 +1,216 @@
+import Layout from '~/layouts/DefaultGuideLayout'
+
+export const meta = {
+  id: 'storage-quickstart',
+  title: 'Storage Quickstart',
+  description: 'Learn how to use Supabase to store and serve files.',
+  sidebar_label: 'Quickstart',
+}
+
+This guide shows the basic functionality of Supabase Storage. Find a full [example application on GitHub](https://github.com/supabase/supabase/tree/master/examples/user-management/nextjs-ts-user-management) you can deploy yourself.
+
+[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/git/external?repository-url=https%3A%2F%2Fgithub.com%2Fsupabase%2Fsupabase%2Ftree%2Fmaster%2Fexamples%2Fuser-management%2Fnextjs-ts-user-management&project-name=supabase-user-management&repository-name=supabase-user-management&demo-title=Supabase%20User%20Management&demo-description=An%20example%20web%20app%20using%20Supabase%20and%20Next.js&demo-url=https%3A%2F%2Fsupabase-nextjs-ts-user-management.vercel.app&demo-image=https%3A%2F%2Fi.imgur.com%2FZ3HkQqe.png&integration-ids=oac_jUduyjQgOyzev1fjrW83NYOv&external-id=nextjs-user-management)
+
+<Admonition type="note">
+
+File, Folder, and Bucket names **must follow** [AWS object key naming guidelines](https://docs.aws.amazon.com/AmazonS3/latest/userguide/object-keys.html) and avoid use of any other characters.
+
+</Admonition>
+
+## Create a bucket
+
+You can create a bucket using the Supabase Dashboard.
+Since the storage is interoperable with your Postgres database, you can also use SQL or our
+client libraries. Here we create a bucket called "avatars":
+
+<Tabs
+  scrollable
+  size="small"
+  type="underlined"
+  defaultActiveId="dashboard"
+>
+<TabPanel id="dashboard" label="Dashboard">
+
+1. Go to the [Storage](https://app.supabase.com/project/_/storage/buckets) page in the Dashboard.
+2. Click **New Bucket** and enter a name for the bucket.
+3. Click **Create Bucket**.
+
+</TabPanel>
+<TabPanel id="sql" label="SQL">
+
+```sql
+-- Use Postgres to create a bucket.
+
+insert into storage.buckets (id, name)
+values ('avatars', 'avatars');
+```
+
+</TabPanel>
+<TabPanel id="javascript" label="JavaScript">
+
+```js
+// Use the JS library to create a bucket.
+
+const { data, error } = await supabase.storage.createBucket('avatars')
+```
+
+[Reference.](/docs/reference/javascript/storage-createbucket)
+
+</TabPanel>
+<TabPanel id="dart" label="Dart">
+
+```dart
+void main() async {
+  final supabase = SupabaseClient('supabaseUrl', 'supabaseKey');
+
+  final storageResponse = await supabase
+      .storage
+      .createBucket('avatars');
+}
+```
+
+[Reference.](https://pub.dev/documentation/storage_client/latest/storage_client/SupabaseStorageClient/createBucket.html)
+
+</TabPanel>
+</Tabs>
+
+## Upload a file
+
+You can upload a file from the Dashboard, or within a browser using our JS libraries.
+
+<Tabs
+  scrollable
+  size="small"
+  type="underlined"
+  defaultActiveId="dashboard"
+>
+<TabPanel id="dashboard" label="Dashboard">
+
+1. Go to the [Storage](https://app.supabase.com/project/_/storage/buckets) page in the Dashboard.
+2. Select the bucket you want to upload the file to.
+3. Click **Upload File**.
+4. Select the file you want to upload.
+
+</TabPanel>
+<TabPanel id="javascript" label="JavaScript">
+
+```js
+const avatarFile = event.target.files[0]
+const { data, error } = await supabase.storage
+  .from('avatars')
+  .upload('public/avatar1.png', avatarFile)
+```
+
+[Reference.](/docs/reference/javascript/storage-from-upload)
+
+</TabPanel>
+<TabPanel id="dart" label="Dart">
+
+```dart
+void main() async {
+  final supabase = SupabaseClient('supabaseUrl', 'supabaseKey');
+
+  // Create file `example.txt` and upload it in `public` bucket
+  final file = File('example.txt');
+  file.writeAsStringSync('File content');
+  final storageResponse = await supabase
+      .storage
+      .from('public')
+      .upload('example.txt', file);
+}
+```
+
+[Reference.](https://pub.dev/documentation/storage_client/latest/storage_client/SupabaseStorageClient/createBucket.html)
+
+</TabPanel>
+</Tabs>
+
+## Download a file
+
+You can download a file from the Dashboard, or within a browser using our JS libraries.
+
+<Tabs
+  scrollable
+  size="small"
+  type="underlined"
+  defaultActiveId="dashboard"
+>
+<TabPanel id="dashboard" label="Dashboard">
+
+1. Go to the [Storage](https://app.supabase.com/project/_/storage/buckets) page in the Dashboard.
+2. Select the bucket that contains the file.
+3. Select the file that you want to download.
+4. Click **Download**.
+
+</TabPanel>
+<TabPanel id="javascript" label="JavaScript">
+
+```js
+// Use the JS library to download a file.
+
+const { data, error } = await supabase.storage.from('avatars').download('public/avatar1.png')
+```
+
+[Reference.](/docs/reference/javascript/storage-from-download)
+
+</TabPanel>
+<TabPanel id="dart" label="Dart">
+
+```dart
+void main() async {
+  final supabase = SupabaseClient('supabaseUrl', 'supabaseKey');
+
+  final storageResponse = await supabase
+      .storage
+      .from('public')
+      .download('example.txt');
+}
+```
+
+[Reference.](/docs/reference/dart/storage-from-download)
+
+</TabPanel>
+</Tabs>
+
+## Add security rules
+
+To restrict access to your files you can use either the Dashboard or SQL.
+
+<Tabs
+  scrollable
+  size="small"
+  type="underlined"
+  defaultActiveId="dashboard"
+>
+<TabPanel id="dashboard" label="Dashboard">
+
+1. Go to the [Storage](https://app.supabase.com/project/_/storage/buckets) page in the Dashboard.
+2. Click **Policies** in the sidebar.
+3. Click **Add Policies** in the `OBJECTS` table to add policies for Files. You can also create policies for Buckets.
+4. Choose whether you want the policy to apply to downloads (SELECT), uploads (INSERT), updates (UPDATE), or deletes (DELETE).
+5. Give your policy a unique name.
+6. Write the policy using SQL.
+
+</TabPanel>
+<TabPanel id="sql" label="SQL">
+
+```sql
+-- Use SQL to create a policy.
+
+create policy "Public Access"
+  on storage.objects for select
+  using ( bucket_id = 'public' );
+```
+
+</TabPanel>
+</Tabs>
+
+## See also
+
+- [Supabase Storage on GitHub](https://github.com/supabase/storage-api)
+- [Swagger API documentation](https://supabase.github.io/storage-api)
+- Official [JavaScript](/docs/reference/javascript/storage-createbucket) and [Dart](/docs/reference/dart/storage-createbucket) documentation
+
+export const Page = ({ children }) => <Layout meta={meta} children={children} />
+
+export default Page
diff --git a/apps/docs/public/humans.txt b/apps/docs/public/humans.txt
index 024052c061f..95817e22f6d 100644
--- a/apps/docs/public/humans.txt
+++ b/apps/docs/public/humans.txt
@@ -29,6 +29,7 @@ Jon M
 Jonny Summers-Muir
 Joshen Lim
 Kang Ming Tay
+Karlo Ison
 Kevin Grüneberg
 Lakshmipathi G
 Laura C
diff --git a/apps/www/_blog/2022-12-01-transparent-column-encryption-with-postgres.mdx b/apps/www/_blog/2022-12-01-transparent-column-encryption-with-postgres.mdx
index 260719c186f..739236e69d8 100644
--- a/apps/www/_blog/2022-12-01-transparent-column-encryption-with-postgres.mdx
+++ b/apps/www/_blog/2022-12-01-transparent-column-encryption-with-postgres.mdx
@@ -153,7 +153,7 @@ Notice also how there is a `DEFAULT` value for the `key_id`. In a way, this give
 
 ### One Key ID per Row with Nonce Support
 
-The default cryptographic algorithm for the above approach uses a _nonceless_ encryption algorithm called `[crypto_aead_det_xchacha20()](https://github.com/jedisct1/libsodium-xchacha20-siv)`. This algorithm has the advantage that it does not require nonce values, the disadvantage is that duplicate plaintexts will produce duplicate ciphertexts.
+The default cryptographic algorithm for the above approach uses a _nonceless_ encryption algorithm called [`crypto_aead_det_xchacha20()`](https://github.com/jedisct1/libsodium-xchacha20-siv). This algorithm has the advantage that it does not require nonce values, the disadvantage is that duplicate plaintexts will produce duplicate ciphertexts.
 
 Nonces are some extra cryptographic context that is used in many cryptographic algorithms to produce different ciphertexts, even if the plaintexts are the same. The nonce does not have to be secret, but it _does_ have to be unique. **pgsodium** comes with a useful function `pgsodium.crypto_aead_det_noncegen()` that will generate a cryptographically secure nonce for you, and in almost all cases it's best to use that function unless you know specifically what you are doing. In password hashing approaches, this is often similar to how a “salt” value is used to deduplicate password hashes.
 
diff --git a/apps/www/_blog/2022-12-06-the-supabase-content-storm.mdx b/apps/www/_blog/2022-12-06-the-supabase-content-storm.mdx
new file mode 100644
index 00000000000..07404711e42
--- /dev/null
+++ b/apps/www/_blog/2022-12-06-the-supabase-content-storm.mdx
@@ -0,0 +1,58 @@
+---
+title: The Supabase Content Storm
+description: We worked with +30 content creators to drop a mountain of content simultaneously.
+author: ramiro
+image: 2022-12-06-content-storm/content-storm.jpg
+thumb: 2022-12-06-content-storm/content-storm.jpg
+tags:
+  - announcements
+date: '2022-12-06'
+toc_depth: 3
+---
+
+We're always trying to innovate at Supabase, so when we started planning [Launch Week 6](https://supabase.com/launch-week), we brainstormed ideas for a campaign to promote it that would involve the community. We took a bit of inspiration from things like Weezer’s YouTube takeover and came up with the concept of a Content Storm ⛈.
+
+## What is the Content Storm?
+
+The idea was to get many different external content creators as possible to create Supabase-related content and *publish everything on the same day*. We contacted some well known Youtubers, community members, makers building with Supabase, the SupaSquad, and generally anyone within the Supabase community. We wanted this to be an opportunity for them to build their personal brand or promote their products and startups.
+
+## The aftermath of the storm
+
+More than 30 creators participated in creating content in different formats and everything was published today (Tuesday 6th of December). Here is the full list of every piece of content and its author:
+
+- [A quick look at Supabase](https://twitter.com/Rorstro/status/1600047388852293632) by Ania Kubów.
+- [Live streaming: Supabase and Sveltekit](https://www.youtube.com/@JamesQQuick/streams) by James Q Quick.
+- [Perform Database Migration Using Github Actions & Supabase CLI](https://www.youtube.com/watch?v=iCkdtXSeq7A) by Kunal Kushwaha.
+- [Supabase Authentication & Realtime Database with Flutter](https://www.youtube.com/watch?v=UTSSYPOd5A0) by Pooja Bhaumik.
+- [Why I Switched From AWS Cognito To Supabase The Week Before My Startup Launched](https://medium.com/@sleeplessfox/why-i-switched-from-aws-cognito-to-supabase-the-week-before-my-startup-launched-67fdc1eccb8c) by Danilo à Tellinghusen.
+- [Supabase Crash Course For Python Developers](https://www.youtube.com/watch?v=M6cfT2pqpSc) by Patrick Loeber.
+- [Hoppscotch with GraphQL](https://www.youtube.com/watch?v=HoBXQng3aK4) by Jamie Barton.
+- [Supabase with TypeScript: using tRPC and Prisma to achieve end-to-end typesafety](https://noahflk.com/blog/supabase-typescript-trpc) by Noah.
+- [How to Connect Browser Extensions to Supabase](https://akoskm.com/how-to-connect-browser-extensions-to-supabase) by Ákos Kőműves.
+- [A Chili Cookoff with Rust, Rocket, Render, and Supabase](bradcypert.com/chili-cookoff-with-rust-rocket-render-and-supabase/) by Brad Cypert.
+- [Authenticating users with Remix and Supabase](https://makerkit.dev/blog/tutorials/remix-supabase-auth) by Giancarlo Buomprisco.
+- [Automatic Spotify Playlist Creation with Pipedream and Supabase](https://www.ianwootten.co.uk/2022/12/06/automatic-spotify-playlist-creation-with-pipedream-and-supabase/) by Ian Wootten.
+- [Accept Payments For Your African-Based Business Using Supabase Edge Functions and Paystack](https://blog.hijabicoder.dev/accept-payments-for-your-african-based-business-using-supabase-edge-functions-and-paystack) by Fatuma Abdullahi.
+- [Creating AvatarAI.me using Supabase and Cerebrium](https://blog.cerebrium.ai/creating-avatarai-me-using-supabase-and-cerebrium-1bf69440c4a7) by Cerebrium.
+- [From Zero to Hero: Building Next.js Projects](https://www.youtube.com/watch?v=LR1i_8QjXyY) by Gui Bibeau.
+- [Set up a monorepo with Supabase and Turborepo](https://philipp.steinroetter.com/posts/supabase-turborepo) by Philipp Steinrötter.
+- [Twitter clone with Supabase](https://www.youtube.com/watch?v=JnUzV-PpopU) by Code with Guillaume.
+- [How Supabase Powers Mockury](https://blog.ikirill.com/how-supabase-powers-mockury) by Kirill Inoz.
+- [How to add SIGN-IN WITH APPLE using IONIC ANGULAR and SUPABASE](https://www.youtube.com/watch?v=xhzVyso-9OM) by [Simon Grimm].
+- [SvelteKit + Supabase v2 Auth with Magic Links, Providers, Email + Password, & more! 🔐🔴 LIVE](https://www.youtube.com/watch?v=XuyMr4pM4B8) by Johnny Magrippis
+- [How we use Supabase at Brick](https://dev.to/vinzent/how-we-use-supabase-at-brick-3a5d) by Vinzent.
+- [How Kuiq is using Supabase and serving around 100 APIs](https://kuiq.io/blog/how-kuiq-is-using-supabase-and-serving-around-100-apis) by Taishi
+- [How I created an interactive website with React, Chakra UI + Supabase](https://medium.com/@limjoshen/how-i-created-a-personal-website-with-react-chakra-ui-supabase-39661852746a) by Joshen Lim.
+- [5 benefits of using Supabase for your SaaS](https://supastarter.dev/blog/five-benefits-of-supabase) by Jonathan Wilke.
+- [Getting into the holiday spirit with Astro, React, and Supabase](https://www.aleksandra.codes/astro-supabase) by Aleksandra
+- [How I build register and login page with Supabase](https://surajondev.com/2022/12/06/how-i-build-register-and-login-page-using-supabase/) by Suraj Vishwakarma.
+- [What the hell is Supabase?](https://www.youtube.com/watch?v=syOnFdFC_5U) by Ayesha Sahar.
+- [Comment utiliser Supabase en No-Code avec Weweb ?](https://www.youtube.com/watch?v=g2TLd8vvs0E) by Thomas Buyle.
+- [How I used Supabase and n8n for my background tasks](https://mathias.rocks/blog/2022-12-06-how-I-used-supabase/) by Mathias Mitchel
+- [Build An Image Gallery With Supabase Storage and React (Upload Images with Supabase)](https://www.youtube.com/watch?v=8tfdY0Sf2rA) by Coopercodes
+- [Twitter thread showing how to build a web app](https://twitter.com/thisisisheanesu/status/1600257146792181766) by Isheanesu.
+- [This service will run your entire app](https://www.instagram.com/reel/Cl1KWbtDGMR/) by Simon Baker (@allthecode).
+
+It's a lot! There are tons of great resources, going through everything would take a couple of days, so we recommend bookmarking this page! If you like the content, make sure to give feedback to the author and follow them on social. 
+
+And don't miss Launch Week 6, we've been working hard to make it our best Launch Week yet 🚀. Get your tickets [here](https://supabase.com/launch-week).
diff --git a/apps/www/_blog/2022-12-07-supabase-beta-november-2022.mdx b/apps/www/_blog/2022-12-07-supabase-beta-november-2022.mdx
new file mode 100644
index 00000000000..d1387baddc8
--- /dev/null
+++ b/apps/www/_blog/2022-12-07-supabase-beta-november-2022.mdx
@@ -0,0 +1,104 @@
+---
+title: Supabase Beta November 2022
+description: We are preparing everything for Launch Week 6, but we still had time to ship some goodies this month!
+author: ant_wilson
+image: 2022-12-07-november-beta-update/monthly-update-november-2022.jpg
+thumb: 2022-12-07-november-beta-update/monthly-update-november-2022.jpg
+tags:
+  - release-notes
+date: '2022-12-07'
+toc_depth: 3
+---
+
+Launch Week 6 is just around the corner! We’re saving most of November’s updated as a surprise for Launch Week, but we still had time to ship some goodies this month. Read on!
+
+## Launch Week 6 tickets
+
+![Launch Week 6 tickets](/images/blog/2022-12-07-november-beta-update/launch-week-6-ticket.jpg)
+
+Next week, we go all out for LW6. It’s 5 days of shipping, including major features requested by the community. You don’t want to miss a thing, so make sure to claim your free ticket (and you might win some very special SupaSwag).
+
+[Get your ticket](https://supabase.com/launch-week)
+
+## Remix Auth Helpers
+
+![Remix Auth Helpers](/images/blog/2022-12-07-november-beta-update/remix-auth-helpers.jpg)
+
+It’s here! The much-awaited Remix Auth Helpers make server-side auth even easier and with a better experience for server-side rendering. Up to date with supabase-js V2 and can be used with Typescript.
+
+[Read the docs](https://supabase.com/docs/guides/auth/auth-helpers/remix)
+
+## Edgy Edge Functions
+
+![Edgy Edge Function](/images/blog/2022-12-07-november-beta-update/edgy-edge-functions.jpg)
+
+We launched a new YouTube series, [Edgy Edge Functions](https://www.youtube.com/playlist?list=PL5S4mPUpp4OulD3olUW8Eq1IYKpUbk5Ob), where we take a deep look at a new function every week.
+
+Plus, we published three new functions examples: [Generate OG Images](https://github.com/supabase/supabase/tree/master/examples/edge-functions/supabase/functions/opengraph), [Build API servers using Oak](https://github.com/supabase/supabase/tree/master/examples/edge-functions/supabase/functions/oak-server), and [Generate Screenshots using Puppeteer](https://github.com/supabase/supabase/tree/master/examples/edge-functions/supabase/functions/puppeteer).
+
+## Quick product updates
+
+- Fixed two issues with the `supabase.auth.signOut` function: [cookies not clearing properly](https://github.com/supabase/gotrue/pull/830) and [session not removed](https://github.com/supabase/gotrue-js/pull/541).
+
+- You can now customize magic links by providing access to the `HashedToken`. [PR](https://github.com/supabase/gotrue/pull/707)
+
+- Now you can do redirects from your functions. [PR](https://github.com/supabase/supabase/issues/10325)
+
+- Conda support (`conda install -c conda-forge supabase` and everything else in py)
+
+## Content storm ⛈
+
+![The Supabase Content Storm](/images/blog/2022-12-07-november-beta-update/content-storm.jpg)
+
+As a prelude to Launch Week 6, we invited dozens of developers from around the world to create content in different formats and publish everything simultaneously!
+
+[Check the full list](https://supabase.com/blog/the-supabase-content-storm)
+
+## Fireship’s Supabase course
+
+![Fireship’s Supabase course](/images/blog/2022-12-07-november-beta-update/fireship-supabase-course.jpg)
+
+That guy from the [Supaship Youtube](https://www.youtube.com/@Supaship6000) channel made a Supabase Course with Fireship! Zack DeRose did an amazing job with this project-based course that builds a Reddit-inspired web app from scratch with Supabase, PostgreSQL, and React.
+
+[Get it while it's hot](https://fireship.io/courses/supabase/).
+
+## Made with Supabase
+
+![Made with Supabase](/images/blog/2022-12-07-november-beta-update/madewithsupabase.jpg)
+
+[postedbyAI](https://postedby.ai/) | Allows users to create personalized postcards using advanced AI technology. Built with Vercel, OpenAI, and Supabase.
+
+Discover other great projects: [Made with Supabase](https://www.madewithsupabase.com/).
+
+## Extended Community Highlights
+
+![Community](/images/blog/2022-june/community.jpg)
+
+- Supabase in 100 Seconds, by Fireship. [Video](https://www.youtube.com/watch)
+- NextAuth Supabase Adapter. [Docs](https://next-auth.js.org/adapters/supabase)
+- Flutter Authentication and Authorization with RLS. [Tutorial](https://supabase.com/blog/flutter-authentication-and-authorization-with-rls)
+- The pros and cons of using PostgREST. [Podcast](https://postgres.fm/episodes/postgrest)
+- Querying Supabase from the edge with Netlify and PolyScale. [Tutorial](https://www.netlify.com/blog/querying-supabase-from-the-edge-with-polyscale/)
+- JWT Authentication with Supabase and Zuplo for your API. [Blog](https://zuplo.com/blog/2022/11/15/api-authentication-with-supabase-jwt/) and [Video](https://www.youtube.com/watch?v=UEeSZkV7o_Y&feature=youtu.be)
+- Shipping a public API backed by Supabase. [Blog](https://zuplo.com/blog/2022/11/18/shipping-a-public-api-backed-by-supabase) and [Video](https://www.youtube.com/watch?v=GJSkbxMnWxE)
+- A Guide to testing on Supabase using pgTAP. [Guide](https://usebasejump.com/blog/testing-on-supabase-with-pgtap)
+- [Using Bytebase to manage the database development lifecycle for Supabase databases](https://www.bytebase.com/docs/how-to/integrations/supabase)
+- The Best Backend as a Service for your React App. [Article](https://www.freecodecamp.org/news/best-backend-service-react/)
+- All You Need to Know About Serverless Functions and the Edge. [Article](https://dev.to/nefejames/all-you-need-to-know-about-serverless-functions-and-the-edge-2bl2)
+- #1 Hack for Building JavaScript Portfolio Projects. [Video](https://www.youtube.com/watch?v=3K9VUT7H5sw)
+- Livestreaming - Job Board App w/ SvelteKit, Supabase, & Prisma. [Youtube Playlist](https://www.youtube.com/playlist?list=PLq30BP0TIcqU8SlzDK2wX4IaXamQ26kpr)
+- How to connect to and insert data into Supabase with Pipedream. [Article](https://pipedream.com/blog/how-to-connect-to-and-insert-data-into-supabase-with-pipedream/) and [Video](https://www.youtube.com/watch?v=l9B8F1n3duk)
+- Google Sign-In using Supabase and React Native (Expo). [Tutorial](https://dev.to/fedorish/google-sign-in-using-supabase-and-react-native-expo-14jf)
+- Fast and Intuitive analytics for Supabase with DB Zaps. [Video](https://www.youtube.com/watch?v=QlIlqm9eG3w)
+- ReactJS + Supabase Fullstack CRUD Application Development. [Youtube Playlist](https://youtube.com/playlist?list=PLl6EcvA_AoxEFqwT_rNs1uZnnf7LSEoji)
+- How to connect a ESP8266 to a Streamlit App using Supabase database. [Video](https://www.youtube.com/watch?v=wI209WK3-VM)
+
+
+
+## Meme Zone
+
+This month’s meme comes courtesy of Fireship. [Follow us on Twitter](https://twitter.com/supabase) for more.
+
+![Supabase meme November 2022](/images/blog/2022-12-07-november-beta-update/november-beta-update-meme.png)
+
+See you next month!
diff --git a/apps/www/data/Community.tsx b/apps/www/data/Community.tsx
index e0df04c1f61..c202ce5f4ae 100644
--- a/apps/www/data/Community.tsx
+++ b/apps/www/data/Community.tsx
@@ -30,7 +30,7 @@ const data: CommunityItem[] = [
   },
   {
     title: 'GitHub',
-    stat: '40,000+',
+    stat: '42,000+',
     statLabel: 'GitHub stars',
     img: 'github.png',
     invertImgDarkMode: true,
@@ -42,7 +42,7 @@ const data: CommunityItem[] = [
   },
   {
     title: 'Twitter',
-    stat: '44,000+',
+    stat: '50,000+',
     statLabel: 'Followers',
     img: 'twitter.png',
     detail: () => (
@@ -53,7 +53,7 @@ const data: CommunityItem[] = [
   },
   {
     title: 'Discord',
-    stat: '8,000+',
+    stat: '10,000+',
     statLabel: 'SupaTroopers',
     img: 'discord.png',
     detail: () => (
diff --git a/apps/www/lib/authors.json b/apps/www/lib/authors.json
index 32aa9a36de2..f177f04a739 100644
--- a/apps/www/lib/authors.json
+++ b/apps/www/lib/authors.json
@@ -229,5 +229,12 @@
     "position": "Postgres Engineer",
     "author_url": "https://github.com/pashkinelfe",
     "author_image_url": "https://avatars.githubusercontent.com/u/63344111?v=4"
+  },
+  {
+    "author_id": "ramiro",
+    "author": "Ramiro Nunez Dosio",
+    "position": "Growth Marketer",
+    "author_url": "https://twitter.com/ramiro__nd",
+    "author_image_url": "https://avatars.githubusercontent.com/u/20600542?v=4"
   }
 ]
diff --git a/apps/www/lib/mdx/mdxComponents.tsx b/apps/www/lib/mdx/mdxComponents.tsx
index 5464795d445..e8b1e6dacf5 100644
--- a/apps/www/lib/mdx/mdxComponents.tsx
+++ b/apps/www/lib/mdx/mdxComponents.tsx
@@ -30,20 +30,13 @@ export default function mdxComponents(type?: 'blog' | 'lp' | undefined) {
     img: (props: any) => {
       if (props.className !== ignoreClass) {
         return (
-          <div
-            className={[
-              'next-image--dynamic-fill',
-              type === 'blog' && 'to-scale-400 from-scale-500 rounded-lg border bg-gradient-to-r',
-            ].join(' ')}
-          >
+          <span className={['next-image--dynamic-fill'].join(' ')}>
             <Image
               {...props}
-              className={['next-image--dynamic-fill', type === 'blog' && 'rounded-md border'].join(
-                ' '
-              )}
+              className={[type === 'blog' ? 'rounded-md border' : ''].join(' ')}
               layout="fill"
             />
-          </div>
+          </span>
         )
       }
       return <img {...props} />
diff --git a/apps/www/lib/redirects.js b/apps/www/lib/redirects.js
index 11d28e34e7c..aa69f18688c 100644
--- a/apps/www/lib/redirects.js
+++ b/apps/www/lib/redirects.js
@@ -7,7 +7,7 @@ module.exports = [
   {
     permanent: true,
     source: '/docs/guides/storage-caching',
-    destination: '/docs/guides/storage-cdn',
+    destination: '/docs/guides/storage/cdn',
   },
   {
     permanent: true,
@@ -1560,6 +1560,11 @@ module.exports = [
     source: '/forgot-password',
     destination: 'https://app.supabase.com/forgot-password',
   },
+  {
+    permanent: true,
+    source: '/docs/guides/storage-cdn',
+    destination: '/docs/guides/storage/cdn',
+  },
   {
     permanent: true,
     source: '/docs/guides/functions/examples',
diff --git a/apps/www/pages/launch-week/index.tsx b/apps/www/pages/launch-week/index.tsx
index 99a45254d41..9a3945146f4 100644
--- a/apps/www/pages/launch-week/index.tsx
+++ b/apps/www/pages/launch-week/index.tsx
@@ -1,6 +1,5 @@
 import { NextSeo } from 'next-seo'
 import _days from '~/components/LaunchWeek/days.json'
-import { WeekDayProps } from '~/components/LaunchWeek/types'
 import DefaultLayout from '~/components/Layouts/Default'
 import SectionContainer from '~/components/Layouts/SectionContainer'
 
@@ -13,7 +12,20 @@ import classNames from 'classnames'
 import styleUtils from '~/components/LaunchWeek/Ticket/utils.module.css'
 import { SITE_ORIGIN } from '~/lib/constants'
 
-const days = _days as WeekDayProps[]
+import { Badge, IconExternalLink } from '~/../../packages/ui'
+
+const constellation = [
+  [60, 8],
+  [13, 20],
+  [42, 24],
+  [68, 27],
+  [23, 42],
+  [52, 52],
+  [0, 55],
+  [33, 65],
+  [66, 70],
+  [55, 82],
+]
 
 export default function launchweek() {
   const { isDarkMode } = useTheme()
@@ -25,6 +37,8 @@ export default function launchweek() {
     createClient(process.env.NEXT_PUBLIC_SUPABASE_URL!, process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY!)
   )
   const [session, setSession] = useState<Session | null>(null)
+  const [creators, setCreators] = useState<any>([])
+  const [activeCreator, setActiveCreator] = useState<any>(null)
   const { query } = useRouter()
   const ticketNumber = query.ticketNumber?.toString()
   const defaultUserData = {
@@ -38,12 +52,36 @@ export default function launchweek() {
     supabase.auth.onAuthStateChange((event, session) => {
       setSession(session)
     })
+
+    getCreators()
   }, [])
 
   useEffect(() => {
     document.body.className = isDarkMode ? 'dark bg-[#121212]' : 'light bg-[#fff]'
   }, [isDarkMode])
 
+  async function getCreators() {
+    try {
+      // setLoading(true)
+      let supa = await supabase.from('lw6_creators').select()
+
+      let { data, error, status } = supa
+
+      if (error && status !== 406) {
+        throw error
+      }
+
+      if (data) {
+        setCreators(data)
+      }
+    } catch (error) {
+      // alert('Error loading user data!')
+      console.log(error)
+    } finally {
+      // setLoading(false)
+    }
+  }
+
   return (
     <>
       <NextSeo
@@ -60,7 +98,7 @@ export default function launchweek() {
         }}
       />
       <DefaultLayout>
-        <SectionContainer className="flex flex-col !pb-24 items-center lg:pt-32 gap-32">
+        <SectionContainer className="flex flex-col !pb-1 items-center lg:pt-32 gap-32">
           <div
             className={classNames(
               styleUtils.appear,
@@ -116,6 +154,75 @@ export default function launchweek() {
             )}
           ></div>
         </div>
+        <SectionContainer
+          className={classNames(
+            'flex gap-6 min-h-[350px] !py-3 mb-11 flex-col-reverse md:flex-row',
+            styleUtils.appear,
+            styleUtils['appear-third']
+          )}
+        >
+          <div
+            className={`flex-1 bg-[url('/images/launchweek/orbit.svg')] bg-auto bg-no-repeat bg-bottom relative min-h-[360px]`} //grid grid-cols-5 grid-rows-5
+          >
+            {creators.map((creator: any, index: number) => {
+              return (
+                <div
+                  className={`justify-self-center absolute overflow-visible`}
+                  onMouseEnter={() => {
+                    setActiveCreator(index)
+                  }}
+                  style={{
+                    top: `${constellation[index][0]}%`,
+                    left: `${constellation[index][1]}%`,
+                  }}
+                >
+                  <div className="relative group">
+                    <div className="absolute -inset-0.5 bg-brand-1100 rounded-full opacity-75 group-hover:opacity-100 group-hover:blur-sm transition duration-500"></div>
+                    <a href={creator.link} target="_blank" rel="noopener">
+                      <img
+                        className="relative rounded-full w-12 h-12 border border-brand-900 hover:shadow-md"
+                        src={creator.profile_picture}
+                      />
+                    </a>
+                  </div>
+                </div>
+              )
+            })}
+          </div>
+          <div className="flex-1">
+            <Badge className="mb-6 bg-gradient-to-r from-[#0E3737C2] to-[#67947F] hover:to-[#39617D94] dark:hover:to-[#A6FFD899] text-whiteA-1200 dark:text-black font-normal !py-1 !px-4 dark:from-white dark:via-white dark:to-[#1a7a4c75] bg-slate-1200">
+              Currently happening
+            </Badge>
+            <h2 className="text-4xl dark:text-white mb-2">The Supabase Content Storm</h2>
+            <p className="text-slate-900 md:max-w-[80%] mb-16">
+              We worked with +30 content creators from around the world to drop a mountain of
+              content simultaneously!
+              <a rel="noopener" target="_blank" href="/blog/the-supabase-content-storm">
+                <div className="text-brand-900 flex items-center">
+                  See all the content
+                  <IconExternalLink size="small" className="inline-block ml-1" />
+                </div>
+              </a>
+            </p>
+            {activeCreator !== null && (
+              <div className="lg:max-w-[50%] min-h-[120px]">
+                <h3 className="dark:text-white">
+                  {activeCreator !== null
+                    ? `${creators[activeCreator].first_name} ${creators[activeCreator].last_name}`
+                    : 'Title'}
+                </h3>
+                <p className="text-brand-900">
+                  <a rel="noopener" target="_blank" href={creators[activeCreator].link}>
+                    <span>
+                      {creators[activeCreator].link_title}
+                      <IconExternalLink size="small" className="inline-block ml-2" />
+                    </span>
+                  </a>
+                </p>
+              </div>
+            )}
+          </div>
+        </SectionContainer>
       </DefaultLayout>
     </>
   )
diff --git a/apps/www/pages/launch-week/launchWeek.module.css b/apps/www/pages/launch-week/launchWeek.module.css
new file mode 100644
index 00000000000..574027b2053
--- /dev/null
+++ b/apps/www/pages/launch-week/launchWeek.module.css
@@ -0,0 +1,3 @@
+.mask {
+  mask-image: radial-gradient(black, transparent);
+}
diff --git a/apps/www/public/images/blog/2022-12-06-content-storm/content-storm.jpg b/apps/www/public/images/blog/2022-12-06-content-storm/content-storm.jpg
new file mode 100644
index 00000000000..01fd11cab31
Binary files /dev/null and b/apps/www/public/images/blog/2022-12-06-content-storm/content-storm.jpg differ
diff --git a/apps/www/public/images/blog/2022-12-07-november-beta-update/content-storm.jpg b/apps/www/public/images/blog/2022-12-07-november-beta-update/content-storm.jpg
new file mode 100644
index 00000000000..60ff50e9acf
Binary files /dev/null and b/apps/www/public/images/blog/2022-12-07-november-beta-update/content-storm.jpg differ
diff --git a/apps/www/public/images/blog/2022-12-07-november-beta-update/edgy-edge-functions.jpg b/apps/www/public/images/blog/2022-12-07-november-beta-update/edgy-edge-functions.jpg
new file mode 100644
index 00000000000..b96861758b4
Binary files /dev/null and b/apps/www/public/images/blog/2022-12-07-november-beta-update/edgy-edge-functions.jpg differ
diff --git a/apps/www/public/images/blog/2022-12-07-november-beta-update/fireship-supabase-course.jpg b/apps/www/public/images/blog/2022-12-07-november-beta-update/fireship-supabase-course.jpg
new file mode 100644
index 00000000000..30ed840cc9e
Binary files /dev/null and b/apps/www/public/images/blog/2022-12-07-november-beta-update/fireship-supabase-course.jpg differ
diff --git a/apps/www/public/images/blog/2022-12-07-november-beta-update/launch-week-6-ticket.jpg b/apps/www/public/images/blog/2022-12-07-november-beta-update/launch-week-6-ticket.jpg
new file mode 100644
index 00000000000..31cc7b978cd
Binary files /dev/null and b/apps/www/public/images/blog/2022-12-07-november-beta-update/launch-week-6-ticket.jpg differ
diff --git a/apps/www/public/images/blog/2022-12-07-november-beta-update/madewithsupabase.jpg b/apps/www/public/images/blog/2022-12-07-november-beta-update/madewithsupabase.jpg
new file mode 100644
index 00000000000..ded3c26f2f6
Binary files /dev/null and b/apps/www/public/images/blog/2022-12-07-november-beta-update/madewithsupabase.jpg differ
diff --git a/apps/www/public/images/blog/2022-12-07-november-beta-update/monthly-update-november-2022.jpg b/apps/www/public/images/blog/2022-12-07-november-beta-update/monthly-update-november-2022.jpg
new file mode 100644
index 00000000000..098dd5a563c
Binary files /dev/null and b/apps/www/public/images/blog/2022-12-07-november-beta-update/monthly-update-november-2022.jpg differ
diff --git a/apps/www/public/images/blog/2022-12-07-november-beta-update/november-beta-update-meme.png b/apps/www/public/images/blog/2022-12-07-november-beta-update/november-beta-update-meme.png
new file mode 100644
index 00000000000..ec5d8e3b5b9
Binary files /dev/null and b/apps/www/public/images/blog/2022-12-07-november-beta-update/november-beta-update-meme.png differ
diff --git a/apps/www/public/images/blog/2022-12-07-november-beta-update/remix-auth-helpers.jpg b/apps/www/public/images/blog/2022-12-07-november-beta-update/remix-auth-helpers.jpg
new file mode 100644
index 00000000000..c94e3f861d3
Binary files /dev/null and b/apps/www/public/images/blog/2022-12-07-november-beta-update/remix-auth-helpers.jpg differ
diff --git a/apps/www/public/images/launchweek/orbit.svg b/apps/www/public/images/launchweek/orbit.svg
new file mode 100644
index 00000000000..4963e74a9b0
--- /dev/null
+++ b/apps/www/public/images/launchweek/orbit.svg
@@ -0,0 +1,39 @@
+<svg width="709" height="355" viewBox="0 0 709 355" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_867_58310)">
+<circle cx="355" cy="360" r="101" stroke="url(#paint0_linear_867_58310)" stroke-width="0.685121"/>
+<circle cx="355" cy="360" r="157" stroke="url(#paint1_linear_867_58310)" stroke-width="0.685121"/>
+<circle cx="355" cy="360" r="225" stroke="url(#paint2_linear_867_58310)" stroke-width="0.685121"/>
+<circle cx="355" cy="360" r="285" stroke="url(#paint3_linear_867_58310)" stroke-width="0.685121"/>
+<circle cx="355" cy="360" r="360" stroke="url(#paint4_linear_867_58310)" stroke-width="0.685121"/>
+</g>
+<defs>
+<linearGradient id="paint0_linear_867_58310" x1="254" y1="259" x2="456" y2="259" gradientUnits="userSpaceOnUse">
+<stop offset="0.135417" stop-color="#121212" stop-opacity="0"/>
+<stop offset="0.510996" stop-color="#4F4F4F"/>
+<stop offset="0.864583" stop-color="#121212" stop-opacity="0"/>
+</linearGradient>
+<linearGradient id="paint1_linear_867_58310" x1="198" y1="203" x2="512" y2="203" gradientUnits="userSpaceOnUse">
+<stop offset="0.135417" stop-color="#121212" stop-opacity="0"/>
+<stop offset="0.510996" stop-color="#4F4F4F"/>
+<stop offset="0.864583" stop-color="#121212" stop-opacity="0"/>
+</linearGradient>
+<linearGradient id="paint2_linear_867_58310" x1="130" y1="135" x2="580" y2="135" gradientUnits="userSpaceOnUse">
+<stop offset="0.135417" stop-color="#121212" stop-opacity="0"/>
+<stop offset="0.510996" stop-color="#4F4F4F"/>
+<stop offset="0.864583" stop-color="#121212" stop-opacity="0"/>
+</linearGradient>
+<linearGradient id="paint3_linear_867_58310" x1="70" y1="75" x2="640" y2="75" gradientUnits="userSpaceOnUse">
+<stop offset="0.135417" stop-color="#121212" stop-opacity="0"/>
+<stop offset="0.510996" stop-color="#4F4F4F"/>
+<stop offset="0.864583" stop-color="#121212" stop-opacity="0"/>
+</linearGradient>
+<linearGradient id="paint4_linear_867_58310" x1="-5" y1="0" x2="715" y2="-2.73533e-06" gradientUnits="userSpaceOnUse">
+<stop offset="0.135417" stop-color="#121212" stop-opacity="0"/>
+<stop offset="0.510996" stop-color="#4F4F4F"/>
+<stop offset="0.864583" stop-color="#121212" stop-opacity="0"/>
+</linearGradient>
+<clipPath id="clip0_867_58310">
+<rect width="709" height="355" fill="white" transform="matrix(-1 -8.74228e-08 -8.74228e-08 1 709 0)"/>
+</clipPath>
+</defs>
+</svg>
diff --git a/apps/www/public/rss.xml b/apps/www/public/rss.xml
index 947b9a551dd..146122ccf83 100644
--- a/apps/www/public/rss.xml
+++ b/apps/www/public/rss.xml
@@ -5,9 +5,23 @@
       <link>https://supabase.com</link>
       <description>Latest news from Supabase</description>
       <language>en</language>
-      <lastBuildDate>Wed, 30 Nov 2022 16:04:00 +0000</lastBuildDate>
+      <lastBuildDate>Tue, 06 Dec 2022 16:04:00 +0000</lastBuildDate>
       <atom:link href="https://supabase.com/rss.xml" rel="self" type="application/rss+xml"/>
       <item>
+  <guid>https://supabase.com/blog/supabase-beta-november-2022</guid>
+  <title>Supabase Beta November 2022</title>
+  <link>https://supabase.com/blog/supabase-beta-november-2022</link>
+  <description>We are preparing everything for Launch Week 6, but we still had time to ship some goodies this month!</description>
+  <pubDate>Tue, 06 Dec 2022 16:04:00 +0000</pubDate>
+</item>
+<item>
+  <guid>https://supabase.com/blog/the-supabase-content-storm</guid>
+  <title>The Supabase Content Storm</title>
+  <link>https://supabase.com/blog/the-supabase-content-storm</link>
+  <description>We worked with +30 content creators to drop a mountain of content simultaneously.</description>
+  <pubDate>Mon, 05 Dec 2022 16:04:00 +0000</pubDate>
+</item>
+<item>
   <guid>https://supabase.com/blog/transparent-column-encryption-with-postgres</guid>
   <title>Transparent Column Encryption with Postgres</title>
   <link>https://supabase.com/blog/transparent-column-encryption-with-postgres</link>
diff --git a/apps/www/styles/index.css b/apps/www/styles/index.css
index 3728791dcd8..77922bd7095 100644
--- a/apps/www/styles/index.css
+++ b/apps/www/styles/index.css
@@ -426,7 +426,7 @@ launch week
 }
 
 .gradient-container {
-  min-height: 480px;
+  min-height: 360px;
   position: relative;
   max-width: 1600px;
   margin: 0 auto;
diff --git a/examples/edge-functions/supabase/functions/file-upload-storage/README.md b/examples/edge-functions/supabase/functions/file-upload-storage/README.md
new file mode 100644
index 00000000000..3d061d5d78e
--- /dev/null
+++ b/examples/edge-functions/supabase/functions/file-upload-storage/README.md
@@ -0,0 +1,3 @@
+# Upload files to Storage
+
+This example shows how to process `multipart/form-data` in an Edge Function. Then, upload files in the request to Supabase Storage and insert other fields as a record to a database table.
diff --git a/examples/edge-functions/supabase/functions/file-upload-storage/index.ts b/examples/edge-functions/supabase/functions/file-upload-storage/index.ts
new file mode 100644
index 00000000000..5593c0b6581
--- /dev/null
+++ b/examples/edge-functions/supabase/functions/file-upload-storage/index.ts
@@ -0,0 +1,66 @@
+// This example shows how to use Edge Functions to read incoming multipart/form-data request,
+// and write files to Supabase Storage and other fields to a database table.
+
+import { Application, Router } from 'https://deno.land/x/oak/mod.ts'
+import { createClient } from 'https://esm.sh/@supabase/supabase-js@2'
+
+const MB = 1024 * 1024
+
+const app = new Application()
+
+app.use(async (ctx) => {
+  const body = ctx.request.body({ type: 'form-data' })
+  const formData = await body.value.read({
+    // Need to set the maxSize so files will be stored in memory.
+    // This is necessary as Edge Functions don't have disk write access.
+    // We are setting the max size as 10MB (an Edge Function has a max memory limit of 150MB)
+    // For more config options, check: https://deno.land/x/oak@v11.1.0/mod.ts?s=FormDataReadOptions
+    maxSize: 10 * MB,
+  })
+  if (!formData.files || !formData.files.length) {
+    ctx.response.status = 400
+    ctx.response.body = 'missing file'
+    return
+  }
+
+  const supabaseClient = createClient(
+    // Supabase API URL - env var exported by default.
+    Deno.env.get('SUPABASE_URL') ?? '',
+    // Supabase API ANON KEY - env var exported by default.
+    Deno.env.get('SUPABASE_ANON_KEY') ?? ''
+  )
+
+  //upload image to Storage
+  const file = formData.files[0]
+  const timestamp = +new Date()
+  const uploadName = `${file.name}-${timestamp}`
+  const { data: upload, error: uploadError } = await supabaseClient.storage
+    .from('images')
+    .upload(uploadName, file.content!.buffer, {
+      contentType: file.contentType,
+      cacheControl: '3600',
+      upsert: false,
+    })
+  if (uploadError) {
+    console.error(uploadError)
+    ctx.response.status = 500
+    ctx.response.body = 'Failed to upload the file'
+    return
+  }
+
+  // insert record to messages table
+  const { error } = await supabaseClient
+    .from('comments')
+    .insert({ message: formData.fields!.message || '', image_path: upload.path })
+  if (error) {
+    console.error(error)
+    ctx.response.status = 500
+    ctx.response.body = 'Fail to add the record'
+    return
+  }
+
+  ctx.response.status = 201
+  ctx.response.body = 'Success!'
+})
+
+await app.listen({ port: 8000 })
diff --git a/i18n/README.pt-br.md b/i18n/README.pt-br.md
index fa90c744008..9d22a6c7282 100644
--- a/i18n/README.pt-br.md
+++ b/i18n/README.pt-br.md
@@ -27,11 +27,14 @@
 
 Para documentação completa, visite [supabase.com/docs](https://supabase.com/docs)
 
+Para ver como Contribuir, visite [Primeiros Passos](./DEVELOPERS.md)
+
 ## Comunidade & Suporte
 
 - [Fórum da comunidade](https://github.com/supabase/supabase/discussions). Melhor para: ajuda com a construção, discussões sobre melhores práticas em banco de dados.
 - [GitHub Issues](https://github.com/supabase/supabase/issues). Melhor para: problemas ou erros que você encontrar usando o Supabase.
 - [Suporte por E-mail](https://supabase.com/docs/support#business-support). Melhor para: problemas com o seu banco de dados ou infraestrutura.
+- [Discord](https://discord.supabase.com). Melhor para: compartilhar seus aplicativos e se divertir com a comunidade.
 
 ## Status
 
@@ -53,6 +56,7 @@ Supabase é uma combinação de ferramentas de código aberto. Nós estamos cons
 **Arquitetura atual**
 
 Supabase é uma [plataforma hospedada](https://app.supabase.com). Você pode se cadastrar e começar a usar Supabase sem instalar nada. Nós ainda estamos criando a experiência de trabalho local - esse é o nosso foco principal, junto com a estabilidade da plataforma.
+Voce tambem pode [auto-hospedar](https://supabase.com/docs/guides/hosting/overview) e [develop locally](https://supabase.com/docs/guides/local-development).
 
 ![Arquitetura](https://user-images.githubusercontent.com/70828596/187547862-ffa9d058-0c3a-4851-a3e7-92ccfca4b596.png)
 
@@ -66,7 +70,7 @@ Supabase é uma [plataforma hospedada](https://app.supabase.com). Você pode se
 
 #### Bibliotecas de cliente
 
-Nossa biblioteca de cliente é modular. Cada sub-biblioteca é uma implementação independente para cada sistema externo. Esse é uma das formas de apoiar as ferramentas existentes.
+Nossa biblioteca de cliente é modular. Cada sub-biblioteca é uma implementação independente para cada sistema externo. Essa é uma das formas de apoiar as ferramentas existentes.
 
 <table style="table-layout:fixed; white-space: nowrap;">
   <tr>
@@ -81,6 +85,7 @@ Nossa biblioteca de cliente é modular. Cada sub-biblioteca é uma implementaç
     <th><a href="https://github.com/supabase/gotrue" target="_blank" rel="noopener noreferrer">GoTrue</a></th>
     <th><a href="https://github.com/supabase/realtime" target="_blank" rel="noopener noreferrer">Realtime</a></th>
     <th><a href="https://github.com/supabase/storage-api" target="_blank" rel="noopener noreferrer">Storage</a></th>
+    <th>Funções</th>
   </tr>
   <!-- TEMPLATE FOR NEW ROW -->
   <!-- START ROW
@@ -93,7 +98,7 @@ Nossa biblioteca de cliente é modular. Cada sub-biblioteca é uma implementaç
     <td><a href="https://github.com/supabase-community/storage-lang" target="_blank" rel="noopener noreferrer">storage-lang</a></td>
   </tr>
   END ROW -->
-  <th colspan="6">⚡️ Oficial ⚡️</th>
+  <th colspan="7">⚡️ Oficial ⚡️</th>
   <tr>
     <td>JavaScript (TypeScript)</td>
     <td><a href="https://github.com/supabase/supabase-js" target="_blank" rel="noopener noreferrer">supabase-js</a></td>
@@ -101,8 +106,18 @@ Nossa biblioteca de cliente é modular. Cada sub-biblioteca é uma implementaç
     <td><a href="https://github.com/supabase/gotrue-js" target="_blank" rel="noopener noreferrer">gotrue-js</a></td>
     <td><a href="https://github.com/supabase/realtime-js" target="_blank" rel="noopener noreferrer">realtime-js</a></td>
     <td><a href="https://github.com/supabase/storage-js" target="_blank" rel="noopener noreferrer">storage-js</a></td>
+    <td><a href="https://github.com/supabase/functions-js" target="_blank" rel="noopener noreferrer">functions-js</a></td>
   </tr>
-  <th colspan="6">💚 Comunidade 💚</th>
+   <tr>
+    <td>Flutter</td>
+    <td><a href="https://github.com/supabase/supabase-flutter" target="_blank" rel="noopener noreferrer">supabase-flutter</a></td>
+    <td><a href="https://github.com/supabase/postgrest-dart" target="_blank" rel="noopener noreferrer">postgrest-dart</a></td>
+    <td><a href="https://github.com/supabase/gotrue-dart" target="_blank" rel="noopener noreferrer">gotrue-dart</a></td>
+    <td><a href="https://github.com/supabase/realtime-dart" target="_blank" rel="noopener noreferrer">realtime-dart</a></td>
+    <td><a href="https://github.com/supabase/storage-dart" target="_blank" rel="noopener noreferrer">storage-dart</a></td>
+    <td><a href="https://github.com/supabase/functions-dart" target="_blank" rel="noopener noreferrer">functions-dart</a></td>
+  </tr>
+  <th colspan="7">💚 Comunidade 💚</th>
   <tr>
     <td>C#</td>
     <td><a href="https://github.com/supabase-community/supabase-csharp" target="_blank" rel="noopener noreferrer">supabase-csharp</a></td>
@@ -110,22 +125,16 @@ Nossa biblioteca de cliente é modular. Cada sub-biblioteca é uma implementaç
     <td><a href="https://github.com/supabase-community/gotrue-csharp" target="_blank" rel="noopener noreferrer">gotrue-csharp</a></td>
     <td><a href="https://github.com/supabase-community/realtime-csharp" target="_blank" rel="noopener noreferrer">realtime-csharp</a></td>
     <td><a href="https://github.com/supabase-community/storage-csharp" target="_blank" rel="noopener noreferrer">storage-csharp</a></td>
-  </tr>
-  <tr>
-    <td>Flutter</td>
-    <td><a href="https://github.com/supabase/supabase-flutter" target="_blank" rel="noopener noreferrer">supabase-dart</a></td>
-    <td><a href="https://github.com/supabase/postgrest-dart" target="_blank" rel="noopener noreferrer">postgrest-dart</a></td>
-    <td><a href="https://github.com/supabase/gotrue-dart" target="_blank" rel="noopener noreferrer">gotrue-lang</a></td>
-    <td><a href="https://github.com/supabase/realtime-dart" target="_blank" rel="noopener noreferrer">realtime-dart</a></td>
-    <td><a href="https://github.com/supabase/storage-dart" target="_blank" rel="noopener noreferrer">storage-dart</a></td>
+    <td><a href="https://github.com/supabase-community/functions-csharp" target="_blank" rel="noopener noreferrer">functions-csharp</a></td>
   </tr>
   <tr>
     <td>Go</td>
     <td>-</td>
     <td><a href="https://github.com/supabase-community/postgrest-go" target="_blank" rel="noopener noreferrer">postgrest-go</a></td>
+    <td><a href="https://github.com/supabase-community/gotrue-go" target="_blank" rel="noopener noreferrer">gotrue-go</a></td>
     <td>-</td>
-    <td>-</td>
-    <td>-</td>
+    <td><a href="https://github.com/supabase-community/storage-go" target="_blank" rel="noopener noreferrer">storage-go</a></td>
+    <td><a href="https://github.com/supabase-community/functions-go" target="_blank" rel="noopener noreferrer">functions-go</a></td>
   </tr>
   <tr>
     <td>Java</td>
@@ -134,14 +143,16 @@ Nossa biblioteca de cliente é modular. Cada sub-biblioteca é uma implementaç
     <td><a href="https://github.com/supabase-community/gotrue-java" target="_blank" rel="noopener noreferrer">gotrue-java</a></td>
     <td>-</td>
     <td>-</td>
+    <td>-</td>
   </tr>
   <tr>
     <td>Kotlin</td>
-    <td>-</td>
+    <td><a href="https://github.com/supabase-community/supabase-kt" target="_blank" rel="noopener noreferrer">supabase-kt</a></td>
     <td><a href="https://github.com/supabase-community/postgrest-kt" target="_blank" rel="noopener noreferrer">postgrest-kt</a></td>
     <td><a href="https://github.com/supabase-community/gotrue-kt" target="_blank" rel="noopener noreferrer">gotrue-kt</a></td>
-    <td>-</td>
-    <td>-</td>
+    <td><a href="https://github.com/supabase-community/supabase-kt/tree/master/Realtime" target="_blank" rel="noopener noreferrer">realtime-kt</a></td>
+    <td><a href="https://github.com/supabase-community/supabase-kt/tree/master/Storage" target="_blank" rel="noopener noreferrer">storage-kt</a></td>
+    <td><a href="https://github.com/supabase-community/supabase-kt/tree/master/Functions" target="_blank" rel="noopener noreferrer">functions-kt</a></td>
   </tr>
   <tr>
     <td>Python</td>
@@ -149,7 +160,8 @@ Nossa biblioteca de cliente é modular. Cada sub-biblioteca é uma implementaç
     <td><a href="https://github.com/supabase-community/postgrest-py" target="_blank" rel="noopener noreferrer">postgrest-py</a></td>
     <td><a href="https://github.com/supabase-community/gotrue-py" target="_blank" rel="noopener noreferrer">gotrue-py</a></td>
     <td><a href="https://github.com/supabase-community/realtime-py" target="_blank" rel="noopener noreferrer">realtime-py</a></td>
-    <td>-</td>
+    <td><a href="https://github.com/supabase-community/storage-py" target="_blank" rel="noopener noreferrer">storage-py</a></td>
+    <td><a href="https://github.com/supabase-community/functions-py" target="_blank" rel="noopener noreferrer">functions-py</a></td>
   </tr>
   <tr>
     <td>Ruby</td>
@@ -158,6 +170,7 @@ Nossa biblioteca de cliente é modular. Cada sub-biblioteca é uma implementaç
     <td>-</td>
     <td>-</td>
     <td>-</td>
+    <td>-</td>
   </tr>
   <tr>
     <td>Rust</td>
@@ -166,6 +179,7 @@ Nossa biblioteca de cliente é modular. Cada sub-biblioteca é uma implementaç
     <td>-</td>
     <td>-</td>
     <td>-</td>
+    <td>-</td>
   </tr>
   <tr>
     <td>Swift</td>
@@ -174,6 +188,16 @@ Nossa biblioteca de cliente é modular. Cada sub-biblioteca é uma implementaç
     <td><a href="https://github.com/supabase-community/gotrue-swift" target="_blank" rel="noopener noreferrer">gotrue-swift</a></td>
     <td><a href="https://github.com/supabase-community/realtime-swift" target="_blank" rel="noopener noreferrer">realtime-swift</a></td>
     <td><a href="https://github.com/supabase-community/storage-swift" target="_blank" rel="noopener noreferrer">storage-swift</a></td>
+    <td><a href="https://github.com/supabase-community/functions-swift" target="_blank" rel="noopener noreferrer">functions-swift</a></td>
+  </tr>
+   <tr>
+    <td>Godot Engine (GDScript)</td>
+    <td><a href="https://github.com/supabase-community/godot-engine.supabase" target="_blank" rel="noopener noreferrer">supabase-gdscript</a></td>
+    <td><a href="https://github.com/supabase-community/postgrest-gdscript" target="_blank" rel="noopener noreferrer">postgrest-gdscript</a></td>
+    <td><a href="https://github.com/supabase-community/gotrue-gdscript" target="_blank" rel="noopener noreferrer">gotrue-gdscript</a></td>
+    <td><a href="https://github.com/supabase-community/realtime-gdscript" target="_blank" rel="noopener noreferrer">realtime-gdscript</a></td>
+    <td><a href="https://github.com/supabase-community/storage-gdscript" target="_blank" rel="noopener noreferrer">storage-gdscript</a></td>
+    <td><a href="https://github.com/supabase-community/functions-gdscript" target="_blank" rel="noopener noreferrer">functions-gdscript</a></td>
   </tr>
 </table>
 
diff --git a/studio/components/grid/components/header/Header.tsx b/studio/components/grid/components/header/Header.tsx
index d12de67b882..a3042f00fe0 100644
--- a/studio/components/grid/components/header/Header.tsx
+++ b/studio/components/grid/components/header/Header.tsx
@@ -137,7 +137,7 @@ const RowHeader: FC<RowHeaderProps> = ({ sorts, filters }) => {
         } else {
           const rowIdxs = Array.from(selectedRows) as number[]
           const rows = allRows.filter((x) => rowIdxs.includes(x.idx))
-          const { error } = state.rowService!.delete(rows)
+          const { error } = await state.rowService!.delete(rows)
           if (error) {
             if (state.onError) state.onError(error)
           } else {
diff --git a/studio/components/grid/components/menu/RowContextMenu.tsx b/studio/components/grid/components/menu/RowContextMenu.tsx
index 545f534c7ad..28f2b6430a2 100644
--- a/studio/components/grid/components/menu/RowContextMenu.tsx
+++ b/studio/components/grid/components/menu/RowContextMenu.tsx
@@ -17,13 +17,13 @@ const RowContextMenu: React.FC<RowContextMenuProps> = ({}) => {
     confirmAlert({
       title: 'Confirm to delete',
       message: 'Are you sure you want to delete this row? This action cannot be undone.',
-      onConfirm: async () => {
+      onAsyncConfirm: async () => {
         const { props } = p
         const { rowIdx } = props
         const row = state.rows[rowIdx]
         if (!row) return
 
-        const { error } = state.rowService!.delete([row])
+        const { error } = await state.rowService!.delete([row])
         if (error) {
           if (state.onError) state.onError(error)
         } else {
diff --git a/studio/components/grid/services/row/SqlRowService.ts b/studio/components/grid/services/row/SqlRowService.ts
index 25302c459ac..4e4e7226396 100644
--- a/studio/components/grid/services/row/SqlRowService.ts
+++ b/studio/components/grid/services/row/SqlRowService.ts
@@ -37,11 +37,7 @@ export class SqlRowService implements IRowService {
     }
   }
 
-  async create(row: SupaRow) {
-    return { error: { message: 'not implemented' } }
-  }
-
-  delete(rows: SupaRow[]) {
+  async delete(rows: SupaRow[]) {
     const { primaryKeys, error } = this.getPrimaryKeys()
     if (error) return { error }
 
@@ -53,14 +49,7 @@ export class SqlRowService implements IRowService {
     })
 
     const query = queryChains.toSql()
-    SupabaseGridQueue.add(async () => {
-      const { error } = await this.onSqlQuery(query)
-      if (error) throw error
-    }).catch((error) => {
-      this.onError(error)
-    })
-
-    return {}
+    return await this.onSqlQuery(query)
   }
 
   // For deleting all rows based on a given filter
diff --git a/studio/components/grid/services/row/index.tsx b/studio/components/grid/services/row/index.tsx
index e9d1eddec87..3c63b0685a1 100644
--- a/studio/components/grid/services/row/index.tsx
+++ b/studio/components/grid/services/row/index.tsx
@@ -3,8 +3,6 @@ import { Filter, ServiceError, Sort, SupaRow } from '../../types'
 export interface IRowService {
   count: (filters: Filter[]) => Promise<{ data?: number; error?: ServiceError }>
 
-  create: (row: SupaRow) => Promise<{ data?: SupaRow; error?: ServiceError }>
-
   fetchPage: (
     page: number,
     rowsPerPage: number,
@@ -25,7 +23,7 @@ export interface IRowService {
    * Right now, we remove rows immediately, so it's confused when delete operation fails
    * and rows are already removed from the grid
    */
-  delete: (rows: SupaRow[]) => { error?: ServiceError }
+  delete: (rows: SupaRow[]) => Promise<{ error?: ServiceError }>
   deleteAll: (filters: Filter[]) => Promise<{ error?: ServiceError }>
 
   update: (
diff --git a/studio/components/interfaces/App/PortalToast.tsx b/studio/components/interfaces/App/PortalToast.tsx
index 14cc701e890..67386cf12b7 100644
--- a/studio/components/interfaces/App/PortalToast.tsx
+++ b/studio/components/interfaces/App/PortalToast.tsx
@@ -32,14 +32,16 @@ const PortalToast = () => (
           {({ icon, message }) => (
             <>
               {icon}
-              {message}
-              {t.type !== 'loading' && (
-                <div className="ml-4">
-                  <Button className="!p-1" type="text" onClick={() => toast.dismiss(t.id)}>
-                    <IconX size={14} strokeWidth={2} />
-                  </Button>
-                </div>
-              )}
+              <div className="flex items-center">
+                <div className="toast-message w-full">{message}</div>
+                {t.type !== 'loading' && (
+                  <div className="ml-4">
+                    <Button className="!p-1" type="text" onClick={() => toast.dismiss(t.id)}>
+                      <IconX size={14} strokeWidth={2} />
+                    </Button>
+                  </div>
+                )}
+              </div>
             </>
           )}
         </ToastBar>
diff --git a/studio/components/interfaces/Billing/AddOns/AddOns.utils.ts b/studio/components/interfaces/Billing/AddOns/AddOns.utils.ts
index 4440c0a0f78..9b1a7bf7d68 100644
--- a/studio/components/interfaces/Billing/AddOns/AddOns.utils.ts
+++ b/studio/components/interfaces/Billing/AddOns/AddOns.utils.ts
@@ -1,12 +1,17 @@
 import { DatabaseAddon } from './AddOns.types'
 
-// e.g supabase-postgres-14.1.0.88 (There's 4 segments instead, so we can't use semver)
 export const getSemanticVersion = (version: string) => {
   if (!version) return 0
 
-  const segments = version.split('-')
+  // e.g supabase-postgres-14.1.0.88
+  // There's 4 segments instead so we can't use the semver package
+  const segments = version.split('supabase-postgres-')
   const semver = segments[segments.length - 1]
-  return Number(semver.split('.').join(''))
+
+  // e.g supabase-postgres-14.1.0.99-vault-rc1
+  const formattedSemver = semver.split('-')[0]
+
+  return Number(formattedSemver.split('.').join(''))
 }
 
 export const formatComputeSizes = (addons: DatabaseAddon[]) => {
diff --git a/studio/components/interfaces/Billing/PaymentSummaryPanel/PaymentSummaryPanel.tsx b/studio/components/interfaces/Billing/PaymentSummaryPanel/PaymentSummaryPanel.tsx
index a3134c2629e..7405534e4d2 100644
--- a/studio/components/interfaces/Billing/PaymentSummaryPanel/PaymentSummaryPanel.tsx
+++ b/studio/components/interfaces/Billing/PaymentSummaryPanel/PaymentSummaryPanel.tsx
@@ -71,12 +71,11 @@ const PaymentSummaryPanel: FC<Props> = ({
 }) => {
   const { ui } = useStore()
   const projectRegion = ui.selectedProject?.region
-  const isOwner = ui.selectedOrganization?.is_owner
 
-  const enablePermissions = useFlag('enablePermissions')
-  const canUpdatePaymentMethods = enablePermissions
-    ? checkPermissions(PermissionAction.BILLING_WRITE, 'stripe.payment_methods')
-    : isOwner
+  const canUpdatePaymentMethods = checkPermissions(
+    PermissionAction.BILLING_WRITE,
+    'stripe.payment_methods'
+  )
 
   const [showConfirmModal, setShowConfirmModal] = useState(false)
 
@@ -311,9 +310,8 @@ const PaymentSummaryPanel: FC<Props> = ({
                       ].join(' ')}
                     >
                       <span className="text-xs text-scale-1200">
-                        {enablePermissions
-                          ? 'You need additional permissions to add new payment methods to this organization'
-                          : 'Only organization owners can add new payment methods'}
+                        You need additional permissions to add new payment methods to this
+                        organization
                       </span>
                     </div>
                   </Tooltip.Content>
diff --git a/studio/components/interfaces/Billing/Subscription/Subscription.tsx b/studio/components/interfaces/Billing/Subscription/Subscription.tsx
index 22909243baa..aa49e690d66 100644
--- a/studio/components/interfaces/Billing/Subscription/Subscription.tsx
+++ b/studio/components/interfaces/Billing/Subscription/Subscription.tsx
@@ -36,13 +36,13 @@ const Subscription: FC<Props> = ({
   const router = useRouter()
 
   const { ref } = router.query
-  const enablePermissions = useFlag('enablePermissions')
   const projectUpdateDisabled = useFlag('disableProjectCreationAndUpdate')
 
   const canReadSubscription = checkPermissions(PermissionAction.READ, 'subscriptions')
-  const canUpdateSubscription = enablePermissions
-    ? checkPermissions(PermissionAction.BILLING_WRITE, 'stripe.subscriptions')
-    : ui.selectedOrganization?.is_owner
+  const canUpdateSubscription = checkPermissions(
+    PermissionAction.BILLING_WRITE,
+    'stripe.subscriptions'
+  )
 
   const { usage, isLoading: loadingUsage } = useProjectUsage(ref as string)
 
@@ -112,10 +112,8 @@ const Subscription: FC<Props> = ({
                             <br />
                             Our engineers are working on a fix.
                           </>
-                        ) : !canUpdateSubscription && enablePermissions ? (
+                        ) : !canUpdateSubscription ? (
                           'You need additional permissions to amend subscriptions'
-                        ) : !canUpdateSubscription && !enablePermissions ? (
-                          'Only the organization owner can amend subscriptions'
                         ) : (
                           ''
                         )}
diff --git a/studio/components/interfaces/Database/Backups/PITR/PITRSelection.tsx b/studio/components/interfaces/Database/Backups/PITR/PITRSelection.tsx
index cc81c51e4ff..04fda2cda25 100644
--- a/studio/components/interfaces/Database/Backups/PITR/PITRSelection.tsx
+++ b/studio/components/interfaces/Database/Backups/PITR/PITRSelection.tsx
@@ -86,8 +86,8 @@ const PITRSelection = ({}) => {
 
   // Start: Variables specifically for date picker component
   // Required as it only works with vanilla Date object which is not timezone localized
-  const earliestAvailableBackupFormatted = new Date(earliestAvailableBackup.format('DD-MMM-YYYY'))
-  const latestAvailableBackupFormatted = new Date(latestAvailableBackup.format('DD-MMM-YYYY'))
+  const earliestAvailableBackupFormatted = new Date(earliestAvailableBackup.format('YYYY-MM-DD'))
+  const latestAvailableBackupFormatted = new Date(latestAvailableBackup.format('YYYY-MM-DD'))
   const isSelectedOnEarliest = checkMatchingDates(selectedDate, earliestAvailableBackupFormatted)
   const isSelectedOnLatest = checkMatchingDates(selectedDate, latestAvailableBackupFormatted)
   const availableDates = getDatesBetweenRange(
diff --git a/studio/components/interfaces/Organization/BillingSettings/BillingAddress/BillingAddress.tsx b/studio/components/interfaces/Organization/BillingSettings/BillingAddress/BillingAddress.tsx
index cb9978efc57..010510676a2 100644
--- a/studio/components/interfaces/Organization/BillingSettings/BillingAddress/BillingAddress.tsx
+++ b/studio/components/interfaces/Organization/BillingSettings/BillingAddress/BillingAddress.tsx
@@ -4,7 +4,7 @@ import { Dictionary } from 'components/grid'
 import { Form, Input, Button, Listbox } from 'ui'
 import { PermissionAction } from '@supabase/shared-types/out/constants'
 
-import { checkPermissions, useStore, useFlag } from 'hooks'
+import { checkPermissions, useStore } from 'hooks'
 import { patch } from 'lib/common/fetch'
 import { API_URL } from 'lib/constants'
 import { COUNTRIES } from './BillingAddress.constants'
@@ -22,11 +22,11 @@ const BillingAddress: FC<Props> = ({ loading, address, onAddressUpdated }) => {
   const orgSlug = ui.selectedOrganization?.slug ?? ''
   const { city, country, line1, line2, postal_code, state } = address
 
-  const enablePermissions = useFlag('enablePermissions')
   const canReadBillingAddress = checkPermissions(PermissionAction.BILLING_READ, 'stripe.customer')
-  const canUpdateBillingAddress = enablePermissions
-    ? checkPermissions(PermissionAction.BILLING_WRITE, 'stripe.customer')
-    : ui.selectedOrganization?.is_owner
+  const canUpdateBillingAddress = checkPermissions(
+    PermissionAction.BILLING_WRITE,
+    'stripe.customer'
+  )
 
   const [isDirty, setIsDirty] = useState(false)
   const initialValues = {
diff --git a/studio/components/interfaces/Organization/BillingSettings/BillingEmail.tsx b/studio/components/interfaces/Organization/BillingSettings/BillingEmail.tsx
index ca1fdf60647..052285ce1fa 100644
--- a/studio/components/interfaces/Organization/BillingSettings/BillingEmail.tsx
+++ b/studio/components/interfaces/Organization/BillingSettings/BillingEmail.tsx
@@ -1,17 +1,11 @@
 import { useContext, useEffect } from 'react'
 import { Form, Input } from 'ui'
 import { PermissionAction } from '@supabase/shared-types/out/constants'
-import { useFlag, useStore, checkPermissions } from 'hooks'
+import { useStore, checkPermissions } from 'hooks'
 import { API_URL } from 'lib/constants'
 import { patch } from 'lib/common/fetch'
 
-import {
-  FormActions,
-  FormPanel,
-  FormSection,
-  FormSectionContent,
-  FormSectionLabel,
-} from 'components/ui/Forms'
+import { FormActions, FormPanel, FormSection, FormSectionContent } from 'components/ui/Forms'
 
 import { PageContext } from 'pages/org/[slug]/settings'
 
@@ -24,12 +18,7 @@ const BillingEmail = () => {
     billing_email: PageState.organization?.billing_email ?? '',
   }
 
-  const enablePermissions = useFlag('enablePermissions')
-
-  const canUpdateOrganization = enablePermissions
-    ? checkPermissions(PermissionAction.UPDATE, 'organizations')
-    : ui.selectedOrganization?.is_owner
-
+  const canUpdateOrganization = checkPermissions(PermissionAction.UPDATE, 'organizations')
   const canReadBillingEmail = checkPermissions(PermissionAction.READ, 'organizations')
 
   const onUpdateOrganization = async (values: any, { setSubmitting, resetForm }: any) => {
diff --git a/studio/components/interfaces/Organization/BillingSettings/BillingSettings.tsx b/studio/components/interfaces/Organization/BillingSettings/BillingSettings.tsx
index 5dc4677375e..6057c57a403 100644
--- a/studio/components/interfaces/Organization/BillingSettings/BillingSettings.tsx
+++ b/studio/components/interfaces/Organization/BillingSettings/BillingSettings.tsx
@@ -1,6 +1,6 @@
 import { FC, useState, useEffect } from 'react'
 
-import { useFlag, useStore, checkPermissions } from 'hooks'
+import { useStore } from 'hooks'
 import { API_URL } from 'lib/constants'
 import { get } from 'lib/common/fetch'
 
@@ -9,7 +9,6 @@ import CreditBalance from './CreditBalance'
 import PaymentMethods from './PaymentMethods'
 import BillingAddress from './BillingAddress/BillingAddress'
 import TaxID from './TaxID/TaxID'
-import { PermissionAction } from '@supabase/shared-types/out/constants'
 import BillingEmail from './BillingEmail'
 
 interface Props {
@@ -39,14 +38,6 @@ const BillingSettings: FC<Props> = ({ organization, projects = [] }) => {
       ? customerBalance.toString().replace('-', '')
       : customerBalance
 
-  const enablePermissions = useFlag('enablePermissions')
-
-  const canUpdateOrganization = enablePermissions
-    ? checkPermissions(PermissionAction.UPDATE, 'organizations')
-    : ui.selectedOrganization?.is_owner
-
-  const canReadBillingEmail = checkPermissions(PermissionAction.READ, 'organizations')
-
   useEffect(() => {
     getCustomerProfile()
     getPaymentMethods()
diff --git a/studio/components/interfaces/Organization/BillingSettings/PaymentMethods.tsx b/studio/components/interfaces/Organization/BillingSettings/PaymentMethods.tsx
index 7b7d38b4c39..f5675c7620b 100644
--- a/studio/components/interfaces/Organization/BillingSettings/PaymentMethods.tsx
+++ b/studio/components/interfaces/Organization/BillingSettings/PaymentMethods.tsx
@@ -46,15 +46,14 @@ const PaymentMethods: FC<Props> = ({
   const [showAddPaymentMethodModal, setShowAddPaymentMethodModal] = useState(false)
   const [isUpdatingPaymentMethod, setIsUpdatingPaymentMethod] = useState(false)
 
-  const enablePermissions = useFlag('enablePermissions')
-
   const canReadPaymentMethods = checkPermissions(
     PermissionAction.BILLING_READ,
     'stripe.payment_methods'
   )
-  const canUpdatePaymentMethods = enablePermissions
-    ? checkPermissions(PermissionAction.BILLING_WRITE, 'stripe.payment_methods')
-    : isOwner
+  const canUpdatePaymentMethods = checkPermissions(
+    PermissionAction.BILLING_WRITE,
+    'stripe.payment_methods'
+  )
 
   const onConfirmMakeDefaultPaymentMethod = async () => {
     try {
@@ -120,9 +119,7 @@ const PaymentMethods: FC<Props> = ({
                 <div className="flex w-full justify-between">
                   {!canUpdatePaymentMethods ? (
                     <p className="text-sm text-scale-1000">
-                      {enablePermissions
-                        ? "You need additional permissions to manage this organization's payment methods"
-                        : 'Only organization owners can update payment methods'}
+                      You need additional permissions to manage this organization's payment methods
                     </p>
                   ) : (
                     <div />
diff --git a/studio/components/interfaces/Organization/BillingSettings/TaxID/TaxID.tsx b/studio/components/interfaces/Organization/BillingSettings/TaxID/TaxID.tsx
index 1c525608eb4..31dffe44d4f 100644
--- a/studio/components/interfaces/Organization/BillingSettings/TaxID/TaxID.tsx
+++ b/studio/components/interfaces/Organization/BillingSettings/TaxID/TaxID.tsx
@@ -50,12 +50,8 @@ const TaxID: FC<Props> = ({ loading, taxIds, onTaxIdsUpdated }) => {
   }, [taxIds])
 
   const hasChanges = !isEqual(taxIdValues, formattedTaxIds)
-
-  const enablePermissions = useFlag('enablePermissions')
   const canReadTaxIds = checkPermissions(PermissionAction.BILLING_READ, 'stripe.tax_ids')
-  const canUpdateTaxIds = enablePermissions
-    ? checkPermissions(PermissionAction.BILLING_WRITE, 'stripe.tax_ids')
-    : ui.selectedOrganization?.is_owner
+  const canUpdateTaxIds = checkPermissions(PermissionAction.BILLING_WRITE, 'stripe.tax_ids')
 
   const onUpdateTaxId = (id: string, key: string, value: string) => {
     const updatedTaxIds = taxIdValues.map((taxId: any) => {
diff --git a/studio/components/interfaces/Organization/GeneralSettings/GeneralSettings.tsx b/studio/components/interfaces/Organization/GeneralSettings/GeneralSettings.tsx
index 9af091fa4d2..f87ab5c6be4 100644
--- a/studio/components/interfaces/Organization/GeneralSettings/GeneralSettings.tsx
+++ b/studio/components/interfaces/Organization/GeneralSettings/GeneralSettings.tsx
@@ -3,7 +3,7 @@ import { observer } from 'mobx-react-lite'
 import { Form, Input } from 'ui'
 import { PermissionAction } from '@supabase/shared-types/out/constants'
 
-import { useFlag, useStore, checkPermissions } from 'hooks'
+import { useStore, checkPermissions } from 'hooks'
 import { API_URL } from 'lib/constants'
 import { patch } from 'lib/common/fetch'
 
@@ -24,16 +24,8 @@ const GeneralSettings = observer(() => {
 
   const formId = 'org-general-settings'
   const initialValues = { name: PageState.organization.name }
-
-  const enablePermissions = useFlag('enablePermissions')
-
-  const canUpdateOrganization = enablePermissions
-    ? checkPermissions(PermissionAction.UPDATE, 'organizations')
-    : ui.selectedOrganization?.is_owner
-
-  const canDeleteOrganization = enablePermissions
-    ? checkPermissions(PermissionAction.UPDATE, 'organizations')
-    : ui.selectedOrganization?.is_owner
+  const canUpdateOrganization = checkPermissions(PermissionAction.UPDATE, 'organizations')
+  const canDeleteOrganization = checkPermissions(PermissionAction.UPDATE, 'organizations')
 
   const onUpdateOrganization = async (values: any, { setSubmitting, resetForm }: any) => {
     if (!canUpdateOrganization) {
diff --git a/studio/components/interfaces/Organization/NewProject/NotOrganizationOwnerWarning.tsx b/studio/components/interfaces/Organization/NewProject/NotOrganizationOwnerWarning.tsx
index d98396c9a87..a80724fb25c 100644
--- a/studio/components/interfaces/Organization/NewProject/NotOrganizationOwnerWarning.tsx
+++ b/studio/components/interfaces/Organization/NewProject/NotOrganizationOwnerWarning.tsx
@@ -1,12 +1,8 @@
 import { IconAlertCircle } from 'ui'
-
-import { useFlag } from 'hooks'
 import InformationBox from 'components/ui/InformationBox'
 
 // [Joshen] This can just use NoPermission component i think
 const NotOrganizationOwnerWarning = () => {
-  const enablePermissions = useFlag('enablePermissions')
-
   return (
     <div className="mt-4">
       <InformationBox
@@ -17,9 +13,7 @@ const NotOrganizationOwnerWarning = () => {
         description={
           <div className="space-y-3">
             <p className="text-sm leading-normal">
-              {enablePermissions
-                ? 'Contact your organization owner or adminstrator to create a new project.'
-                : 'Only the organization owner can create new projects. Contact your organization owner to create a new project for this organization.'}
+              Contact your organization owner or adminstrator to create a new project.
             </p>
           </div>
         }
diff --git a/studio/components/interfaces/Organization/TeamSettings/InviteMemberButton.tsx b/studio/components/interfaces/Organization/TeamSettings/InviteMemberButton.tsx
index 092a893902b..091496b3238 100644
--- a/studio/components/interfaces/Organization/TeamSettings/InviteMemberButton.tsx
+++ b/studio/components/interfaces/Organization/TeamSettings/InviteMemberButton.tsx
@@ -6,7 +6,7 @@ import * as Tooltip from '@radix-ui/react-tooltip'
 import { Button, Form, IconMail, Input, Modal, Select } from 'ui'
 
 import { Member, User, Role } from 'types'
-import { checkPermissions, useFlag, useOrganizationDetail, useStore } from 'hooks'
+import { checkPermissions, useOrganizationDetail, useStore } from 'hooks'
 import { post } from 'lib/common/fetch'
 import { API_URL } from 'lib/constants'
 import { PermissionAction } from '@supabase/shared-types/out/constants'
@@ -23,8 +23,6 @@ const InviteMemberButton: FC<Props> = ({ user, members = [], roles = [], rolesAd
   const router = useRouter()
   const { slug } = router.query
 
-  const enablePermissions = useFlag('enablePermissions')
-
   const [isOpen, setIsOpen] = useState(false)
   const { mutateOrgMembers } = useOrganizationDetail((slug as string) || '')
 
@@ -57,16 +55,14 @@ const InviteMemberButton: FC<Props> = ({ user, members = [], roles = [], rolesAd
       }
     }
 
-    const roleId = enablePermissions
-      ? Number(values.role)
-      : roles.find((role) => role.name === 'Developer')?.id ?? roles[0].id
+    const roleId = Number(values.role)
 
     setSubmitting(true)
 
     const response = await post(`${API_URL}/organizations/${slug}/members/invite`, {
       invited_email: values.email.toLowerCase(),
       owner_id: user.id,
-      ...(enablePermissions ? { role_id: roleId } : {}),
+      role_id: roleId,
     })
 
     if (response.error) {
@@ -141,9 +137,7 @@ const InviteMemberButton: FC<Props> = ({ user, members = [], roles = [], rolesAd
             }, [roles])
 
             const selectedRole = roles.find((role) => role.id === Number(values.role))
-            const invalidRoleSelected = enablePermissions
-              ? values.role && !rolesAddable.includes(Number(values.role))
-              : false
+            const invalidRoleSelected = values.role && !rolesAddable.includes(Number(values.role))
 
             return (
               <>
@@ -151,7 +145,7 @@ const InviteMemberButton: FC<Props> = ({ user, members = [], roles = [], rolesAd
                   <div className="w-full py-4">
                     <div className="space-y-4">
                       <div className="space-y-2">
-                        {roles && enablePermissions && (
+                        {roles && (
                           <Select
                             name="role"
                             label="Member role"
diff --git a/studio/components/interfaces/Organization/TeamSettings/MemberActions.tsx b/studio/components/interfaces/Organization/TeamSettings/MemberActions.tsx
index b3df262556a..86c4bbc51e0 100644
--- a/studio/components/interfaces/Organization/TeamSettings/MemberActions.tsx
+++ b/studio/components/interfaces/Organization/TeamSettings/MemberActions.tsx
@@ -5,7 +5,7 @@ import { PermissionAction } from '@supabase/shared-types/out/constants'
 import { Button, Dropdown, IconTrash, IconMoreHorizontal } from 'ui'
 
 import { Member, Role } from 'types'
-import { useStore, useOrganizationDetail, useFlag, checkPermissions } from 'hooks'
+import { useStore, useOrganizationDetail, checkPermissions } from 'hooks'
 import { delete_, post } from 'lib/common/fetch'
 import { API_URL } from 'lib/constants'
 import TextConfirmModal from 'components/ui/Modals/TextConfirmModal'
@@ -27,7 +27,6 @@ const MemberActions: FC<Props> = ({ members, member, roles }) => {
   const { rolesRemovable } = getRolesManagementPermissions(roles)
 
   const { app, ui } = useStore()
-  const enablePermissions = useFlag('enablePermissions')
   const { mutateOrgMembers } = useOrganizationDetail(ui.selectedOrganization?.slug || '')
 
   const [loading, setLoading] = useState(false)
@@ -37,9 +36,7 @@ const MemberActions: FC<Props> = ({ members, member, roles }) => {
   const isPendingInviteAcceptance = member.invited_id
 
   const roleId = member.role_ids?.[0] ?? -1
-  const canRemoveMember = enablePermissions
-    ? rolesRemovable.includes((member?.role_ids ?? [-1])[0])
-    : true
+  const canRemoveMember = rolesRemovable.includes((member?.role_ids ?? [-1])[0])
   const canResendInvite = checkPermissions(PermissionAction.CREATE, 'user_invites', {
     resource: { role_id: roleId },
   })
@@ -54,11 +51,9 @@ const MemberActions: FC<Props> = ({ members, member, roles }) => {
       onAsyncConfirm: async () => {
         setLoading(true)
 
-        const response = enablePermissions
-          ? await delete_(`${API_URL}/organizations/${slug}/members/${member.gotrue_id}`)
-          : await delete_(`${API_URL}/organizations/${slug}/members/remove`, {
-              member_id: member.id,
-            })
+        const response = await delete_(
+          `${API_URL}/organizations/${slug}/members/${member.gotrue_id}`
+        )
 
         if (response.error) {
           ui.setNotification({
@@ -67,9 +62,7 @@ const MemberActions: FC<Props> = ({ members, member, roles }) => {
           })
           setLoading(false)
         } else {
-          const updatedMembers = enablePermissions
-            ? members.filter((m) => m.gotrue_id !== member.gotrue_id)
-            : members.filter((m) => m.id !== member.id)
+          const updatedMembers = members.filter((m) => m.gotrue_id !== member.gotrue_id)
 
           mutateOrgMembers(updatedMembers)
           ui.setNotification({
@@ -117,7 +110,7 @@ const MemberActions: FC<Props> = ({ members, member, roles }) => {
     const response = await post(`${API_URL}/organizations/${slug}/members/invite`, {
       invited_email: member.primary_email,
       owner_id: member.invited_id,
-      ...(enablePermissions ? { role_id: roleId } : {}),
+      role_id: roleId,
     })
 
     if (response.error) {
@@ -189,7 +182,7 @@ const MemberActions: FC<Props> = ({ members, member, roles }) => {
         align="end"
         overlay={
           <>
-            {!enablePermissions && !isPendingInviteAcceptance && (
+            {!isPendingInviteAcceptance && (
               <>
                 <Dropdown.Item onClick={() => setOwnerTransferIsVisible(!ownerTransferIsVisible)}>
                   <div className="flex flex-col">
diff --git a/studio/components/interfaces/Organization/TeamSettings/MembersView.tsx b/studio/components/interfaces/Organization/TeamSettings/MembersView.tsx
index 101401a91c3..530bc2073e7 100644
--- a/studio/components/interfaces/Organization/TeamSettings/MembersView.tsx
+++ b/studio/components/interfaces/Organization/TeamSettings/MembersView.tsx
@@ -5,7 +5,7 @@ import { observer } from 'mobx-react-lite'
 import { Badge, Button, Loading, Listbox, IconUser, Modal } from 'ui'
 
 import { Member, Role } from 'types'
-import { useStore, useFlag, useOrganizationDetail } from 'hooks'
+import { useStore, useOrganizationDetail } from 'hooks'
 import { patch } from 'lib/common/fetch'
 import { API_URL } from 'lib/constants'
 import { isInviteExpired, getUserDisplayName } from '../Organization.utils'
@@ -28,17 +28,13 @@ const MembersView = () => {
 
   const { ui } = useStore()
   const slug = ui.selectedOrganization?.slug || ''
-  const isOwner = ui.selectedOrganization?.is_owner
 
-  const enablePermissions = useFlag('enablePermissions')
   const { mutateOrgMembers } = useOrganizationDetail(slug)
 
   const [loading, setLoading] = useState(false)
   const [selectedMember, setSelectedMember] = useState<SelectedMember>()
   const [userRoleChangeModalVisible, setUserRoleChangeModalVisible] = useState(false)
 
-  const hasAccessToMemberActions = enablePermissions ? true : isOwner
-
   const getRoleNameById = (id: number | undefined) => {
     if (!roles) return id
     return roles.find((x: any) => x.id === id)?.name
@@ -87,7 +83,7 @@ const MembersView = () => {
               <Table.th key="header-status"></Table.th>,
               <Table.th key="header-role" className="flex items-center space-x-2">
                 <span>Role</span>
-                {enablePermissions && <RolesHelperModal />}
+                <RolesHelperModal />
               </Table.th>,
               <Table.th key="header-action"></Table.th>,
             ]}
@@ -157,71 +153,64 @@ const MembersView = () => {
                       </Table.td>
 
                       <Table.td>
-                        {!role && !enablePermissions && <p>{x.is_owner ? 'Owner' : 'Developer'}</p>}
+                        {!role && <p>{x.is_owner ? 'Owner' : 'Developer'}</p>}
                         {role && (
-                          <>
-                            {!enablePermissions ? (
-                              <p>{role?.name ?? 'Developer'}</p>
-                            ) : (
-                              <Tooltip.Root delayDuration={0}>
-                                <Tooltip.Trigger>
-                                  <Listbox
-                                    className={disableRoleEdit ? 'pointer-events-none' : ''}
+                          <Tooltip.Root delayDuration={0}>
+                            <Tooltip.Trigger>
+                              <Listbox
+                                className={disableRoleEdit ? 'pointer-events-none' : ''}
+                                disabled={disableRoleEdit}
+                                value={role.id}
+                                onChange={validateSelectedRoleToChange}
+                              >
+                                {roles.map((r: any) => (
+                                  <Listbox.Option
+                                    key={r.id}
+                                    value={r.id}
+                                    label={r.name}
                                     disabled={disableRoleEdit}
-                                    value={role.id}
-                                    onChange={validateSelectedRoleToChange}
                                   >
-                                    {roles.map((r: any) => (
-                                      <Listbox.Option
-                                        key={r.id}
-                                        value={r.id}
-                                        label={r.name}
-                                        disabled={disableRoleEdit}
-                                      >
-                                        {r.name}
-                                      </Listbox.Option>
-                                    ))}
-                                  </Listbox>
-                                </Tooltip.Trigger>
-                                {memberIsPendingInvite ? (
-                                  <Tooltip.Content side="bottom">
-                                    <Tooltip.Arrow className="radix-tooltip-arrow" />
-                                    <div
-                                      className={[
-                                        'rounded bg-scale-100 py-1 px-2 leading-none shadow', // background
-                                        'border border-scale-200 ', //border
-                                      ].join(' ')}
-                                    >
-                                      <span className="text-xs text-scale-1200">
-                                        Role can only be changed after the user has accepted the
-                                        invite
-                                      </span>
-                                    </div>
-                                  </Tooltip.Content>
-                                ) : !memberIsUser && !canRemoveRole ? (
-                                  <Tooltip.Content side="bottom">
-                                    <Tooltip.Arrow className="radix-tooltip-arrow" />
-                                    <div
-                                      className={[
-                                        'rounded bg-scale-100 py-1 px-2 leading-none shadow', // background
-                                        'border border-scale-200 ', //border
-                                      ].join(' ')}
-                                    >
-                                      <span className="text-xs text-scale-1200">
-                                        You need additional permissions to manage this team member
-                                      </span>
-                                    </div>
-                                  </Tooltip.Content>
-                                ) : (
-                                  <></>
-                                )}
-                              </Tooltip.Root>
+                                    {r.name}
+                                  </Listbox.Option>
+                                ))}
+                              </Listbox>
+                            </Tooltip.Trigger>
+                            {memberIsPendingInvite ? (
+                              <Tooltip.Content side="bottom">
+                                <Tooltip.Arrow className="radix-tooltip-arrow" />
+                                <div
+                                  className={[
+                                    'rounded bg-scale-100 py-1 px-2 leading-none shadow', // background
+                                    'border border-scale-200 ', //border
+                                  ].join(' ')}
+                                >
+                                  <span className="text-xs text-scale-1200">
+                                    Role can only be changed after the user has accepted the invite
+                                  </span>
+                                </div>
+                              </Tooltip.Content>
+                            ) : !memberIsUser && !canRemoveRole ? (
+                              <Tooltip.Content side="bottom">
+                                <Tooltip.Arrow className="radix-tooltip-arrow" />
+                                <div
+                                  className={[
+                                    'rounded bg-scale-100 py-1 px-2 leading-none shadow', // background
+                                    'border border-scale-200 ', //border
+                                  ].join(' ')}
+                                >
+                                  <span className="text-xs text-scale-1200">
+                                    You need additional permissions to manage this team member
+                                  </span>
+                                </div>
+                              </Tooltip.Content>
+                            ) : (
+                              <></>
                             )}
-                          </>
+                          </Tooltip.Root>
                         )}
                       </Table.td>
                       <Table.td>
-                        {hasAccessToMemberActions && !memberIsUser && (
+                        {!memberIsUser && (
                           <MemberActions members={PageState.members} member={x} roles={roles} />
                         )}
                       </Table.td>
diff --git a/studio/components/interfaces/Organization/TeamSettings/TeamSettings.tsx b/studio/components/interfaces/Organization/TeamSettings/TeamSettings.tsx
index 4eb120239de..f5df041e974 100644
--- a/studio/components/interfaces/Organization/TeamSettings/TeamSettings.tsx
+++ b/studio/components/interfaces/Organization/TeamSettings/TeamSettings.tsx
@@ -2,7 +2,7 @@ import { useState, useContext } from 'react'
 import { observer } from 'mobx-react-lite'
 import { Button, Input, IconSearch } from 'ui'
 
-import { useFlag, useStore } from 'hooks'
+import { useStore } from 'hooks'
 import { post } from 'lib/common/fetch'
 import { API_URL } from 'lib/constants'
 import InviteMemberButton from './InviteMemberButton'
@@ -21,10 +21,8 @@ const TeamSettings = observer(() => {
   const slug = ui.selectedOrganization?.slug ?? ''
   const isOwner = ui.selectedOrganization?.is_owner
 
-  const enablePermissions = useFlag('enablePermissions')
   const [isLeaving, setIsLeaving] = useState(false)
-
-  const canAddMembers = enablePermissions ? rolesAddable.length > 0 : isOwner
+  const canAddMembers = rolesAddable.length > 0
 
   function onFilterMemberChange(e: any) {
     PageState.membersFilterString = e.target.value
diff --git a/studio/components/interfaces/Settings/General/CustomDomainConfig/CustomDomainConfig.tsx b/studio/components/interfaces/Settings/General/CustomDomainConfig/CustomDomainConfig.tsx
index dde95501290..be80c2ac9d8 100644
--- a/studio/components/interfaces/Settings/General/CustomDomainConfig/CustomDomainConfig.tsx
+++ b/studio/components/interfaces/Settings/General/CustomDomainConfig/CustomDomainConfig.tsx
@@ -35,7 +35,7 @@ const CustomDomainConfig = () => {
 
   return (
     <section>
-      <FormHeader title="Custom Domains" description="" />
+      <FormHeader title="Custom Domains" description="Present a branded experience to your users" />
       {data?.status === '0_no_hostname_configured' ? (
         <CustomDomainsConfigureHostname projectRef={ref} />
       ) : (
diff --git a/studio/components/interfaces/Settings/General/CustomDomainConfig/CustomDomainVerify.tsx b/studio/components/interfaces/Settings/General/CustomDomainConfig/CustomDomainVerify.tsx
index c8dee15035a..ab3a0664e3d 100644
--- a/studio/components/interfaces/Settings/General/CustomDomainConfig/CustomDomainVerify.tsx
+++ b/studio/components/interfaces/Settings/General/CustomDomainConfig/CustomDomainVerify.tsx
@@ -83,9 +83,29 @@ const CustomDomainVerify = ({ projectRef, customDomain, settings }: CustomDomain
                   : 'Please note that it may take up to 24 hours for the DNS records to propagate.'
               }
               description={
-                isNotVerifiedYet
-                  ? 'Do check again in a bit as it may take up to 24 hours for changes in DNS records to propagate.'
-                  : undefined
+                isNotVerifiedYet ? (
+                  <div className="space-y-1">
+                    <p>
+                      Do check again in a bit as it may take up to 24 hours for changes in DNS
+                      records to propagate.
+                    </p>
+                    <p>
+                      You may also visit{' '}
+                      <Link href={`https://whatsmydns.net/#TXT/${customDomain.hostname}`}>
+                        <a className="text-brand-900">here</a>
+                      </Link>{' '}
+                      to check if your DNS has been propagated successfully before clicking verify.
+                    </p>
+                  </div>
+                ) : (
+                  <p>
+                    You may also visit{' '}
+                    <Link href={`https://whatsmydns.net/#TXT/${customDomain.hostname}`}>
+                      <a className="text-brand-900">here</a>
+                    </Link>{' '}
+                    to check if your DNS has been propagated successfully before clicking verify.
+                  </p>
+                )
               }
             />
           </div>
diff --git a/studio/components/interfaces/Settings/General/CustomDomainConfig/CustomDomainsConfigureHostname.tsx b/studio/components/interfaces/Settings/General/CustomDomainConfig/CustomDomainsConfigureHostname.tsx
index a79ced1679c..5fa62056d20 100644
--- a/studio/components/interfaces/Settings/General/CustomDomainConfig/CustomDomainsConfigureHostname.tsx
+++ b/studio/components/interfaces/Settings/General/CustomDomainConfig/CustomDomainsConfigureHostname.tsx
@@ -88,7 +88,7 @@ const CustomDomainsConfigureHostname = ({ projectRef }: CustomDomainsConfigureHo
                 </div>
               }
             >
-              <FormSection header={<FormSectionLabel>Add a Custom Domain</FormSectionLabel>}>
+              <FormSection header={<FormSectionLabel>Add a custom domain</FormSectionLabel>}>
                 <FormSectionContent loading={false}>
                   <Input
                     id="domain"
diff --git a/studio/components/interfaces/Settings/General/DeleteProjectPanel/DeleteProjectButton.tsx b/studio/components/interfaces/Settings/General/DeleteProjectPanel/DeleteProjectButton.tsx
index cff0c2c739d..a316a3b1bf6 100644
--- a/studio/components/interfaces/Settings/General/DeleteProjectPanel/DeleteProjectButton.tsx
+++ b/studio/components/interfaces/Settings/General/DeleteProjectPanel/DeleteProjectButton.tsx
@@ -4,7 +4,7 @@ import { Button, Input } from 'ui'
 import * as Tooltip from '@radix-ui/react-tooltip'
 import { PermissionAction } from '@supabase/shared-types/out/constants'
 
-import { useStore, checkPermissions, useFlag } from 'hooks'
+import { useStore, checkPermissions } from 'hooks'
 import { API_URL, PRICING_TIER_PRODUCT_IDS } from 'lib/constants'
 import { delete_, post } from 'lib/common/fetch'
 import TextConfirmModal from 'components/ui/Modals/TextConfirmModal'
@@ -17,13 +17,10 @@ interface Props {
 const DeleteProjectButton: FC<Props> = ({ type = 'danger' }) => {
   const router = useRouter()
   const { app, ui } = useStore()
-  const enablePermissions = useFlag('enablePermissions')
 
   const project = ui.selectedProject
   const projectRef = project?.ref
   const projectTier = project?.subscription_tier ?? PRICING_TIER_PRODUCT_IDS.FREE
-
-  const isOwner = ui.selectedOrganization?.is_owner
   const isFree = projectTier === PRICING_TIER_PRODUCT_IDS.FREE
 
   const [isOpen, setIsOpen] = useState(false)
@@ -38,9 +35,7 @@ const DeleteProjectButton: FC<Props> = ({ type = 'danger' }) => {
     }
   }, [isOpen])
 
-  const canDeleteProject = enablePermissions
-    ? checkPermissions(PermissionAction.UPDATE, 'projects')
-    : isOwner
+  const canDeleteProject = checkPermissions(PermissionAction.UPDATE, 'projects')
 
   const toggle = () => {
     if (loading) return
diff --git a/studio/components/interfaces/Settings/General/General.tsx b/studio/components/interfaces/Settings/General/General.tsx
index 6ca7d6cd1ef..3145838560e 100644
--- a/studio/components/interfaces/Settings/General/General.tsx
+++ b/studio/components/interfaces/Settings/General/General.tsx
@@ -2,7 +2,7 @@ import { FC } from 'react'
 import { Form, Input } from 'ui'
 import { PermissionAction } from '@supabase/shared-types/out/constants'
 
-import { useStore, checkPermissions, useFlag } from 'hooks'
+import { useStore, checkPermissions } from 'hooks'
 import { API_URL } from 'lib/constants'
 import { post } from 'lib/common/fetch'
 import {
@@ -20,16 +20,11 @@ const General: FC<Props> = ({}) => {
   const { app, ui } = useStore()
   const project = ui.selectedProject
 
-  const enablePermissions = useFlag('enablePermissions')
-  const isOwner = ui.selectedOrganization?.is_owner
-
   const formId = 'project-general-settings'
   const initialValues = { name: project?.name ?? '', ref: project?.ref ?? '' }
-  const canUpdateProject = enablePermissions
-    ? checkPermissions(PermissionAction.UPDATE, 'projects')
-    : isOwner
+  const canUpdateProject = checkPermissions(PermissionAction.UPDATE, 'projects')
 
-  const onSubmit = async (values: any, { setSubmitting, resetForm }: any) => {
+  const onSubmit = async (values: any, { resetForm }: any) => {
     const response = await post(`${API_URL}/projects/${project?.ref}/update`, { name: values.name })
     if (response.error) {
       ui.setNotification({
diff --git a/studio/components/interfaces/Settings/General/Infrastructure/PauseProjectButton.tsx b/studio/components/interfaces/Settings/General/Infrastructure/PauseProjectButton.tsx
index 06d68b8ef2a..4923bfcb441 100644
--- a/studio/components/interfaces/Settings/General/Infrastructure/PauseProjectButton.tsx
+++ b/studio/components/interfaces/Settings/General/Infrastructure/PauseProjectButton.tsx
@@ -5,7 +5,7 @@ import * as Tooltip from '@radix-ui/react-tooltip'
 import { Button, IconPause } from 'ui'
 import { PermissionAction } from '@supabase/shared-types/out/constants'
 
-import { checkPermissions, useStore, useFlag } from 'hooks'
+import { checkPermissions, useStore } from 'hooks'
 import { post } from 'lib/common/fetch'
 import { API_URL, PROJECT_STATUS } from 'lib/constants'
 import ConfirmModal from 'components/ui/Dialogs/ConfirmDialog'
@@ -21,15 +21,13 @@ const PauseProjectButton: FC<Props> = observer(({ projectRef, projectId }) => {
   const [loading, setLoading] = useState(false)
   const [isModalOpen, setIsModalOpen] = useState(false)
 
-  const enablePermissions = useFlag('enablePermissions')
-  const isOwner = ui.selectedOrganization?.is_owner
-
   const openModal = () => setIsModalOpen(true)
   const closeModal = () => setIsModalOpen(false)
 
-  const canPauseProject = enablePermissions
-    ? checkPermissions(PermissionAction.INFRA_EXECUTE, 'queue_jobs.projects.pause')
-    : isOwner
+  const canPauseProject = checkPermissions(
+    PermissionAction.INFRA_EXECUTE,
+    'queue_jobs.projects.pause'
+  )
 
   const requestPauseProject = async () => {
     if (!canPauseProject) {
diff --git a/studio/components/interfaces/TableGridEditor/TableGridEditor.tsx b/studio/components/interfaces/TableGridEditor/TableGridEditor.tsx
index 65d738dc56b..0905149b791 100644
--- a/studio/components/interfaces/TableGridEditor/TableGridEditor.tsx
+++ b/studio/components/interfaces/TableGridEditor/TableGridEditor.tsx
@@ -23,7 +23,7 @@ interface Props {
   sidePanelKey?: 'row' | 'column' | 'table'
   /** Toggles if we're duplicating a table */
   isDuplicating: boolean
-  /** Selected entities if we're editting a row, column or table */
+  /** Selected entities if we're editing a row, column or table */
   selectedRowToEdit?: Dictionary<any>
   selectedColumnToEdit?: PostgresColumn
   selectedTableToEdit?: PostgresTable
diff --git a/studio/components/layouts/ProjectLayout/ProjectPausedState.tsx b/studio/components/layouts/ProjectLayout/ProjectPausedState.tsx
index 61bf61c4f15..1392bbd62e9 100644
--- a/studio/components/layouts/ProjectLayout/ProjectPausedState.tsx
+++ b/studio/components/layouts/ProjectLayout/ProjectPausedState.tsx
@@ -16,21 +16,19 @@ interface Props {
 
 const ProjectPausedState: FC<Props> = ({ project }) => {
   const { ui, app } = useStore()
-  const isOwner = ui.selectedOrganization?.is_owner
   const orgSlug = ui.selectedOrganization?.slug
 
   const kpsEnabled = useFlag('initWithKps')
-  const enablePermissions = useFlag('enablePermissions')
+  const { membersExceededLimit } = useFreeProjectLimitCheck(orgSlug)
+  const hasMembersExceedingFreeTierLimit = (membersExceededLimit || []).length > 0
 
   const [showConfirmRestore, setShowConfirmRestore] = useState(false)
   const [showFreeProjectLimitWarning, setShowFreeProjectLimitWarning] = useState(false)
 
-  const { membersExceededLimit } = useFreeProjectLimitCheck(orgSlug)
-  const hasMembersExceedingFreeTierLimit = (membersExceededLimit || []).length > 0
-
-  const canResumeProject = enablePermissions
-    ? checkPermissions(PermissionAction.INFRA_EXECUTE, 'queue_jobs.projects.initialize_or_resume')
-    : isOwner
+  const canResumeProject = checkPermissions(
+    PermissionAction.INFRA_EXECUTE,
+    'queue_jobs.projects.initialize_or_resume'
+  )
 
   const onSelectRestore = () => {
     if (!canResumeProject) {
diff --git a/studio/components/to-be-cleaned/ModalsDeprecated/ConfirmModal.js b/studio/components/to-be-cleaned/ModalsDeprecated/ConfirmModal.js
index 696cae5a616..88bba5b5509 100644
--- a/studio/components/to-be-cleaned/ModalsDeprecated/ConfirmModal.js
+++ b/studio/components/to-be-cleaned/ModalsDeprecated/ConfirmModal.js
@@ -43,10 +43,15 @@ function ConfirmModal({
       loading={loading}
       customFooter={
         <div className="flex items-center gap-2">
-          <Button type="default" onClick={() => onCancelClick()}>
+          <Button type="default" disabled={loading} onClick={() => onCancelClick()}>
             Cancel
           </Button>
-          <Button type="primary" onClick={() => onConfirmClick()} loading={loading}>
+          <Button
+            type="primary"
+            disabled={loading}
+            onClick={() => onConfirmClick()}
+            loading={loading}
+          >
             {confirmText}
           </Button>
         </div>
diff --git a/studio/components/ui/UpgradeToPro.tsx b/studio/components/ui/UpgradeToPro.tsx
index 0dd4d6e3b46..ca7b1b549b6 100644
--- a/studio/components/ui/UpgradeToPro.tsx
+++ b/studio/components/ui/UpgradeToPro.tsx
@@ -26,7 +26,7 @@ const UpgradeToPro: FC<Props> = ({ icon, primaryText, projectRef, secondaryText
     >
       <div className="flex space-x-3">
         {icon && <div className="mt-1">{icon}</div>}
-        <div className="flex w-full items-center justify-between">
+        <div className="flex w-full items-center justify-between space-x-32">
           <div className="space-y-1">
             <p className="text-sm">{primaryText}</p>
             <div>
diff --git a/studio/hooks/queries/useOrganizationDetail.ts b/studio/hooks/queries/useOrganizationDetail.ts
index 275d9397bf0..e2f4253fef6 100644
--- a/studio/hooks/queries/useOrganizationDetail.ts
+++ b/studio/hooks/queries/useOrganizationDetail.ts
@@ -3,25 +3,13 @@ import useSWR, { mutate } from 'swr'
 import { Member } from 'types'
 import { API_URL } from 'lib/constants'
 import { get } from 'lib/common/fetch'
-import { useFlag } from 'hooks'
 
 export function useOrganizationDetail(slug: string) {
-  const enablePermissions = useFlag('enablePermissions')
-
   // Get org members
-  const url = enablePermissions
-    ? `${API_URL}/organizations/${slug}/members?member_roles`
-    : `${API_URL}/props/org/${slug}`
+  const url = `${API_URL}/organizations/${slug}/members?member_roles`
 
   const { data, error } = useSWR<any>(slug ? url : null, get)
-  let members = enablePermissions
-    ? data
-    : (data?.members ?? []).map((m: any) => ({
-        id: m.id,
-        is_owner: m.is_owner,
-        username: m.profile.username,
-        primary_email: m.profile.primary_email,
-      })) ?? []
+  let members = data
 
   // Get pending invite users
   const pendingInviteUrl = `${API_URL}/organizations/${slug}/members/invite`
@@ -37,7 +25,7 @@ export function useOrganizationDetail(slug: string) {
         username: x.invited_email.slice(0, 1),
         primary_email: x.invited_email,
       }
-      return enablePermissions ? { ...member, role_ids: [x.role_id] } : member
+      return { ...member, role_ids: [x.role_id] }
     })
 
     members = [...members, ...invitedMembers]
diff --git a/studio/hooks/queries/usePermissions.ts b/studio/hooks/queries/usePermissions.ts
index a7091aa4dda..537535324bd 100644
--- a/studio/hooks/queries/usePermissions.ts
+++ b/studio/hooks/queries/usePermissions.ts
@@ -1,5 +1,5 @@
 import jsonLogic from 'json-logic-js'
-import { useFlag, useStore } from 'hooks'
+import { useStore } from 'hooks'
 import { get } from 'lib/common/fetch'
 import { API_URL, IS_PLATFORM } from 'lib/constants'
 import useSWR from 'swr'
@@ -40,9 +40,6 @@ export function checkPermissions(
 ) {
   if (!IS_PLATFORM) return true
 
-  const enablePermissions = useFlag('enablePermissions')
-  if (!enablePermissions) return true
-
   const { ui } = useStore()
   const orgid = organizationId ?? ui?.selectedOrganization?.id
 
diff --git a/studio/pages/new/[slug].tsx b/studio/pages/new/[slug].tsx
index bb74530426a..0578455f4f4 100644
--- a/studio/pages/new/[slug].tsx
+++ b/studio/pages/new/[slug].tsx
@@ -45,7 +45,6 @@ const Wizard: NextPageWithLayout = () => {
   const { slug } = router.query
   const { app, ui } = useStore()
 
-  const enablePermissions = useFlag('enablePermissions')
   const projectCreationDisabled = useFlag('disableProjectCreationAndUpdate')
   const kpsEnabled = useFlag('initWithKps')
   const subscriptionStats = useSubscriptionStats()
@@ -66,13 +65,8 @@ const Wizard: NextPageWithLayout = () => {
   const currentOrg = organizations.find((o: any) => o.slug === slug)
   const stripeCustomerId = currentOrg?.stripe_customer_id
 
-  const isOrganizationOwner = ui.selectedOrganization?.is_owner
   const availableRegions = getAvailableRegions()
-
-  const isAdmin = enablePermissions
-    ? checkPermissions(PermissionAction.CREATE, 'projects')
-    : isOrganizationOwner
-
+  const isAdmin = checkPermissions(PermissionAction.CREATE, 'projects')
   const isInvalidSlug = isUndefined(currentOrg)
   const isEmptyOrganizations = organizations.length <= 0 && app.organizations.isInitialized
   const isEmptyPaymentMethod = paymentMethods ? !paymentMethods.length : false
diff --git a/studio/pages/project/[ref]/settings/database.tsx b/studio/pages/project/[ref]/settings/database.tsx
index 012c8b3c48d..56850b1d5d1 100644
--- a/studio/pages/project/[ref]/settings/database.tsx
+++ b/studio/pages/project/[ref]/settings/database.tsx
@@ -42,10 +42,7 @@ const ResetDbPassword: FC<any> = () => {
   const { ui } = useStore()
   const projectRef = ui.selectedProject?.ref
 
-  const enablePermissions = useFlag('enablePermissions')
-  const canResetDbPassword = enablePermissions
-    ? checkPermissions(PermissionAction.UPDATE, 'projects')
-    : ui.selectedOrganization?.is_owner
+  const canResetDbPassword = checkPermissions(PermissionAction.UPDATE, 'projects')
 
   const [showResetDbPass, setShowResetDbPass] = useState<boolean>(false)
   const [isUpdatingPassword, setIsUpdatingPassword] = useState<boolean>(false)
diff --git a/studio/stores/authConfig/schema/AuthProviders/AuthTemplatesValidation.tsx b/studio/stores/authConfig/schema/AuthProviders/AuthTemplatesValidation.tsx
index 9cfa51468a0..82320e55bd9 100644
--- a/studio/stores/authConfig/schema/AuthProviders/AuthTemplatesValidation.tsx
+++ b/studio/stores/authConfig/schema/AuthProviders/AuthTemplatesValidation.tsx
@@ -19,6 +19,8 @@ export const CONFIRMATION: FormSchema = {
       type: 'code',
       description: ` 
 - \`{{ .ConfirmationURL }}\` : URL to confirm the message
+- \`{{ .Token }}\` : The 6-digit numeric email OTP 
+- \`{{ .TokenHash }}\` : The hashed token used in the URL
 `,
     },
   },
@@ -48,6 +50,8 @@ export const INVITE: FormSchema = {
       type: 'code',
       description: ` 
 - \`{{ .ConfirmationURL }}\` : URL to confirm the message
+- \`{{ .Token }}\` : The 6-digit numeric email OTP 
+- \`{{ .TokenHash }}\` : The hashed token used in the URL
 `,
     },
   },
@@ -77,6 +81,8 @@ export const MAGIC_LINK: FormSchema = {
       type: 'code',
       description: ` 
 - \`{{ .ConfirmationURL }}\` : URL to confirm the message
+- \`{{ .Token }}\` : The 6-digit numeric email OTP 
+- \`{{ .TokenHash }}\` : The hashed token used in the URL
 `,
     },
   },
@@ -106,6 +112,8 @@ export const EMAIL_CHANGE: FormSchema = {
       type: 'code',
       description: ` 
 - \`{{ .ConfirmationURL }}\` : URL to confirm the email change
+- \`{{ .Token }}\` : The 6-digit numeric email OTP 
+- \`{{ .TokenHash }}\` : The hashed token used in the URL
 `,
     },
   },
@@ -135,6 +143,8 @@ export const RECOVERY: FormSchema = {
       type: 'code',
       description: ` 
 - \`{{ .ConfirmationURL }}\` : URL to confirm the password reset
+- \`{{ .Token }}\` : The 6-digit numeric email OTP 
+- \`{{ .TokenHash }}\` : The hashed token used in the URL
 `,
     },
   },
diff --git a/studio/styles/toast.scss b/studio/styles/toast.scss
index 87b0ef9214c..69091a11ec0 100644
--- a/studio/styles/toast.scss
+++ b/studio/styles/toast.scss
@@ -552,4 +552,12 @@
   animation-name: Toastify__slideOutDown;
 }
 
-/*# sourceMappingURL=ReactToastify.css.map */
+.toast-message {
+  max-width: 258px;
+  div[role='status'] {
+    @apply justify-start w-full break-words;
+    word-break: break-word;
+  }
+}
+
+/*# sourceMappingURL=ReactToastify.css.map */
\ No newline at end of file