feat: PublishingShell create a site (#4959)

WebUI/src/main/ts/i18n/message.ts

@@ -198,6 +198,22 @@ export const MSG = {
     "perc.ui.publish.modern@Could not copy location",
   PUBLISH_COPY_DISMISS: "perc.ui.publish.modern@Dismiss",
   PUBLISH_EMPTY_SITES: "perc.ui.publish.modern@No Sites",
+  PUBLISH_EMPTY_SITES_NEXT:
+    "perc.ui.publish.modern@Create a site, then return here to configure publish servers.",
+  PUBLISH_EMPTY_SITES_FILTER_NEXT:
+    "perc.ui.publish.modern@No sites match this search. Clear the filter to see the full list.",
+  PUBLISH_CREATE_SITE: "perc.ui.publish.modern@Create site",
+  PUBLISH_CREATE_SITE_NAME: "perc.ui.publish.modern@Site name",
+  PUBLISH_CREATE_SITE_SAVE: "perc.ui.publish.modern@Create",
+  PUBLISH_CREATE_SITE_CANCEL: "perc.ui.publish.modern@Cancel",
+  PUBLISH_CREATE_SITE_DUPLICATE:
+    "perc.ui.publish.modern@A site with that name already exists",
+  PUBLISH_CREATE_SITE_INVALID: "perc.ui.publish.modern@Enter a valid site name",
+  PUBLISH_CREATE_SITE_FORBIDDEN:
+    "perc.ui.publish.modern@You are not allowed to create a site",
+  PUBLISH_CREATE_SITE_ERROR: "perc.ui.publish.modern@Could not create the site",
+  PUBLISH_CREATE_SITE_OPEN_FAILED:
+    "perc.ui.publish.modern@The site was created but could not be opened",
   PUBLISH_EMPTY_SERVERS: "perc.ui.publish.modern@No Servers",
   PUBLISH_EMPTY_JOBS: "perc.ui.publish.modern@No Active Jobs",
   PUBLISH_EMPTY_LOGS: "perc.ui.publish.modern@No Logs",

WebUI/src/main/ts/publishing/components/CreateSitePanel.tsx

@@ -0,0 +1,130 @@
+/*
+ * Copyright (c) 2026 Intersoft Data Labs, Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import React, { useRef, useState } from "react";
+import { isApiError } from "../../api/client";
+import {
+  createSite,
+  isSiteCreateReady,
+  normalizeSiteName,
+} from "../../api/developer/sitesApi";
+import type { SiteDef } from "../../api/developer/types";
+import { message, MSG } from "../../i18n/message";
+import { buttonStyle, errorStyle, primaryButtonStyle } from "../publishing.styles";
+
+function createErrorMessage(err: unknown): string {
+  if (isApiError(err)) {
+    if (err.status === 409) {
+      return message(MSG.PUBLISH_CREATE_SITE_DUPLICATE);
+    }
+    if (err.status === 400) {
+      return message(MSG.PUBLISH_CREATE_SITE_INVALID);
+    }
+    if (err.status === 403) {
+      return message(MSG.PUBLISH_CREATE_SITE_FORBIDDEN);
+    }
+  }
+  return message(MSG.PUBLISH_CREATE_SITE_ERROR);
+}
+
+function namesMatch(left: string, right: string | undefined): boolean {
+  return normalizeSiteName(left).toLowerCase() === (right ?? "").trim().toLowerCase();
+}
+
+export function CreateSitePanel({
+  existingNames,
+  onCancel,
+  onCreated,
+}: {
+  existingNames: readonly string[];
+  onCancel: () => void;
+  onCreated: (created: SiteDef) => void;
+}): React.ReactElement {
+  const [name, setName] = useState("");
+  const [error, setError] = useState<string | null>(null);
+  const [busy, setBusy] = useState(false);
+  const inflight = useRef(false);
+  const ready = !busy && isSiteCreateReady({ name });
+
+  async function handleCreate(): Promise<void> {
+    if (!ready || inflight.current) {
+      return;
+    }
+    const normalized = normalizeSiteName(name);
+    if (existingNames.some((existing) => namesMatch(normalized, existing))) {
+      setError(message(MSG.PUBLISH_CREATE_SITE_DUPLICATE));
+      return;
+    }
+    inflight.current = true;
+    setBusy(true);
+    setError(null);
+    try {
+      const saved = await createSite({ name: normalized });
+      const savedName = normalizeSiteName(saved.name ?? "");
+      if (!savedName) {
+        setError(message(MSG.PUBLISH_CREATE_SITE_ERROR));
+        return;
+      }
+      onCreated({ ...saved, name: savedName });
+    } catch (err: unknown) {
+      setError(createErrorMessage(err));
+    } finally {
+      inflight.current = false;
+      setBusy(false);
+    }
+  }
+
+  return (
+    <div data-testid="publish-site-create" role="dialog" aria-label={message(MSG.PUBLISH_CREATE_SITE)}>
+      {error ? (
+        <p role="alert" data-testid="publish-site-create-error" style={errorStyle}>
+          {error}
+        </p>
+      ) : null}
+      <label htmlFor="publish-site-create-name">{message(MSG.PUBLISH_CREATE_SITE_NAME)}</label>
+      <input
+        id="publish-site-create-name"
+        data-testid="publish-site-create-name"
+        value={name}
+        disabled={busy}
+        autoComplete="off"
+        onChange={(e) => setName(e.target.value)}
+        style={{ padding: "6px 10px", minWidth: 200, display: "block", margin: "6px 0 12px" }}
+      />
+      <div style={{ display: "flex", gap: 8 }}>
+        <button
+          type="button"
+          data-testid="publish-site-create-save"
+          style={primaryButtonStyle}
+          disabled={!ready}
+          onClick={() => void handleCreate()}
+        >
+          {message(MSG.PUBLISH_CREATE_SITE_SAVE)}
+        </button>
+        <button
+          type="button"
+          data-testid="publish-site-create-cancel"
+          style={buttonStyle}
+          disabled={busy}
+          onClick={onCancel}
+        >
+          {message(MSG.PUBLISH_CREATE_SITE_CANCEL)}
+        </button>
+      </div>
+    </div>
+  );
+}

WebUI/src/main/ts/publishing/components/EmptyState.tsx

@@ -23,6 +23,7 @@ export interface EmptyStateProps {
   nextAction?: string;
   actionLabel?: string;
   onAction?: () => void;
+  actionTestId?: string;
   testId?: string;
 }
 
@@ -32,6 +33,7 @@ export function EmptyState({
   nextAction,
   actionLabel,
   onAction,
+  actionTestId,
   testId = "publish-empty-state",
 }: EmptyStateProps): React.ReactElement {
   return (
@@ -41,7 +43,12 @@ export function EmptyState({
         <p style={{ margin: "0 0 12px", color: "#555" }}>{nextAction}</p>
       )}
       {actionLabel && onAction && (
-        <button type="button" style={primaryButtonStyle} onClick={onAction}>
+        <button
+          type="button"
+          style={primaryButtonStyle}
+          onClick={onAction}
+          data-testid={actionTestId}
+        >
           {actionLabel}
         </button>
       )}

WebUI/src/main/ts/publishing/sections/SitesSection.tsx

@@ -18,7 +18,9 @@
 import React, { useEffect, useMemo, useState } from "react";
 import { fetchSites } from "../../api/home/homeApi";
 import type { SiteSummary } from "../../api/home/types";
+import type { SiteDef } from "../../api/developer/types";
 import { message, MSG } from "../../i18n/message";
+import { CreateSitePanel } from "../components/CreateSitePanel";
 import { EmptyState } from "../components/EmptyState";
 import {
   buttonStyle,
@@ -47,9 +49,16 @@ function toPublishSite(s: SiteSummary): PublishSiteSummary {
     name: s.name,
     id: s.id,
     siteId: s.siteId ?? s.id,
+    folderPath: s.folderPath,
   };
 }
 
+/** Publish-server APIs require a numeric site id, not the site name. */
+function hasNumericSiteId(site: PublishSiteSummary): boolean {
+  const raw = site.siteId ?? site.id;
+  return raw != null && /^\d+$/.test(String(raw).trim());
+}
+
 export function SitesSection({
   initialSiteId = "",
   initialServerId = "",
@@ -62,6 +71,7 @@ export function SitesSection({
   const [loading, setLoading] = useState(true);
   const [error, setError] = useState<string | null>(null);
   const [selectedKey, setSelectedKey] = useState(initialSiteId);
+  const [creating, setCreating] = useState(false);
 
   useEffect(() => {
     let cancelled = false;
@@ -99,6 +109,31 @@ export function SitesSection({
     [sites, selectedKey],
   );
 
+  async function openCreatedSite(created: SiteDef): Promise<void> {
+    const name = (created.name ?? "").trim();
+    if (!name) {
+      setError(message(MSG.PUBLISH_CREATE_SITE_ERROR));
+      return;
+    }
+    try {
+      const list = (await fetchSites()).map(toPublishSite);
+      setSites(list);
+      const match = list.find(
+        (site) => site.name.toLowerCase() === name.toLowerCase(),
+      );
+      if (!match || !hasNumericSiteId(match)) {
+        setCreating(false);
+        setError(message(MSG.PUBLISH_CREATE_SITE_OPEN_FAILED));
+        return;
+      }
+      setError(null);
+      setCreating(false);
+      setSelectedKey(siteKey(match));
+    } catch {
+      setError(message(MSG.PUBLISH_CREATE_SITE_OPEN_FAILED));
+    }
+  }
+
   if (selectedSite) {
     return (
       <SiteWorkspace
@@ -126,6 +161,14 @@ export function SitesSection({
             style={{ padding: "6px 10px", minWidth: 200 }}
           />
         </label>
+        <button
+          type="button"
+          style={buttonStyle}
+          data-testid="publish-sites-create"
+          onClick={() => setCreating(true)}
+        >
+          {message(MSG.PUBLISH_CREATE_SITE)}
+        </button>
         <button
           type="button"
           style={buttonStyle}
@@ -142,6 +185,14 @@ export function SitesSection({
         </button>
       </div>
 
+      {creating && (
+        <CreateSitePanel
+          existingNames={sites.map((site) => site.name)}
+          onCancel={() => setCreating(false)}
+          onCreated={openCreatedSite}
+        />
+      )}
+
       {loading && <p>{message(MSG.PUBLISH_LOADING)}</p>}
       {error && (
         <p style={errorStyle} role="alert">
@@ -153,9 +204,12 @@ export function SitesSection({
           title={message(MSG.PUBLISH_EMPTY_SITES)}
           nextAction={
             filter.trim()
-              ? "No sites match this search. Clear the filter to see the full list."
-              : "Create or import a site, then return here to configure publish servers."
+              ? message(MSG.PUBLISH_EMPTY_SITES_FILTER_NEXT)
+              : message(MSG.PUBLISH_EMPTY_SITES_NEXT)
           }
+          actionLabel={message(MSG.PUBLISH_CREATE_SITE)}
+          onAction={() => setCreating(true)}
+          actionTestId="publish-empty-sites-create"
           testId={
             filter.trim() ? "publish-empty-sites-filter" : "publish-empty-sites"
           }