diff --git a/docs/data/toolpad/core/components/sign-in-page/sign-in-page.md b/docs/data/toolpad/core/components/sign-in-page/sign-in-page.md index cddc44d4daf..e120f9b8ed8 100644 --- a/docs/data/toolpad/core/components/sign-in-page/sign-in-page.md +++ b/docs/data/toolpad/core/components/sign-in-page/sign-in-page.md @@ -108,7 +108,7 @@ This renders an alert with the `error` string as the message. #### Next.js App Directory and GitHub -The component is composable with any authentication library you might want to use. The following is a `SignInPage` with [Auth.js](https://authjs.dev/) using GitHub, Next.js App router and server actions. +The component is composable with any authentication library you might want to use. The following is a `SignInPage` with [Auth.js](https://authjs.dev/) using GitHub, Next.js App Router and server actions. {{"component": "modules/components/DocsImage.tsx", "src": "/static/toolpad/docs/core/auth-next.png", "srcDark": "/static/toolpad/docs/core/auth-next-dark.png", "alt": "Auth.js & Next.js with Toolpad Core sign-in page", "caption": "Auth.js & Next.js app router with Toolpad Core Sign-in page", "zoom": true, "indent": 1, "aspectRatio": "1.428" }} @@ -230,7 +230,7 @@ Through the `theme` prop in the [AppProvider](https://mui.com/toolpad/core/react {{"demo": "ThemeSignInPage.js", "iframe": true, "height": 700 }} :::info -Find a full-fledged example using the Next.js App router, Auth.js and this theme [here](https://codesandbox.io/s/github/mui/toolpad/tree/master/examples/core/auth-nextjs-themed). +Find a full-fledged example using the Next.js App Router, Auth.js and this theme [here](https://codesandbox.io/p/sandbox/github/mui/toolpad/tree/master/examples/core/auth-nextjs-themed). ::: ### Slots diff --git a/docs/data/toolpad/studio/how-to-guides/railway-deploy.md b/docs/data/toolpad/studio/how-to-guides/railway-deploy.md index 64d428730af..d13861161cd 100644 --- a/docs/data/toolpad/studio/how-to-guides/railway-deploy.md +++ b/docs/data/toolpad/studio/how-to-guides/railway-deploy.md @@ -6,7 +6,7 @@ This guide walks you through the deployment of a Toolpad Studio app from a GitHu ## Prerequisites -- A [Railway](https://railway.app/) account +- A [Railway](https://railway.com/) account - A [GitHub](https://github.com) account - A GitHub repository containing your Toolpad Studio app. Check out [pushing your Toolpad Studio app to GitHub](/toolpad/studio/how-to-guides/render-deploy/#pushing-your-toolpad-studio-app-to-github) for this step. diff --git a/docs/src/modules/components/Examples/ExamplesGrid.tsx b/docs/src/modules/components/Examples/ExamplesGrid.tsx index 8c24fc40fd2..501ee3578f3 100644 --- a/docs/src/modules/components/Examples/ExamplesGrid.tsx +++ b/docs/src/modules/components/Examples/ExamplesGrid.tsx @@ -122,32 +122,32 @@ function ExamplesGrid(props: ExamplesGridProps) { {t('source')} - {example.codeSandbox && ( - + {example.stackBlitz === true ? ( + - + - )} - {example.stackBlitz && ( - + ) : null} + {example.codeSandbox === true ? ( + - + - )} + ) : null} diff --git a/docs/src/modules/components/Examples/FeaturedExamples.tsx b/docs/src/modules/components/Examples/FeaturedExamples.tsx index 26c2bd4ec19..c935d807b9d 100644 --- a/docs/src/modules/components/Examples/FeaturedExamples.tsx +++ b/docs/src/modules/components/Examples/FeaturedExamples.tsx @@ -144,17 +144,18 @@ export default function FeaturedExamples(props: FeaturedExamplesProps) { gap: 1, }} > - {example.stackBlitz ? ( + {example.stackBlitz === true ? ( { - window.open(example.stackBlitz, '_blank', 'noopener,noreferrer'); - }} > @@ -162,17 +163,18 @@ export default function FeaturedExamples(props: FeaturedExamplesProps) { ) : null} - {example.codeSandbox ? ( + {example.codeSandbox === true ? ( { - window.open(example.codeSandbox, '_blank', 'noopener,noreferrer'); - }} > diff --git a/docs/src/modules/components/Examples/core-examples.ts b/docs/src/modules/components/Examples/core-examples.ts index 54667731313..6f24e9fab62 100644 --- a/docs/src/modules/components/Examples/core-examples.ts +++ b/docs/src/modules/components/Examples/core-examples.ts @@ -7,104 +7,106 @@ export default function examples() { src: '/static/toolpad/docs/core/tutorial-1.png', href: 'https://mui.com/toolpad/core/introduction/tutorial/', source: 'https://github.com/mui/toolpad/tree/master/examples/core/tutorial/', - codeSandbox: 'https://codesandbox.io/s/github/mui/toolpad/tree/master/examples/core/tutorial', - stackBlitz: 'https://stackblitz.com/github/mui/toolpad/tree/master/examples/core/tutorial', + codeSandbox: true, + stackBlitz: true, }, { - title: 'Auth.js with Next.js App router', + title: 'Auth.js with Next.js App Router', description: - 'This app shows you to how to get started using Toolpad Core with Auth.js and the Next.js App router', + 'This app shows you to how to get started using Toolpad Core with Auth.js and the Next.js App Router.', src: '/static/toolpad/docs/core/auth-next.png', srcDark: '/static/toolpad/docs/core/auth-next-dark.png', source: 'https://github.com/mui/toolpad/tree/master/examples/core/auth-nextjs/', - codeSandbox: - 'https://codesandbox.io/s/github/mui/toolpad/tree/master/examples/core/auth-nextjs', - stackblitz: 'https://stackblitz.com/github/mui/toolpad/tree/master/examples/core/auth-nextjs', + codeSandbox: true, + stackBlitz: true, }, { - title: 'Auth.js with Next.js Pages router', + title: 'Auth.js with Next.js Pages Router', description: - 'This app shows you to how to get started using Toolpad Core with Auth.js and the Next.js Pages router', + 'This app shows you to how to get started using Toolpad Core with Auth.js and the Next.js Pages router.', src: '/static/toolpad/docs/core/auth-next.png', srcDark: '/static/toolpad/docs/core/auth-next-dark.png', source: 'https://github.com/mui/toolpad/tree/master/examples/core/auth-nextjs-pages/', - codeSandbox: - 'https://codesandbox.io/s/github/mui/toolpad/tree/master/examples/core/auth-nextjs-pages', - stackblitz: - 'https://stackblitz.com/github/mui/toolpad/tree/master/examples/core/auth-nextjs-pages', + // infinite redirection + codeSandbox: false, + stackBlitz: false, }, { - title: 'Auth.js Magic Link with Next.js App router', + title: 'Auth.js Magic Link with Next.js App Router', description: - 'This app shows you to how to get started using Toolpad Core with Auth.js Magic Links and the Next.js App router', + 'This app shows you to how to get started using Toolpad Core with Auth.js Magic Links and the Next.js App Router.', src: '/static/toolpad/docs/core/auth-next.png', source: 'https://github.com/mui/toolpad/tree/master/examples/core/auth-nextjs-email', - codeSandbox: - 'https://codesandbox.io/s/github/mui/toolpad/tree/master/examples/core/auth-nextjs-email', + // Crash with Prisma + codeSandbox: false, + stackBlitz: false, }, { title: 'Vite with React Router', description: - 'This app shows you to how to get started using Toolpad Core with Vite and React Router', + 'This app shows you to how to get started using Toolpad Core with Vite and React Router.', src: '/static/toolpad/docs/core/vite-react-router.png', source: 'https://github.com/mui/toolpad/tree/master/examples/core/vite/', - codeSandbox: 'https://codesandbox.io/s/github/mui/toolpad/tree/master/examples/core/vite', - stackblitz: 'https://stackblitz.com/github/mui/toolpad/tree/master/examples/core/vite', + codeSandbox: true, + // Show nothing + stackBlitz: false, }, { - title: 'Auth.js v4 with Next.js Pages router', + title: 'Auth.js v4 with Next.js Pages Router', description: - 'This app shows you to how to get started using Toolpad Core with Auth.js v4 and the Next.js Pages router', + 'This app shows you to how to get started using Toolpad Core with Auth.js v4 and the Next.js Pages router.', src: '/static/toolpad/docs/core/auth-next.png', srcDark: '/static/toolpad/docs/core/auth-next-dark.png', source: 'https://github.com/mui/toolpad/tree/master/examples/core/auth-nextjs-pages-nextauth-4/', - codeSandbox: - 'https://codesandbox.io/s/github/mui/toolpad/tree/master/examples/core/auth-nextjs-pages-nextauth-4', - stackblitz: - 'https://stackblitz.com/github/mui/toolpad/tree/master/examples/core/auth-nextjs-pages-nextauth-4', + codeSandbox: true, + // Show nothing + stackBlitz: false, }, { - title: 'Next.js App router with Auth.js Passkey', + title: 'Next.js App Router with Auth.js Passkey', description: - 'This app shows you to how to get started using Toolpad Core with Auth.js Passkeys and the Next.js App router', + 'This app shows you to how to get started using Toolpad Core with Auth.js Passkeys and the Next.js App Router.', src: '/static/toolpad/docs/core/auth-next-passkey.png', srcDark: '/static/toolpad/docs/core/auth-next-passkey-dark.png', source: 'https://github.com/mui/toolpad/tree/master/examples/core/auth-nextjs-passkey/', - codeSandbox: - 'https://codesandbox.io/s/github/mui/toolpad/tree/master/examples/core/auth-nextjs-passkey', + // Crash with Prisma + codeSandbox: false, + stackBlitz: false, }, { title: 'Vite with React Router and mock authentication', description: - 'This app shows you to how to get started using Toolpad Core with Vite, React Router and any external authentication provider', + 'This app shows you to how to get started using Toolpad Core with Vite, React Router and any external authentication provider.', src: '/static/toolpad/docs/core/vite-react-router.png', source: 'https://github.com/mui/toolpad/tree/master/examples/core/auth-vite', - codeSandbox: - 'https://codesandbox.io/s/github/mui/toolpad/tree/master/examples/core/auth-vite', + codeSandbox: true, + // Show nothing + stackBlitz: false, }, { title: 'Vite with React Router and Firebase Auth', description: - 'This app shows you to how to get started using Toolpad Core with Vite, React Router, and authentication using Firebase', + 'This app shows you to how to get started using Toolpad Core with Vite, React Router, and authentication using Firebase.', src: '/static/toolpad/docs/core/firebase-vite-light.png', srcDark: '/static/toolpad/docs/core/firebase-vite-dark.png', source: 'https://github.com/mui/toolpad/tree/master/examples/core/firebase-vite', - codeSandbox: - 'https://codesandbox.io/s/github/mui/toolpad/tree/master/examples/core/firebase-vite', + // Show nothing + codeSandbox: false, + stackBlitz: false, }, { - title: 'Functional Dashboard', + title: 'Functional dashboard', description: - 'This example shows you how to get started building a dashboard with Toolpad Core, Next.js app router, Auth.js and Material UI components in a customized theme', + 'This example shows you how to get started building a dashboard with Toolpad Core, Next.js app router, Auth.js and Material UI components in a customized theme.', src: '/static/toolpad/docs/core/functional-dashboard.png', href: 'https://mui.com/toolpad/core/templates/nextjs-dashboard', srcDark: '/static/toolpad/docs/core/functional-dashboard-dark.png', source: 'https://github.com/mui/toolpad/tree/master/examples/core/auth-nextjs-themed', featured: true, new: true, - codeSandbox: - 'https://codesandbox.io/s/github/mui/toolpad/tree/master/examples/core/auth-nextjs-themed', + codeSandbox: true, + stackBlitz: true, }, ]; } diff --git a/docs/src/modules/components/Examples/types.ts b/docs/src/modules/components/Examples/types.ts index 96508d22704..729ea4aa9c7 100644 --- a/docs/src/modules/components/Examples/types.ts +++ b/docs/src/modules/components/Examples/types.ts @@ -5,8 +5,8 @@ export interface Example { srcDark?: string; href: string; source: string; - codeSandbox?: string; - stackBlitz?: string; + codeSandbox?: boolean; + stackBlitz?: boolean; new?: boolean; featured?: boolean; } diff --git a/examples/core/auth-nextjs-email/README.md b/examples/core/auth-nextjs-email/README.md index b31c41650a4..da6cc6f9471 100644 --- a/examples/core/auth-nextjs-email/README.md +++ b/examples/core/auth-nextjs-email/README.md @@ -1,4 +1,4 @@ -# Toolpad Core Next.js App Router app with email provider +# Toolpad Core - Next.js App Router app with email provider This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app). diff --git a/examples/core/auth-nextjs-passkey/README.md b/examples/core/auth-nextjs-passkey/README.md index d55433ada12..7bf46b3ea61 100644 --- a/examples/core/auth-nextjs-passkey/README.md +++ b/examples/core/auth-nextjs-passkey/README.md @@ -1,4 +1,4 @@ -# Toolpad Core Playground - Next.js App Router with Passkey +# Toolpad Core - Next.js App Router with Passkey This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app). diff --git a/examples/core/auth-nextjs-themed/README.md b/examples/core/auth-nextjs-themed/README.md index baa6adbed70..cb926fe14dc 100644 --- a/examples/core/auth-nextjs-themed/README.md +++ b/examples/core/auth-nextjs-themed/README.md @@ -1,4 +1,4 @@ -# Create Toolpad App +# Toolpad Core - Create Toolpad App This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-toolpad-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app). @@ -16,7 +16,7 @@ Open [http://localhost:3000](http://localhost:3000) with your browser to see the ## Run on CodeSandbox -Run this example on CodeSandbox [here](https://codesandbox.io/s/github/mui/toolpad/tree/master/examples/core/auth-nextjs-themed). +Run this example on CodeSandbox [here](https://codesandbox.io/p/sandbox/github/mui/toolpad/tree/master/examples/core/auth-nextjs-themed). ## Clone using `create-toolpad-app` diff --git a/examples/core/auth-vite/README.md b/examples/core/auth-vite/README.md index 77643b462dd..f84b2a951b3 100644 --- a/examples/core/auth-vite/README.md +++ b/examples/core/auth-vite/README.md @@ -1,4 +1,4 @@ -# React + TypeScript + Vite +# Toolpad Core - Vite with React Router and mock authentication This template provides a minimal setup to get React working in Vite with HMR. diff --git a/examples/core/firebase-vite/README.md b/examples/core/firebase-vite/README.md index 72355db4e34..49e6fa69d16 100644 --- a/examples/core/firebase-vite/README.md +++ b/examples/core/firebase-vite/README.md @@ -1,4 +1,4 @@ -# React + TypeScript + Vite +# Toolpad Core - Vite with React Router and Firebase Auth This template provides a minimal setup to get React working in Vite with HMR, and authentication with Firebase. diff --git a/examples/core/vite/README.md b/examples/core/vite/README.md index 5f2dc7485c8..1ef91e1e4f0 100644 --- a/examples/core/vite/README.md +++ b/examples/core/vite/README.md @@ -1,4 +1,4 @@ -# Toolpad Core - Vite & React Router +# Toolpad Core - Vite with React Router This example provides a minimal setup to get Toolpad Core working in Vite with HMR, as well as routing with React Router. diff --git a/packages/create-toolpad-app/src/generateProject.ts b/packages/create-toolpad-app/src/generateProject.ts index 2fa766bdd23..0825af5897c 100644 --- a/packages/create-toolpad-app/src/generateProject.ts +++ b/packages/create-toolpad-app/src/generateProject.ts @@ -10,7 +10,7 @@ import ordersPage from './templates/ordersPage'; import packageJson from './templates/packageJson'; import indexPage from './templates/indexPage'; -// App router specific files +// App Router specific files import rootLayout from './templates/nextjs-app/rootLayout'; import dashboardLayout from './templates/nextjs-app/dashboardLayout';