From cf18c723a5e5384bc284df439a88acb81b5ed842 Mon Sep 17 00:00:00 2001 From: joel Date: Wed, 31 Jan 2024 15:29:07 -0800 Subject: [PATCH] feat: enable ppr --- apps/course-builder-web/next.config.mjs | 3 + apps/course-builder-web/package.json | 4 +- .../src/app/[article]/page.tsx | 56 +++-- .../src/app/articles/page.tsx | 2 +- apps/course-builder-web/src/app/layout.tsx | 1 + .../src/components/navigation/links.tsx | 1 - pnpm-lock.yaml | 210 ++++++++++++++++-- 7 files changed, 244 insertions(+), 33 deletions(-) diff --git a/apps/course-builder-web/next.config.mjs b/apps/course-builder-web/next.config.mjs index 457862afa..7583ad0c9 100644 --- a/apps/course-builder-web/next.config.mjs +++ b/apps/course-builder-web/next.config.mjs @@ -21,6 +21,9 @@ const withMDX = createMDX({ /** @type {import("next").NextConfig} */ const config = { + experimental: { + ppr: true, + }, pageExtensions: ['mdx', 'ts', 'tsx'], transpilePackages: ['@coursebuilder/ui'], // @ts-expect-error diff --git a/apps/course-builder-web/package.json b/apps/course-builder-web/package.json index 689331f30..9c6bb56dc 100644 --- a/apps/course-builder-web/package.json +++ b/apps/course-builder-web/package.json @@ -33,7 +33,7 @@ "@mdx-js/react": "^3.0.0", "@msgpack/msgpack": "3.0.0-beta2", "@mux/mux-player-react": "^2.2.0", - "@next/mdx": "14.1.0", + "@next/mdx": "canary", "@planetscale/database": "1.14.0", "@radix-ui/colors": "^3.0.0", "@radix-ui/react-alert-dialog": "^1.0.5", @@ -96,7 +96,7 @@ "lucide-react": "^0.288.0", "memoize-one": "^6.0.0", "nanoid": "^5.0.2", - "next": "14.1.0", + "next": "canary", "next-auth": "^4.24.5", "next-axiom": "^1.1.1", "next-mdx-remote": "^4.4.1", diff --git a/apps/course-builder-web/src/app/[article]/page.tsx b/apps/course-builder-web/src/app/[article]/page.tsx index e67a0ad1d..e743fb878 100644 --- a/apps/course-builder-web/src/app/[article]/page.tsx +++ b/apps/course-builder-web/src/app/[article]/page.tsx @@ -1,4 +1,5 @@ import * as React from 'react' +import { Suspense } from 'react' import { type Metadata, type ResolvingMetadata } from 'next' import Link from 'next/link' import { notFound } from 'next/navigation' @@ -34,32 +35,57 @@ export async function generateMetadata({ params, searchParams }: Props, parent: } } -export default async function ArticlePage({ params }: { params: { article: string } }) { +async function ArticleActionBar({ slug }: { slug: string }) { const session = await getServerAuthSession() const ability = getAbility({ user: session?.user }) - const article = await getArticle(params.article) - - if (!article) { - notFound() - } + const article = await getArticle(slug) return ( -
- {ability.can('update', 'Content') ? ( + <> + {article && ability.can('update', 'Content') ? (
- ) : null} -
-

{article.title}

+ ) : ( +
+ )} + + ) +} -
- {article.body} - {article.description} -
+async function Article({ slug }: { slug: string }) { + const article = await getArticle(slug) + + if (!article) { + notFound() + } + + return ( +
+ {article.body} + {article.description} +
+ ) +} + +async function ArticleTitle({ slug }: { slug: string }) { + const article = await getArticle(slug) + + return

{article?.title}

+} + +export default async function ArticlePage({ params }: { params: { article: string } }) { + return ( +
+ }> + + +
+ +
) diff --git a/apps/course-builder-web/src/app/articles/page.tsx b/apps/course-builder-web/src/app/articles/page.tsx index eb6f61048..2b430a0c3 100644 --- a/apps/course-builder-web/src/app/articles/page.tsx +++ b/apps/course-builder-web/src/app/articles/page.tsx @@ -16,7 +16,7 @@ export default async function ArticlesIndexPage() { slug: string }[] >( - `*[_type == "article"] | order(_updatedAt desc) { + `*[_type == "article"] | order(_createdAt desc) { _id, title, "slug": slug.current, diff --git a/apps/course-builder-web/src/app/layout.tsx b/apps/course-builder-web/src/app/layout.tsx index e37c3fccc..c3f55c727 100644 --- a/apps/course-builder-web/src/app/layout.tsx +++ b/apps/course-builder-web/src/app/layout.tsx @@ -1,6 +1,7 @@ import '@/styles/globals.css' import * as React from 'react' +import { Suspense } from 'react' import { Inter } from 'next/font/google' import { Party } from '@/app/_components/party' import { Providers } from '@/app/_components/providers' diff --git a/apps/course-builder-web/src/components/navigation/links.tsx b/apps/course-builder-web/src/components/navigation/links.tsx index 93c9f49e6..61a631c66 100644 --- a/apps/course-builder-web/src/components/navigation/links.tsx +++ b/apps/course-builder-web/src/components/navigation/links.tsx @@ -3,7 +3,6 @@ import * as React from 'react' import Link from 'next/link' import { redirect, usePathname } from 'next/navigation' -import { Logo } from '@/components/navigation' import { Login } from '@/components/navigation/login' import { User } from '@/components/navigation/user' import { cn } from '@/lib/utils' diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 39409ddf5..25332b258 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -135,8 +135,8 @@ importers: specifier: ^2.2.0 version: 2.2.0(@types/react-dom@18.2.15)(@types/react@18.2.37)(react-dom@18.2.0)(react@18.2.0) '@next/mdx': - specifier: 14.1.0 - version: 14.1.0(@mdx-js/loader@3.0.0)(@mdx-js/react@3.0.0) + specifier: canary + version: 14.1.1-canary.26(@mdx-js/loader@3.0.0)(@mdx-js/react@3.0.0) '@planetscale/database': specifier: 1.14.0 version: 1.14.0 @@ -235,7 +235,7 @@ importers: version: 10.45.0(@trpc/server@10.45.0) '@trpc/next': specifier: 10.45.0 - version: 10.45.0(@tanstack/react-query@4.36.1)(@trpc/client@10.45.0)(@trpc/react-query@10.45.0)(@trpc/server@10.45.0)(next@14.1.0)(react-dom@18.2.0)(react@18.2.0) + version: 10.45.0(@tanstack/react-query@4.36.1)(@trpc/client@10.45.0)(@trpc/react-query@10.45.0)(@trpc/server@10.45.0)(next@14.1.1-canary.26)(react-dom@18.2.0)(react@18.2.0) '@trpc/react-query': specifier: 10.45.0 version: 10.45.0(@tanstack/react-query@4.36.1)(@trpc/client@10.45.0)(@trpc/server@10.45.0)(react-dom@18.2.0)(react@18.2.0) @@ -256,7 +256,7 @@ importers: version: 9.0.7 '@uploadthing/react': specifier: 5.7.1-canary.65ab2fd - version: 5.7.1-canary.65ab2fd(next@14.1.0)(react@18.2.0)(uploadthing@5.7.5-canary.65ab2fd) + version: 5.7.1-canary.65ab2fd(next@14.1.1-canary.26)(react@18.2.0)(uploadthing@5.7.5-canary.65ab2fd) ai: specifier: ^2.2.22 version: 2.2.22(react@18.2.0)(solid-js@1.8.5)(svelte@4.2.3)(vue@3.3.8) @@ -324,14 +324,14 @@ importers: specifier: ^5.0.2 version: 5.0.3 next: - specifier: 14.1.0 - version: 14.1.0(@babel/core@7.23.3)(react-dom@18.2.0)(react@18.2.0) + specifier: canary + version: 14.1.1-canary.26(@babel/core@7.23.3)(react-dom@18.2.0)(react@18.2.0) next-auth: specifier: ^4.24.5 - version: 4.24.5(next@14.1.0)(react-dom@18.2.0)(react@18.2.0) + version: 4.24.5(next@14.1.1-canary.26)(react-dom@18.2.0)(react@18.2.0) next-axiom: specifier: ^1.1.1 - version: 1.1.1(next@14.1.0)(react@18.2.0) + version: 1.1.1(next@14.1.1-canary.26)(react@18.2.0) next-mdx-remote: specifier: ^4.4.1 version: 4.4.1(react-dom@18.2.0)(react@18.2.0) @@ -4489,6 +4489,11 @@ packages: /@next/env@14.1.0: resolution: {integrity: sha512-Py8zIo+02ht82brwwhTg36iogzFqGLPXlRGKQw5s+qP/kMNc4MAyDeEwBKDijk6zTIbegEgu8Qy7C1LboslQAw==} + dev: true + + /@next/env@14.1.1-canary.26: + resolution: {integrity: sha512-NpwQaDqrJSREns70aTeh6vC44GPr2qHgoZdk2SPEJmuq1rD+n21FJVn5LtueUbHSZ0RcyPfATYfvdLGnsnZybw==} + dev: false /@next/eslint-plugin-next@13.5.6: resolution: {integrity: sha512-ng7pU/DDsxPgT6ZPvuprxrkeew3XaRf4LAT4FabaEO/hAbvVx4P7wqnqdbTdDn1kgTvsI4tpIgT4Awn/m0bGbg==} @@ -4502,8 +4507,8 @@ packages: glob: 7.1.7 dev: false - /@next/mdx@14.1.0(@mdx-js/loader@3.0.0)(@mdx-js/react@3.0.0): - resolution: {integrity: sha512-YLYsViq91+H8+3oCtK1iuMWdeN14K70Hy6/tYScY+nfo5bQ84A/A+vA6UdNC9MkbWQ/373hQubx2p4JvUjlb2Q==} + /@next/mdx@14.1.1-canary.26(@mdx-js/loader@3.0.0)(@mdx-js/react@3.0.0): + resolution: {integrity: sha512-0q8VU95YEFGAo7M37B0XI6QQFr74QAHIKgEJ9Re8zQWgguzA2Zre39L+sy2rVM/0se6lEu954MGXqBEFVoRH9A==} peerDependencies: '@mdx-js/loader': '>=0.15.0' '@mdx-js/react': '>=0.15.0' @@ -4524,6 +4529,16 @@ packages: cpu: [arm64] os: [darwin] requiresBuild: true + dev: true + optional: true + + /@next/swc-darwin-arm64@14.1.1-canary.26: + resolution: {integrity: sha512-me7bG+MrBI1awUn6bqFaKYWSp3Kw1A0mSLvMKwpFdjJYut4Alw5edUZF9pzDDoYAPYunvKqn55RuSMcIwEhqgw==} + engines: {node: '>= 10'} + cpu: [arm64] + os: [darwin] + requiresBuild: true + dev: false optional: true /@next/swc-darwin-x64@14.1.0: @@ -4532,6 +4547,16 @@ packages: cpu: [x64] os: [darwin] requiresBuild: true + dev: true + optional: true + + /@next/swc-darwin-x64@14.1.1-canary.26: + resolution: {integrity: sha512-ObPe53eJNan5TOIRWZmTpr3Dt9fvb9fph8VncwLnL1joNfgsfFCNq/UYZEE0eWjF1HsL/sfKP7ke8hn8qke+iA==} + engines: {node: '>= 10'} + cpu: [x64] + os: [darwin] + requiresBuild: true + dev: false optional: true /@next/swc-linux-arm64-gnu@14.1.0: @@ -4540,6 +4565,16 @@ packages: cpu: [arm64] os: [linux] requiresBuild: true + dev: true + optional: true + + /@next/swc-linux-arm64-gnu@14.1.1-canary.26: + resolution: {integrity: sha512-cXgFZZXYXbXeWmZaxv47LcOEFScqSauYOh5QFhdCn5oqhxqrmlO2TwKDvFY+zGRRUMAAmGSjlYugI74gsZZlrg==} + engines: {node: '>= 10'} + cpu: [arm64] + os: [linux] + requiresBuild: true + dev: false optional: true /@next/swc-linux-arm64-musl@14.1.0: @@ -4548,6 +4583,16 @@ packages: cpu: [arm64] os: [linux] requiresBuild: true + dev: true + optional: true + + /@next/swc-linux-arm64-musl@14.1.1-canary.26: + resolution: {integrity: sha512-+GVq76ysbkifRfBP2APheQv4aI7O39QKUApjTKhcRJQD1ZMBTifAYxxWpRqjFH7fvHwNMXHJ39kQ9VeRHzeOhg==} + engines: {node: '>= 10'} + cpu: [arm64] + os: [linux] + requiresBuild: true + dev: false optional: true /@next/swc-linux-x64-gnu@14.1.0: @@ -4556,6 +4601,16 @@ packages: cpu: [x64] os: [linux] requiresBuild: true + dev: true + optional: true + + /@next/swc-linux-x64-gnu@14.1.1-canary.26: + resolution: {integrity: sha512-3j57txb3IUeVBmYK7Tcr5NFmz/kt41D91YE20oD0rcB1sOf5fyKdCY82NbfE01QqIMV9gZMFbhlgMfIxUfUSUA==} + engines: {node: '>= 10'} + cpu: [x64] + os: [linux] + requiresBuild: true + dev: false optional: true /@next/swc-linux-x64-musl@14.1.0: @@ -4564,6 +4619,16 @@ packages: cpu: [x64] os: [linux] requiresBuild: true + dev: true + optional: true + + /@next/swc-linux-x64-musl@14.1.1-canary.26: + resolution: {integrity: sha512-BxBTBhgtyZoJONo10wrfXXZsrkgH+Q44E3C4yBxpJE8NPObV2IUkLKD++dvkLPHDhWwf6pEroLq/KKmTDSNEOw==} + engines: {node: '>= 10'} + cpu: [x64] + os: [linux] + requiresBuild: true + dev: false optional: true /@next/swc-win32-arm64-msvc@14.1.0: @@ -4572,6 +4637,16 @@ packages: cpu: [arm64] os: [win32] requiresBuild: true + dev: true + optional: true + + /@next/swc-win32-arm64-msvc@14.1.1-canary.26: + resolution: {integrity: sha512-eHarkYpJYruf6y0kpGhw4HMeQ+RI/sh06VgGavCG6kH3kZHhQ58ofAbA/U6uomMcpb3NuzjqnCvjYAa7vXpaFw==} + engines: {node: '>= 10'} + cpu: [arm64] + os: [win32] + requiresBuild: true + dev: false optional: true /@next/swc-win32-ia32-msvc@14.1.0: @@ -4580,6 +4655,16 @@ packages: cpu: [ia32] os: [win32] requiresBuild: true + dev: true + optional: true + + /@next/swc-win32-ia32-msvc@14.1.1-canary.26: + resolution: {integrity: sha512-Dl9Cvfen0mPOC9wjfMYfme6ewv6pfMkOgLlnWCj7+MIX2Mwbyqxa4WFCvvNtX9bF+D7IZojHWtJByo31eVqq0Q==} + engines: {node: '>= 10'} + cpu: [ia32] + os: [win32] + requiresBuild: true + dev: false optional: true /@next/swc-win32-x64-msvc@14.1.0: @@ -4588,6 +4673,16 @@ packages: cpu: [x64] os: [win32] requiresBuild: true + dev: true + optional: true + + /@next/swc-win32-x64-msvc@14.1.1-canary.26: + resolution: {integrity: sha512-Tgs1SJNYHP5xcRLkZa81Pn2mT9IgfSxPAaYjrWEQjcOgFOJ5/gN+Mwr93z40L3o6G/vjo31IfRNVwXpqg+Jq1A==} + engines: {node: '>= 10'} + cpu: [x64] + os: [win32] + requiresBuild: true + dev: false optional: true /@nodelib/fs.scandir@2.1.5: @@ -7399,6 +7494,27 @@ packages: next: 14.1.0(@babel/core@7.23.3)(react-dom@18.2.0)(react@18.2.0) react: 18.2.0 react-dom: 18.2.0(react@18.2.0) + dev: true + + /@trpc/next@10.45.0(@tanstack/react-query@4.36.1)(@trpc/client@10.45.0)(@trpc/react-query@10.45.0)(@trpc/server@10.45.0)(next@14.1.1-canary.26)(react-dom@18.2.0)(react@18.2.0): + resolution: {integrity: sha512-saXajAb5GBpos9BNEtq/BeTOxmM4oCP3kyuGlMopNtHoacr71xHCItFnLsPWffM4DVW88uOXCFWaOtpOs5ThBw==} + peerDependencies: + '@tanstack/react-query': ^4.18.0 + '@trpc/client': 10.45.0 + '@trpc/react-query': 10.45.0 + '@trpc/server': 10.45.0 + next: '*' + react: '>=16.8.0' + react-dom: '>=16.8.0' + dependencies: + '@tanstack/react-query': 4.36.1(react-dom@18.2.0)(react@18.2.0) + '@trpc/client': 10.45.0(@trpc/server@10.45.0) + '@trpc/react-query': 10.45.0(@tanstack/react-query@4.36.1)(@trpc/client@10.45.0)(@trpc/server@10.45.0)(react-dom@18.2.0)(react@18.2.0) + '@trpc/server': 10.45.0 + next: 14.1.1-canary.26(@babel/core@7.23.3)(react-dom@18.2.0)(react@18.2.0) + react: 18.2.0 + react-dom: 18.2.0(react@18.2.0) + dev: false /@trpc/react-query@10.45.0(@tanstack/react-query@4.36.1)(@trpc/client@10.45.0)(@trpc/server@10.45.0)(react-dom@18.2.0)(react@18.2.0): resolution: {integrity: sha512-MMc2pLwoaLZVwvLQyzJv3uEmdG3lORhifhVzR/drtavwDYwt+OEvH0w3s1zC7RaDdFpc6Nj2kkpHmdoU7BlAAw==} @@ -8137,7 +8253,7 @@ packages: resolution: {integrity: sha512-ZUo1JHOPPMZDsUw1mOhhVDIvJGlsjj6T0xJ/YJtulyJwL43S9B5pxg1cHcRuTEgjaxj7B55jiqQ6r9mDrrjH9A==} dev: false - /@uploadthing/react@5.7.1-canary.65ab2fd(next@14.1.0)(react@18.2.0)(uploadthing@5.7.5-canary.65ab2fd): + /@uploadthing/react@5.7.1-canary.65ab2fd(next@14.1.1-canary.26)(react@18.2.0)(uploadthing@5.7.5-canary.65ab2fd): resolution: {integrity: sha512-9vEhEE47nuyXZ/ywpu56fN0MSo6mIh6NG5MD0pPt8QlWNPd0e92itCkcMMWMMWYUEp+EJr+WJHstXIt01zIVKQ==} peerDependencies: next: 14.0.1 @@ -8150,7 +8266,7 @@ packages: '@uploadthing/shared': 5.2.7(@uploadthing/mime-types@0.2.2) attr-accept: 2.2.2 file-selector: 0.6.0 - next: 14.1.0(@babel/core@7.23.3)(react-dom@18.2.0)(react@18.2.0) + next: 14.1.1-canary.26(@babel/core@7.23.3)(react-dom@18.2.0)(react@18.2.0) react: 18.2.0 tailwind-merge: 1.14.0 uploadthing: 5.7.5-canary.65ab2fd @@ -15857,15 +15973,41 @@ packages: react: 18.2.0 react-dom: 18.2.0(react@18.2.0) uuid: 8.3.2 + dev: true + + /next-auth@4.24.5(next@14.1.1-canary.26)(react-dom@18.2.0)(react@18.2.0): + resolution: {integrity: sha512-3RafV3XbfIKk6rF6GlLE4/KxjTcuMCifqrmD+98ejFq73SRoj2rmzoca8u764977lH/Q7jo6Xu6yM+Re1Mz/Og==} + peerDependencies: + next: ^12.2.5 || ^13 || ^14 + nodemailer: ^6.6.5 + react: ^17.0.2 || ^18 + react-dom: ^17.0.2 || ^18 + peerDependenciesMeta: + nodemailer: + optional: true + dependencies: + '@babel/runtime': 7.23.2 + '@panva/hkdf': 1.1.1 + cookie: 0.5.0 + jose: 4.15.4 + next: 14.1.1-canary.26(@babel/core@7.23.3)(react-dom@18.2.0)(react@18.2.0) + oauth: 0.9.15 + openid-client: 5.6.1 + preact: 10.19.1 + preact-render-to-string: 5.2.6(preact@10.19.1) + react: 18.2.0 + react-dom: 18.2.0(react@18.2.0) + uuid: 8.3.2 + dev: false - /next-axiom@1.1.1(next@14.1.0)(react@18.2.0): + /next-axiom@1.1.1(next@14.1.1-canary.26)(react@18.2.0): resolution: {integrity: sha512-0r/TJ+/zetD+uDc7B+2E7WpC86hEtQ1U+DuWYrP/JNmUz+ZdPFbrZgzOSqaZ6TwYbXP56VVlPfYwq1YsKHTHYQ==} engines: {node: '>=18'} peerDependencies: next: '>=13.4' react: '>=18.0.0' dependencies: - next: 14.1.0(@babel/core@7.23.3)(react-dom@18.2.0)(react@18.2.0) + next: 14.1.1-canary.26(@babel/core@7.23.3)(react-dom@18.2.0)(react@18.2.0) react: 18.2.0 remeda: 1.30.0 whatwg-fetch: 3.6.20 @@ -15929,6 +16071,46 @@ packages: transitivePeerDependencies: - '@babel/core' - babel-plugin-macros + dev: true + + /next@14.1.1-canary.26(@babel/core@7.23.3)(react-dom@18.2.0)(react@18.2.0): + resolution: {integrity: sha512-vHj7hCL9qn8AhRXNEC1ujTO55w3IjckEE1tkmxwyqA3ypTH9PtxSnU6eFfC9C67Xf/Q2C5Btug7Yqvw7pxGkhg==} + engines: {node: '>=18.17.0'} + hasBin: true + peerDependencies: + '@opentelemetry/api': ^1.1.0 + react: ^18.2.0 + react-dom: ^18.2.0 + sass: ^1.3.0 + peerDependenciesMeta: + '@opentelemetry/api': + optional: true + sass: + optional: true + dependencies: + '@next/env': 14.1.1-canary.26 + '@swc/helpers': 0.5.2 + busboy: 1.6.0 + caniuse-lite: 1.0.30001581 + graceful-fs: 4.2.11 + postcss: 8.4.31 + react: 18.2.0 + react-dom: 18.2.0(react@18.2.0) + styled-jsx: 5.1.1(@babel/core@7.23.3)(react@18.2.0) + optionalDependencies: + '@next/swc-darwin-arm64': 14.1.1-canary.26 + '@next/swc-darwin-x64': 14.1.1-canary.26 + '@next/swc-linux-arm64-gnu': 14.1.1-canary.26 + '@next/swc-linux-arm64-musl': 14.1.1-canary.26 + '@next/swc-linux-x64-gnu': 14.1.1-canary.26 + '@next/swc-linux-x64-musl': 14.1.1-canary.26 + '@next/swc-win32-arm64-msvc': 14.1.1-canary.26 + '@next/swc-win32-ia32-msvc': 14.1.1-canary.26 + '@next/swc-win32-x64-msvc': 14.1.1-canary.26 + transitivePeerDependencies: + - '@babel/core' + - babel-plugin-macros + dev: false /nlcst-to-string@3.1.1: resolution: {integrity: sha512-63mVyqaqt0cmn2VcI2aH6kxe1rLAmSROqHMA0i4qqg1tidkfExgpb0FGMikMCn86mw5dFtBtEANfmSSK7TjNHw==}