Merge branch 'main' into returnUrl-login

.github/workflows/acceptance.yml

@@ -9,7 +9,7 @@ jobs:
     strategy:
       fail-fast: false
       matrix:
-        node-version: [18.x, 20.x]
+        node-version: [20.x, 22.x]
     steps:
       - uses: actions/checkout@v4
 
@@ -57,7 +57,7 @@ jobs:
     strategy:
       fail-fast: false
       matrix:
-        node-version: [18.x, 20.x]
+        node-version: [20.x, 22.x]
     steps:
       - uses: actions/checkout@v4
 
@@ -105,7 +105,7 @@ jobs:
     strategy:
       fail-fast: false
       matrix:
-        node-version: [18.x, 20.x]
+        node-version: [20.x, 22.x]
     steps:
       - uses: actions/checkout@v4
 
@@ -153,7 +153,7 @@ jobs:
     strategy:
       fail-fast: false
       matrix:
-        node-version: [18.x, 20.x]
+        node-version: [20.x, 22.x]
     steps:
       - uses: actions/checkout@v4
 
@@ -201,7 +201,7 @@ jobs:
     strategy:
       fail-fast: false
       matrix:
-        node-version: [18.x, 20.x]
+        node-version: [20.x, 22.x]
     steps:
       - uses: actions/checkout@v4
 
@@ -249,7 +249,7 @@ jobs:
     strategy:
       fail-fast: false
       matrix:
-        node-version: [18.x, 20.x]
+        node-version: [20.x, 22.x]
     steps:
       - uses: actions/checkout@v4
 
@@ -296,7 +296,7 @@ jobs:
     strategy:
       fail-fast: false
       matrix:
-        node-version: [18.x]
+        node-version: [22.x]
     steps:
       - uses: actions/checkout@v4
 
@@ -344,7 +344,7 @@ jobs:
     strategy:
       fail-fast: false
       matrix:
-        node-version: [18.x]
+        node-version: [22.x]
     steps:
       - uses: actions/checkout@v4
 
@@ -392,7 +392,7 @@ jobs:
     strategy:
       fail-fast: false
       matrix:
-        node-version: [18.x]
+        node-version: [22.x]
     steps:
       - uses: actions/checkout@v4
 
@@ -440,7 +440,7 @@ jobs:
     strategy:
       fail-fast: false
       matrix:
-        node-version: [18.x]
+        node-version: [22.x]
         # python-version: [3.7]
     steps:
       - uses: actions/checkout@v4
@@ -489,7 +489,7 @@ jobs:
     strategy:
       fail-fast: false
       matrix:
-        node-version: [18.x, 20.x]
+        node-version: [20.x, 22.x]
     env:
       generator-directory: ./packages/generator-volto
       project-directory: ./my-volto-app
@@ -597,7 +597,7 @@ jobs:
     strategy:
       fail-fast: false
       matrix:
-        node-version: [18.x]
+        node-version: [22.x]
     steps:
       - uses: actions/checkout@v4
 
@@ -647,7 +647,7 @@ jobs:
     strategy:
       fail-fast: false
       matrix:
-        node-version: [18.x]
+        node-version: [22.x]
     steps:
       - uses: actions/checkout@v4
 

.github/workflows/changelog.yml

@@ -6,7 +6,7 @@ on:
       - main
 
 env:
-  node-version: 20.x
+  node-version: 22.x
 
 jobs:
   towncrier:

.github/workflows/code-analysis.yml

@@ -2,7 +2,7 @@ name: Code Analysis Check
 on: [push, pull_request]
 
 env:
-  node-version: 20.x
+  node-version: 22.x
 
 jobs:
   prettier:

.github/workflows/deployment_tests.yml

@@ -2,7 +2,7 @@ name: Deployment Tests
 on: [push, pull_request]
 
 env:
-  node-version: 20.x
+  node-version: 22.x
 
 jobs:
   vitessr:

.github/workflows/unit.yml

@@ -2,7 +2,7 @@ name: Unit Tests
 on: [push, pull_request]
 
 env:
-  node-version: 20.x
+  node-version: 22.x
 
 jobs:
   volto:
@@ -12,7 +12,7 @@ jobs:
     strategy:
       fail-fast: false
       matrix:
-        node-version: [18.x, 20.x]
+        node-version: [20.x, 22.x]
     steps:
       - uses: actions/checkout@v4
 
@@ -40,7 +40,7 @@ jobs:
     strategy:
       fail-fast: false
       matrix:
-        node-version: [18.x, 20.x]
+        node-version: [20.x, 22.x]
     steps:
       - uses: actions/checkout@v4
 
@@ -77,16 +77,14 @@ jobs:
     runs-on: ubuntu-latest
     strategy:
       fail-fast: false
-      matrix:
-        node-version: [18.x, 20.x]
     steps:
       - uses: actions/checkout@v4
 
       # node setup
-      - name: Use Node.js ${{ matrix.node-version }}
+      - name: Use Node.js ${{ env.node-version }}
         uses: actions/setup-node@v4
         with:
-          node-version: ${{ matrix.node-version }}
+          node-version: ${{ env.node-version }}
 
       - name: Enable corepack
         run: corepack enable
@@ -152,16 +150,14 @@ jobs:
     runs-on: ubuntu-latest
     strategy:
       fail-fast: false
-      matrix:
-        node-version: [18.x, 20.x]
     steps:
       - uses: actions/checkout@v4
 
       # node setup
-      - name: Use Node.js ${{ matrix.node-version }}
+      - name: Use Node.js ${{ env.node-version }}
         uses: actions/setup-node@v4
         with:
-          node-version: ${{ matrix.node-version }}
+          node-version: ${{ env.node-version }}
 
       - name: Enable corepack
         run: corepack enable

