More fixes and updates

docs/package.json

@@ -25,16 +25,16 @@
     "@emotion/server": "11.11.0",
     "@emotion/styled": "11.14.0",
     "@mui/base": "5.0.0-beta.68",
-    "@mui/docs": "6.3.1",
-    "@mui/icons-material": "6.3.1",
+    "@mui/docs": "6.4.1",
+    "@mui/icons-material": "6.4.1",
     "@mui/internal-markdown": "1.0.24",
     "@mui/joy": "5.0.0-beta.51",
     "@mui/lab": "6.0.0-beta.22",
-    "@mui/material": "6.3.1",
+    "@mui/material": "6.4.1",
     "@mui/material-nextjs": "6.3.1",
-    "@mui/styles": "6.3.1",
-    "@mui/system": "6.3.1",
-    "@mui/utils": "6.3.1",
+    "@mui/styles": "6.4.1",
+    "@mui/system": "6.4.1",
+    "@mui/utils": "6.4.1",
     "@mui/x-date-pickers": "7.23.6",
     "@mui/x-date-pickers-pro": "7.23.6",
     "@mui/x-license": "7.23.6",

packages/toolpad-core/package.json

@@ -56,7 +56,7 @@
   "dependencies": {
     "@babel/runtime": "^7.26.0",
     "@mui/lab": "6.0.0-beta.22",
-    "@mui/utils": "6.3.1",
+    "@mui/utils": "6.4.1",
     "@toolpad/utils": "workspace:*",
     "@vitejs/plugin-react": "4.3.4",
     "client-only": "^0.0.1",
@@ -65,8 +65,8 @@
     "prop-types": "15.8.1"
   },
   "devDependencies": {
-    "@mui/icons-material": "6.3.1",
-    "@mui/material": "6.3.1",
+    "@mui/icons-material": "6.4.1",
+    "@mui/material": "6.4.1",
     "@mui/x-data-grid": "7.22.2",
     "@types/invariant": "2.2.37",
     "@types/prop-types": "15.7.14",

packages/toolpad-core/src/CRUD/Create.tsx

@@ -26,7 +26,11 @@ function Create<D extends DataModel>(props: CreateProps<D>) {
     async (previousState, formData) => {
       try {
         await createOne(
-          Object.fromEntries(fields.map(({ field }) => [field, formData.get(field)])) as D,
+          Object.fromEntries(
+            fields
+              .filter(({ field }) => field !== 'id')
+              .map(({ field }) => [field, formData.get(field)]),
+          ) as D,
         );
         notifications.show('Item created successfully.', {
           severity: 'success',
@@ -46,11 +50,13 @@ function Create<D extends DataModel>(props: CreateProps<D>) {
   return (
     <Box component="form" action={submitAction} noValidate autoComplete="off">
       <Grid container spacing={2} sx={{ mb: 2 }}>
-        {fields.map(({ field, headerName }) => (
-          <Grid key={field} size={6}>
-            <TextField id={field} label={headerName} sx={{ width: '100%' }} />
-          </Grid>
-        ))}
+        {fields
+          .filter(({ field }) => field !== 'id')
+          .map(({ field, headerName }) => (
+            <Grid key={field} size={6}>
+              <TextField id={field} label={headerName} sx={{ width: '100%' }} />
+            </Grid>
+          ))}
       </Grid>
       <Button type="submit" variant="contained" loading={isSubmitting}>
         Create

packages/toolpad-studio-components/package.json

@@ -41,9 +41,9 @@
     "url": "https://github.com/mui/toolpad/issues"
   },
   "dependencies": {
-    "@mui/icons-material": "6.3.1",
+    "@mui/icons-material": "6.4.1",
     "@mui/lab": "6.0.0-beta.22",
-    "@mui/material": "6.3.1",
+    "@mui/material": "6.4.1",
     "@mui/x-charts": "7.23.6",
     "@mui/x-data-grid-premium": "7.23.6",
     "@mui/x-date-pickers": "7.23.6",

packages/toolpad-studio-runtime/package.json

@@ -44,7 +44,7 @@
   },
   "dependencies": {
     "@auth/core": "0.37.4",
-    "@mui/material": "6.3.1",
+    "@mui/material": "6.4.1",
     "@tanstack/react-query": "5.61.3",
     "@toolpad/utils": "workspace:*",
     "@types/json-schema": "7.0.15",

packages/toolpad-studio/package.json

@@ -63,12 +63,12 @@
     "@emotion/styled": "11.14.0",
     "@googleapis/drive": "8.14.0",
     "@googleapis/sheets": "9.3.1",
-    "@mui/icons-material": "6.3.1",
+    "@mui/icons-material": "6.4.1",
     "@mui/lab": "6.0.0-beta.22",
-    "@mui/material": "6.3.1",
-    "@mui/system": "6.3.1",
+    "@mui/material": "6.4.1",
+    "@mui/system": "6.4.1",
     "@mui/types": "7.2.21",
-    "@mui/utils": "6.3.1",
+    "@mui/utils": "6.4.1",
     "@mui/x-charts": "7.23.6",
     "@mui/x-data-grid": "7.23.6",
     "@mui/x-data-grid-premium": "7.23.6",

playground/nextjs-pages/package.json

@@ -9,8 +9,8 @@
   "devDependencies": {
     "@emotion/react": "11.14.0",
     "@emotion/styled": "11.14.0",
-    "@mui/icons-material": "6.3.1",
-    "@mui/material": "6.3.1",
+    "@mui/icons-material": "6.4.1",
+    "@mui/material": "6.4.1",
     "@mui/material-nextjs": "6.3.1",
     "@toolpad/core": "workspace:*",
     "@types/react": "^19.0.0",

playground/nextjs/package.json

@@ -9,8 +9,8 @@
   "devDependencies": {
     "@emotion/react": "11.14.0",
     "@emotion/styled": "11.14.0",
-    "@mui/icons-material": "6.3.1",
-    "@mui/material": "6.3.1",
+    "@mui/icons-material": "6.4.1",
+    "@mui/material": "6.4.1",
     "@mui/material-nextjs": "6.3.1",
     "@toolpad/core": "workspace:*",
     "@types/node": "^20.17.12",

playground/vite/package.json

@@ -10,8 +10,8 @@
   "devDependencies": {
     "@emotion/react": "11.14.0",
     "@emotion/styled": "11.14.0",
-    "@mui/icons-material": "6.3.1",
-    "@mui/material": "6.3.1",
+    "@mui/icons-material": "6.4.1",
+    "@mui/material": "6.4.1",
     "@toolpad/core": "workspace:*",
     "@types/react": "^19.0.0",
     "@types/react-dom": "^19.0.3",

playground/vite/src/App.tsx

@@ -14,11 +14,6 @@ const NAVIGATION: Navigation = [
     title: 'Dashboard',
     icon: <DashboardIcon />,
   },
-  {
-    segment: 'orders/new',
-    title: 'New Order',
-    icon: <ShoppingCartIcon />,
-  },
   {
     segment: 'orders',
     title: 'Orders',

playground/vite/src/layouts/dashboard.tsx

@@ -1,12 +1,21 @@
 import * as React from 'react';
-import { Outlet } from 'react-router';
+import { Outlet, useLocation, useParams } from 'react-router';
 import { DashboardLayout } from '@toolpad/core/DashboardLayout';
 import { PageContainer } from '@toolpad/core/PageContainer';
 
 export default function Layout() {
+  const location = useLocation();
   const { orderId } = useParams();
 
-  const title = orderId && `Order ${orderId}`;
+  const title = React.useMemo(() => {
+    if (orderId) {
+      return `Order ${orderId}`;
+    }
+    if (location.pathname === '/orders/new') {
+      return 'New Order';
+    }
+    return undefined;
+  }, [location.pathname, orderId]);
 
   return (
     <DashboardLayout>

playground/vite/src/pages/order.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { Show } from '@toolpad/core/CRUD';
-import { useNavigate, useParams } from 'react-router-dom';
+import { useNavigate, useParams } from 'react-router';
 import ordersDataSource, { Order } from '../data/orders';
 
 export default function OrderPage() {

playground/vite/src/pages/orders.tsx

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { useNavigate } from 'react-router-dom';
+import { useNavigate } from 'react-router';
 import { List } from '@toolpad/core/CRUD';
 import ordersDataSource, { Order } from '../data/orders';