Update all packages to latest major

package.json

@@ -31,7 +31,7 @@
   ],
   "devDependencies": {
     "husky": "^9.0.11",
-    "lerna": "^8.1.3",
+    "lerna": "^8.1.5",
     "lint-staged": "^15.2.7",
     "npm-check-updates": "^16.14.20"
   },

packages/app/package.json

@@ -15,29 +15,29 @@
     "prepare": "touch ./public/config.local.js"
   },
   "dependencies": {
-    "@commercelayer/app-elements": "^2.0.7",
-    "@commercelayer/sdk": "^6.8.0",
+    "@commercelayer/app-elements": "^2.0.10",
+    "@commercelayer/sdk": "^6.9.1",
     "@hookform/resolvers": "^3.6.0",
     "lodash": "^4.17.21",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
     "react-hook-form": "^7.52.0",
     "swr": "^2.2.5",
     "type-fest": "^4.20.1",
-    "wouter": "^3.2.0",
+    "wouter": "^3.3.0",
     "zod": "^3.23.8"
   },
   "devDependencies": {
     "@commercelayer/eslint-config-ts-react": "^1.4.5",
     "@types/lodash": "^4.17.5",
-    "@types/node": "20.14.5",
+    "@types/node": "20.14.9",
     "@types/react": "^18.3.3",
     "@types/react-dom": "^18.3.0",
     "@vitejs/plugin-react": "^4.3.1",
     "eslint": "^8.57.0",
     "jsdom": "^24.1.0",
-    "rollup-plugin-external-globals": "^0.10.0",
-    "typescript": "^5.4.5",
+    "rollup-plugin-external-globals": "^0.11.0",
+    "typescript": "^5.5.2",
     "vite": "^5.3.1",
     "vite-tsconfig-paths": "^4.3.2",
     "vitest": "^1.6.0"

packages/app/src/hooks/useOrderToolbar.tsx

@@ -80,7 +80,8 @@ export function useOrderToolbar({
         ? [
             {
               label: dropdownItemsGroup[0].label,
-              onClick: dropdownItemsGroup[0].onClick
+              onClick: dropdownItemsGroup[0].onClick,
+              size: 'small'
             }
           ]
         : undefined,

packages/app/src/pages/OrderDetails.tsx

@@ -22,7 +22,9 @@ import {
   Spacer,
   formatDateWithPredicate,
   goBack,
-  useTokenProvider
+  useEditMetadataOverlay,
+  useTokenProvider,
+  type DropdownItemProps
 } from '@commercelayer/app-elements'
 import { useLocation, useRoute } from 'wouter'
 
@@ -40,6 +42,23 @@ function OrderDetails(): JSX.Element {
   const { order, isLoading, error } = useOrderDetails(orderId)
   const { returns, isLoadingReturns } = useOrderReturns(orderId)
   const toolbar = useOrderToolbar({ order })
+  const { Overlay: EditMetadataOverlay, show: showEditMetadataOverlay } =
+    useEditMetadataOverlay()
+  if (canUser('update', 'orders')) {
+    const setMetadataDropDownItem: DropdownItemProps = {
+      label: 'Set metadata',
+      onClick: () => {
+        showEditMetadataOverlay()
+      }
+    }
+    if (toolbar.dropdownItems != null) {
+      toolbar.dropdownItems[toolbar.dropdownItems.length - 1]?.push(
+        setMetadataDropDownItem
+      )
+    } else {
+      toolbar.dropdownItems = [[setMetadataDropDownItem]]
+    }
+  }
 
   if (orderId === undefined || !canUser('read', 'orders') || error != null) {
     return (
@@ -178,6 +197,13 @@ function OrderDetails(): JSX.Element {
               <Timeline order={order} />
             </Spacer>
           )}
+          {!isMockedId(order.id) && (
+            <EditMetadataOverlay
+              resourceType={order.type}
+              resourceId={order.id}
+              title={pageTitle}
+            />
+          )}
         </Spacer>
       </SkeletonTemplate>
     </PageLayout>

packages/app/tsconfig.json

@@ -54,9 +54,6 @@
   "include": [
     "global.d.ts",
     "src",
-    "*.config.ts",
-    "*.config.js",
-    "*.config.cjs",
     ".eslintrc.cjs",
     "public/*.js",
   ],