vivid-planet · thomasdax98 · May 27, 2025 · Apr 23, 2025 · Apr 23, 2025 · Apr 23, 2025
diff --git a/.changeset/beige-comics-serve.md b/.changeset/beige-comics-serve.md
@@ -0,0 +1,5 @@
+---
+"@comet/admin": patch
+---
+
+Optimize responsive behavior of `CrudMoreActionsMenu`
diff --git a/.changeset/gentle-boats-hunt.md b/.changeset/gentle-boats-hunt.md
@@ -0,0 +1,5 @@
+---
+"@comet/cms-admin": minor
+---
+
+Adapt styling of `DamTable` to align with Comet DXP design
diff --git a/.changeset/hip-eagles-play.md b/.changeset/hip-eagles-play.md
diff --git a/.env b/.env
@@ -1,6 +1,8 @@
 # node
 NODE_ENV=development
 
+SERVER_HOST=localhost # change me to 0.0.0.0 if you want to access the server from other devices
+
 # project
 PROJECT_NAME=comet-demo
 DEV_DOMAIN_POSTFIX=demo

diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
@@ -83,7 +83,7 @@ Example for a good changeset:
 
 ````md
 ---
-"@comet/cms-site": minor
+"@comet/site-nextjs": minor
 ---
 
 Add `ErrorHandlerProvider`
@@ -110,7 +110,7 @@ The `ErrorHandler` receives the errors in the application and can report them to
 ```tsx
 "use client";
 
-import { ErrorHandlerProvider } from "@comet/cms-site";
+import { ErrorHandlerProvider } from "@comet/site-nextjs";
 import { PropsWithChildren } from "react";
 
 export function ErrorHandler({ children }: PropsWithChildren) {

diff --git a/copy-schema-files.js b/copy-schema-files.js
@@ -5,6 +5,8 @@ const fs = require("fs");
         fs.promises.copyFile("packages/api/cms-api/schema.gql", "packages/admin/cms-admin/schema.gql"),
         fs.promises.copyFile("packages/api/cms-api/block-meta.json", "packages/admin/cms-admin/block-meta.json"),
         fs.promises.copyFile("packages/api/cms-api/block-meta.json", "packages/site/cms-site/block-meta.json"),
+        fs.promises.copyFile("packages/api/cms-api/block-meta.json", "packages/site/site-nextjs/block-meta.json"),
+        fs.promises.copyFile("packages/api/cms-api/block-meta.json", "packages/site/site-react/block-meta.json"),
 
         fs.promises.copyFile("demo/api/block-meta.json", "demo/admin/block-meta.json"),
         fs.promises.copyFile("demo/api/block-meta.json", "demo/site/block-meta.json"),

diff --git a/demo/admin/package.json b/demo/admin/package.json
@@ -19,7 +19,8 @@
         "lint:tsc": "tsc --project .",
         "preview": "npm run build && vite preview",
         "serve": "node server",
-        "start": "run-s admin-generator intl:compile && run-p gql:types generate-block-types && dotenv -e .env.secrets -e .env.local -e .env -e .env.site-configs -- vite"
+        "start": "$npm_execpath check-node-version && run-s admin-generator intl:compile && run-p gql:types generate-block-types && dotenv -e .env.secrets -e .env.local -e .env -e .env.site-configs -- vite",
+        "check-node-version": "check-node-version --node $(cat ../../.nvmrc)"
     },
     "dependencies": {
         "@apollo/client": "^3.13.4",
@@ -76,6 +77,7 @@
         "@types/react-router": "^5.1.20",
         "@types/react-router-dom": "^5.3.3",
         "@vitejs/plugin-react-swc": "^3.8.1",
+        "check-node-version": "^4.2.1",
         "chokidar-cli": "^3.0.0",
         "cosmiconfig-toml-loader": "^1.0.0",
         "dotenv-cli": "^7.4.4",

diff --git a/demo/admin/server/index.js b/demo/admin/server/index.js
@@ -7,6 +7,7 @@ const { createProxyMiddleware } = require("http-proxy-middleware");
 
 const app = express();
 const port = process.env.APP_PORT ?? 3000;
+const host = process.env.SERVER_HOST ?? "localhost";
 
 let indexFile = fs.readFileSync("./build/index.html", "utf8");
 
@@ -38,6 +39,7 @@ app.use(
 );
 
 app.get("/status/health", (req, res) => {
+    res.setHeader("cache-control", "no-store");
     res.send("OK!");
 });
 
@@ -71,6 +73,6 @@ app.get("*", (req, res) => {
     res.send(indexFile);
 });
 
-app.listen(port, () => {
-    console.log(`Admin app listening at http://localhost:${port}`);
+app.listen(port, host, () => {
+    console.log(`Admin app listening at http://${host}:${port}`);
 });
