Initial push for the Plone 7 app package

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/revolto/.release-it.json

@@ -0,0 +1,26 @@
+{
+  "hooks": {
+    "after:bump": [
+      "pipx run towncrier build --draft --yes --version ${version} > .changelog.draft",
+      "pipx run towncrier build --yes --version ${version}"
+    ],
+    "after:release": "rm .changelog.draft"
+  },
+  "npm": {
+    "publish": false
+  },
+  "git": {
+    "commitArgs": ["--no-verify"],
+    "changelog": "pipx run towncrier build --draft --yes --version 0.0.0",
+    "requireUpstream": false,
+    "requireCleanWorkingDir": false,
+    "commitMessage": "Release Plone7 ${version}",
+    "tagName": "plone7-${version}",
+    "tagAnnotation": "Release Plone7 ${version}"
+  },
+  "github": {
+    "release": true,
+    "releaseName": "Plone7 ${version}",
+    "releaseNotes": "cat .changelog.draft"
+  }
+}

packages/revolto/CHANGELOG.md

@@ -0,0 +1,11 @@
+# Plone 7 Release Notes
+
+<!-- Do *NOT* add new change log entries to this file.
+     Instead create a file in the news directory.
+     For helpful instructions, see:
+     https://6.docs.plone.org/contributing/index.html#change-log-entry
+-->
+
+<!-- towncrier release notes start -->
+
+## 1.0.0 (unreleased)

packages/revolto/README.md

