fix: keep validation report after closing publish

apps/builder/app/builder/features/publish/publish-progress.test.tsx

@@ -7,6 +7,7 @@ import type { Project } from "@webstudio-is/project";
 import { $publishDialog } from "~/builder/shared/nano-states";
 import { $project } from "~/shared/sync/data-stores";
 import { __testing__ } from "./publish";
+import { PublishValidationResults } from "./publish-validation-results";
 
 const {
   usePublishProgress,
@@ -865,6 +866,50 @@ test("an older validation cannot replace newer findings", () => {
   expect(container.querySelector("output")?.textContent).toBe("new");
 });
 
+test("manual validation report stays available after the popover reopens", () => {
+  const Harness = () => {
+    const [isOpen, setIsOpen] = useState(true);
+    const { manualValidationFindings } = usePublishProgress("project");
+    return (
+      <>
+        <button onClick={() => setIsOpen(false)}>Close</button>
+        <button onClick={() => setIsOpen(true)}>Reopen</button>
+        <button
+          onClick={() => {
+            const session = manualValidationFindings.begin();
+            manualValidationFindings.update(session, [
+              { severity: "warning", title: "Check", reportText: "Check" },
+            ]);
+          }}
+        >
+          Validate
+        </button>
+        {isOpen && (
+          <PublishValidationResults
+            findings={manualValidationFindings.findings}
+          />
+        )}
+      </>
+    );
+  };
+
+  container = document.createElement("div");
+  document.body.appendChild(container);
+  root = createRoot(container);
+  act(() => root?.render(<Harness />));
+  const [close, reopen, validate] = container.querySelectorAll("button");
+  act(() => validate.click());
+  expect(container.textContent).toContain("Publish check found 1 warning.");
+  act(() => close.click());
+  act(() => reopen.click());
+  expect(container.textContent).toContain("Publish check found 1 warning.");
+  expect(
+    [...container.querySelectorAll("button")].some(
+      (button) => button.textContent === "See issues"
+    )
+  ).toBe(true);
+});
+
 test("a rejected request after project navigation shows a toast", async () => {
   $project.set({ id: "old-project" } as Project);
   $publishDialog.set("publish");

apps/builder/app/builder/features/publish/publish.tsx

@@ -574,6 +574,7 @@ const STATUS_REFRESH_RETRY_DELAY = 5_000;
 const STATUS_REFRESH_MAX_ATTEMPTS = 3;
 
 const usePublishProgress = (projectId: Project["id"]) => {
+  const manualValidationFindings = useManualValidationFindings();
   const [startedAt, setStartedAt] = useState<number>();
   const [showCountdown, setShowCountdown] = useState(false);
   const [isPublishing, setIsPublishing] = useState(false);
@@ -721,6 +722,7 @@ const usePublishProgress = (projectId: Project["id"]) => {
   };
 
   return {
+    manualValidationFindings,
     isPublishing,
     requestError,
     publishFindings,
@@ -903,6 +905,7 @@ const Publish = ({
   onValidationStateChange,
   isPublishing,
   requestError,
+  manualValidationFindings,
   publishFindings,
   setPublishFindings,
   publishError,
@@ -922,6 +925,7 @@ const Publish = ({
   onValidationStateChange: (state: PublishValidationState) => void;
   isPublishing: boolean;
   requestError: string | undefined;
+  manualValidationFindings: ReturnType<typeof useManualValidationFindings>;
   publishFindings: PublishValidationFinding[];
   setPublishFindings: (findings: PublishValidationFinding[]) => void;
   publishError: JSX.Element | string | undefined;
@@ -933,7 +937,7 @@ const Publish = ({
   startPublishing: (publish: () => Promise<void>) => void;
 }) => {
   const { userPublishCount, maxDailyPublishesPerUser } = useUserPublishCount();
-  const validationFindings = useManualValidationFindings();
+  const validationFindings = manualValidationFindings;
   const { invalidate: invalidateValidationFindings } = validationFindings;
   const buttonRef = useRef<HTMLButtonElement>(null);
   const [hasSelectedDomains, setHasSelectedDomains] = useState(false);
@@ -1531,6 +1535,7 @@ const Content = (props: {
   onValidationStateChange: (state: PublishValidationState) => void;
   isPublishing: boolean;
   requestError: string | undefined;
+  manualValidationFindings: ReturnType<typeof useManualValidationFindings>;
   publishFindings: PublishValidationFinding[];
   setPublishFindings: (findings: PublishValidationFinding[]) => void;
   publishError: JSX.Element | string | undefined;
@@ -1659,6 +1664,7 @@ const Content = (props: {
             onValidationStateChange={props.onValidationStateChange}
             isPublishing={props.isPublishing}
             requestError={props.requestError}
+            manualValidationFindings={props.manualValidationFindings}
             publishFindings={props.publishFindings}
             setPublishFindings={props.setPublishFindings}
             publishError={props.publishError}
@@ -2020,6 +2026,7 @@ export const PublishButton = ({ projectId }: PublishProps) => {
             onValidationStateChange={update}
             isPublishing={publishProgress.isPublishing}
             requestError={publishProgress.requestError}
+            manualValidationFindings={publishProgress.manualValidationFindings}
             publishFindings={publishProgress.publishFindings}
             setPublishFindings={publishProgress.setPublishFindings}
             publishError={publishProgress.publishError}