Initial push of the Plone 7 base package (#6599)

.github/workflows/acceptance.yml

@@ -691,3 +691,51 @@ jobs:
         with:
           name: cypress-videos
           path: packages/volto/cypress/videos
+
+  seven:
+    if: github.event_name != 'pull_request' || github.event.pull_request.head.repo.full_name != github.event.pull_request.base.repo.full_name
+    runs-on: ubuntu-latest
+    name: Seven
+    timeout-minutes: 45
+    strategy:
+      fail-fast: false
+      matrix:
+        node-version: [22.x]
+    steps:
+      - uses: actions/checkout@v4
+
+      - name: Set up Node.js environment
+        uses: ./.github/actions/node_env_setup
+        with:
+          node-version: ${{ matrix.node-version }}
+
+      - name: Cypress acceptance tests
+        uses: cypress-io/github-action@v6
+        env:
+          BABEL_ENV: production
+          CYPRESS_RETRIES: 2
+          # Recommended: pass the GitHub token lets this action correctly
+          # determine the unique run id necessary to re-run the checks
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+        with:
+          install: false
+          working-directory: packages/seven
+          browser: chrome
+          spec: cypress/tests/core/basic/**/*.cy.ts
+          start: |
+            make ci-acceptance-backend-start
+            make acceptance-frontend-prod-start
+          wait-on: 'npx wait-on --httpTimeout 20000 http-get://127.0.0.1:55001/plone http://127.0.0.1:3000'
+
+      # Upload Cypress screenshots
+      - uses: actions/upload-artifact@v4
+        if: failure()
+        with:
+          name: cypress-screenshots
+          path: packages/seven/cypress/screenshots
+      # Upload Cypress videos
+      - uses: actions/upload-artifact@v4
+        if: failure()
+        with:
+          name: cypress-videos
+          path: packages/seven/cypress/videos

.github/workflows/changelog.yml

@@ -48,6 +48,8 @@ jobs:
               - 'packages/slots/**'
             theming:
               - 'packages/theming/**'
+            seven:
+              - 'packages/seven/**'
             wrongNews:
               - added|modified: 'news/**'
 
@@ -150,6 +152,14 @@ jobs:
         env:
           BASE_BRANCH: ${{ github.base_ref }}
 
+      - name: seven changelog check
+        if: steps.filter.outputs.seven == 'true'
+        run: |
+          git fetch --no-tags origin main
+          towncrier check --compare-with origin/main --dir packages/seven
+        env:
+          BASE_BRANCH: ${{ github.base_ref }}
+
       - name: Wrong location of news changelog check
         if: steps.filter.outputs.wrongNews == 'true'
         run: echo "News items should be moved from the repository root to the appropriate package root in `packages/package-name`." && exit 1

.github/workflows/cookieplone.yml

@@ -0,0 +1,66 @@
+name: Cookieplone
+on: [push, pull_request]
+
+env:
+  PYTHON_VERSION: "3.13"
+
+jobs:
+  seven:
+    if: github.event_name != 'pull_request' || github.event.pull_request.head.repo.full_name != github.event.pull_request.base.repo.full_name
+    runs-on: ubuntu-latest
+    name: Seven Cookieplone
+    timeout-minutes: 45
+    strategy:
+      fail-fast: false
+      matrix:
+        node-version: [22.x]
+    steps:
+      - uses: actions/checkout@v4
+      - run: echo "Current branch is ${GITHUB_REF#refs/heads/}"
+      - name: Set up Node.js environment
+        uses: ./.github/actions/node_env_setup
+        with:
+          node-version: ${{ matrix.node-version }}
+
+      - name: Generate Cookieplone-based frontend addon
+        run: |
+          pipx install cookieplone
+          COOKIEPLONE_REPOSITORY_TAG=seventemplate pipx run --no-cache cookieplone seven_addon --no-input
+
+      - name: Install generated package
+        working-directory: seven-add-on
+        run: |
+          pnpm dlx mrs-developer missdev --no-config --fetch-https
+          (cd core && git fetch --depth 1 origin ${GITHUB_REF#refs/heads/}:${GITHUB_REF#refs/heads/} && git checkout ${GITHUB_REF#refs/heads/})
+          pnpm i
+
+      - name: Cypress acceptance tests
+        uses: cypress-io/github-action@v6
+        env:
+          BABEL_ENV: production
+          CYPRESS_RETRIES: 2
+          # Recommended: pass the GitHub token lets this action correctly
+          # determine the unique run id necessary to re-run the checks
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+        with:
+          install: false
+          working-directory: seven-add-on/core/packages/seven
+          browser: chrome
+          spec: cypress/tests/core/basic/**/*.cy.ts
+          start: |
+            make ci-acceptance-backend-start
+            make project-acceptance-frontend-prod-start
+          wait-on: 'npx wait-on --httpTimeout 20000 http-get://127.0.0.1:55001/plone http://127.0.0.1:3000'
+
+      # Upload Cypress screenshots
+      - uses: actions/upload-artifact@v4
+        if: failure()
+        with:
+          name: cypress-screenshots
+          path: packages/seven/cypress/screenshots
+      # Upload Cypress videos
+      - uses: actions/upload-artifact@v4
+        if: failure()
+        with:
+          name: cypress-videos
+          path: packages/seven/cypress/videos

Makefile

@@ -145,9 +145,24 @@ packages/registry/dist: $(shell find packages/registry/src -type f)
 packages/components/dist: $(shell find packages/components/src -type f)
 	pnpm build:components
 
+packages/client/dist: $(shell find packages/client/src -type f)
+	pnpm build:client
+
+packages/providers/dist: $(shell find packages/providers/src -type f)
+	pnpm build:providers
+
+packages/helpers/dist: $(shell find packages/helpers/src -type f)
+	pnpm build:helpers
+
+packages/react-router/dist: $(shell find packages/react-router/src -type f)
+	pnpm build:react-router
+
 .PHONY: build-deps
 build-deps: packages/registry/dist ## Build dependencies
 
+.PHONY: build-all-deps
+build-all-deps: packages/registry/dist packages/components/dist packages/client/dist packages/providers/dist packages/react-router/dist packages/helpers/dist ## Build all dependencies
+
 .PHONY: i18n
 i18n: ## Converts your po files into json to translate volto frontend
 	$(MAKE) -C "./packages/volto/" i18n
@@ -378,6 +393,28 @@ acceptance-server-detached-start: ## Starts test acceptance server main fixture
 acceptance-server-detached-stop: ## Stop test acceptance server main fixture in detached mode (daemon)
 	docker kill plone-client-acceptance-server
 
+######### Seven acceptance tests
+
+.PHONY: seven-acceptance-frontend-dev-start
+seven-acceptance-frontend-dev-start: ## Start acceptance frontend in development mode for Seven
+	$(MAKE) -C "./packages/seven/" acceptance-frontend-dev-start
+
+.PHONY: seven-acceptance-frontend-prod-start
+seven-acceptance-frontend-prod-start:: ## Start acceptance frontend in production mode for Seven
+	$(MAKE) -C "./packages/seven/" acceptance-frontend-prod-start
+
+.PHONY: seven-acceptance-test
+seven-acceptance-test: ## Start Cypress in interactive mode for Seven
+	$(MAKE) -C "./packages/seven/" acceptance-test
+
+.PHONY: seven-ci-acceptance-test
+seven-ci-acceptance-test: ## Run cypress tests in headless mode for CI for Seven
+	$(MAKE) -C "./packages/seven/" ci-acceptance-test
+
+.PHONY: seven-ci-acceptance-test-run-all
+seven-ci-acceptance-test-run-all: ## With a single command, start both the acceptance frontend and backend acceptance server, and run Cypress tests in headless mode for Seven
+	$(MAKE) -C "./packages/seven/" ci-acceptance-test-run-all
+
 # include local overrides if present
 -include Makefile.local
 -include ../../../Makefile.local

PACKAGES.md

@@ -15,9 +15,8 @@ and as a development dependency:
 Plone 6.0.x (Volto 17 and below) does not use any of them.
 
 These packages are expected to be used and become part of Plone 7.
-Some of them might become part of Plone 6.1.x minor versions.
 
-The packages are divided into three categories or types:
+These packages are divided into three categories or types:
 
 - core
 - utilities
@@ -53,6 +52,7 @@ The bundle of these packages must work on both CommonJS and ECMAScript Module (E
 
 -   `@plone/providers`
 -   `@plone/helpers`
+-   `@plone/react-router`
 
 
 ### Rules
@@ -67,6 +67,7 @@ This bundle must work on both CommonJS and ESM environments.
 -   `@plone/blocks`
 -   `@plone/slots`
 -   `@plone/theming`
+-   `@plone/cmsui`
 -   `@plone/contents`
 
 
@@ -94,7 +95,7 @@ Some of them are used by the build, and separated in packages for convenience.
 - `tsconfig`
 
 
-## Volto add-ons packages
+## Volto add-on packages
 
 These Volto add-ons are packages used by Volto core.
 They are always loaded, so they are also called "core packages".

package.json

@@ -5,14 +5,18 @@
     "preinstall": "npx only-allow pnpm",
     "watch": "pnpm --filter @plone/registry --filter @plone/client --filter @plone/components --filter @plone/providers watch",
     "build:deps": "pnpm --filter @plone/registry build",
-    "build:all": "pnpm --filter @plone/registry --filter @plone/client --filter @plone/components --filter @plone/providers build",
-    "build:all:force": "pnpm --filter @plone/registry --filter @plone/client --filter @plone/components --filter @plone/providers build:force",
+    "build:all": "pnpm --filter @plone/registry --filter @plone/client --filter @plone/components --filter @plone/providers --filter @plone/react-router build",
+    "build:all:force": "pnpm --filter @plone/registry --filter @plone/client --filter @plone/components --filter @plone/providers --filter @plone/react-router build:force",
     "build:registry": "pnpm --filter @plone/registry run build",
     "build:components": "pnpm --filter @plone/components run build",
+    "build:client": "pnpm --filter @plone/client run build",
+    "build:providers": "pnpm --filter @plone/providers run build",
+    "build:helpers": "pnpm --filter @plone/helpers run build",
+    "build:react-router": "pnpm --filter @plone/react-router run build",
     "build": "pnpm --filter @plone/volto build",
     "start": "pnpm --filter @plone/volto start",
     "start:project": "pnpm --filter plone run start",
-    "lint": "pnpm build:all && eslint --max-warnings=0 '{apps,packages}/**/*.{js,jsx,ts,tsx}'",
+    "lint": "make build-all-deps && eslint --max-warnings=0 '{apps,packages}/**/*.{js,jsx,ts,tsx}'",
     "lint:volto": "pnpm --filter @plone/volto run lint",
     "test": "pnpm --filter @plone/volto run test",
     "test:ci": "pnpm --filter @plone/volto run test:ci",

packages/blocks/.eslintrc.cjs

@@ -1,5 +1,5 @@
 /** @type {import('eslint').Linter.Config} */
 module.exports = {
-  extends: ['../../.eslintrc.cjs', 'plugin:react/jsx-runtime'],
-  ignorePatterns: ['storybook-static', 'dist'],
+  extends: ['../../.eslintrc.cjs', '../eslintconfig/addons.js'],
+  ignorePatterns: ['vitest.config.ts'],
 };

packages/blocks/RenderBlocks/BlockWrapper.tsx

@@ -11,8 +11,8 @@ const BlockWrapper = (props: BlockWrapperProps) => {
   const data = content.blocks?.[block];
   const category = blocksConfig?.[data['@type']]?.category;
   // TODO: Bring in the StyleWrapper helpers for calculating styles and classes
-  const classNames = null;
-  const style = null;
+  const classNames = undefined;
+  const style = undefined;
 
   return (
     <div

packages/blocks/RenderBlocks/RenderBlocks.tsx

@@ -45,7 +45,7 @@ const RenderBlocks = (props: RenderBlocksProps) => {
         const Block = blocksConfig[blockType]?.view || DefaultBlockView;
 
         return Block ? (
-          <BlockWrapper {...props} block={block}>
+          <BlockWrapper key={block} {...props} block={block}>
             {/* @ts-ignore It's ok to pass the blockData as is */}
             <Block
               key={block}

packages/blocks/index.ts

@@ -4,6 +4,7 @@ import { blocksConfig } from './config';
 
 export default function install(config: ConfigType) {
   config.settings.slate = slate;
+  // @ts-expect-error this is a quick hack for now
   config.blocks.blocksConfig = blocksConfig;
 
   return config;

packages/blocks/news/6599.bugfix

@@ -0,0 +1 @@
+Fixed several typing errors and a map without key. @sneridagh

packages/blocks/package.json

@@ -56,8 +56,13 @@
   "devDependencies": {
     "@plone/registry": "workspace:*",
     "@plone/types": "workspace:*",
+    "@testing-library/jest-dom": "6.4.2",
+    "@testing-library/react": "14.2.1",
+    "@types/jest-axe": "^3.5.7",
+    "@types/node": "^20",
     "@types/react": "^18",
     "@types/react-dom": "^18",
+    "jest-axe": "^8.0.0",
     "release-it": "17.1.1",
     "tsconfig": "workspace:*",
     "typescript": "^5.6.3",

packages/blocks/setupTesting.ts

@@ -0,0 +1,3 @@
+import '@testing-library/jest-dom';
+import { toHaveNoViolations } from 'jest-axe';
+expect.extend(toHaveNoViolations);

packages/blocks/vitest.config.ts

@@ -0,0 +1,14 @@
+import { defineConfig } from 'vitest/config';
+
+// https://vitejs.dev/config/
+export default defineConfig({
+  test: {
+    globals: true,
+    environment: 'jsdom',
+    setupFiles: './setupTesting.ts',
+    // you might want to disable it, if you don't have tests that rely on CSS
+    // since parsing CSS is slow
+    css: true,
+    exclude: ['**/node_modules/**', '**/lib/**'],
+  },
+});

packages/client/README.md

@@ -37,7 +37,7 @@ The main artifact that the client provides is the `ploneClient` entry point.
 
 Once imported, you should call `initialize` to setup its basic parameters, like `apiPath`, headers or authentication options.
 
-After initialization, you can import all the prorvided query options factories.
+After initialization, you can import all the provided query options factories.
 
 ```ts
 import ploneClient from '@plone/client';

packages/client/news/6599.documentation

@@ -0,0 +1 @@
+Fix typo in README. @sneridagh

packages/eslintconfig/README.md

@@ -0,0 +1,34 @@
+# `eslintconfig`
+
+Base configurations for projects.
+
+## Usage
+
+In `package.json`:
+
+```json
+  "devDependencies": {
+    "eslintconfig": "workspace:*",
+  }
+```
+
+```js
+{
+  "extends": "tsconfig/react-library.json",
+  "include": ["src", "src/**/*.js"],
+  "exclude": [
+    "node_modules",
+    "build",
+    "public",
+    "coverage",
+    "src/**/*.test.{js,jsx,ts,tsx}",
+    "src/**/*.spec.{js,jsx,ts,tsx}",
+    "src/**/*.stories.{js,jsx,ts,tsx}"
+  ]
+}
+```
+
+> [!WARNING]
+> This package or app is experimental.
+> The community offers no support whatsoever for it.
+> Breaking changes may occur without notice.

packages/eslintconfig/addons.js

@@ -0,0 +1,17 @@
+/** @type {import('eslint').Linter.Config} */
+module.exports = {
+  ignorePatterns: ['storybook-static', 'dist'],
+  overrides: [
+    {
+      files: ['**/*.{ts,tsx, js, jsx}'],
+      extends: [
+        'plugin:react/jsx-runtime', // We only want this for non-library code (eg. volto add-ons)
+      ],
+      rules: {
+        'import/no-unresolved': 1,
+        'import/named': 'error',
+        'react/jsx-key': [2, { checkFragmentShorthand: true }],
+      },
+    },
+  ],
+};

packages/eslintconfig/package.json

@@ -0,0 +1,9 @@
+{
+  "name": "eslintconfig",
+  "version": "0.0.0",
+  "private": true,
+  "license": "MIT",
+  "publishConfig": {
+    "access": "public"
+  }
+}