@@ -1,30 +1,33 @@
-# Plone on React Router 7
-
-This is a proof of concept of a [React Router](https://reactrouter.com/dev/docs) app, using the `@plone/*` libraries.
-This is intended to serve as both a playground for the development of both packages and as a demo of Plone using Remix.
+# Plone 7
 
 > [!WARNING]
-> This package or app is experimental.
+> This package and all the efforts around it are not even in an alpha state and are experimental.
 > The community offers no support whatsoever for it.
 > Breaking changes may occur without notice.
 
+This is the initial (and very early) implementation of Plone 7.
+After the design and first implementations of all the required pieces (the `@plone/*` libraries) that will compose Plone 7, this package will concentrate all the development during the next years.
+
+It is based on [React Router](https://reactrouter.com/dev/docs) 7, using the `@plone/*` libraries.
+
+The name of this package and its folder name in `packages` may also change since it's undecided yet.
+
+## Releases
+
+Even in experimental phase, this package will be soft released periodically, under a tag.
+This will provide a way to try it out in real development and deploy scenarios.
+
 ## Development
 
 To start, from the root of the monorepo, issue the following commands.
 
 ```shell
 pnpm install
-pnpm --filter plone-remix run dev
+pnpm --filter plone7 run dev
 ```
 
 Then start the Plone backend.
 
-% TODO MAKEFILE
 ```shell
 make backend-docker-start
 ```
-
-
-## About this app
-
-- [Remix Docs](https://remix.run/docs/en/main)

packages/revolto/app/content.tsx

@@ -37,14 +37,13 @@ export async function loader({ params, request }: Route.LoaderArgs) {
       /\.(css|css\.map)$/.test(path)
     )
   ) {
-    console.log('prefetching', path);
     try {
       return await getContent({ path, expand });
     } catch (error) {
       throw data('Content Not Found', { status: 404 });
     }
   } else {
-    console.log('path not prefetched', path);
+    console.log('matched path not fetched', path);
     throw data('Content Not Found', { status: 404 });
   }
 }

packages/revolto/app/root.tsx

@@ -1,7 +1,6 @@
-import type { LinksFunction } from 'react-router';
-import type { Route } from './+types/root';
 import { useState } from 'react';
 import {
+  isRouteErrorResponse,
   Links,
   Meta,
   Outlet,
@@ -12,8 +11,9 @@ import {
   useNavigate as useRRNavigate,
   useParams,
   useLoaderData,
-  isRouteErrorResponse,
+  useRouteLoaderData,
 } from 'react-router';
+import type { Route } from './+types/root';
 
 import { QueryClient } from '@tanstack/react-query';
 import { ReactQueryDevtools } from '@tanstack/react-query-devtools';
@@ -38,7 +38,22 @@ function useHrefLocal(to: string) {
   return useHref(flattenToAppURL(to));
 }
 
-export const links: LinksFunction = () => [
+export const meta: Route.MetaFunction = () => [
+  { name: 'generator', content: 'Plone 7 - https://plone.org' },
+];
+
+export const links: Route.LinksFunction = () => [
+  {
+    rel: 'icon',
+    href: '/favicon.png',
+    type: 'image/png',
+    sizes: 'any',
+  },
+  {
+    rel: 'icon',
+    href: '/icon.svg',
+    type: 'image/svg+xml',
+  },
   { rel: 'stylesheet', href: themingMain },
   { rel: 'stylesheet', href: slotsMain },
   { rel: 'preconnect', href: 'https://fonts.googleapis.com' },
@@ -66,17 +81,23 @@ export async function loader() {
 
 export function Layout({ children }: { children: React.ReactNode }) {
   const data = useLoaderData<typeof loader>();
+  const indexLoaderData = useRouteLoaderData('index');
+  const contentLoaderData = useRouteLoaderData('content');
+  const contentData = indexLoaderData || contentLoaderData;
 
   return (
-    <html lang="en">
+    <html lang={contentData?.language?.token || 'en'}>
       <head>
         <meta charSet="utf-8" />
         <meta name="viewport" content="width=device-width, initial-scale=1" />
+        <meta name="mobile-web-app-capable" content="yes" />
         <Meta />
         <Links />
       </head>
       <body>
-        {children}
+        <div role="navigation" aria-label="Toolbar" id="toolbar" />
+        <div id="main">{children}</div>
+        <div role="complementary" aria-label="Sidebar" id="sidebar" />
         <ScrollRestoration />
         <script
           dangerouslySetInnerHTML={{

packages/revolto/package.json

@@ -1,5 +1,5 @@
 {
-  "name": "plone-rr7",
+  "name": "plone7",
   "private": true,
   "sideEffects": false,
   "type": "module",
@@ -8,7 +8,8 @@
     "build": "react-router build",
     "start:prod": "react-router-serve ./build/server/index.js",
     "typecheck": "react-router typegen && tsc",
-    "typegen": "react-router typegen"
+    "typegen": "react-router typegen",
+    "release": "release-it"
   },
   "dependencies": {
     "@plone/blocks": "workspace:*",
@@ -18,17 +19,17 @@
     "@plone/registry": "workspace:*",
     "@plone/slots": "workspace:*",
     "@plone/theming": "workspace:*",
-    "@react-router/node": "7.1.1",
-    "@react-router/serve": "7.1.1",
+    "@react-router/node": "7.1.2",
+    "@react-router/serve": "7.1.2",
     "@tanstack/react-query": "^5.59.0",
     "@tanstack/react-query-devtools": "^5.59.0",
     "isbot": "^5.1.17",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
-    "react-router": "7.1.1"
+    "react-router": "7.1.2"
   },
   "devDependencies": {
-    "@react-router/dev": "7.1.1",
+    "@react-router/dev": "7.1.2",
     "@types/react": "^18.3.9",
     "@types/react-dom": "^18.3.0",
     "typescript": "^5.6.3",

packages/revolto/towncrier.toml

@@ -0,0 +1,33 @@
+[tool.towncrier]
+filename = "CHANGELOG.md"
+directory = "news/"
+title_format = "## {version} ({project_date})"
+underlines = ["", "", ""]
+template = "../scripts/templates/towncrier_template.jinja"
+start_string = "<!-- towncrier release notes start -->\n"
+issue_format = "[#{issue}](https://github.com/plone/volto/issues/{issue})"
+
+[[tool.towncrier.type]]
+directory = "breaking"
+name = "Breaking"
+showcontent = true
+
+[[tool.towncrier.type]]
+directory = "feature"
+name = "Feature"
+showcontent = true
+
+[[tool.towncrier.type]]
+directory = "bugfix"
+name = "Bugfix"
+showcontent = true
+
+[[tool.towncrier.type]]
+directory = "internal"
+name = "Internal"
+showcontent = true
+
+[[tool.towncrier.type]]
+directory = "documentation"
+name = "Documentation"
+showcontent = true