Merge branch 'release/3.0.0' into feature/brnd-2.7-fix1

Author: tuj

.env

@@ -108,6 +108,9 @@ KEY_VAULT_JSON="{}"
 TRACK_SCREEN_INFO=false
 # Interval in seconds between screen info updates.
 TRACK_SCREEN_INFO_UPDATE_INTERVAL_SECONDS=300
+# Maximum media upload size in mebibytes (MiB). Read per-request, so no cache:clear needed.
+# Must stay aligned with NGINX_MAX_BODY_SIZE and php-fpm upload_max_filesize / post_max_size.
+MEDIA_MAX_UPLOAD_SIZE_MB=200
 # Toggle the relations checksum optimisation for content updates.
 RELATIONS_CHECKSUM_ENABLED=true
 ###< App ###
@@ -177,6 +180,11 @@ CALENDAR_API_FEED_SOURCE_CACHE_EXPIRE_SECONDS=300
 EVENTDATABASE_API_V2_CACHE_EXPIRE_SECONDS=300
 ###< Event Database Api V2 Feed Type ###
 
+###> Instant Book ###
+# Source of busy intervals data for instant booking interactive slides (graph or feed).
+INSTANT_BOOK_BUSY_INTERVALS_SOURCE=graph
+###< Instant Book ###
+
 ###> Admin configuration ###
 # API key for Rejseplanen (Danish journey planner) integration.
 ADMIN_REJSEPLANEN_APIKEY=

.env.test

@@ -19,3 +19,6 @@ JWT_SCREEN_TOKEN_TTL=43200
 JWT_REFRESH_TOKEN_TTL=3600
 JWT_SCREEN_REFRESH_TOKEN_TTL=86400
 ###< gesdinet/jwt-refresh-token-bundle ###
+
+# Lowered so testMediaUploadRejectedWhenTooLarge can build a small tmp file.
+MEDIA_MAX_UPLOAD_SIZE_MB=1

CHANGELOG.md

@@ -5,6 +5,13 @@ All notable changes to this project will be documented in this file.
 ## [Unreleased]
 
 - Merged fixes from 2.7.0 into release/3.0.0.
+- Added `INSTANT_BOOK_BUSY_INTERVALS_SOURCE` to select between Graph and the slide's calendar feed as the source of busy
+  intervals for InstantBook.
+- Changed polling interval for instant booking template.
+- Fixed admin toast leaking a raw `SyntaxError: Unexpected token '<'` when an upload was rejected
+  upstream (e.g. nginx 413); the toast now shows `HTTP <status>` instead.
+- Made the media upload max size configurable via the new `MEDIA_MAX_UPLOAD_SIZE_MB` env var.
+- Fixed playlist share-target dropdown silently truncating to 30 tenants; it now loads every page.
 - Refactored InteractiveController to use a typed `InteractiveSlideActionInput` DTO; regenerated API spec and RTK types.
 - Fixed multiple InstantBook bugs: interval boundary overlap, busy-interval timezone, per-resource spam-protect
   throttling, duration validation, error responses (409/4xx), resource cache TTL, and assorted

README.md

@@ -452,6 +452,7 @@ KEY_VAULT_SOURCE=ENVIRONMENT
 KEY_VAULT_JSON="{}"
 TRACK_SCREEN_INFO=false
 TRACK_SCREEN_INFO_UPDATE_INTERVAL_SECONDS=300
