[docs] Clean-up examples (#2611)

mui · Sep 2, 2023 · fb120b8 · fb120b8
1 parent 1622dc0
commit fb120b8
Show file tree

Hide file tree

Showing 10 changed files with 26 additions and 20 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -404,7 +404,7 @@ Add new reference documentation, add new QR-code example.
 - &#8203;<!-- 10 -->Add 404 page to application runtime (#2077) @Janpot
 - &#8203;<!-- 09 -->Avoid component catalog opening while hovering the snackbar (#2079) @Janpot
 - &#8203;<!-- 08 -->Fix broken documentation links (#2076) @Janpot
-- &#8203;<!-- 07 -->Add new example for QR code generator (#2067) @Janpot
+- &#8203;<!-- 07 -->Add new example for QR Code generator (#2067) @Janpot
 - &#8203;<!-- 06 -->Avoid restarting vite devserver when env file changes (#2069) @Janpot
 - &#8203;<!-- 05 -->Reference documentation (#2001) @Janpot
 - &#8203;<!-- 04 -->Fix websocket connection in codesandbox (#2068) @Janpot

diff --git a/docs/data/pages.ts b/docs/data/pages.ts
@@ -9,9 +9,9 @@ const pages: MuiPage[] = [
       { pathname: '/toolpad/getting-started/installation' },
       { pathname: '/toolpad/getting-started/first-app', title: 'Build your first app' },
       {
-        pathname: '/toolpad/examples',
+        pathname: '/toolpad/examples-group',
         children: [
-          { pathname: '/toolpad/examples/overview', title: 'Overview' },
+          { pathname: '/toolpad/examples', title: 'Overview' },
           { pathname: '/toolpad/examples/npm-stats', title: 'npm stats' },
           { pathname: '/toolpad/examples/basic-crud-app', title: 'Basic CRUD application' },
           { pathname: '/toolpad/examples/qr-generator', title: 'QR Code generator' },

diff --git a/docs/pages/toolpad/examples/overview.js → docs/pages/toolpad/examples/index.js b/docs/pages/toolpad/examples/overview.js → docs/pages/toolpad/examples/index.js
diff --git a/docs/public/_redirects b/docs/public/_redirects
@@ -32,6 +32,7 @@
 /toolpad/concepts/connecting-to-data/ /toolpad/concepts/queries/ 301
 /toolpad/how-to-guides/connect-to-datasource/ /toolpad/how-to-guides/connect-to-databases/ 301
 /toolpad/tutorials/render-deploy/ /toolpad/how-to-guides/render-deploy/ 301
+/toolpad/examples/overview/ /toolpad/examples/ 301
 
 # Create separate namespace on https://mui.com
 

diff --git a/docs/src/modules/components/ExamplesGrid.js b/docs/src/modules/components/ExamplesGrid.js
@@ -35,39 +35,44 @@ function layouts() {
     },
     {
       title: 'With Prisma',
-      description: 'A basic Toolpad application that demonstrates how to integrate with prisma.',
+      description: 'A basic Toolpad application that demonstrates how to integrate with Prisma.',
       src: '/static/toolpad/marketing/with-prisma-hero.png',
+      href: 'https://github.com/mui/mui-toolpad/tree/master/examples/with-prisma',
       source: 'https://github.com/mui/mui-toolpad/tree/master/examples/with-prisma',
     },
     {
-      title: 'Google sheet',
-      description: 'Quickly fetch data from Google sheets to build a Toolpad app',
+      title: 'Google Sheet',
+      description: 'Quickly fetch data from Google Sheets to build a Toolpad app.',
       src: '/static/toolpad/marketing/google-sheet.png',
-      href: 'https://mui.com/toolpad/how-to-guides/connect-to-googlesheets/',
+      href: 'https://github.com/mui/mui-toolpad/tree/master/examples/google-sheet',
       source: 'https://github.com/mui/mui-toolpad/tree/master/examples/google-sheet',
     },
     {
       title: 'Dog app',
       description: 'An app that shows dog images based on selected breeds or sub-breeds.',
       src: '/static/toolpad/docs/getting-started/first-app/step-13.png',
+      href: 'https://github.com/mui/mui-toolpad/tree/master/examples/dog-app',
       source: 'https://github.com/mui/mui-toolpad/tree/master/examples/dog-app',
     },
     {
       title: 'Data grid columns',
-      description: 'A basic Toolpad app that shows how to add a code component inside a Data Grid',
+      description: 'A basic Toolpad app that shows how to add a code component inside a data grid.',
       src: '/static/toolpad/marketing/datagrid-columns.png',
+      href: 'https://github.com/mui/mui-toolpad/tree/master/examples/datagrid-columns',
       source: 'https://github.com/mui/mui-toolpad/tree/master/examples/datagrid-columns',
     },
     {
       title: 'Custom data grid',
-      description: 'A basic Toolpad app that shows how to add a code component inside a Data Grid',
+      description: 'A basic Toolpad app that shows how to add a code component inside a data grid.',
       src: '/static/toolpad/marketing/custom-datagrid-column.png',
+      href: 'https://github.com/mui/mui-toolpad/tree/master/examples/custom-datagrid-column',
       source: 'https://github.com/mui/mui-toolpad/tree/master/examples/custom-datagrid-column',
     },
     {
       title: 'GraphQL app',
       description: 'An app that shows latest 100 stargazers info for any GitHub repository.',
       src: '/static/toolpad/marketing/graphql.png',
+      href: 'https://github.com/mui/mui-toolpad/tree/master/examples/graphql',
       source: 'https://github.com/mui/mui-toolpad/tree/master/examples/graphql',
     },
   ];

diff --git a/examples/custom-datagrid-column/README.md b/examples/custom-datagrid-column/README.md
@@ -1,7 +1,7 @@
-# Custom datagrid column
+# Custom data grid column
 
-<p class="description">A basic Toolpad app that shows how to add a code component inside a Data Grid.</p>
+<p class="description">A basic Toolpad app that shows how to add a code component inside a data grid.</p>
 
-Example showcasing Adding a code component as a datagrid column. [docs](https://mui.com/toolpad/building-ui/data-grid-component/#configuring-columns)
+Example showcasing Adding a code component as a data grid column. [The docs](https://mui.com/toolpad/building-ui/data-grid-component/#configuring-columns).
 
 [![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/fork/github/mui/mui-toolpad/tree/master/examples/custom-datagrid-column)
diff --git a/examples/datagrid-columns/README.md b/examples/datagrid-columns/README.md
@@ -1,7 +1,7 @@
-# Datagrid columns
+# Data grid columns
 
-<p class="description">A basic Toolpad app that shows how to add a code component inside a Data Grid.</p>
+<p class="description">A basic Toolpad app that shows how to add a code component inside a data grid.</p>
 
-Example showcasing Adding a code component as a datagrid column. [docs](https://mui.com/toolpad/building-ui/data-grid-component/#configuring-columns)
+Example showcasing adding a code component as a data grid column. [The docs](https://mui.com/toolpad/building-ui/data-grid-component/#configuring-columns).
 
 [![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/fork/github/mui/mui-toolpad/tree/master/examples/datagrid-columns)
diff --git a/examples/google-sheet/README.md b/examples/google-sheet/README.md
@@ -1,5 +1,5 @@
-# Google sheet app
+# Google Sheet
 
-<p class="description">A Toolpad app that reads from Google sheet datasource</p>
+<p class="description">A Toolpad app that reads from Google Sheet datasource.</p>
 
 To build this app step-by-step, visit the [docs](https://mui.com/toolpad/how-to-guides/connect-to-googlesheets/).
diff --git a/examples/qr-generator/README.md b/examples/qr-generator/README.md
@@ -1,4 +1,4 @@
-# QR code generator
+# QR Code generator
 
 <p class="description">A basic Toolpad application that can be used to turn any text or URL into a QR code.</p>
 

diff --git a/examples/with-prisma/README.md b/examples/with-prisma/README.md
@@ -1,6 +1,6 @@
-# with prisma
+# With Prisma
 
-<p class="description">A basic Toolpad application that demonstrates how to integrate with prisma.</p>
+<p class="description">A basic Toolpad application that demonstrates how to integrate with Prisma.</p>
 
 <a target="_blank">
   <img src="https://mui.com//static/toolpad/marketing/with-prisma.png" alt="Toolpad example app with Prisma ORM" style="aspect-ratio: 1.8" width="100%">