diff --git a/demo/admin/vite.config.mts b/demo/admin/vite.config.mts
@@ -75,7 +75,7 @@ export default defineConfig(({ mode }) => {
             adminPackagesHotReloadPlugin,
         ],
         server: {
-            host: true,
+            host: process.env.SERVER_HOST ?? "localhost",
             port: Number(process.env.ADMIN_PORT),
             proxy: process.env.API_URL_INTERNAL
                 ? {

diff --git a/demo/api/package.json b/demo/api/package.json
@@ -21,7 +21,8 @@
         "lint:tsc": "tsc --project ./tsconfig.lint.json",
         "mikro-orm": "dotenv -e .env.secrets -e .env.local -e .env -e .env.site-configs -- mikro-orm",
         "start": "$npm_execpath prebuild && dotenv -e .env.secrets -e .env.local -e .env -e .env.site-configs -- nest start --debug --watch --preserveWatchOutput",
-        "start:dev": "run-p dev:*",
+        "check-node-version": "check-node-version --node $(cat ../../.nvmrc)",
+        "start:dev": "$npm_execpath check-node-version && run-p dev:*",
         "start:prod": "node dist/main"
     },
     "dependencies": {
@@ -75,6 +76,7 @@
         "@types/inquirer": "^8.2.11",
         "@types/node": "^22.15.21",
         "@types/response-time": "^2.3.8",
+        "check-node-version": "^4.2.1",
         "chokidar-cli": "^3.0.0",
         "dotenv-cli": "^7.4.4",
         "eslint": "^9.22.0",

diff --git a/demo/api/schema.gql b/demo/api/schema.gql
@@ -459,7 +459,7 @@ type PageTreeNode {
   category: PageTreeNodeCategory!
   userGroup: UserGroup!
   childNodes: [PageTreeNode!]!
-  numberOfDescendants: Float!
+  numberOfDescendants: Int!
   parentNode: PageTreeNode
   path: String!
   parentNodes: [PageTreeNode!]!
@@ -647,6 +647,7 @@ type Redirect {
   target: JSONObject!
   comment: String
   active: Boolean!
+  activatedAt: DateTime
   generationType: RedirectGenerationType!
   createdAt: DateTime!
   updatedAt: DateTime!

diff --git a/demo/api/src/app.module.ts b/demo/api/src/app.module.ts
@@ -53,6 +53,7 @@ import { PageTreeNode } from "./page-tree/entities/page-tree-node.entity";
 import { ProductsModule } from "./products/products.module";
 import { RedirectScope } from "./redirects/dto/redirect-scope";
 import { RedirectTargetUrlService } from "./redirects/redirect-target-url.service";
+import { StatusModule } from "./status/status.module";
 
 @Module({})
 export class AppModule {
@@ -152,6 +153,7 @@ export class AppModule {
                     File: DamFile,
                     Folder: DamFolder,
                 }),
+                StatusModule,
                 FileUploadsModule.register({
                     maxFileSize: config.fileUploads.maxFileSize,
                     directory: `${config.blob.storageDirectoryPrefix}-file-uploads`,

diff --git a/demo/api/src/comet-config.json b/demo/api/src/comet-config.json
@@ -8,7 +8,7 @@
         "maxFileSize": 15
     },
     "images": {
-        "deviceSizes": [640, 750, 828, 1080, 1200, 1920, 2048, 3840],
+        "deviceSizes": [640, 750, 828, 1080, 1200, 1920, 2048, 2560, 3200, 3840],
         "imageSizes": [16, 32, 48, 64, 96, 128, 256, 320, 384]
     },
     "imgproxy": {

diff --git a/demo/api/src/config/config.ts b/demo/api/src/config/config.ts
@@ -27,6 +27,7 @@ export function createConfig(processEnv: NodeJS.ProcessEnv) {
     return {
         ...cometConfig,
         debug: processEnv.NODE_ENV !== "production",
+        serverHost: processEnv.SERVER_HOST ?? "localhost",
         helmRelease: envVars.HELM_RELEASE,
         apiUrl: envVars.API_URL,
         apiPort: envVars.API_PORT,

diff --git a/demo/api/src/main.ts b/demo/api/src/main.ts
@@ -71,7 +71,8 @@ async function bootstrap(): Promise<void> {
     }
 
     const port = config.apiPort;
-    await app.listen(port);
-    console.log(`Application is running on: http://localhost:${port}/`);
+    const host = config.serverHost;
+    await app.listen(port, host);
+    console.log(`Application is running on: http://${host}:${port}/`);
 }
 bootstrap();
diff --git a/demo/api/src/products/entities/manufacturer.entity.ts b/demo/api/src/products/entities/manufacturer.entity.ts
@@ -14,7 +14,7 @@ export class AlternativeAddress {
     @IsString()
     street: string;
 
-    @Field(() => Number, { nullable: true })
+    @Field({ nullable: true })
     @Property({ nullable: true })
     @IsNumber()
     @IsNullable()
@@ -51,7 +51,7 @@ export class AlternativeAddressAsEmbeddable {
     @IsString()
     street: string;
 
-    @Field(() => Number, { nullable: true })
+    @Field({ nullable: true })
     @Property({ nullable: true })
     @IsNumber()
     @IsNullable()

diff --git a/demo/api/src/status/status.controller.ts b/demo/api/src/status/status.controller.ts
@@ -0,0 +1,31 @@
+import { DisableCometGuards } from "@comet/cms-api";
+import { EntityManager } from "@mikro-orm/postgresql";
+import { Controller, Get, Header } from "@nestjs/common";
+
+@Controller("status")
+@DisableCometGuards()
+export class StatusController {
+    constructor(private readonly entityManager: EntityManager) {}
+
+    @Get("liveness")
+    @Header("cache-control", "no-store")
+    liveness(): string {
+        // If this controller returns a non 2xx status code, the pod is restarted by kubernetes
+        // see https://kubernetes.io/docs/tasks/configure-pod-container/configure-liveness-readiness-startup-probes/
+        return "OK";
+    }
+
+    @Get("readiness")
+    @Header("cache-control", "no-store")
+    async readiness(): Promise<string> {
+        // If this controller returns a non 2xx status code, the pod does not receive traffic
+        // If the database is not available, it does not make sense to restart the pod
+        // However, the pod should not receive traffic anymore as it can't handle it without the database
+        // see https://kubernetes.io/docs/tasks/configure-pod-container/configure-liveness-readiness-startup-probes/#define-readiness-probes
+        //
+        // If your application is not relying on the database, you can remove the next line
+        // If your application is relying on another service (e.g. redis), add a health-check here
+        await this.entityManager.execute("SELECT 1+1");
+        return "OK";
+    }
+}
diff --git a/demo/api/src/status/status.module.ts b/demo/api/src/status/status.module.ts
@@ -0,0 +1,6 @@
+import { Module } from "@nestjs/common";
+
+import { StatusController } from "./status.controller";
+
+@Module({ controllers: [StatusController] })
+export class StatusModule {}
diff --git a/demo/build-and-run-site.sh b/demo/build-and-run-site.sh
@@ -1,5 +1,3 @@
-# Execute this script via `npm run build-and-run-site`
-#
 # This script builds the site like in the CI and starts it.
 #
 # Reasons why you want to do this:

diff --git a/demo/site-pages/src/common/blocks/CallToActionListBlock.tsx b/demo/site-pages/src/common/blocks/CallToActionListBlock.tsx
@@ -21,7 +21,7 @@ const Root = styled.div`
     flex-flow: row wrap;
     gap: ${({ theme }) => theme.spacing.S300};
 
-    ${({ theme }) => theme.breakpoints.sm.mediaQuery} {
+    ${({ theme }) => theme.breakpoints.md.mediaQuery} {
         gap: ${({ theme }) => theme.spacing.S400};
     }
 `;
diff --git a/demo/site-pages/src/common/blocks/MediaGalleryBlock.tsx b/demo/site-pages/src/common/blocks/MediaGalleryBlock.tsx
@@ -53,15 +53,15 @@ const PageLayoutContent = styled.div`
     grid-column: 2 / -2;
     position: relative;
 
-    ${({ theme }) => theme.breakpoints.xs.mediaQuery} {
+    ${({ theme }) => theme.breakpoints.sm.mediaQuery} {
         grid-column: 5 / -5;
     }
 
-    ${({ theme }) => theme.breakpoints.md.mediaQuery} {
+    ${({ theme }) => theme.breakpoints.lg.mediaQuery} {
         grid-column: 6 / -6;
     }
 
-    ${({ theme }) => theme.breakpoints.lg.mediaQuery} {
+    ${({ theme }) => theme.breakpoints.xl.mediaQuery} {
         grid-column: 7 / -7;
     }
 `;

diff --git a/demo/site-pages/src/common/blocks/RichTextBlock.tsx b/demo/site-pages/src/common/blocks/RichTextBlock.tsx
@@ -116,7 +116,7 @@ const DisableLastBottomSpacing = styled.div`
         > *:last-child {
             margin-bottom: 0;
 
-            ${theme.breakpoints.xs.mediaQuery} {
+            ${theme.breakpoints.sm.mediaQuery} {
                 margin-bottom: 0;
             }
         }

diff --git a/demo/site-pages/src/common/components/Typography.tsx b/demo/site-pages/src/common/components/Typography.tsx
@@ -205,7 +205,7 @@ export const Typography = styled.div.attrs<{
         css`
             margin-bottom: 0;
 
-            ${theme.breakpoints.xs.mediaQuery} {
+            ${theme.breakpoints.sm.mediaQuery} {
                 margin-bottom: 0;
             }
         `};

diff --git a/demo/site-pages/src/common/helpers/SvgUse.tsx b/demo/site-pages/src/common/helpers/SvgUse.tsx
@@ -5,7 +5,7 @@ interface SvgUseProps extends SVGProps<SVGSVGElement> {
 }
 
 export const SvgUse = ({ href, ...props }: SvgUseProps) => (
-    <svg {...props}>
+    <svg aria-hidden="true" {...props}>
         <use href={href} xlinkHref={href} />
     </svg>
 );
diff --git a/demo/site-pages/src/documents/pages/blocks/BasicStageBlock.tsx b/demo/site-pages/src/documents/pages/blocks/BasicStageBlock.tsx
@@ -72,7 +72,7 @@ const Content = styled.div<{ $alignItems: CSSProperties["alignItems"] }>`
 const MediaPhone = styled.div`
     height: 800px;
 
-    ${({ theme }) => theme.breakpoints.xs.mediaQuery} {
+    ${({ theme }) => theme.breakpoints.sm.mediaQuery} {
         display: none;
     }
 `;
@@ -81,11 +81,11 @@ const MediaTablet = styled.div`
     display: none;
     height: 700px;
 
-    ${({ theme }) => theme.breakpoints.xs.mediaQuery} {
+    ${({ theme }) => theme.breakpoints.sm.mediaQuery} {
         display: block;
     }
 
-    ${({ theme }) => theme.breakpoints.sm.mediaQuery} {
+    ${({ theme }) => theme.breakpoints.md.mediaQuery} {
         display: none;
     }
 `;
@@ -94,11 +94,11 @@ const MediaTabletLandscape = styled.div`
     display: none;
     height: 650px;
 
-    ${({ theme }) => theme.breakpoints.sm.mediaQuery} {
+    ${({ theme }) => theme.breakpoints.md.mediaQuery} {
         display: block;
     }
 
-    ${({ theme }) => theme.breakpoints.md.mediaQuery} {
+    ${({ theme }) => theme.breakpoints.lg.mediaQuery} {
         display: none;
     }
 `;
@@ -107,11 +107,11 @@ const MediaDesktop = styled.div`
     display: none;
     height: 750px;
 
-    ${({ theme }) => theme.breakpoints.md.mediaQuery} {
+    ${({ theme }) => theme.breakpoints.lg.mediaQuery} {
         display: block;
     }
 
-    ${({ theme }) => theme.breakpoints.lg.mediaQuery} {
+    ${({ theme }) => theme.breakpoints.xl.mediaQuery} {
         height: 800px;
     }
 `;