+MEDIA_MAX_UPLOAD_SIZE_MB=200
 ###< App ###
 ```
 
@@ -467,6 +468,15 @@ TRACK_SCREEN_INFO_UPDATE_INTERVAL_SECONDS=300
 - EVENTDATABASE_API_V2_CACHE_EXPIRE_SECONDS: What should the expire be for cache entries in EventDatabaseApiV2FeedType?
 - TRACK_SCREEN_INFO: Should screen info be tracked (true|false)?
 - TRACK_SCREEN_INFO_UPDATE_INTERVAL_SECONDS: How often (seconds) should the screen info be tracked from API requests?
+- MEDIA_MAX_UPLOAD_SIZE_MB: Maximum allowed size (in megabytes, binary MiB) for media uploads. Enforced inside
+  `App\Controller\Api\MediaController` and exposed to the Admin via `/config/admin` so the dropzone size check and
+  the displayed "Max-size" label stay aligned. Must also be aligned with the nginx body-size limit and the PHP-FPM
+  upload/post limits — see [Configuring media upload size limits](#configuring-media-upload-size-limits) below.
+
+  **Default**: `200`.
+
+  Changes are picked up on the next request once PHP-FPM workers see the new env value (in production, restart the
+  php-fpm container or reload the workers). The admin UI re-fetches `/config/admin` on the next page load.
 
 ### Admin configuration
 
@@ -588,6 +598,21 @@ CLIENT_DEBUG=false
 
   **Default**: Disabled.
 
+### Configuring media upload size limits
+
+The maximum size of an uploaded media file is enforced at three independent layers. They must be kept aligned —
+the strictest one wins, and when nginx or PHP-FPM rejects a request the user sees a generic 413 / network error
+rather than the friendly Symfony validator message. Keep them ordered as: **PHP-FPM ≥ nginx ≥ app**.
+
+| Layer | Knob | Where it lives |
+|---|---|---|
+| App (Symfony validator + Admin UI) | `MEDIA_MAX_UPLOAD_SIZE_MB` (megabytes, integer) | `.env` (committed default `200`) — override in `.env.local` for development or in the deployment environment for production |
+| Nginx request body | `NGINX_MAX_BODY_SIZE` (nginx size string, e.g. `200m`) | `docker-compose.yml` and `docker-compose.server.yml`; image default is `200m` (set in `infrastructure/nginx/Dockerfile`) |
+| PHP-FPM upload + post body | `PHP_UPLOAD_MAX_FILESIZE`, `PHP_POST_MAX_SIZE` (PHP size strings, e.g. `200M`) | Operator-managed env vars on the php-fpm container (supported by the `itkdev/php8.4-fpm` base image). Not set in this repo by default — base image defaults apply unless overridden |
+
+The app reads `MEDIA_MAX_UPLOAD_SIZE_MB` per-request, so a deploy / php-fpm worker reload is enough to pick up
+changes; no validator cache clear is needed.
+
 ### Other configuration options
 
 - See `docs/configuration/openid-connect.md` for configuration of OpenID Connect.
@@ -604,6 +629,21 @@ EVENTDATABASE_API_V2_CACHE_EXPIRE_SECONDS=300
 - EVENTDATABASE_API_V2_CACHE_EXPIRE_SECONDS: What should the expiration be for cache entries in
   EventDatabaseApiV2FeedType?
 
+#### InstantBook
+
+```dotenv
+###> InstantBook ###
+INSTANT_BOOK_BUSY_INTERVALS_SOURCE=graph
+###< InstantBook ###
+```
+
+- INSTANT_BOOK_BUSY_INTERVALS_SOURCE: Where the InstantBook interactive slide fetches resource
+  busy-intervals from.
+  - `graph`: Fetch busy intervals from Microsoft Graph (results cached for 15 minutes).
+  - `feed`: Fetch busy intervals from the slide's configured calendar-output feed.
+
+  **Default**: `graph`.
+
 ## Rest API & Relationships
 
 To avoid embedding all relations in REST representations but still allow the clients to minimize the amount of API calls

Taskfile.yml

@@ -217,7 +217,7 @@ tasks:
     desc: "Runs API tests (PHPUnit)."
     cmds:
       - task composer -- test-setup
-      - task compose -- exec --env SYMFONY_DEPRECATIONS_HELPER=disabled phpfpm vendor/bin/phpunit --stop-on-failure {{.CLI_ARGS}}
+      - task compose -- exec phpfpm vendor/bin/phpunit --stop-on-failure {{.CLI_ARGS}}
 
   test:frontend-built:
     desc: "Runs frontend tests (Playwright) on the built files. This temporarily stops the node container."

assets/admin/components/playlist/playlist-form.jsx

@@ -1,9 +1,11 @@
-import { useContext } from "react";
+import { useContext, useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
+import { useDispatch } from "react-redux";
 import { Alert } from "react-bootstrap";
 import UserContext from "../../context/user-context";
 import Schedule from "../util/schedule/schedule";
-import { useGetV2TenantsQuery } from "../../../shared/redux/enhanced-api.ts";
+import { enhancedApi } from "../../../shared/redux/enhanced-api.ts";
+import getAllPages from "../util/helpers/get-all-pages.js";
 import ContentBody from "../util/content-body/content-body";
 import TenantsDropdown from "../util/forms/multiselect-dropdown/tenants/tenants-dropdown";
 
@@ -24,10 +26,20 @@ function PlaylistForm({
 }) {
   const { t } = useTranslation("common", { keyPrefix: "playlist-form" });
   const context = useContext(UserContext);
+  const dispatch = useDispatch();
+  const [tenants, setTenants] = useState(null);
 
-  const { data: tenants } = useGetV2TenantsQuery({
-    itemsPerPage: 30,
-  });
+  useEffect(() => {
+    let cancelled = false;
+    getAllPages(dispatch, enhancedApi.endpoints.getV2Tenants, {
+      itemsPerPage: 30,
+    }).then((all) => {
+      if (!cancelled) setTenants(all);
+    });
+    return () => {
+      cancelled = true;
+    };
+  }, [dispatch]);
 
   return (
     <>
@@ -51,7 +63,7 @@ function PlaylistForm({
               name="tenants"
               handleTenantSelection={handleInput}
               selected={playlist.tenants}
-              data={tenants["hydra:member"].filter(({ tenantKey }) => {
+              data={tenants.filter(({ tenantKey }) => {
                 return context.selectedTenant.get.tenantKey !== tenantKey;
               })}
             />

assets/admin/components/slide/content/file-dropzone.jsx

@@ -5,14 +5,20 @@ import { useTranslation } from "react-i18next";
  * @param {object} props - The props.
  * @param {Function} props.onFilesAdded - Callback when files are added.
  * @param {Array | null} props.acceptedMimetypes - Mimetypes to accept.
+ * @param {number} props.maxSizeMb - Maximum allowed file size in megabytes.
  * @returns {object} Dropzone component.
  */
-function FileDropzone({ onFilesAdded, acceptedMimetypes = null }) {
+function FileDropzone({
+  onFilesAdded,
+  acceptedMimetypes = null,
+  maxSizeMb = 200,
+}) {
   const { t } = useTranslation("common");
 
-  // TODO: Make this configurable. It should always align with sizes in
-  // https://github.com/os2display/display-api-service/blob/develop/src/Entity/Tenant/Media.php
-  const allowedSize = 200000000;
+  // Use binary MiB so this threshold aligns with Symfony's `Assert\File`
+  // `maxSize: 'NM'` semantics — otherwise a file rejected backend-side could
+  // slip past the dropzone.
+  const allowedSize = maxSizeMb * 1024 * 1024;
 
   const fileValidator = (file) => {
     if (file.size > allowedSize) {
@@ -21,7 +27,7 @@ function FileDropzone({ onFilesAdded, acceptedMimetypes = null }) {
         code: "file-too-large",
         message: `${file.name} (${Math.floor(
           file.size / 1000000,
-        )} MB) ${largerThanText} (${allowedSize / 1000000} MB)`,
+        )} MB) ${largerThanText} (${maxSizeMb} MB)`,
       };
     }
 

