Add authentication examples

docs/src/modules/components/ExamplesGrid.js

@@ -106,6 +106,13 @@ function layouts() {
       href: 'https://github.com/mui/mui-toolpad/tree/master/examples/charts',
       source: 'https://github.com/mui/mui-toolpad/tree/master/examples/charts',
     },
+    {
+      title: 'Authentication',
+      description: 'An app that shows how to set up authentication in Toolpad.',
+      src: '/static/toolpad/marketing/authentication.png',
+      href: 'https://github.com/mui/mui-toolpad/tree/master/examples/auth',
+      source: 'https://github.com/mui/mui-toolpad/tree/master/examples/auth',
+    },
     {
       title: 'Custom server',
       description: 'An app that shows how to use Toolpad with a custom server.',

examples/auth/.env.example

@@ -0,0 +1,7 @@
+TOOLPAD_AUTH_SECRET=u43rXwzRvl4PDZhAqeciOW4KLfYIl2Aa9B5Wet+rJSI=
+
+TOOLPAD_GITHUB_CLIENT_ID=
+TOOLPAD_GITHUB_CLIENT_SECRET=
+
+TOOLPAD_GOOGLE_CLIENT_ID=
+TOOLPAD_GOOGLE_CLIENT_SECRET=

examples/auth/README.md

@@ -0,0 +1,29 @@
+# Authentication
+
+<p class="description">An app that shows how to set up authentication in Toolpad.</p>
+
+Example showcasing how to set up authentication providers in a Toolpad app. [The docs](https://mui.com/toolpad/concepts/authentication/).
+
+<a target="_blank">
+  <img src="https://mui.com/static/toolpad/marketing/authentication.png" alt="Authentication" style="aspect-ratio: 131/88;" width="524">
+</a>
+
+## How to run
+
+Use `create-toolpad-app` to bootstrap the example:
+
+```bash
+npx create-toolpad-app@latest --example auth
+```
+
+```bash
+yarn create toolpad-app --example auth
+```
+
+```bash
+pnpm create toolpad-app --example auth
+```
+
+or:
+
+[![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/fork/github/mui/mui-toolpad/tree/master/examples/auth)

examples/auth/package.json

@@ -0,0 +1,13 @@
+{
+  "name": "auth",
+  "version": "0.1.0",
+  "private": true,
+  "scripts": {
+    "dev": "toolpad dev",
+    "build": "toolpad build",
+    "start": "toolpad start"
+  },
+  "dependencies": {
+    "@mui/toolpad": "0.1.49"
+  }
+}

examples/auth/toolpad/.gitignore

@@ -0,0 +1 @@
+.generated

examples/auth/toolpad/application.yml

@@ -0,0 +1,8 @@
+apiVersion: v1
+kind: application
+spec:
+  {
+    authentication:
+      { providers: [{ provider: github }, { provider: google }], restrictedDomains: [] },
+    authorization: {},
+  }

examples/auth/toolpad/pages/protectedpage/page.yml

@@ -0,0 +1,14 @@
+# yaml-language-server: $schema=https://raw.githubusercontent.com/mui/mui-toolpad/v0.1.48/docs/schemas/v1/definitions.json#properties/Page
+
+apiVersion: v1
+kind: page
+spec:
+  alias:
+    - sP_2TKM
+  title: Protected Page
+  displayName: Protected Page
+  content:
+    - component: Text
+      name: text
+      props:
+        value: Only authenticated users can see me.