vasceannie/supabase
1
0
Fork 0
Code Issues Pull Requests Actions 8 Packages Projects Releases Wiki Activity

feat: pre-compile-time partials (#34028)

Browse Source 
Partials are currently defined via MDX includes. This PR switches to pre-compile-time partials, which have a new syntax:

```
<$Partial path="path/to/file.mdx" />
```

## Rationale

This produces two improvements:

1. Partial substitution can occur in pipelines that don't use MDX compilation. For example, we can now do partial substitution before building the search index, so partial content will also be indexed.
2. After the App Router migration, the MDXProviders should've been deprecated, but were kept around for the sole reason of making partials work, and leading to us shipping unnecessary client-side code. We get a minor decrease in overall client bundle size (5.74 MB to 5.6 MB) by getting rid of the Providers.

## Breaking changes

Besides the change to partial syntax, the arguments are also less powerful than before because we are doing string substitution and don't have the full power of JS. Defining string variables is still possible (documented in the Contributing guide), and since that's all we actually do in practice, this shouldn't be too cumbersome. There is always the escape hatch of making a custom component for more complex content reuse cases.
This commit is contained in:
Charis
2025-03-18 10:37:39 -04:00
committed by GitHub
parent f1394f7080
commit 2709fa4a3e
135 changed files with 619 additions and 624 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
.github/workflows/docs-lint-v2.yml vendored
View File

@@ -57,7 +57,7 @@ jobs:
git diff --name-only origin/$BASE_REF HEAD \
| { grep -E "^apps/docs/content/" || test $? = 1; } \
| xargs -r supa-mdx-lint --format rdf \
| reviewdog -f=rdjsonl -reporter=github-pr-review
| reviewdog -f=rdjsonl -reporter=github-pr-review -tee
- name: run linter (external)
if: steps.filter.outputs.docs == 'true' && github.event.pull_request.head.repo.full_name != github.repository
env:

26
apps/docs/app/contributing/content.mdx
View File

@@ -415,10 +415,10 @@ We incorporate content reuse in the docs to avoid duplication. If you find yours
>
```mdx
<DatabaseSetup />
<$Partial path="database_setup.mdx" />
```
<DatabaseSetup />
<$Partial path="database_setup.mdx" />
</AccordionItem>
@@ -430,10 +430,10 @@ We incorporate content reuse in the docs to avoid duplication. If you find yours
>
```mdx
<CreateClientSnippet />
<$Partial path="create_client_snippet.mdx" />
```
<CreateClientSnippet />
<$Partial path="create_client_snippet.mdx" />
</AccordionItem>
@@ -442,8 +442,18 @@ We incorporate content reuse in the docs to avoid duplication. If you find yours
To make a new partial:
1. Make a new MDX file in `apps/docs/components/MDX`.
1. Make a new MDX file in `apps/docs/content/_partials`.
1. Write your reusable content.
1. Inside `apps/docs/components/MDX/partials.tsx`, import and re-export your partial.
1. Inside `apps/docs/features/docs/mdx.shared.tsx`, import your partial and include it in the `components` object.
1. You can now use your partial inside any other MDX file by using: `<YourPartialName />`.
1. You can now use your partial inside any other MDX file by using: `<$Partial path="path/from/_partials/directory.mdx" />`.
If you need compile-time variable replacement, you can define variables that get replaced with strings.
```mdx
<$Partial path="path/to/file.mdx" variables={{ "substitute": "this" }}>
```
```mdx
Here is the partial text to {{ .substitute }}.
```
Only string replacements are possible at this time. For more complex use cases, consider making a custom component.

5
apps/docs/app/contributing/page.tsx
View File

@@ -3,7 +3,6 @@ import { dirname, join } from 'node:path'
import { fileURLToPath } from 'node:url'
import { ContributingToc } from '~/app/contributing/ContributingToC'
import { MDXProviderGuides } from '~/features/docs/GuidesMdx.client'
import { MDXRemoteBase } from '~/features/docs/MdxBase'
import { LayoutMainContent } from '~/layouts/DefaultLayout'
import { SidebarSkeleton } from '~/layouts/MainSkeleton'
@@ -22,9 +21,7 @@ export default async function ContributingPage() {
id="contributing"
className="prose max-w-none relative transition-all ease-out duration-100"
>
<MDXProviderGuides>
<MDXRemoteBase source={content} />
</MDXProviderGuides>
<MDXRemoteBase source={content} />
</article>
</div>
<ContributingToc />

57
apps/docs/components/MDX/partials.tsx
View File

@@ -1,57 +0,0 @@
'use client'
import AuthErrorCodesTable from './auth_error_codes_table.mdx'
import AuthRateLimits from './auth_rate_limits.mdx'
import CreateClientSnippet from './create_client_snippet.mdx'
import DatabaseSetup from './database_setup.mdx'
import GetSessionWarning from './get_session_warning.mdx'
import HuggingFaceDeployment from './ai/quickstart_hf_deployment.mdx'
import KotlinProjectSetup from './kotlin_project_setup.mdx'
import MigrationWarnings from './migration_warnings.mdx'
import OAuthPkceFlow from './oauth_pkce_flow.mdx'
import ProjectSetup from './project_setup.mdx'
import QuickstartDbSetup from './quickstart_db_setup.mdx'
import QuickstartIntro from './quickstart_intro.mdx'
import SocialProviderSettingsSupabase from './social_provider_settings_supabase.mdx'
import SocialProviderSetup from './social_provider_setup.mdx'
import PostgresInstallation from './postgres_installation.mdx'
import PricingMfaPhone from './billing/pricing/pricing_mfa_phone.mdx'
import PricingBranching from './billing/pricing/pricing_branching.mdx'
import PricingEdgeFunctions from './billing/pricing/pricing_edge_functions.mdx'
import PricingMau from './billing/pricing/pricing_mau.mdx'
import PricingMauSso from './billing/pricing/pricing_mau_sso.mdx'
import PricingMauThirdParty from './billing/pricing/pricing_mau_third_party.mdx'
import PricingPitr from './billing/pricing/pricing_pitr.mdx'
import PricingRealtimeMessages from './billing/pricing/pricing_realtime_messages.mdx'
import PricingRealtimeConnections from './billing/pricing/pricing_realtime_connections.mdx'
import PricingStorageImageTransformations from './billing/pricing/pricing_storage_image_transformations.mdx'
import PricingStorageSize from './billing/pricing/pricing_storage_size.mdx'
export {
AuthErrorCodesTable,
AuthRateLimits,
CreateClientSnippet,
DatabaseSetup,
GetSessionWarning,
HuggingFaceDeployment,
KotlinProjectSetup,
MigrationWarnings,
ProjectSetup,
OAuthPkceFlow,
QuickstartDbSetup,
QuickstartIntro,
SocialProviderSettingsSupabase,
SocialProviderSetup,
PostgresInstallation,
PricingMfaPhone,
PricingBranching,
PricingEdgeFunctions,
PricingMau,
PricingMauSso,
PricingMauThirdParty,
PricingPitr,
PricingRealtimeMessages,
PricingRealtimeConnections,
PricingStorageImageTransformations,
PricingStorageSize,
}

176
apps/docs/components/index.tsx
View File

@@ -1,176 +0,0 @@
/**
* This entire file could do with a cleanup and better code-splitting, but one thing at a time.
*/
// Basic UI things
import Link from 'next/link'
import { Accordion, Alert, Button, CodeBlock, Image, markdownComponents } from 'ui'
import { Admonition } from 'ui-patterns/admonition'
import { GlassPanel } from 'ui-patterns/GlassPanel'
import { IconPanel } from 'ui-patterns/IconPanel'
import { TabPanel, Tabs } from '~/features/ui/Tabs'
import InfoTooltip from '~/features/ui/InfoTooltip'
// Common components
import { CH } from '@code-hike/mdx/components'
import { ArrowDown, Check } from 'lucide-react'
import { Heading } from 'ui'
import StepHikeCompact from '~/components/StepHikeCompact'
import ButtonCard from './ButtonCard'
// Reference guide specific
// [Charis] I think we can factor these out so they aren't in the bundle for absolutely everything
import CliGlobalFlagsHandler from '~/components/reference/enrichments/cli/CliGlobalFlagsHandler'
import RefSubLayout from '~/layouts/ref/RefSubLayout'
import RefHeaderSection from './reference/RefHeaderSection'
// Other components
import AuthProviders from '~/components/AuthProviders'
import { CostWarning } from '~/components/AuthSmsProviderConfig/AuthSmsProviderConfig.Warnings'
import Options from '~/components/Options'
import Param from '~/components/Params'
import { ProjectConfigVariables } from '~/components/ProjectConfigVariables'
import Table from '~/components/Table'
// Data wrappers
import { NavData } from './NavData'
import { SharedData } from './SharedData'
// Partials
import HuggingFaceDeployment from './MDX/ai/quickstart_hf_deployment.mdx'
import AuthErrorCodesTable from './MDX/auth_error_codes_table.mdx'
import AuthRateLimits from './MDX/auth_rate_limits.mdx'
import DatabaseSetup from './MDX/database_setup.mdx'
import GetSessionWarning from './MDX/get_session_warning.mdx'
import KotlinProjectSetup from './MDX/kotlin_project_setup.mdx'
import MigrationWarnings from './MDX/migration_warnings.mdx'
import OAuthPkceFlow from './MDX/oauth_pkce_flow.mdx'
import ProjectSetup from './MDX/project_setup.mdx'
import QuickstartIntro from './MDX/quickstart_intro.mdx'
import SocialProviderSettingsSupabase from './MDX/social_provider_settings_supabase.mdx'
import SocialProviderSetup from './MDX/social_provider_setup.mdx'
import PostgresInstallation from './MDX/postgres_installation.mdx'
// Icons
import {
IconMenuApi,
IconMenuAuth,
IconMenuCli,
IconMenuCsharp,
IconMenuDatabase,
IconMenuEdgeFunctions,
IconMenuFlutter,
IconMenuGettingStarted,
IconMenuHome,
IconMenuIntegrations,
IconMenuJavascript,
IconMenuKotlin,
IconMenuPlatform,
IconMenuPython,
IconMenuRealtime,
IconMenuResources,
IconMenuRestApis,
IconMenuSelfHosting,
IconMenuStorage,
IconMenuSwift,
} from './Navigation/NavigationMenu/MenuIcons'
// Heavy/rare (lazy-loaded)
import SqlToRest from 'ui-patterns/SqlToRest'
import { AppleSecretGenerator } from './AppleSecretGenerator'
import { AuthSmsProviderConfig } from './AuthSmsProviderConfig'
import { Extensions } from './Extensions'
import { JwtGenerator } from './JwtGenerator'
import { RealtimeLimitsEstimator } from './RealtimeLimitsEstimator'
const components = {
...markdownComponents,
Accordion,
Admonition,
Alert: (props: any) => (
<Alert {...props} className="not-prose">
{props.children}
</Alert>
),
AppleSecretGenerator,
AuthProviders,
AuthErrorCodesTable,
AuthRateLimits,
AuthSmsProviderConfig,
Button,
ButtonCard,
CH,
CliGlobalFlagsHandler: () => <CliGlobalFlagsHandler />,
CodeBlock,
CostWarning,
DatabaseSetup,
Extensions,
GetSessionWarning,
GlassPanel,
h2: (props: any) => (
<Heading tag="h2" {...props}>
{props.children}
</Heading>
),
h3: (props: any) => (
<Heading tag="h3" {...props}>
{props.children}
</Heading>
),
h4: (props: any) => (
<Heading tag="h4" {...props}>
{props.children}
</Heading>
),
HuggingFaceDeployment,
IconCheck: Check,
IconMenuApi,
IconArrowDown: ArrowDown,
IconMenuAuth,
IconMenuCli,
IconMenuCsharp,
IconMenuDatabase,
IconMenuEdgeFunctions,
IconMenuFlutter,
IconMenuGettingStarted,
IconMenuHome,
IconMenuIntegrations,
IconMenuJavascript,
IconMenuKotlin,
IconMenuPlatform,
IconMenuPython,
IconMenuRealtime,
IconMenuResources,
IconMenuRestApis,
IconMenuSelfHosting,
IconMenuStorage,
IconMenuSwift,
IconPanel,
Image: (props: any) => <Image fill className="object-contain" {...props} />,
JwtGenerator,
KotlinProjectSetup,
Link,
MigrationWarnings,
NavData,
OAuthPkceFlow,
Options,
Param,
InfoTooltip,
ProjectConfigVariables,
ProjectSetup,
QuickstartIntro,
RealtimeLimitsEstimator,
RefHeaderSection: (props: any) => <RefHeaderSection {...props} />,
RefSubLayout,
SharedData,
SocialProviderSettingsSupabase,
SocialProviderSetup,
PostgresInstallation,
SqlToRest,
StepHikeCompact,
table: Table,
TabPanel,
Tabs,
}
export default components

4
apps/docs/content/_partials/_fixtures/nested1.mdx Normal file
View File

@@ -0,0 +1,4 @@
First level of nesting:
{/* prettier-ignore */}
<$Partial path='/_fixtures/nested2.mdx' />

1
apps/docs/content/_partials/_fixtures/nested2.mdx Normal file
View File

@@ -0,0 +1 @@
Second level of nesting.

22
apps/docs/content/_partials/_fixtures/test.mdx Normal file
View File

@@ -0,0 +1,22 @@
Here is some content to embed as a partial.
## A heading
Some more stuff, including:
- A list
- With two items
And some custom components:
<Admonition type="note">
Some stuff.
In two paragraphs.
</Admonition>
<Component />
An entire paragraph: It was the best of times, it was the worst of times, it was the age of wisdom, it was the age of foolishness, it was the epoch of belief, it was the epoch of incredulity, it was the season of Light, it was the season of Darkness, it was the spring of hope, it was the winter of despair, we had everything before us, we had nothing before us, we were all going direct to Heaven, we were all going direct the other way...

1
apps/docs/content/_partials/_fixtures/variables.mdx Normal file
View File

@@ -0,0 +1 @@
Here is a partial that takes a {{ .var }}.

0
apps/docs/components/MDX/ai/quickstart_hf_deployment.mdx → apps/docs/content/_partials/ai/quickstart_hf_deployment.mdx
View File

8
apps/docs/components/MDX/auth_error_codes_table.mdx → apps/docs/content/_partials/auth_error_codes_table.mdx
View File

@@ -8,10 +8,10 @@ To supplement HTTP status codes, Supabase Auth returns a string error code which
| `bad_jwt` | JWT sent in the `Authorization` header is not valid. |
| `bad_oauth_callback` | OAuth callback from provider to Auth does not have all the required attributes (state). Indicates an issue with the OAuth provider or client library implementation. |
| `bad_oauth_state` | OAuth state (data echoed back by the OAuth provider to Supabase Auth) is not in the correct format. Indicates an issue with the OAuth provider integration. |
| `captcha_failed` | Captcha challenge could not be verified with the captcha provider. Check your captcha integration. |
| `captcha_failed` | CAPTCHA challenge could not be verified with the CAPTCHA provider. Check your CAPTCHA integration. |
| `conflict` | General database conflict, such as concurrent requests on resources that should not be modified concurrently. Can often occur when you have too many session refresh requests firing off at the same time for a user. Check your app for concurrency issues, and if detected, back off exponentially. |
| `email_address_invalid` | Example and test domains are currently not supported. Please use a different email address. |
| `email_address_not_authorized` | Email sending is not allowed for this address as your project is using the default SMTP service. Emails can only be sent to members in your Supabase organization. If you want to send emails to others, please set up a [custom SMTP provider](/docs/guides/auth/auth-smtp). |
| `email_address_invalid` | Example and test domains are currently not supported. Use a different email address. |
| `email_address_not_authorized` | Email sending is not allowed for this address as your project is using the default SMTP service. Emails can only be sent to members in your Supabase organization. If you want to send emails to others, set up a [custom SMTP provider](/docs/guides/auth/auth-smtp). |
| `email_conflict_identity_not_deletable` | Unlinking this identity causes the user's account to change to an email address which is already used by another user account. Indicates an issue where the user has two different accounts using different primary email addresses. You may need to migrate user data to one of their accounts in this case. |
| `email_exists` | Email address already exists in the system. |
| `email_not_confirmed` | Signing in is not allowed for this user as the email address is not confirmed. |
@@ -61,7 +61,7 @@ To supplement HTTP status codes, Supabase Auth returns a string error code which
| `request_timeout` | Processing the request took too long. Retry the request. |
| `same_password` | A user that is updating their password must use a different password than the one currently used. |
| `saml_assertion_no_email` | SAML assertion (user information) was received after sign in, but no email address was found in it, which is required. Check the provider's attribute mapping and/or configuration. |
| `saml_assertion_no_user_id` | SAML assertion (user information) was received after sign in, but a user ID (called NameID) was not found in it, which is required. Check the SAML identity provider's configuration. |
| `saml_assertion_no_user_id` | SAML assertion (user information) was received after sign in, but a user ID (called `NameID`) was not found in it, which is required. Check the SAML identity provider's configuration. |
| `saml_entity_id_mismatch` | (Admin API.) Updating the SAML metadata for a SAML identity provider is not possible, as the entity ID in the update does not match the entity ID in the database. This is equivalent to creating a new identity provider, and you should do that instead. |
| `saml_idp_already_exists` | (Admin API.) Adding a SAML identity provider that is already added. |
| `saml_idp_not_found` | SAML identity provider not found. Most often returned after IdP-initiated sign-in with an unregistered SAML identity provider in Supabase Auth. |

2
apps/docs/components/MDX/auth_rate_limits.mdx → apps/docs/content/_partials/auth_rate_limits.mdx
View File

@@ -2,7 +2,7 @@
| ------------------------------------------------ | -------------------------------------------------------------- | ------------------------ | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| All endpoints that send emails | `/auth/v1/signup` `/auth/v1/recover` `/auth/v1/user`[^1] | Sum of combined requests | Defaults to 4 emails per hour as of 14th July 2023. As of 21 Oct 2023, this has been updated to <SharedData data="config">auth.rate_limits.email.inbuilt_smtp_per_hour</SharedData> emails per hour. You can only change this with your own custom SMTP setup. |
| All endpoints that send One-Time-Passwords (OTP) | `/auth/v1/otp` | Sum of combined requests | Defaults to <SharedData data="config">auth.rate_limits.otp.requests_per_hour</SharedData> OTPs per hour. Is customizable. |
| Send OTPs or magiclinks | `/auth/v1/otp` | Last request | Defaults to <SharedData data="config">auth.rate_limits.otp.period</SharedData> window before a new request is allowed. Is customizable. |
| Send OTPs or magic links | `/auth/v1/otp` | Last request | Defaults to <SharedData data="config">auth.rate_limits.otp.period</SharedData> window before a new request is allowed. Is customizable. |
| Signup confirmation request | `/auth/v1/signup` | Last request | Defaults to <SharedData data="config">auth.rate_limits.signup_confirmation.period</SharedData> window before a new request is allowed. Is customizable. |
| Password Reset Request | `/auth/v1/recover` | Last request | Defaults to <SharedData data="config">auth.rate_limits.password_reset.period</SharedData> window before a new request is allowed. Is customizable. |
| Verification requests | `/auth/v1/verify` | IP Address | <SharedData data="config">auth.rate_limits.verification.requests_per_hour</SharedData> requests per hour (with bursts up to <SharedData data="config">auth.rate_limits.verification.requests_burst</SharedData> requests) |

0
apps/docs/components/MDX/billing/pricing/pricing_branching.mdx → apps/docs/content/_partials/billing/pricing/pricing_branching.mdx
View File

0
apps/docs/components/MDX/billing/pricing/pricing_edge_functions.mdx → apps/docs/content/_partials/billing/pricing/pricing_edge_functions.mdx
View File

0
apps/docs/components/MDX/billing/pricing/pricing_mau.mdx → apps/docs/content/_partials/billing/pricing/pricing_mau.mdx
View File

0
apps/docs/components/MDX/billing/pricing/pricing_mau_sso.mdx → apps/docs/content/_partials/billing/pricing/pricing_mau_sso.mdx
View File

0
apps/docs/components/MDX/billing/pricing/pricing_mau_third_party.mdx → apps/docs/content/_partials/billing/pricing/pricing_mau_third_party.mdx
View File

0
apps/docs/components/MDX/billing/pricing/pricing_mfa_phone.mdx → apps/docs/content/_partials/billing/pricing/pricing_mfa_phone.mdx
View File

0
apps/docs/components/MDX/billing/pricing/pricing_pitr.mdx → apps/docs/content/_partials/billing/pricing/pricing_pitr.mdx
View File

0
apps/docs/components/MDX/billing/pricing/pricing_realtime_connections.mdx → apps/docs/content/_partials/billing/pricing/pricing_realtime_connections.mdx
View File

0
apps/docs/components/MDX/billing/pricing/pricing_realtime_messages.mdx → apps/docs/content/_partials/billing/pricing/pricing_realtime_messages.mdx
View File

0
apps/docs/components/MDX/billing/pricing/pricing_storage_image_transformations.mdx → apps/docs/content/_partials/billing/pricing/pricing_storage_image_transformations.mdx
View File

0
apps/docs/components/MDX/billing/pricing/pricing_storage_size.mdx → apps/docs/content/_partials/billing/pricing/pricing_storage_size.mdx
View File

0
apps/docs/components/MDX/create_client_snippet.mdx → apps/docs/content/_partials/create_client_snippet.mdx
View File

3
apps/docs/components/MDX/database_setup.mdx → apps/docs/content/_partials/database_setup.mdx
View File

@@ -1,6 +1,3 @@
import { Tabs } from 'ui'
export const TabPanel = Tabs.Panel
## Project setup
Let's create a new Postgres database. This is as simple as starting a new Project in Supabase:

0
apps/docs/components/MDX/get_session_warning.mdx → apps/docs/content/_partials/get_session_warning.mdx
View File

10
apps/docs/components/MDX/kotlin_project_setup.mdx → apps/docs/content/_partials/kotlin_project_setup.mdx
View File

@@ -1,7 +1,3 @@
import ProductManagementSQLTemplate from './product_management_sql_template.mdx'
import { Tabs } from 'ui'
export const TabPanel = Tabs.Panel
## Project setup
Before we start building we're going to set up our Database and API. This is as simple as starting a new Project in Supabase and then creating a "schema" inside the database.
@@ -32,12 +28,12 @@ Now we are going to set up the database schema. You can just copy/paste the SQL
</TabPanel> */}
<TabPanel id="sql" label="SQL">
<ProductManagementSQLTemplate />
<$Partial path="product_management_sql_template.mdx" />
</TabPanel>
</Tabs>
### Get the API Keys
### Get the API keys
Now that you've created some database tables, you are ready to insert data using the auto-generated API.
We just need to get the Project URL and `anon` key from the API settings.
@@ -45,7 +41,7 @@ We just need to get the Project URL and `anon` key from the API settings.
1. Go to the [API Settings](https://app.supabase.com/project/_/settings/api) page in the Dashboard.
2. Find your Project `URL`, `anon`, and `service_role` keys on this page.
### Set up Google Authentication
### Set up Google authentication
From the [Google Console](https://console.developers.google.com/apis/library), create a new project and add OAuth2 credentials.

0
apps/docs/components/MDX/migration_warnings.mdx → apps/docs/content/_partials/migration_warnings.mdx
View File

0
apps/docs/components/MDX/oauth_pkce_flow.mdx → apps/docs/content/_partials/oauth_pkce_flow.mdx
View File

2
apps/docs/components/MDX/postgres_installation.mdx → apps/docs/content/_partials/postgres_installation.mdx
View File

@@ -13,7 +13,7 @@
<StepHikeCompact.Details title="Install Postgres" fullWidth>
Download and run the installation file for the latest version from the [PostgreSQL installer download page](https://www.postgresql.org/download/windows/).
Download and run the installation file for the latest version from the [Postgres installer download page](https://www.postgresql.org/download/windows/).
</StepHikeCompact.Details>

0
apps/docs/components/MDX/product_management_sql_template.mdx → apps/docs/content/_partials/product_management_sql_template.mdx
View File

10
apps/docs/components/MDX/project_setup.mdx → apps/docs/content/_partials/project_setup.mdx
View File

@@ -1,7 +1,3 @@
import UserManagementSQLTemplate from './user_management_quickstart_sql_template.mdx'
import { Tabs } from 'ui'
export const TabPanel = Tabs.Panel
## Project setup
Before we start building we're going to set up our Database and API. This is as simple as starting a new Project in Supabase and then creating a "schema" inside the database.
@@ -31,7 +27,7 @@ Now we are going to set up the database schema. We can use the "User Management
<Admonition type="note">
You can easily pull the database schema down to your local project by running the `db pull` command. Read the [local development docs](/docs/guides/cli/local-development#link-your-project) for detailed instructions.
You can pull the database schema down to your local project by running the `db pull` command. Read the [local development docs](/docs/guides/cli/local-development#link-your-project) for detailed instructions.
</Admonition>
@@ -54,12 +50,12 @@ When working locally you can run the following command to create a new migration
supabase migration new user_management_starter
```
<UserManagementSQLTemplate />
<$Partial path="user_management_quickstart_sql_template.mdx" />
</TabPanel>
</Tabs>
### Get the API Keys
### Get the API keys
Now that you've created some database tables, you are ready to insert data using the auto-generated API.
We just need to get the Project URL and `anon` key from the API settings.

0
apps/docs/components/MDX/quickstart_db_setup.mdx → apps/docs/content/_partials/quickstart_db_setup.mdx
View File

0
apps/docs/components/MDX/quickstart_intro.mdx → apps/docs/content/_partials/quickstart_intro.mdx
View File

4
apps/docs/components/MDX/social_provider_settings_supabase.mdx → apps/docs/content/_partials/social_provider_settings_supabase.mdx
View File

@@ -1,6 +1,6 @@
- Go to your [Supabase Project Dashboard](https://supabase.com/dashboard)
- In the left sidebar, click the `Authentication` icon (near the top)
- Click on [`Providers`](https://supabase.com/dashboard/project/_/auth/providers) under the Configuration section
- Click on **{props.provider}** from the accordion list to expand and turn **{props.provider} Enabled** to ON
- Enter your **{props.provider} Client ID** and **{props.provider} Client Secret** saved in the previous step
- Click on **{{ .provider }}** from the accordion list to expand and turn **{{ .provider }} Enabled** to ON
- Enter your **{{ .provider }} Client ID** and **{{ .provider }} Client Secret** saved in the previous step
- Click `Save`

4
apps/docs/components/MDX/social_provider_setup.mdx → apps/docs/content/_partials/social_provider_setup.mdx
View File

@@ -3,10 +3,10 @@ The next step requires a callback URL, which looks like this: `https://<project-
- Go to your [Supabase Project Dashboard](https://supabase.com/dashboard)
- Click on the `Authentication` icon in the left sidebar
- Click on [`Providers`](https://supabase.com/dashboard/project/_/auth/providers) under the Configuration section
- Click on **{props.provider}** from the accordion list to expand and you'll find your **Callback URL**, you can click `Copy` to copy it to the clipboard
- Click on **{{ .provider }}** from the accordion list to expand and you'll find your **Callback URL**, you can click `Copy` to copy it to the clipboard
<Admonition type="note">
For testing OAuth locally with the Supabase CLI please see the [local development docs](/docs/guides/cli/local-development#use-auth-locally).
For testing OAuth locally with the Supabase CLI see the [local development docs](/docs/guides/cli/local-development#use-auth-locally).
</Admonition>

0
apps/docs/components/MDX/user_management_quickstart_sql_template.mdx → apps/docs/content/_partials/user_management_quickstart_sql_template.mdx
View File

2
apps/docs/content/guides/ai/integrations/llamaindex.mdx
View File

@@ -7,7 +7,7 @@ breadcrumb: 'AI Integrations'
This guide will walk you through a basic example using the LlamaIndex [`SupabaseVectorStore`](https://github.com/supabase/supabase/blob/master/examples/ai/llamaindex/llamaindex.ipynb).
<DatabaseSetup />
<$Partial path="database_setup.mdx" />
## Launching a notebook

2
apps/docs/content/guides/ai/integrations/roboflow.mdx
View File

@@ -7,7 +7,7 @@ breadcrumb: 'AI Integrations'
In this guide, we will walk through two examples of using [Roboflow Inference](https://inference.roboflow.com) to run fine-tuned and foundation models. We will run inference and save predictions using an object detection model and [CLIP](https://github.com/openai/CLIP).
<DatabaseSetup />
<$Partial path="database_setup.mdx" />
## Save computer vision predictions

2
apps/docs/content/guides/ai/quickstarts/face-similarity.mdx
View File

@@ -12,7 +12,7 @@ This guide will walk you through a ["Face Similarity Search"](https://github.com
1. Use the `face_recognition` model to create an embedding for every celebrity photo.
1. Search for similar faces inside the dataset.
<DatabaseSetup />
<$Partial path="database_setup.mdx" />
## Launching a notebook

2
apps/docs/content/guides/ai/quickstarts/hello-world.mdx
View File

@@ -13,7 +13,7 @@ This guide will walk you through a basic ["Hello World"](https://github.com/supa
1. Add data to the collection
1. Query the collection
<DatabaseSetup />
<$Partial path="database_setup.mdx" />
## Launching a notebook

4
apps/docs/content/guides/ai/quickstarts/text-deduplication.mdx
View File

@@ -13,7 +13,7 @@ This guide will walk you through a ["Semantic Text Deduplication"](https://githu
1. Use the `sentence-transformers/all-MiniLM-L6-v2` model to create an embedding representing the semantic meaning of each review.
1. Search for all duplicates.
<DatabaseSetup />
<$Partial path="database_setup.mdx" />
## Launching a notebook
@@ -63,7 +63,7 @@ You can view the inserted items in the [Table Editor](https://supabase.com/dashb
![Colab documents](/docs/img/ai/google-colab/colab-documents.png)
<HuggingFaceDeployment />
<$Partial path="ai/quickstart_hf_deployment.mdx" />
## Next steps

4
apps/docs/content/guides/auth/auth-helpers/remix.mdx
View File

@@ -20,7 +20,7 @@ We generally recommend using the new `@supabase/ssr` package instead of `auth-he
size="medium"
className="text-foreground-light border-b mt-8 pb-2"
>
<AccordionItem
header="See legacy docs"
id="legacy-docs"
@@ -320,7 +320,7 @@ const {
The session contains a user property. This is the user metadata saved, unencoded, to the local storage medium. It's unverified and can be tampered by the user, so don't use it for authorization or sensitive purposes.
<GetSessionWarning />
<$Partial path="get_session_warning.mdx" />
```jsx
const user = session?.user

2
apps/docs/content/guides/auth/auth-helpers/sveltekit.mdx
View File

@@ -61,7 +61,7 @@ PUBLIC_SUPABASE_ANON_KEY=your-anon-key
Create a new `hooks.server.js` file in the root of your project and populate with the following to retrieve the user session.
<GetSessionWarning />
<$Partial path="get_session_warning.mdx" />
```js src/hooks.server.js
// src/hooks.server.js

2
apps/docs/content/guides/auth/auth-mfa/phone.mdx
View File

@@ -312,6 +312,6 @@ Be aware that Phone MFA is vulnerable to SIM swap attacks where an attacker will
## Pricing
<PricingMfaPhone />
<$Partial path="billing/pricing/pricing_mfa_phone.mdx" />
For a detailed breakdown of how charges are calculated, refer to [Manage Advanced MFA Phone usage](/docs/guides/platform/manage-your-usage/advanced-mfa-phone).

2
apps/docs/content/guides/auth/debugging/error-codes.mdx
View File

@@ -105,7 +105,7 @@ Sent out when a feature is not enabled on the Auth server, and you are trying to
The following table provides a comprehensive list of error codes you may encounter when working with Supabase Auth. Each error code is associated with a specific issue and includes a description to help you understand and resolve the problem efficiently.
<AuthErrorCodesTable />
<$Partial path="auth_error_codes_table.mdx" />
## Best practices for error handling

2
apps/docs/content/guides/auth/enterprise-sso/auth-sso-saml.mdx
View File

@@ -382,7 +382,7 @@ You can use the `-o json` flag to output the information as JSON, should you nee
## Pricing
<PricingMauSso />
<$Partial path="billing/pricing/pricing_mau_sso.mdx" />
For a detailed breakdown of how charges are calculated, refer to [Manage Monthly Active SSO Users usage](/docs/guides/platform/manage-your-usage/monthly-active-users-sso).

4
apps/docs/content/guides/auth/passwords.mdx
View File

@@ -162,7 +162,7 @@ Your signup email template should contain the following HTML:
Create an API endpoint at `<YOUR_SITE_URL>/auth/confirm` to handle the token exchange.
<CreateClientSnippet />
<$Partial path="create_client_snippet.mdx" />
<Tabs scrollable size="small" type="underlined" defaultActiveId="nextjs" queryGroup="framework">
<TabPanel id="nextjs" label="Next.js">
@@ -631,7 +631,7 @@ Your signup email template should contain the following HTML:
Create an API endpoint at `<YOUR_SITE_URL>/auth/confirm` to handle the token exchange.
<CreateClientSnippet />
<$Partial path="create_client_snippet.mdx" />
<Tabs scrollable size="small" type="underlined" defaultActiveId="nextjs" queryGroup="framework">
<TabPanel id="nextjs" label="Next.js">

2
apps/docs/content/guides/auth/rate-limits.mdx
View File

@@ -5,4 +5,4 @@ subtitle: 'Rate limits protect your services from abuse'
Supabase Auth enforces rate limits on endpoints to prevent abuse. Some rate limits are [customizable](/dashboard/project/_/auth/rate-limits).
<AuthRateLimits />
<$Partial path="auth_rate_limits.mdx" />

4
apps/docs/content/guides/auth/social-login/auth-apple.mdx
View File

@@ -37,7 +37,7 @@ When developing with Expo, you can test Sign in with Apple via the Expo Go app,
Behind the scenes, Supabase Auth uses the [REST APIs](https://developer.apple.com/documentation/sign_in_with_apple/sign_in_with_apple_rest_api) provided by Apple.
<CreateClientSnippet />
<$Partial path="create_client_snippet.mdx" />
To initiate sign in, you can use the `signInWithOAuth()` method from the Supabase JavaScript library:
@@ -49,7 +49,7 @@ When developing with Expo, you can test Sign in with Apple via the Expo Go app,
This call takes the user to Apple's consent screen. Once the flow ends, the user's profile information is exchanged and validated with Supabase Auth before it redirects back to your web application with an access and refresh token representing the user's session.
<OAuthPkceFlow />
<$Partial path="oauth_pkce_flow.mdx" />
### Configuration [#configuration-web]

4
apps/docs/content/guides/auth/social-login/auth-azure.mdx
View File

@@ -125,7 +125,7 @@ Supabase Auth requires that Azure returns a valid email address. Therefore you m
>
<TabPanel id="js" label="JavaScript">
<CreateClientSnippet />
<$Partial path="create_client_snippet.mdx" />
When your user signs in, call [`signInWithOAuth()`](/docs/reference/javascript/auth-signinwithoauth) with `azure` as the `provider`:
@@ -172,7 +172,7 @@ suspend fun signInWithAzure() {
</TabPanel>
</Tabs>
<OAuthPkceFlow />
<$Partial path="oauth_pkce_flow.mdx" />
<Tabs
scrollable

8
apps/docs/content/guides/auth/social-login/auth-bitbucket.mdx
View File

@@ -23,7 +23,7 @@ Setting up Bitbucket logins for your application consists of 3 parts:
## Find your callback URL
<SocialProviderSetup provider="Bitbucket" />
<$Partial path="social_provider_setup.mdx" variables={{ "provider": "Bitbucket" }} />
## Create a Bitbucket OAuth app
@@ -42,7 +42,7 @@ Setting up Bitbucket logins for your application consists of 3 parts:
## Add your Bitbucket credentials into your Supabase project
<SocialProviderSettingsSupabase provider="Bitbucket" />
<$Partial path="social_provider_settings_supabase.mdx" variables={{ "provider": "BitBucket" }} />
## Add login code to your client app
@@ -55,7 +55,7 @@ Setting up Bitbucket logins for your application consists of 3 parts:
>
<TabPanel id="js" label="JavaScript">
<CreateClientSnippet />
<$Partial path="create_client_snippet.mdx" />
When your user signs in, call [`signInWithOAuth()`](/docs/reference/javascript/auth-signinwithoauth) with `bitbucket` as the `provider`:
@@ -97,7 +97,7 @@ suspend fun signInWithBitbucket() {
</TabPanel>
</Tabs>
<OAuthPkceFlow />
<$Partial path="oauth_pkce_flow.mdx" />
<Tabs
scrollable

8
apps/docs/content/guides/auth/social-login/auth-discord.mdx
View File

@@ -27,7 +27,7 @@ Setting up Discord logins for your application consists of 3 parts:
## Find your callback URL
<SocialProviderSetup provider="Discord" />
<$Partial path="social_provider_setup.mdx" variables={{ "provider": "Discord" }} />
## Create a Discord application
@@ -41,7 +41,7 @@ Setting up Discord logins for your application consists of 3 parts:
## Add your Discord credentials into your Supabase project
<SocialProviderSettingsSupabase provider="Discord" />
<$Partial path="social_provider_settings_supabase.mdx" variables={{ "provider": "Discord" }} />
## Add login code to your client app
@@ -54,7 +54,7 @@ Setting up Discord logins for your application consists of 3 parts:
>
<TabPanel id="js" label="JavaScript">
<CreateClientSnippet />
<$Partial path="create_client_snippet.mdx" />
When your user signs in, call [`signInWithOAuth()`](/docs/reference/javascript/auth-signinwithoauth) with `discord` as the `provider`:
@@ -96,7 +96,7 @@ suspend fun signInWithDiscord() {
</TabPanel>
</Tabs>
<OAuthPkceFlow />
<$Partial path="oauth_pkce_flow.mdx" />
If your user is already signed in, Discord prompts the user again for authorization.

8
apps/docs/content/guides/auth/social-login/auth-facebook.mdx
View File

@@ -29,7 +29,7 @@ Setting up Facebook logins for your application consists of 3 parts:
- Fill in your app information, then click `Create App`.
- This should bring you to the screen: `Add Products to Your App`. (Alternatively you can click on `Add Product` in the left sidebar to get to this screen.)
<SocialProviderSetup provider="Facebook" />
<$Partial path="social_provider_setup.mdx" variables={{ "provider": "Facebook" }} />
## Set up Facebook login for your Facebook app
@@ -58,7 +58,7 @@ Under `Build Your App`, click on `Use Cases` screen. From there, do the followin
## Enter your Facebook app ID and secret into your Supabase project
<SocialProviderSettingsSupabase provider="Facebook" />
<$Partial path="social_provider_settings_supabase.mdx" variables={{ "provider": "Facebook" }} />
## Add login code to your client app
@@ -71,7 +71,7 @@ Under `Build Your App`, click on `Use Cases` screen. From there, do the followin
>
<TabPanel id="js" label="JavaScript">
<CreateClientSnippet />
<$Partial path="create_client_snippet.mdx" />
When your user signs in, call [`signInWithOAuth()`](/docs/reference/javascript/auth-signinwithoauth) with `facebook` as the `provider`:
@@ -133,7 +133,7 @@ suspend fun signInWithFacebook() {
</TabPanel>
</Tabs>
<OAuthPkceFlow />
<$Partial path="oauth_pkce_flow.mdx" />
<Tabs
scrollable

8
apps/docs/content/guides/auth/social-login/auth-figma.mdx
View File

@@ -24,7 +24,7 @@ Setting up Figma logins for your application consists of 3 parts:
## Find your callback URL
<SocialProviderSetup provider="Figma" />
<$Partial path="social_provider_setup.mdx" variables={{ "provider": "Figma" }} />
## Create a Figma OAuth app
@@ -42,7 +42,7 @@ Setting up Figma logins for your application consists of 3 parts:
## Enter your Figma credentials into your Supabase project
<SocialProviderSettingsSupabase provider="Figma" />
<$Partial path="social_provider_settings_supabase.mdx" variables={{ "provider": "Figma" }} />
## Add login code to your client app
@@ -55,7 +55,7 @@ Setting up Figma logins for your application consists of 3 parts:
>
<TabPanel id="js" label="JavaScript">
<CreateClientSnippet />
<$Partial path="create_client_snippet.mdx" />
When your user signs in, call [`signInWithOAuth()`](/docs/reference/javascript/auth-signinwithoauth) with `figma` as the `provider`:
@@ -97,7 +97,7 @@ suspend fun signInWithFigma() {
</TabPanel>
</Tabs>
<OAuthPkceFlow />
<$Partial path="oauth_pkce_flow.mdx" />
<Tabs
scrollable

8
apps/docs/content/guides/auth/social-login/auth-github.mdx
View File

@@ -16,7 +16,7 @@ Setting up GitHub logins for your application consists of 3 parts:
## Find your callback URL
<SocialProviderSetup provider="GitHub" />
<$Partial path="social_provider_setup.mdx" variables={{ "provider": "GitHub" }} />
## Register a new OAuth application on GitHub
@@ -36,7 +36,7 @@ Copy your new OAuth credentials
## Enter your GitHub credentials into your Supabase project
<SocialProviderSettingsSupabase provider="GitHub" />
<$Partial path="social_provider_settings_supabase.mdx" variables={{ "provider": "GitHub" }} />
## Add login code to your client app
@@ -49,7 +49,7 @@ Copy your new OAuth credentials
>
<TabPanel id="js" label="JavaScript">
<CreateClientSnippet />
<$Partial path="create_client_snippet.mdx" />
When your user signs in, call [`signInWithOAuth()`](/docs/reference/javascript/auth-signinwithoauth) with `github` as the `provider`:
@@ -105,7 +105,7 @@ suspend fun signInWithGithub() {
</TabPanel>
</Tabs>
<OAuthPkceFlow />
<$Partial path="oauth_pkce_flow.mdx" />
<Tabs
scrollable

8
apps/docs/content/guides/auth/social-login/auth-gitlab.mdx
View File

@@ -23,7 +23,7 @@ Setting up GitLab logins for your application consists of 3 parts:
## Find your callback URL
<SocialProviderSetup provider="GitLab" />
<$Partial path="social_provider_setup.mdx" variables={{ "provider": "GitLab" }} />
## Create your GitLab application
@@ -39,7 +39,7 @@ Setting up GitLab logins for your application consists of 3 parts:
## Add your GitLab credentials into your Supabase project
<SocialProviderSettingsSupabase provider="GitLab" />
<$Partial path="social_provider_settings_supabase.mdx" variables={{ "provider": "GitLab" }} />
## Add login code to your client app
@@ -52,7 +52,7 @@ Setting up GitLab logins for your application consists of 3 parts:
>
<TabPanel id="js" label="JavaScript">
<CreateClientSnippet />
<$Partial path="create_client_snippet.mdx" />
When your user signs in, call [`signInWithOAuth()`](/docs/reference/javascript/auth-signinwithoauth) with `gitlab` as the `provider`:
@@ -94,7 +94,7 @@ suspend fun signInWithGitLab() {
</TabPanel>
</Tabs>
<OAuthPkceFlow />
<$Partial path="oauth_pkce_flow.mdx" />
<Tabs
scrollable

4
apps/docs/content/guides/auth/social-login/auth-google.mdx
View File

@@ -224,7 +224,7 @@ To use Google's pre-built signin buttons:
To use your own application code for the signin button, call the `signInWithOAuth` method (or the equivalent for your language).
<CreateClientSnippet />
<$Partial path="create_client_snippet.mdx" />
```js
supabase.auth.signInWithOAuth({
@@ -234,7 +234,7 @@ supabase.auth.signInWithOAuth({
For an implicit flow, that's all you need to do. The user will be taken to Google's consent screen, and finally redirected to your app with an access and refresh token pair representing their session.
<OAuthPkceFlow />
<$Partial path="oauth_pkce_flow.mdx" />
After a successful code exchange, the user's session will be saved to cookies.

12
apps/docs/content/guides/auth/social-login/auth-kakao.mdx
View File

@@ -45,8 +45,10 @@ This will serve as the `client_id` when you make API calls to authenticate the u
## Find your callback URL
<SocialProviderSetup provider="Kakao" />- To add callback URL on Kakao, go to `Product settings` >
`Kakao Login` > `Redirect URI`.
<$Partial path="social_provider_setup.mdx" variables={{ "provider": "Kakao" }} />
- To add callback URL on Kakao, go to `Product settings` >
`Kakao Login` > `Redirect URI`.
## Generate and activate a `client_secret`
@@ -64,7 +66,7 @@ This will serve as the `client_id` when you make API calls to authenticate the u
## Add your OAuth credentials to Supabase
<SocialProviderSettingsSupabase provider="Kakao" />
<$Partial path="social_provider_settings_supabase.mdx" variables={{ "provider": "Kakao" }} />
## Add login code to your client app
@@ -77,7 +79,7 @@ This will serve as the `client_id` when you make API calls to authenticate the u
>
<TabPanel id="js" label="JavaScript">
<CreateClientSnippet />
<$Partial path="create_client_snippet.mdx" />
When your user signs in, call [`signInWithOAuth()`](/docs/reference/javascript/auth-signinwithoauth) with `kakao` as the `provider`:
@@ -119,7 +121,7 @@ suspend fun signInWithKakao() {
</TabPanel>
</Tabs>
<OAuthPkceFlow />
<$Partial path="oauth_pkce_flow.mdx" />
<Tabs
scrollable

4
apps/docs/content/guides/auth/social-login/auth-keycloak.mdx
View File

@@ -70,7 +70,7 @@ Since Keycloak version 22, the `openid` scope must be passed. Add this to the [`
>
<TabPanel id="js" label="JavaScript">
<CreateClientSnippet />
<$Partial path="create_client_snippet.mdx" />
When your user signs in, call [`signInWithOAuth()`](/docs/reference/javascript/auth-signinwithoauth) with `keycloak` as the `provider`:
@@ -117,7 +117,7 @@ suspend fun signInWithKeycloak() {
</TabPanel>
</Tabs>
<OAuthPkceFlow />
<$Partial path="oauth_pkce_flow.mdx" />
<Tabs
scrollable

8
apps/docs/content/guides/auth/social-login/auth-linkedin.mdx
View File

@@ -23,7 +23,7 @@ Setting up LinkedIn logins for your application consists of 3 parts:
## Find your callback URL
<SocialProviderSetup provider="LinkedIn" />
<$Partial path="social_provider_setup.mdx" variables={{ "provider": "LinkedIn" }} />
## Create a LinkedIn OAuth app
@@ -44,7 +44,7 @@ Ensure that the appropriate scopes have been added under OAuth 2.0 Scopes at the
## Enter your LinkedIn (OIDC) credentials into your Supabase project
<SocialProviderSettingsSupabase provider="LinkedIn (OIDC)" />
<$Partial path="social_provider_settings_supabase.mdx" variables={{ "provider": "LinkedIn (OIDC)" }} />
## Add login code to your client app
@@ -57,7 +57,7 @@ Ensure that the appropriate scopes have been added under OAuth 2.0 Scopes at the
>
<TabPanel id="js" label="JavaScript">
<CreateClientSnippet />
<$Partial path="create_client_snippet.mdx" />
When your user signs in, call [`signInWithOAuth()`](/docs/reference/javascript/auth-signinwithoauth) with `linkedin_oidc` as the `provider`:
@@ -99,7 +99,7 @@ suspend fun signInWithKaLinkedIn() {
</TabPanel>
</Tabs>
<OAuthPkceFlow />
<$Partial path="oauth_pkce_flow.mdx" />
<Tabs
scrollable

8
apps/docs/content/guides/auth/social-login/auth-notion.mdx
View File

@@ -34,7 +34,7 @@ Setting up Notion logins for your application consists of 3 parts:
![notion.so](/docs/img/guides/auth-notion/notion-redirect-uri.png)
<SocialProviderSetup provider="Notion" />
<$Partial path="social_provider_setup.mdx" variables={{ "provider": "Notion" }} />
## Add your Notion credentials into your Supabase project
@@ -42,7 +42,7 @@ Setting up Notion logins for your application consists of 3 parts:
![notion.so](/docs/img/guides/auth-notion/notion-creds.png)
<SocialProviderSettingsSupabase provider="Notion" />
<$Partial path="social_provider_settings_supabase.mdx" variables={{ "provider": "Notion" }} />
## Add login code to your client app
@@ -55,7 +55,7 @@ Setting up Notion logins for your application consists of 3 parts:
>
<TabPanel id="js" label="JavaScript">
<CreateClientSnippet />
<$Partial path="create_client_snippet.mdx" />
When your user signs in, call [`signInWithOAuth()`](/docs/reference/javascript/auth-signinwithoauth) with `notion` as the `provider`:
@@ -97,7 +97,7 @@ suspend fun signInWithNotion() {
</TabPanel>
</Tabs>
<OAuthPkceFlow />
<$Partial path="oauth_pkce_flow.mdx" />
<Tabs
scrollable

8
apps/docs/content/guides/auth/social-login/auth-slack.mdx
View File

@@ -29,7 +29,7 @@ Setting up Slack logins for your application consists of 3 parts:
## Find your callback URL
<SocialProviderSetup provider="Slack" />
<$Partial path="social_provider_setup.mdx" variables={{ "provider": "Slack" }} />
## Create a Slack OAuth app
@@ -60,7 +60,7 @@ Under `Scopes`:
## Enter your Slack credentials into your Supabase project
<SocialProviderSettingsSupabase provider="Slack" />
<$Partial path="social_provider_settings_supabase.mdx" variables={{ "provider": "Slack" }} />
## Add login code to your client app
@@ -73,7 +73,7 @@ Under `Scopes`:
>
<TabPanel id="js" label="JavaScript">
<CreateClientSnippet />
<$Partial path="create_client_snippet.mdx" />
When your user signs in, call [`signInWithOAuth()`](/docs/reference/javascript/auth-signinwithoauth) with `slack_oidc` as the `provider`:
@@ -115,7 +115,7 @@ suspend fun signInWithSlack() {
</TabPanel>
</Tabs>
<OAuthPkceFlow />
<$Partial path="oauth_pkce_flow.mdx" />
<Tabs
scrollable

8
apps/docs/content/guides/auth/social-login/auth-spotify.mdx
View File

@@ -23,7 +23,7 @@ Setting up Spotify logins for your application consists of 3 parts:
## Find your callback URL
<SocialProviderSetup provider="Spotify" />
<$Partial path="social_provider_setup.mdx" variables={{ "provider": "Spotify" }} />
## Create a Spotify OAuth app
@@ -46,7 +46,7 @@ Under `Redirect URIs`:
## Enter your Spotify credentials into your Supabase project
<SocialProviderSettingsSupabase provider="Spotify" />
<$Partial path="social_provider_settings_supabase.mdx" variables={{ "provider": "Spotify" }} />
## Add login code to your client app
@@ -67,7 +67,7 @@ The following outlines the steps to sign in using Spotify with Supabase Auth.
>
<TabPanel id="js" label="JavaScript">
<CreateClientSnippet />
<$Partial path="create_client_snippet.mdx" />
When your user signs in, call [`signInWithOAuth()`](/docs/reference/javascript/auth-signinwithoauth) with `spotify` as the `provider`:
@@ -109,7 +109,7 @@ suspend fun signInWithSpotify() {
</TabPanel>
</Tabs>
<OAuthPkceFlow />
<$Partial path="oauth_pkce_flow.mdx" />
<Tabs
scrollable

8
apps/docs/content/guides/auth/social-login/auth-twitch.mdx
View File

@@ -28,7 +28,7 @@ Setting up Twitch logins for your application consists of 3 parts:
## Find your callback URL
<SocialProviderSetup provider="Twitch" />
<$Partial path="social_provider_setup.mdx" variables={{ "provider": "Twitch" }} />
## Create a Twitch application
@@ -57,7 +57,7 @@ Setting up Twitch logins for your application consists of 3 parts:
## Add your Twitch credentials into your Supabase project
<SocialProviderSettingsSupabase provider="Twitch" />
<$Partial path="social_provider_settings_supabase.mdx" variables={{ "provider": "Twitch" }} />
## Add login code to your client app
@@ -70,7 +70,7 @@ Setting up Twitch logins for your application consists of 3 parts:
>
<TabPanel id="js" label="JavaScript">
<CreateClientSnippet />
<$Partial path="create_client_snippet.mdx" />
When your user signs in, call [`signInWithOAuth()`](/docs/reference/javascript/auth-signinwithoauth) with `twitch` as the `provider`:
@@ -112,7 +112,7 @@ suspend fun signInWithTwitch() {
</TabPanel>
</Tabs>
<OAuthPkceFlow />
<$Partial path="oauth_pkce_flow.mdx" />
<Tabs
scrollable

8
apps/docs/content/guides/auth/social-login/auth-twitter.mdx
View File

@@ -23,7 +23,7 @@ Setting up Twitter logins for your application consists of 3 parts:
## Find your callback URL
<SocialProviderSetup provider="Twitter" />
<$Partial path="social_provider_setup.mdx" variables={{ "provider": "Twitter" }} />
## Create a Twitter OAuth app
@@ -48,7 +48,7 @@ Setting up Twitter logins for your application consists of 3 parts:
## Enter your Twitter credentials into your Supabase project
<SocialProviderSettingsSupabase provider="Twitter" />
<$Partial path="social_provider_settings_supabase.mdx" variables={{ "provider": "Twitter" }} />
## Add login code to your client app
@@ -61,7 +61,7 @@ Setting up Twitter logins for your application consists of 3 parts:
>
<TabPanel id="js" label="JavaScript">
<CreateClientSnippet />
<$Partial path="create_client_snippet.mdx" />
When your user signs in, call [`signInWithOAuth()`](/docs/reference/javascript/auth-signinwithoauth) with `twitter` as the `provider`:
@@ -103,7 +103,7 @@ suspend fun signInWithTwitter() {
</TabPanel>
</Tabs>
<OAuthPkceFlow />
<$Partial path="oauth_pkce_flow.mdx" />
<Tabs
scrollable

8
apps/docs/content/guides/auth/social-login/auth-zoom.mdx
View File

@@ -23,7 +23,7 @@ Setting up Zoom logins for your application consists of 3 parts:
## Find your callback URL
<SocialProviderSetup provider="Zoom" />
<$Partial path="social_provider_setup.mdx" variables={{ "provider": "Zoom" }} />
## Create a Zoom OAuth app
@@ -55,7 +55,7 @@ Under `Scopes`
## Enter your Zoom credentials into your Supabase project
<SocialProviderSettingsSupabase provider="Zoom" />
<$Partial path="social_provider_settings_supabase.mdx" variables={{ "provider": "Zoom" }} />
## Add login code to your client app
@@ -68,7 +68,7 @@ Under `Scopes`
>
<TabPanel id="js" label="JavaScript">
<CreateClientSnippet />
<$Partial path="create_client_snippet.mdx" />
When your user signs in, call [`signInWithOAuth()`](/docs/reference/javascript/auth-signinwithoauth) with `zoom` as the `provider`:
@@ -110,7 +110,7 @@ suspend fun signInWithZoom() {
</TabPanel>
</Tabs>
<OAuthPkceFlow />
<$Partial path="oauth_pkce_flow.mdx" />
<Tabs
scrollable

2
apps/docs/content/guides/auth/third-party/overview.mdx vendored
View File

@@ -30,6 +30,6 @@ There are some limitations you should be aware of when using third-party authent
## Pricing
<PricingMauThirdParty />
<$Partial path="billing/pricing/pricing_mau_third_party.mdx" />
For a detailed breakdown of how charges are calculated, refer to [Manage Monthly Active Third-Party Users usage](/docs/guides/platform/manage-your-usage/monthly-active-users-third-party).

2
apps/docs/content/guides/functions/pricing.mdx
View File

@@ -3,6 +3,6 @@ id: 'functions-pricing'
title: 'Pricing'
---
<PricingEdgeFunctions />
<$Partial path="billing/pricing/pricing_edge_functions.mdx" />
For a detailed explanation of how charges are calculated, refer to [Manage Edge Function Invocations usage](/docs/guides/platform/manage-your-usage/edge-function-invocations).

2
apps/docs/content/guides/getting-started/quickstarts/flutter.mdx
View File

@@ -9,7 +9,7 @@ hideToc: true
<StepHikeCompact.Step step={1}>
<QuickstartDbSetup />
<$Partial path="quickstart_db_setup.mdx" />
</StepHikeCompact.Step>

2
apps/docs/content/guides/getting-started/quickstarts/ios-swiftui.mdx
View File

@@ -9,7 +9,7 @@ hideToc: true
<StepHikeCompact.Step step={1}>
<QuickstartDbSetup />
<$Partial path="quickstart_db_setup.mdx" />
</StepHikeCompact.Step>

2
apps/docs/content/guides/getting-started/quickstarts/kotlin.mdx
View File

@@ -9,7 +9,7 @@ hideToc: true
<StepHikeCompact.Step step={1}>
<QuickstartDbSetup />
<$Partial path="quickstart_db_setup.mdx" />
</StepHikeCompact.Step>

2
apps/docs/content/guides/getting-started/quickstarts/nextjs.mdx
View File

@@ -9,7 +9,7 @@ hideToc: true
<StepHikeCompact.Step step={1}>
<QuickstartDbSetup />
<$Partial path="quickstart_db_setup.mdx" />
</StepHikeCompact.Step>

2
apps/docs/content/guides/getting-started/quickstarts/nuxtjs.mdx
View File

@@ -9,7 +9,7 @@ hideToc: true
<StepHikeCompact.Step step={1}>
<QuickstartDbSetup />
<$Partial path="quickstart_db_setup.mdx" />
</StepHikeCompact.Step>

2
apps/docs/content/guides/getting-started/quickstarts/reactjs.mdx
View File

@@ -9,7 +9,7 @@ hideToc: true
<StepHikeCompact.Step step={1}>
<QuickstartDbSetup />
<$Partial path="quickstart_db_setup.mdx" />
</StepHikeCompact.Step>

2
apps/docs/content/guides/getting-started/quickstarts/refine.mdx
View File

@@ -9,7 +9,7 @@ hideToc: true
<StepHikeCompact.Step step={1}>
<QuickstartDbSetup />
<$Partial path="quickstart_db_setup.mdx" />
</StepHikeCompact.Step>

2
apps/docs/content/guides/getting-started/quickstarts/solidjs.mdx
View File

@@ -9,7 +9,7 @@ hideToc: true
<StepHikeCompact.Step step={1}>
<QuickstartDbSetup />
<$Partial path="quickstart_db_setup.mdx" />
</StepHikeCompact.Step>

2
apps/docs/content/guides/getting-started/quickstarts/sveltekit.mdx
View File

@@ -9,7 +9,7 @@ hideToc: true
<StepHikeCompact.Step step={1}>
<QuickstartDbSetup />
<$Partial path="quickstart_db_setup.mdx" />
</StepHikeCompact.Step>

2
apps/docs/content/guides/getting-started/quickstarts/vue.mdx
View File

@@ -9,7 +9,7 @@ hideToc: true
<StepHikeCompact.Step step={1}>
<QuickstartDbSetup />
<$Partial path="quickstart_db_setup.mdx" />
</StepHikeCompact.Step>

4
apps/docs/content/guides/getting-started/tutorials/with-angular.mdx
View File

@@ -3,7 +3,7 @@ title: 'Build a User Management App with Angular'
description: 'Learn how to use Supabase in your Angular App.'
---
<QuickstartIntro />
<$Partial path="quickstart_intro.mdx" />
![Supabase User Management example](/docs/img/user-management-demo.png)
@@ -13,7 +13,7 @@ If you get stuck while working through this guide, refer to the [full example on
</Admonition>
<ProjectSetup />
<$Partial path="project_setup.mdx" />
## Building the app

4
apps/docs/content/guides/getting-started/tutorials/with-expo-react-native.mdx
View File

@@ -4,7 +4,7 @@ description: 'Learn how to use Supabase in your React Native App.'
tocVideo: 'AE7dKIKMJy4'
---
<QuickstartIntro />
<$Partial path="quickstart_intro.mdx" />
![Supabase User Management example](/docs/img/supabase-flutter-demo.png)
@@ -14,7 +14,7 @@ If you get stuck while working through this guide, refer to the [full example on
</Admonition>
<ProjectSetup />
<$Partial path="project_setup.mdx" />
## Building the app

4
apps/docs/content/guides/getting-started/tutorials/with-flutter.mdx
View File

@@ -4,7 +4,7 @@ description: 'Learn how to use Supabase in your Flutter App.'
tocVideo: 'r7ysVtZ5Row'
---
<QuickstartIntro />
<$Partial path="quickstart_intro.mdx" />
![Supabase User Management example](/docs/img/supabase-flutter-demo.png)
@@ -14,7 +14,7 @@ If you get stuck while working through this guide, refer to the [full example on
</Admonition>
<ProjectSetup />
<$Partial path="project_setup.mdx" />
## Building the app

4
apps/docs/content/guides/getting-started/tutorials/with-ionic-angular.mdx
View File

@@ -3,7 +3,7 @@ title: 'Build a User Management App with Ionic Angular'
description: 'Learn how to use Supabase in your Ionic Angular App.'
---
<QuickstartIntro />
<$Partial path="quickstart_intro.mdx" />
![Supabase User Management example](/docs/img/ionic-demos/ionic-angular-account.png)
@@ -13,7 +13,7 @@ If you get stuck while working through this guide, refer to the [full example on
</Admonition>
<ProjectSetup />
<$Partial path="project_setup.mdx" />
## Building the app

4
apps/docs/content/guides/getting-started/tutorials/with-ionic-react.mdx
View File

@@ -3,7 +3,7 @@ title: 'Build a User Management App with Ionic React'
description: 'Learn how to use Supabase in your Ionic React App.'
---
<QuickstartIntro />
<$Partial path="quickstart_intro.mdx" />
![Supabase User Management example](/docs/img/ionic-demos/ionic-angular-account.png)
@@ -13,7 +13,7 @@ If you get stuck while working through this guide, refer to the [full example on
</Admonition>
<ProjectSetup />
<$Partial path="project_setup.mdx" />
## Building the app

4
apps/docs/content/guides/getting-started/tutorials/with-ionic-vue.mdx
View File

@@ -3,7 +3,7 @@ title: 'Build a User Management App with Ionic Vue'
description: 'Learn how to use Supabase in your Ionic Vue App.'
---
<QuickstartIntro />
<$Partial path="quickstart_intro.mdx" />
![Supabase User Management example](/docs/img/ionic-demos/ionic-angular-account.png)
@@ -13,7 +13,7 @@ If you get stuck while working through this guide, refer to the [full example on
</Admonition>
<ProjectSetup />
<$Partial path="project_setup.mdx" />
## Building the app

2
apps/docs/content/guides/getting-started/tutorials/with-kotlin.mdx
View File

@@ -17,7 +17,7 @@ If you get stuck while working through this guide, refer to the [full example on
</Admonition>
<KotlinProjectSetup />
<$Partial path="kotlin_project_setup.mdx" />
## Building the app

4
apps/docs/content/guides/getting-started/tutorials/with-nextjs.mdx
View File

@@ -3,7 +3,7 @@ title: 'Build a User Management App with Next.js'
description: 'Learn how to use Supabase in your Next.js App.'
---
<QuickstartIntro />
<$Partial path="quickstart_intro.mdx" />
![Supabase User Management example](/docs/img/user-management-demo.png)
@@ -13,7 +13,7 @@ If you get stuck while working through this guide, refer to the [full example on
</Admonition>
<ProjectSetup />
<$Partial path="project_setup.mdx" />
## Building the app

4
apps/docs/content/guides/getting-started/tutorials/with-nuxt-3.mdx
View File

@@ -3,7 +3,7 @@ title: 'Build a User Management App with Nuxt 3'
description: 'Learn how to use Supabase in your Nuxt 3 App.'
---
<QuickstartIntro />
<$Partial path="quickstart_intro.mdx" />
![Supabase User Management example](/docs/img/user-management-demo.png)
@@ -13,7 +13,7 @@ If you get stuck while working through this guide, refer to the [full example on
</Admonition>
<ProjectSetup />
<$Partial path="project_setup.mdx" />
## Building the app

4
apps/docs/content/guides/getting-started/tutorials/with-react.mdx
View File

@@ -3,7 +3,7 @@ title: 'Build a User Management App with React'
description: 'Learn how to use Supabase in your React App.'
---
<QuickstartIntro />
<$Partial path="quickstart_intro.mdx" />
![Supabase User Management example](/docs/img/user-management-demo.png)
@@ -13,7 +13,7 @@ If you get stuck while working through this guide, refer to the [full example on
</Admonition>
<ProjectSetup />
<$Partial path="project_setup.mdx" />
## Building the app

4
apps/docs/content/guides/getting-started/tutorials/with-redwoodjs.mdx
View File

@@ -3,7 +3,7 @@ title: 'Build a User Management App with RedwoodJS'
description: 'Learn how to use Supabase in your RedwoodJS App.'
---
<QuickstartIntro />
<$Partial path="quickstart_intro.mdx" />
![Supabase User Management example](/docs/img/user-management-demo.png)
@@ -39,7 +39,7 @@ Instead, we'll rely on the Supabase client to do some of the work on the **`web`
That means you will want to refrain from running any `yarn rw prisma migrate` commands and also double check your build commands on deployment to ensure Prisma won't reset your database. Prisma currently doesn't support cross-schema foreign keys, so introspecting the schema fails due
to how your Supabase `public` schema references the `auth.users`.
<ProjectSetup />
<$Partial path="project_setup.mdx" />
## Building the app

4
apps/docs/content/guides/getting-started/tutorials/with-refine.mdx
View File

@@ -3,7 +3,7 @@ title: 'Build a User Management App with refine'
description: 'Learn how to use Supabase in your refine App.'
---
<QuickstartIntro />
<$Partial path="quickstart_intro.mdx" />
![Supabase User Management example](/docs/img/user-management-demo.png)
@@ -25,7 +25,7 @@ It is possible to customize the `authProvider` for Supabase and as we'll see bel
</Admonition>
<ProjectSetup />
<$Partial path="project_setup.mdx" />
## Building the app

4
apps/docs/content/guides/getting-started/tutorials/with-solidjs.mdx
View File

@@ -3,7 +3,7 @@ title: 'Build a User Management App with SolidJS'
description: 'Learn how to use Supabase in your SolidJS App.'
---
<QuickstartIntro />
<$Partial path="quickstart_intro.mdx" />
![Supabase User Management example](/docs/img/user-management-demo.png)
@@ -13,7 +13,7 @@ If you get stuck while working through this guide, refer to the [full example on
</Admonition>
<ProjectSetup />
<$Partial path="project_setup.mdx" />
## Building the app

4
apps/docs/content/guides/getting-started/tutorials/with-svelte.mdx
View File

@@ -3,7 +3,7 @@ title: 'Build a User Management App with Svelte'
description: 'Learn how to use Supabase in your Svelte App.'
---
<QuickstartIntro />
<$Partial path="quickstart_intro.mdx" />
![Supabase User Management example](/docs/img/user-management-demo.png)
@@ -13,7 +13,7 @@ If you get stuck while working through this guide, refer to the [full example on
</Admonition>
<ProjectSetup />
<$Partial path="project_setup.mdx" />
## Building the app

6
apps/docs/content/guides/getting-started/tutorials/with-sveltekit.mdx
View File

@@ -3,7 +3,7 @@ title: 'Build a User Management App with SvelteKit'
description: 'Learn how to use Supabase in your SvelteKit App.'
---
<QuickstartIntro />
<$Partial path="quickstart_intro.mdx" />
![Supabase User Management example](/docs/img/user-management-demo.png)
@@ -13,7 +13,7 @@ If you get stuck while working through this guide, refer to the [full example on
</Admonition>
<ProjectSetup />
<$Partial path="project_setup.mdx" />
## Building the app
@@ -115,7 +115,7 @@ export const handle: Handle = async ({ event, resolve }) => {
}
```
<GetSessionWarning />
<$Partial path="get_session_warning.mdx" />
If you are using TypeScript the compiler might complain about `event.locals.supabase` and `event.locals.safeGetSession`, this can be fixed by updating your `src/app.d.ts` with the content below:

4
apps/docs/content/guides/getting-started/tutorials/with-swift.mdx
View File

@@ -3,7 +3,7 @@ title: 'Build a User Management App with Swift and SwiftUI'
description: 'Learn how to use Supabase in your SwiftUI App.'
---
<QuickstartIntro />
<$Partial path="quickstart_intro.mdx" />
![Supabase User Management example](/docs/img/supabase-swift-demo.png)
@@ -13,7 +13,7 @@ If you get stuck while working through this guide, refer to the [full example on
</Admonition>
<ProjectSetup />
<$Partial path="project_setup.mdx" />
## Building the app

4
apps/docs/content/guides/getting-started/tutorials/with-vue-3.mdx
View File

@@ -3,7 +3,7 @@ title: 'Build a User Management App with Vue 3'
description: 'Learn how to use Supabase in your Vue 3 App.'
---
<QuickstartIntro />
<$Partial path="quickstart_intro.mdx" />
![Supabase User Management example](/docs/img/user-management-demo.png)
@@ -13,7 +13,7 @@ If you get stuck while working through this guide, refer to the [full example on
</Admonition>
<ProjectSetup />
<$Partial path="project_setup.mdx" />
## Building the app

2
apps/docs/content/guides/platform/backups.mdx
View File

@@ -137,7 +137,7 @@ After locking in the desired point in time to recover to, The Dashboard will the
### Pricing
<PricingPitr />
<$Partial path="billing/pricing/pricing_pitr.mdx" />
For a detailed breakdown of how charges are calculated, refer to [Manage Point-in-Time Recovery usage](/docs/guides/platform/manage-your-usage/point-in-time-recovery).

2
apps/docs/content/guides/platform/manage-your-usage/advanced-mfa-phone.mdx
View File

@@ -34,7 +34,7 @@ Usage is shown as "Auth MFA Phone Hours" on your invoice.
## Pricing
<PricingMfaPhone />
<$Partial path="billing/pricing/pricing_mfa_phone.mdx" />
## Billing examples

2
apps/docs/content/guides/platform/manage-your-usage/branching.mdx
View File

@@ -19,7 +19,7 @@ Compute incurred by Preview branches is shown as "Branching Compute Hours" on yo
## Pricing
<PricingBranching />
<$Partial path="billing/pricing/pricing_branching.mdx" />
## Billing examples

2
apps/docs/content/guides/platform/manage-your-usage/edge-function-invocations.mdx
View File

@@ -28,7 +28,7 @@ Usage is shown as "Function Invocations" on your invoice.
## Pricing
<PricingEdgeFunctions />
<$Partial path="billing/pricing/pricing_edge_functions.mdx" />
## Billing examples

Some files were not shown because too many files have changed in this diff Show More