assets/admin/components/slide/content/file-selector.jsx

@@ -1,9 +1,10 @@
-import { useState } from "react";
+import { useEffect, useState } from "react";
 import { Button } from "react-bootstrap";
 import { useTranslation } from "react-i18next";
 import MediaSelectorModal from "./media-selector-modal";
 import FileFormElement from "./file-form-element";
 import FileDropzone from "./file-dropzone";
+import AdminConfigLoader from "../../util/admin-config-loader";
 import "../../util/image-uploader/image-uploader.scss";
 
 /**
@@ -30,6 +31,19 @@ function FileSelector({
 }) {
   const { t } = useTranslation("common");
   const [showMediaModal, setShowMediaModal] = useState(false);
+  const [maxSizeMb, setMaxSizeMb] = useState(null);
+
+  useEffect(() => {
+    let cancelled = false;
+    AdminConfigLoader.loadConfig().then((config) => {
+      if (cancelled) return;
+      const value = config?.mediaMaxUploadSizeMb;
+      setMaxSizeMb(Number.isInteger(value) && value > 0 ? value : 200);
+    });
+    return () => {
+      cancelled = true;
+    };
+  }, []);
 
   const closeModal = () => {
     setShowMediaModal(false);
@@ -101,10 +115,17 @@ function FileSelector({
 
   return (
     <>
-      <FileDropzone
-        onFilesAdded={filesAdded}
-        acceptedMimetypes={acceptedMimetypes}
-      />
+      {maxSizeMb === null ? (
+        <div className="small mt-3 text-muted">
+          {t("file-selector.loading")}
+        </div>
+      ) : (
+        <FileDropzone
+          onFilesAdded={filesAdded}
+          acceptedMimetypes={acceptedMimetypes}
+          maxSizeMb={maxSizeMb}
+        />
+      )}
       {enableMediaLibrary && (
         <>
           <Button
@@ -114,13 +135,11 @@ function FileSelector({
           >
             {t("file-selector.open-media-library")}
           </Button>
-          {/*
-              TODO: Make this configurable. It should always align with sizes in
-              https://github.com/os2display/display-api-service/blob/develop/src/Entity/Tenant/Media.php
-          */}
-          <div className="small mt-3">
-            {t("file-selector.max-size")}: 200 MB
-          </div>
+          {maxSizeMb !== null && (
+            <div className="small mt-3">
+              {t("file-selector.max-size")}: {maxSizeMb} MB
+            </div>
+          )}
           <MediaSelectorModal
             selectedMedia={files}
             multiple={multiple}

