From f3d2d6aa9efd31b4d644143dd718069290160e5e Mon Sep 17 00:00:00 2001 From: Jonathan Summers-Muir Date: Sun, 11 Dec 2022 13:45:27 +0800 Subject: [PATCH] remove codehike from guides --- apps/docs/next.config.mjs | 23 +- .../guides/functions/examples/og-image.mdx | 4 - apps/docs/pages/guides/integrations.mdx | 2 +- apps/docs/pages/new/tutorials/nextjs.mdx | 462 ----------------- apps/docs/pages/reference/storage/config.tsx | 2 +- apps/docs/public/sitemap.xml | 486 +++++++++--------- 6 files changed, 245 insertions(+), 734 deletions(-) delete mode 100644 apps/docs/pages/new/tutorials/nextjs.mdx diff --git a/apps/docs/next.config.mjs b/apps/docs/next.config.mjs index ffb39204e79..58bb4bde63b 100644 --- a/apps/docs/next.config.mjs +++ b/apps/docs/next.config.mjs @@ -3,12 +3,13 @@ import remarkGfm from 'remark-gfm' import rehypeSlug from 'rehype-slug' //import theme from 'shiki/themes/nord.json' assert { type: 'json' } -import { remarkCodeHike } from '@code-hike/mdx' import withTM from 'next-transpile-modules' import withYaml from 'next-plugin-yaml' // import admonitions from 'remark-admonitions' -import codeHikeTheme from './codeHikeTheme.js' + +// import { remarkCodeHike } from '@code-hike/mdx' +// import codeHikeTheme from './codeHikeTheme.js' /** * Rewrites and redirects are handled by @@ -21,15 +22,15 @@ const withMDX = nextMdx({ extension: /\.mdx?$/, options: { remarkPlugins: [ - [ - remarkCodeHike, - { - theme: codeHikeTheme, - autoImport: false, - lineNumbers: true, - showCopyButton: true, - }, - ], + // [ + // remarkCodeHike, + // { + // theme: codeHikeTheme, + // autoImport: false, + // lineNumbers: true, + // showCopyButton: true, + // }, + // ], remarkGfm, ], rehypePlugins: [rehypeSlug], diff --git a/apps/docs/pages/guides/functions/examples/og-image.mdx b/apps/docs/pages/guides/functions/examples/og-image.mdx index 8f8c8a8ada5..2974d5ef853 100644 --- a/apps/docs/pages/guides/functions/examples/og-image.mdx +++ b/apps/docs/pages/guides/functions/examples/og-image.mdx @@ -17,8 +17,6 @@ export const meta = { Generate Open Graph images with Deno and Supabase Edge Functions. [View on GitHub](https://github.com/supabase/supabase/tree/master/examples/edge-functions/supabase/functions/opengraph). - - ```tsx handler.tsx import React from 'https://esm.sh/react@18.2.0' import { ImageResponse } from 'https://deno.land/x/og_edge@0.0.4/mod.ts' @@ -53,8 +51,6 @@ console.log('Hello from og-image Function!') serve(handler) ``` - - export const Page = ({ children }) => export default Page diff --git a/apps/docs/pages/guides/integrations.mdx b/apps/docs/pages/guides/integrations.mdx index 8b6676d9d58..069060a0eef 100644 --- a/apps/docs/pages/guides/integrations.mdx +++ b/apps/docs/pages/guides/integrations.mdx @@ -20,7 +20,7 @@ Explore a variety of integrations from Supabase partners. Need a different integ } > {integration.description} diff --git a/apps/docs/pages/new/tutorials/nextjs.mdx b/apps/docs/pages/new/tutorials/nextjs.mdx deleted file mode 100644 index eae57855a16..00000000000 --- a/apps/docs/pages/new/tutorials/nextjs.mdx +++ /dev/null @@ -1,462 +0,0 @@ -import Layout from '~/layouts/tutorials/TutorialLayout' - -import StepHike from '~/components/StepHike' -import { Tabs } from 'ui' - -export const meta = { - title: 'Build a user management app with Next.js', - description: 'Learn how to use Supabase in your Next App', -} - -This tutorial demonstrates how to build a basic user management app with Next.js and Supabase. The app authenticates and identifies the user, stores their profile information in the database, and allows the user to log in, update their profile details, and upload a profile photo. The app uses: - -- [Supabase Database](/docs/guides/database) - a Postgres database for storing your user data and [Row Level Security](/docs/guides/auth#row-level-security) so data is protected and users can only access their own information. -- [Supabase Auth](/docs/guides/auth) - users log in through magic links sent to their email (without having to set up passwords). -- [Supabase Storage](/docs/guides/storage) - users can upload a profile photo. - -
- -
- ---- - - - -```python one.py -print("Hello, one!") -``` - -```python two.py -print("Hello, two!") -``` - - - - - - - - - - - -### Initialize a Next.js app - -Use [`create-next-app`](https://nextjs.org/docs/getting-started) to initialize an app called `supabase-nextjs`: - -```bash -npx create-next-app@latest --use-npm supabase-nextjs -cd supabase-nextjs -``` - -Install the [Supabase client library](https://github.com/supabase/supabase-js): - -```bash -npm install @supabase/supabase-js -``` - -### Set up the database schema - -1. [Create a new project](https://app.supabase.com) in the Supabase Dashboard. -1. In the [SQL Editor](https://app.supabase.com/project/_/sql), set up the database schema by running the **User Management Starter** query. - -### Set up environment variables - -Go to the [API Settings](https://app.supabase.com/project/_/settings/api) page in the Dashboard and save your **Project URL** and **Public API Key** as environment variables in an `.env.local` file. The public API key allows anonymous access to your database until the user has logged in and enables row level security for your data. - -```bash title=.env.local -NEXT_PUBLIC_SUPABASE_URL=YOUR_SUPABASE_PROJECT_URL -NEXT_PUBLIC_SUPABASE_ANON_KEY=YOUR_SUPABASE_PUBLIC_API_KEY -``` - -### Style the app - -Optionally, style the app using [styles/globals.css](https://raw.githubusercontent.com/supabase/supabase/master/examples/user-management/nextjs-ts-user-management/styles/globals.css) from the GitHub example. - - - - - -Next.js is a highly versatile framework offering pre-rendering at build time (SSG), server-side rendering at request time (SSR), API routes, and middleware edge functions. It can be challenging to authenticate your users in all these different environments so we created [Supabase Auth Helpers](/docs/guides/auth/auth-helpers/nextjs) to make user management and data fetching within Next.js as easy as possible. - -### Install Auth Helpers - -Install the auth helpers for React and Next.js: - -```bash -npm install @supabase/auth-helpers-react @supabase/auth-helpers-nextjs -``` - -Wrap your `pages/_app.js` component with the `SessionContextProvider` component: - -```jsx title=pages/_app.js -import '../styles/globals.css' -import { createBrowserSupabaseClient } from '@supabase/auth-helpers-nextjs' -import { SessionContextProvider } from '@supabase/auth-helpers-react' - -function MyApp({ Component, pageProps }) { - const [supabaseClient] = useState(() => createBrowserSupabaseClient()) - - return ( - - - - ) -} -export default MyApp -``` - -### Install the Auth UI component - -[Supabase Auth UI](/docs/guides/auth/auth-helpers/auth-ui) is a collection of pre-built UI components that work seamlessly with the Supabase Auth Helpers to authenticate users through OAuth, email, and magic links. These pre-built components allow you to build your frontend quickly and still be able to use your own CSS styling. For this app, install the Supabase Auth UI for React: - -```bash -npm install @supabase/auth-ui-react -``` - -Add the `Auth` component to your home page: - -```jsx title=pages/index.js -import { Auth, ThemeSupa } from '@supabase/auth-ui-react' -import { useSession, useSupabaseClient } from '@supabase/auth-helpers-react' - -const Home = () => { - const session = useSession() - const supabase = useSupabaseClient() - - return ( -
- {!session ? ( - - ) : ( -

Account page goes here

- )} -
- ) -} - -export default Home -``` - -
- - - -After a user is signed in, they need a way to update their profile details and manage their account. -Create a new component called `Account.js` within a `components` folder with a function to retreive the user's profile: - -```js title=components/Account.js -import { useState, useEffect } from 'react' -import { useUser, useSupabaseClient } from '@supabase/auth-helpers-react' - -export default function Account({ session }) { - const supabase = useSupabaseClient() - const user = useUser() - const [loading, setLoading] = useState(true) - const [username, setUsername] = useState(null) - const [website, setWebsite] = useState(null) - const [avatar_url, setAvatarUrl] = useState(null) - - useEffect(() => { - getProfile() - }, [session]) - - async function getProfile() { - try { - setLoading(true) - - let { data, error, status } = await supabase - .from('profiles') - .select(`username, website, avatar_url`) - .eq('id', user.id) - .single() - - if (error && status !== 406) { - throw error - } - - if (data) { - setUsername(data.username) - setWebsite(data.website) - setAvatarUrl(data.avatar_url) - } - } catch (error) { - alert('Error loading user data!') - console.log(error) - } finally { - setLoading(false) - } - } -} -``` - -Add a form to collect the user's updated username and website: - -```js title=components/Account.js -// ... - -async function getProfile() { - // ... - - return ( -
-
- - -
-
- - setUsername(e.target.value)} - /> -
-
- - setWebsite(e.target.value)} - /> -
- -
- -
- -
- -
-
- ) -} -``` - -Add a function to update the user's profile with the new username and website: - -```js title=components/Account.js -// ... - -async function getProfile() { - // ... -} - -async function updateProfile({ username, website, avatar_url }) { - try { - setLoading(true) - - const updates = { - id: user.id, - username, - website, - avatar_url, - updated_at: new Date().toISOString(), - } - - let { error } = await supabase.from('profiles').upsert(updates) - if (error) throw error - alert('Profile updated!') - } catch (error) { - alert('Error updating the data!') - console.log(error) - } finally { - setLoading(false) - } -} - -return
...
-``` - -
- - - -Every Supabase project is configured with [Storage](/docs/guides/storage) for managing large files like photos and videos. Create an `Avatar.js` component to allow the user to upload a profile photo: - -```jsx title=components/Avatar.js -import React, { useEffect, useState } from 'react' -import { useSupabaseClient } from '@supabase/auth-helpers-react' - -export default function Avatar({ uid, url, size, onUpload }) { - const supabase = useSupabaseClient() - const [avatarUrl, setAvatarUrl] = useState(null) - const [uploading, setUploading] = useState(false) - - useEffect(() => { - if (url) downloadImage(url) - }, [url]) - - async function downloadImage(path) { - try { - const { data, error } = await supabase.storage.from('avatars').download(path) - if (error) { - throw error - } - const url = URL.createObjectURL(data) - setAvatarUrl(url) - } catch (error) { - console.log('Error downloading image: ', error) - } - } - - const uploadAvatar = async (event) => { - try { - setUploading(true) - - if (!event.target.files || event.target.files.length === 0) { - throw new Error('You must select an image to upload.') - } - - const file = event.target.files[0] - const fileExt = file.name.split('.').pop() - const fileName = `${uid}.${fileExt}` - const filePath = `${fileName}` - - let { error: uploadError } = await supabase.storage - .from('avatars') - .upload(filePath, file, { upsert: true }) - - if (uploadError) { - throw uploadError - } - - onUpload(filePath) - } catch (error) { - alert('Error uploading avatar!') - console.log(error) - } finally { - setUploading(false) - } - } - - return ( -
- {avatarUrl ? ( - Avatar - ) : ( -
- )} -
- - -
-
- ) -} -``` - -Add the component to `Account.js` and update the form: - -```jsx title=components/Account.js lines=2, -// Import the new component -import Avatar from './Avatar' - -// ... - -return ( -
- {/* Add to the body */} - { - setAvatarUrl(url) - updateProfile({ username, website, avatar_url: url }) - }} - /> - {/* ... */} -
-) -``` - - - - - -Update `pages/index.js` with the `Account` component: - -```js lines=3,14 pages/index.js -import { Auth, ThemeSupa } from '@supabase/auth-ui-react' -import { useSession, useSupabaseClient } from '@supabase/auth-helpers-react' -import Account from '../components/Account' - -const Home = () => { - const session = useSession() - const supabase = useSupabaseClient() - - return ( -
- {!session ? ( - - ) : ( - - )} -
- ) -} - -export default Home -``` - -Run `npm run dev` and open your browser to [localhost:3000](http://localhost:3000) to see the completed app. - -![Supabase User Management example](/docs/img/user-management-demo.png) - -
- - - - - - -TS guide content - - - - -## See also - -- See the complete [example on GitHub](https://github.com/supabase/supabase/tree/master/examples/user-management/nextjs-ts-user-management) and deploy it to Vercel -- Explore the [Supabase Cache Helpers](https://github.com/psteinroe/supabase-cache-helpers) - -export default ({ children }) => diff --git a/apps/docs/pages/reference/storage/config.tsx b/apps/docs/pages/reference/storage/config.tsx index d9f5e0ee9d9..8af901cba03 100644 --- a/apps/docs/pages/reference/storage/config.tsx +++ b/apps/docs/pages/reference/storage/config.tsx @@ -6,7 +6,7 @@ import ReactMarkdown from 'react-markdown' // Parameters are grouped on the page by tag const TAGS = ['general', 'multitenant'] -console.log(specFile) +// console.log(specFile) export default function Config() { return (
diff --git a/apps/docs/public/sitemap.xml b/apps/docs/public/sitemap.xml index 3605dbcf1a7..40c31b65054 100644 --- a/apps/docs/public/sitemap.xml +++ b/apps/docs/public/sitemap.xml @@ -60,30 +60,6 @@ 0.5 - - https://supabase.com/docs/company/aup - weekly - 0.5 - - - - https://supabase.com/docs/company/privacy - weekly - 0.5 - - - - https://supabase.com/docs/company/sla - weekly - 0.5 - - - - https://supabase.com/docs/company/terms - weekly - 0.5 - - https://supabase.com/docs/handbook/contributing weekly @@ -114,6 +90,12 @@ 0.5 + + https://supabase.com/docs/tutorials/nextjs + weekly + 0.5 + + https://supabase.com/docs/guides/api weekly @@ -264,12 +246,6 @@ 0.5 - - https://supabase.com/docs/tutorials/nextjs - weekly - 0.5 - - https://supabase.com/docs/reference/index weekly @@ -330,12 +306,6 @@ 0.5 - - https://supabase.com/docs/new/tutorials/nextjs - weekly - 0.5 - - https://supabase.com/docs/guides/api/generating-types weekly @@ -354,120 +324,6 @@ 0.5 - - https://supabase.com/docs/guides/database/arrays - weekly - 0.5 - - - - https://supabase.com/docs/guides/database/connecting-to-postgres - weekly - 0.5 - - - - https://supabase.com/docs/guides/database/extensions - weekly - 0.5 - - - - https://supabase.com/docs/guides/database/full-text-search - weekly - 0.5 - - - - https://supabase.com/docs/guides/database/functions - weekly - 0.5 - - - - https://supabase.com/docs/guides/database/json - weekly - 0.5 - - - - https://supabase.com/docs/guides/database/managing-passwords - weekly - 0.5 - - - - https://supabase.com/docs/guides/database/managing-timezones - weekly - 0.5 - - - - https://supabase.com/docs/guides/database/overview - weekly - 0.5 - - - - https://supabase.com/docs/guides/database/replication - weekly - 0.5 - - - - https://supabase.com/docs/guides/database/sql-to-api - weekly - 0.5 - - - - https://supabase.com/docs/guides/database/tables - weekly - 0.5 - - - - https://supabase.com/docs/guides/database/testing - weekly - 0.5 - - - - https://supabase.com/docs/guides/database/timeouts - weekly - 0.5 - - - - https://supabase.com/docs/guides/database/webhooks - weekly - 0.5 - - - - https://supabase.com/docs/guides/functions/auth - weekly - 0.5 - - - - https://supabase.com/docs/guides/functions/best-practices - weekly - 0.5 - - - - https://supabase.com/docs/guides/functions/cicd-workflow - weekly - 0.5 - - - - https://supabase.com/docs/guides/functions/quickstart - weekly - 0.5 - - https://supabase.com/docs/guides/auth/auth-apple weekly @@ -654,6 +510,120 @@ 0.5 + + https://supabase.com/docs/guides/functions/auth + weekly + 0.5 + + + + https://supabase.com/docs/guides/functions/best-practices + weekly + 0.5 + + + + https://supabase.com/docs/guides/functions/cicd-workflow + weekly + 0.5 + + + + https://supabase.com/docs/guides/functions/quickstart + weekly + 0.5 + + + + https://supabase.com/docs/guides/database/arrays + weekly + 0.5 + + + + https://supabase.com/docs/guides/database/connecting-to-postgres + weekly + 0.5 + + + + https://supabase.com/docs/guides/database/extensions + weekly + 0.5 + + + + https://supabase.com/docs/guides/database/full-text-search + weekly + 0.5 + + + + https://supabase.com/docs/guides/database/functions + weekly + 0.5 + + + + https://supabase.com/docs/guides/database/json + weekly + 0.5 + + + + https://supabase.com/docs/guides/database/managing-passwords + weekly + 0.5 + + + + https://supabase.com/docs/guides/database/managing-timezones + weekly + 0.5 + + + + https://supabase.com/docs/guides/database/overview + weekly + 0.5 + + + + https://supabase.com/docs/guides/database/replication + weekly + 0.5 + + + + https://supabase.com/docs/guides/database/sql-to-api + weekly + 0.5 + + + + https://supabase.com/docs/guides/database/tables + weekly + 0.5 + + + + https://supabase.com/docs/guides/database/testing + weekly + 0.5 + + + + https://supabase.com/docs/guides/database/timeouts + weekly + 0.5 + + + + https://supabase.com/docs/guides/database/webhooks + weekly + 0.5 + + https://supabase.com/docs/guides/hosting/docker weekly @@ -672,30 +642,6 @@ 0.5 - - https://supabase.com/docs/guides/migrations/firebase-auth - weekly - 0.5 - - - - https://supabase.com/docs/guides/migrations/firebase-storage - weekly - 0.5 - - - - https://supabase.com/docs/guides/migrations/firestore-data - weekly - 0.5 - - - - https://supabase.com/docs/guides/migrations/heroku - weekly - 0.5 - - https://supabase.com/docs/guides/integrations/appsmith weekly @@ -835,19 +781,25 @@ - https://supabase.com/docs/guides/realtime/postgres-changes + https://supabase.com/docs/guides/migrations/firebase-auth weekly 0.5 - https://supabase.com/docs/guides/realtime/quickstart + https://supabase.com/docs/guides/migrations/firebase-storage weekly 0.5 - https://supabase.com/docs/guides/realtime/rate-limits + https://supabase.com/docs/guides/migrations/firestore-data + weekly + 0.5 + + + + https://supabase.com/docs/guides/migrations/heroku weekly 0.5 @@ -906,6 +858,24 @@ 0.5 + + https://supabase.com/docs/guides/realtime/postgres-changes + weekly + 0.5 + + + + https://supabase.com/docs/guides/realtime/quickstart + weekly + 0.5 + + + + https://supabase.com/docs/guides/realtime/rate-limits + weekly + 0.5 + + https://supabase.com/docs/guides/resources/examples weekly @@ -1044,54 +1014,6 @@ 0.5 - - https://supabase.com/docs/guides/functions/examples/index - weekly - 0.5 - - - - https://supabase.com/docs/guides/functions/examples/og-image - weekly - 0.5 - - - - https://supabase.com/docs/guides/database/extensions/http - weekly - 0.5 - - - - https://supabase.com/docs/guides/database/extensions/pgcron - weekly - 0.5 - - - - https://supabase.com/docs/guides/database/extensions/pgnet - weekly - 0.5 - - - - https://supabase.com/docs/guides/database/extensions/pgtap - weekly - 0.5 - - - - https://supabase.com/docs/guides/database/extensions/plv8 - weekly - 0.5 - - - - https://supabase.com/docs/guides/database/extensions/uuid-ossp - weekly - 0.5 - - https://supabase.com/docs/guides/auth/auth-helpers/auth-ui weekly @@ -1122,30 +1044,6 @@ 0.5 - - https://supabase.com/docs/guides/resources/migrating-to-supabase/firebase-auth - weekly - 0.5 - - - - https://supabase.com/docs/guides/resources/migrating-to-supabase/firebase-data - weekly - 0.5 - - - - https://supabase.com/docs/guides/resources/migrating-to-supabase/firebase-storage - weekly - 0.5 - - - - https://supabase.com/docs/guides/resources/migrating-to-supabase/heroku - weekly - 0.5 - - https://supabase.com/docs/guides/auth/passwordless-login/email-otp-magic-link weekly @@ -1170,12 +1068,6 @@ 0.5 - - https://supabase.com/docs/guides/resources/self-hosting/docker - weekly - 0.5 - - https://supabase.com/docs/guides/auth/social-login/auth-apple weekly @@ -1284,6 +1176,84 @@ 0.5 + + https://supabase.com/docs/guides/functions/examples/index + weekly + 0.5 + + + + https://supabase.com/docs/guides/functions/examples/og-image + weekly + 0.5 + + + + https://supabase.com/docs/guides/resources/self-hosting/docker + weekly + 0.5 + + + + https://supabase.com/docs/guides/resources/migrating-to-supabase/firebase-auth + weekly + 0.5 + + + + https://supabase.com/docs/guides/resources/migrating-to-supabase/firebase-data + weekly + 0.5 + + + + https://supabase.com/docs/guides/resources/migrating-to-supabase/firebase-storage + weekly + 0.5 + + + + https://supabase.com/docs/guides/resources/migrating-to-supabase/heroku + weekly + 0.5 + + + + https://supabase.com/docs/guides/database/extensions/http + weekly + 0.5 + + + + https://supabase.com/docs/guides/database/extensions/pgcron + weekly + 0.5 + + + + https://supabase.com/docs/guides/database/extensions/pgnet + weekly + 0.5 + + + + https://supabase.com/docs/guides/database/extensions/pgtap + weekly + 0.5 + + + + https://supabase.com/docs/guides/database/extensions/plv8 + weekly + 0.5 + + + + https://supabase.com/docs/guides/database/extensions/uuid-ossp + weekly + 0.5 + + https://supabase.com/docs/guides/resources/supabase-cli/local-development weekly @@ -1362,6 +1332,12 @@ 0.5 + + https://supabase.com/docs/reference/javascript/admin-api + weekly + 0.5 + + https://supabase.com/docs/reference/javascript/auth-admin-createuser weekly