Makefile

@@ -67,7 +67,7 @@ test: ## Run unit tests
 .PHONY: clean
 clean: ## Clean development environment
 	rm -rf node_modules
-	find ./packages -name node_modules -exec rm -rf {} \;
+	find ./packages -name node_modules -not -path "./packages/volto/__tests__/*" -exec rm -rf {} \;
 
 .PHONY: install
 install: ## Set up development environment

apps/nextjs/.eslintrc.json

@@ -0,0 +1,9 @@
+{
+  "extends": ["next/core-web-vitals", "next/typescript"],
+  "ignorePatterns": [".next/**", "dist/**", "node_modules/**"],
+  "settings": {
+    "next": {
+      "rootDir": "apps/nextjs/"
+    }
+  }
+}

apps/nextjs/.gitignore

@@ -4,6 +4,7 @@
 /node_modules
 /.pnp
 .pnp.js
+.yarn/install-state.gz
 
 # testing
 /coverage

apps/nextjs/LICENSE

@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2023 Plone Foundation
+Copyright (c) 2024 Plone Foundation
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

apps/nextjs/README.md

@@ -2,6 +2,11 @@
 
 This is a proof of concept of a [Next.js](https://nextjs.org) app, using the app router and the `@plone/client` and `@plone/components` library. This is intended to serve as both a playground for the development of both packages and as demo of Plone using Next.js.
 
+> [!WARNING]
+> This package or app is experimental.
+> The community offers no support whatsoever for it.
+> Breaking changes may occur without notice.
+
 ## Development
 
 To start, from the root of the monorepo:

apps/nextjs/next.config.js → apps/nextjs/next.config.mjs

@@ -1,7 +1,10 @@
-const path = require('path');
+import path from 'path';
 
 /** @type {import('next').NextConfig} */
 const nextConfig = {
+  typescript: {
+    ignoreBuildErrors: true,
+  },
   // sassOptions: {
   //   includePaths: [path.join(__dirname, 'src/lib/components/src/styles')],
   // },
@@ -46,4 +49,4 @@ const nextConfig = {
   },
 };
 
-module.exports = nextConfig;
+export default nextConfig;

apps/nextjs/package.json

@@ -13,21 +13,22 @@
     "@plone/blocks": "workspace: *",
     "@plone/client": "workspace: *",
     "@plone/components": "workspace: *",
-    "@plone/registry": "workspace: *",
     "@plone/providers": "workspace: *",
-    "@tanstack/react-query": "^5.37.1",
-    "next": "14.2.2",
+    "@plone/registry": "workspace: *",
+    "@tanstack/react-query": "^5.59.0",
+    "next": "14.2.14",
     "react": "^18",
-    "react-aria-components": "^1.1.1",
+    "react-aria-components": "^1.4.0",
     "react-dom": "^18"
   },
   "devDependencies": {
-    "@tanstack/react-query-devtools": "^5.37.1",
+    "@plone/types": "workspace: *",
+    "@tanstack/react-query-devtools": "^5.59.0",
     "@types/node": "^20",
     "@types/react": "^18",
     "@types/react-dom": "^18",
     "eslint": "^8",
-    "eslint-config-next": "14.2.2",
-    "typescript": "^5.4.5"
+    "eslint-config-next": "14.2.14",
+    "typescript": "^5.6.3"
   }
 }

apps/nextjs/src/app/Providers.tsx

@@ -1,15 +1,32 @@
 'use client';
 import React from 'react';
-import { useRouter } from 'next/navigation';
-import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
-import { PloneClientProvider } from '@plone/providers';
+import {
+  useRouter,
+  usePathname,
+  useSearchParams,
+  useParams,
+} from 'next/navigation';
+import { QueryClient } from '@tanstack/react-query';
+import { PloneProvider } from '@plone/providers';
 import PloneClient from '@plone/client';
 import { ReactQueryDevtools } from '@tanstack/react-query-devtools';
-import { RouterProvider } from 'react-aria-components';
-import { FlattenToAppURLProvider } from '@plone/components';
 import { flattenToAppURL } from './utils';
 import config from './config';
 
+// Custom hook to unify the location object between NextJS and Plone
+function useLocation() {
+  const pathname = usePathname();
+  const search = useSearchParams();
+
+  return {
+    pathname,
+    search,
+    searchStr: '',
+    hash: (typeof window !== 'undefined' && window.location.hash) || '',
+    href: (typeof window !== 'undefined' && window.location.href) || '',
+  };
+}
+
 const Providers: React.FC<{
   children?: React.ReactNode;
 }> = ({ children }) => {
@@ -36,19 +53,25 @@ const Providers: React.FC<{
     }),
   );
 
-  let router = useRouter();
+  const router = useRouter();
 
   return (
-    <RouterProvider navigate={router.push}>
-      <PloneClientProvider client={ploneClient}>
-        <QueryClientProvider client={queryClient}>
-          <FlattenToAppURLProvider flattenToAppURL={flattenToAppURL}>
-            {children}
-            <ReactQueryDevtools initialIsOpen={false} />
-          </FlattenToAppURLProvider>
-        </QueryClientProvider>
-      </PloneClientProvider>
-    </RouterProvider>
+    <PloneProvider
+      ploneClient={ploneClient}
+      queryClient={queryClient}
+      // NextJS doesn't have a useLocation hook, so we need to unify this
+      // in a custom hook
+      useLocation={useLocation}
+      navigate={(to) => {
+        router.push(to);
+      }}
+      useParams={useParams}
+      useHref={(to) => flattenToAppURL(to)}
+      flattenToAppURL={flattenToAppURL}
+    >
+      {children}
+      <ReactQueryDevtools initialIsOpen={false} />
+    </PloneProvider>
   );
 };