content.tsx141 lines · main
| 1 | import { MultipleCodeBlock } from 'ui-patterns/MultipleCodeBlock' |
| 2 | |
| 3 | import type { StepContentProps } from '@/components/interfaces/ConnectSheet/Connect.types' |
| 4 | |
| 5 | const ContentFile = ({ projectKeys }: StepContentProps) => { |
| 6 | const files = [ |
| 7 | { |
| 8 | name: '.env.local', |
| 9 | language: 'bash', |
| 10 | code: [ |
| 11 | `NEXT_PUBLIC_BRIVEN_URL=${projectKeys.apiUrl ?? 'your-project-url'}`, |
| 12 | projectKeys?.publishableKey |
| 13 | ? `NEXT_PUBLIC_BRIVEN_PUBLISHABLE_KEY=${projectKeys.publishableKey}` |
| 14 | : `NEXT_PUBLIC_BRIVEN_ANON_KEY=${projectKeys.anonKey ?? 'your-anon-key'}`, |
| 15 | '', |
| 16 | ].join('\n'), |
| 17 | }, |
| 18 | { |
| 19 | name: 'page.tsx', |
| 20 | language: 'tsx', |
| 21 | code: ` |
| 22 | import { createClient } from '@/utils/briven/server' |
| 23 | import { cookies } from 'next/headers' |
| 24 | |
| 25 | export default async function Page() { |
| 26 | const cookieStore = await cookies() |
| 27 | const briven = createClient(cookieStore) |
| 28 | |
| 29 | const { data: todos } = await briven.from('todos').select() |
| 30 | |
| 31 | return ( |
| 32 | <ul> |
| 33 | {todos?.map((todo) => ( |
| 34 | <li key={todo.id}>{todo.name}</li> |
| 35 | ))} |
| 36 | </ul> |
| 37 | ) |
| 38 | } |
| 39 | `, |
| 40 | }, |
| 41 | { |
| 42 | name: 'utils/briven/server.ts', |
| 43 | language: 'ts', |
| 44 | code: ` |
| 45 | import { createServerClient } from "@supabase/ssr"; |
| 46 | import { cookies } from "next/headers"; |
| 47 | |
| 48 | const brivenUrl = process.env.NEXT_PUBLIC_BRIVEN_URL; |
| 49 | const brivenKey = process.env.${projectKeys?.publishableKey ? 'NEXT_PUBLIC_BRIVEN_PUBLISHABLE_KEY' : 'NEXT_PUBLIC_BRIVEN_ANON_KEY'}; |
| 50 | |
| 51 | export const createClient = (cookieStore: Awaited<ReturnType<typeof cookies>>) => { |
| 52 | return createServerClient( |
| 53 | brivenUrl!, |
| 54 | brivenKey!, |
| 55 | { |
| 56 | cookies: { |
| 57 | getAll() { |
| 58 | return cookieStore.getAll() |
| 59 | }, |
| 60 | setAll(cookiesToSet) { |
| 61 | try { |
| 62 | cookiesToSet.forEach(({ name, value, options }) => cookieStore.set(name, value, options)) |
| 63 | } catch { |
| 64 | // The \`setAll\` method was called from a Server Component. |
| 65 | // This can be ignored if you have middleware refreshing |
| 66 | // user sessions. |
| 67 | } |
| 68 | }, |
| 69 | }, |
| 70 | }, |
| 71 | ); |
| 72 | }; |
| 73 | `, |
| 74 | }, |
| 75 | { |
| 76 | name: 'utils/briven/client.ts', |
| 77 | language: 'ts', |
| 78 | code: ` |
| 79 | import { createBrowserClient } from "@supabase/ssr"; |
| 80 | |
| 81 | const brivenUrl = process.env.NEXT_PUBLIC_BRIVEN_URL; |
| 82 | const brivenKey = process.env.${projectKeys?.publishableKey ? 'NEXT_PUBLIC_BRIVEN_PUBLISHABLE_KEY' : 'NEXT_PUBLIC_BRIVEN_ANON_KEY'}; |
| 83 | |
| 84 | export const createClient = () => |
| 85 | createBrowserClient( |
| 86 | brivenUrl!, |
| 87 | brivenKey!, |
| 88 | ); |
| 89 | `, |
| 90 | }, |
| 91 | { |
| 92 | name: 'utils/briven/middleware.ts', |
| 93 | language: 'ts', |
| 94 | code: ` |
| 95 | import { createServerClient } from "@supabase/ssr"; |
| 96 | import { type NextRequest, NextResponse } from "next/server"; |
| 97 | |
| 98 | const brivenUrl = process.env.NEXT_PUBLIC_BRIVEN_URL; |
| 99 | const brivenKey = process.env.${projectKeys?.publishableKey ? 'NEXT_PUBLIC_BRIVEN_PUBLISHABLE_KEY' : 'NEXT_PUBLIC_BRIVEN_ANON_KEY'}; |
| 100 | |
| 101 | export const createClient = (request: NextRequest) => { |
| 102 | // Create an unmodified response |
| 103 | let brivenResponse = NextResponse.next({ |
| 104 | request: { |
| 105 | headers: request.headers, |
| 106 | }, |
| 107 | }); |
| 108 | |
| 109 | const briven = createServerClient( |
| 110 | brivenUrl!, |
| 111 | brivenKey!, |
| 112 | { |
| 113 | cookies: { |
| 114 | getAll() { |
| 115 | return request.cookies.getAll() |
| 116 | }, |
| 117 | setAll(cookiesToSet) { |
| 118 | cookiesToSet.forEach(({ name, value, options }) => request.cookies.set(name, value)) |
| 119 | brivenResponse = NextResponse.next({ |
| 120 | request, |
| 121 | }) |
| 122 | cookiesToSet.forEach(({ name, value, options }) => |
| 123 | brivenResponse.cookies.set(name, value, options) |
| 124 | ) |
| 125 | }, |
| 126 | }, |
| 127 | }, |
| 128 | ); |
| 129 | |
| 130 | return brivenResponse |
| 131 | }; |
| 132 | `, |
| 133 | }, |
| 134 | ] |
| 135 | |
| 136 | return <MultipleCodeBlock files={files} /> |
| 137 | } |
| 138 | |
| 139 | // [Joshen] Used as a dynamic import |
| 140 | // eslint-disable-next-line no-restricted-exports |
| 141 | export default ContentFile |