assets/admin/components/util/admin-config-loader.js

@@ -1,3 +1,21 @@
+const DEFAULT_CONFIG = {
+  rejseplanenApiKey: null,
+  touchButtonRegions: false,
+  showScreenStatus: false,
+  enhancedPreview: false,
+  loginScreenText: "",
+  mediaMaxUploadSizeMb: 200,
+  loginMethods: [
+    {
+      type: "username-password",
+      enabled: true,
+      provider: "username-password",
+      label: null,
+      icon: null,
+    },
+  ],
+};
+
 let configData = null;
 let activePromise = null;
 
@@ -6,48 +24,25 @@ const AdminConfigLoader = {
     if (activePromise) {
       return activePromise;
     }
+    if (configData !== null) {
+      return configData;
+    }
 
-    activePromise = new Promise((resolve) => {
-      if (configData !== null) {
-        resolve(configData);
-      } else {
-        fetch("/config/admin")
-          .then((response) => response.json())
-          .then((data) => {
-            configData = data;
-            resolve(configData);
-          })
-          .catch(() => {
-            if (configData !== null) {
-              resolve(configData);
-            } else {
-              // eslint-disable-next-line no-console
-              console.error("Could not load config. Will use default config.");
-
-              // Default config.
-              resolve({
-                rejseplanenApiKey: null,
-                touchButtonRegions: false,
-                showScreenStatus: false,
-                enhancedPreview: false,
-                loginScreenText: "",
-                loginMethods: [
-                  {
-                    type: "username-password",
-                    enabled: true,
-                    provider: "username-password",
-                    label: null,
-                    icon: null,
-                  },
-                ],
-              });
-            }
-          })
-          .finally(() => {
-            activePromise = null;
-          });
-      }
-    });
+    activePromise = fetch("/config/admin")
+      .then((response) => response.json())
+      .then((data) => {
+        configData = data;
+        return configData;
+      })
+      .catch(() => {
+        // eslint-disable-next-line no-console
+        console.error("Could not load config. Will use default config.");
+        configData = DEFAULT_CONFIG;
+        return configData;
+      })
+      .finally(() => {
+        activePromise = null;
+      });
 
     return activePromise;
   },

assets/admin/components/util/list/toast-component/display-toast.jsx

@@ -27,10 +27,19 @@ export function displayError(errorString, error) {
   if (error && error["hydra:description"]) {
     errorText = error["hydra:description"];
   }
-  if (error && error.data) {
-    errorText = error.data["hydra:description"] || error.data.message;
+  if (error?.data && typeof error.data === "object") {
+    errorText = error.data["hydra:description"] || error.data.message || "";
   }
-  if (error && error.error) {
+  // RTK Query couldn't JSON-parse the response — typically an HTML error page
+  // from nginx/php-fpm rejecting the request before Symfony (e.g. 413 when the
+  // upload exceeds the proxy body-size limit). Show the HTTP status instead
+  // of leaking the "Unexpected token '<'" SyntaxError to the user.
+  if (!errorText && error?.status === "PARSING_ERROR") {
+    errorText = error.originalStatus
+      ? `HTTP ${error.originalStatus}`
+      : "Server returned an unexpected response";
+  }
+  if (!errorText && error?.error) {
     errorText = error.error;
   }