From 1da5c5ff12b7b024a392b167c10fcb190d4bd599 Mon Sep 17 00:00:00 2001
From: Shyam Kumar <shyam.kumar@justwatch.com>
Date: Mon, 18 May 2026 23:10:10 +0200
Subject: [PATCH 1/4] add org name to the setup step

---
 pkg/public/setup_owner.go                     |  7 +++++-
 web_src/src/pages/auth/OwnerSetup.tsx         |  4 ++++
 .../src/pages/auth/ownerSetup/OwnerStep.tsx   | 22 +++++++++++++++++++
 3 files changed, 32 insertions(+), 1 deletion(-)

diff --git a/pkg/public/setup_owner.go b/pkg/public/setup_owner.go
index 08c95fa0b8..2a680d090f 100644
--- a/pkg/public/setup_owner.go
+++ b/pkg/public/setup_owner.go
@@ -24,6 +24,7 @@ type SetupOwnerRequest struct {
 	FirstName                 string `json:"first_name"`
 	LastName                  string `json:"last_name"`
 	Password                  string `json:"password"`
+	OrganizationName          string `json:"organization_name"`
 	SMTPEnabled               bool   `json:"smtp_enabled"`
 	SMTPHost                  string `json:"smtp_host"`
 	SMTPPort                  int    `json:"smtp_port"`
@@ -62,6 +63,10 @@ func (s *Server) setupOwner(w http.ResponseWriter, r *http.Request) {
 		return
 	}
 
+	if req.OrganizationName == "" {
+		req.OrganizationName = "Demo"
+	}
+
 	if req.SMTPEnabled {
 		if req.SMTPHost == "" || req.SMTPPort == 0 || req.SMTPFromEmail == "" {
 			http.Error(w, "SMTP host, port, and from email are required", http.StatusBadRequest)
@@ -110,7 +115,7 @@ func (s *Server) setupOwner(w http.ResponseWriter, r *http.Request) {
 			return err
 		}
 
-		organization, err = models.CreateOrganizationInTransaction(tx, "Demo", "")
+		organization, err = models.CreateOrganizationInTransaction(tx, req.OrganizationName, "")
 		if err != nil {
 			return err
 		}
diff --git a/web_src/src/pages/auth/OwnerSetup.tsx b/web_src/src/pages/auth/OwnerSetup.tsx
index d09a426d1e..84a304e8e5 100644
--- a/web_src/src/pages/auth/OwnerSetup.tsx
+++ b/web_src/src/pages/auth/OwnerSetup.tsx
@@ -10,6 +10,7 @@ const OWNER_SETUP_SURVEY_NAME = "Owner Setup Survey";
 
 const OwnerSetup: React.FC = () => {
   const [email, setEmail] = useState("");
+  const [organizationName, setOrganizationName] = useState("Demo");
   const [firstName, setFirstName] = useState("");
   const [lastName, setLastName] = useState("");
   const [password, setPassword] = useState("");
@@ -115,6 +116,7 @@ const OwnerSetup: React.FC = () => {
         credentials: "include",
         body: JSON.stringify({
           email: email.trim(),
+          organization_name: organizationName.trim(),
           first_name: firstName.trim(),
           last_name: lastName.trim(),
           password,
@@ -233,6 +235,7 @@ const OwnerSetup: React.FC = () => {
         {step === "owner" && (
           <OwnerStep
             email={email}
+            organizationName={organizationName}
             firstName={firstName}
             lastName={lastName}
             password={password}
@@ -241,6 +244,7 @@ const OwnerSetup: React.FC = () => {
             error={error}
             fieldErrors={fieldErrors}
             onEmailChange={setEmail}
+            onOrganizationNameChange={setOrganizationName}
             onFirstNameChange={setFirstName}
             onLastNameChange={setLastName}
             onPasswordChange={setPassword}
diff --git a/web_src/src/pages/auth/ownerSetup/OwnerStep.tsx b/web_src/src/pages/auth/ownerSetup/OwnerStep.tsx
index 5cb4e0afb6..422b7abe73 100644
--- a/web_src/src/pages/auth/ownerSetup/OwnerStep.tsx
+++ b/web_src/src/pages/auth/ownerSetup/OwnerStep.tsx
@@ -8,6 +8,7 @@ import { ErrorBanner } from "./ErrorBanner";
 
 type OwnerStepProps = {
   email: string;
+  organizationName: string;
   firstName: string;
   lastName: string;
   password: string;
@@ -16,6 +17,7 @@ type OwnerStepProps = {
   error: string | null;
   fieldErrors: Record<string, string>;
   onEmailChange: (value: string) => void;
+  onOrganizationNameChange: (value: string) => void;
   onFirstNameChange: (value: string) => void;
   onLastNameChange: (value: string) => void;
   onPasswordChange: (value: string) => void;
@@ -25,6 +27,7 @@ type OwnerStepProps = {
 
 export const OwnerStep: React.FC<OwnerStepProps> = ({
   email,
+  organizationName,
   firstName,
   lastName,
   password,
@@ -33,6 +36,7 @@ export const OwnerStep: React.FC<OwnerStepProps> = ({
   error,
   fieldErrors,
   onEmailChange,
+  onOrganizationNameChange,
   onFirstNameChange,
   onLastNameChange,
   onPasswordChange,
@@ -47,6 +51,24 @@ export const OwnerStep: React.FC<OwnerStepProps> = ({
     </div>
     <form onSubmit={onNext} className="space-y-4">
       <ErrorBanner message={error} />
+      <div>
+        <Label className="mb-2 block text-left">
+          Organization Name
+        </Label>
+        <InputGroup>
+          <Input
+            type="text"
+            value={organizationName}
+            onChange={(event) => onOrganizationNameChange(event.target.value)}
+            placeholder="Acme Inc."
+            autoComplete="organization"
+            className={fieldErrors.organizationName ? "border-red-500" : ""}
+          />
+        </InputGroup>
+        {fieldErrors.organizationName && (
+          <p className="mt-1 text-xs text-red-600 dark:text-red-400">{fieldErrors.organizationName}</p>
+        )}
+      </div>
       <div className="grid grid-cols-1 gap-4 sm:grid-cols-2">
         <div>
           <Label className="mb-2 block text-left">

From 3661d63069fb3c0de1cfc44669cd76cd6741a26c Mon Sep 17 00:00:00 2001
From: Shyam Kumar <shyam.kumar@justwatch.com>
Date: Mon, 18 May 2026 23:14:46 +0200
Subject: [PATCH 2/4] add tests for backend

---
 pkg/public/setup_owner_test.go | 1 +
 test/e2e/owner_setup_test.go   | 5 +++--
 2 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/pkg/public/setup_owner_test.go b/pkg/public/setup_owner_test.go
index ee14b2d84f..5d2167b206 100644
--- a/pkg/public/setup_owner_test.go
+++ b/pkg/public/setup_owner_test.go
@@ -43,6 +43,7 @@ func TestSetupOwnerPersistsInstallationNetworkSettings(t *testing.T) {
 		FirstName:                 "Owner",
 		LastName:                  "User",
 		Password:                  "Password1",
+		OrganizationName:          "Test Org",
 		AllowPrivateNetworkAccess: true,
 	})
 	require.NoError(t, err)
diff --git a/test/e2e/owner_setup_test.go b/test/e2e/owner_setup_test.go
index f9fde8b3b9..11db17438f 100644
--- a/test/e2e/owner_setup_test.go
+++ b/test/e2e/owner_setup_test.go
@@ -148,6 +148,7 @@ func (s *ownerSetupSteps) finishOwnerSetupWithoutSMTP() {
 }
 
 func (s *ownerSetupSteps) fillInOwnerDetails(email, firstName, lastName, password string) {
+	s.session.FillIn(q.Locator(`input[placeholder="Acme Inc."]`), "Test Org")
 	s.session.FillIn(q.Locator(`input[type="email"]`), email)
 	s.session.FillIn(q.Locator(`input[placeholder="First name"]`), firstName)
 	s.session.FillIn(q.Locator(`input[placeholder="Last name"]`), lastName)
@@ -227,8 +228,8 @@ func (s *ownerSetupSteps) assertOwnerAndOrganizationCreated() {
 	assert.NoError(s.t, err, "count organizations")
 	assert.Equal(s.t, int64(1), accountsCount, "expected exactly one account to be created")
 
-	org, err := models.FindOrganizationByName("Demo")
-	assert.NoError(s.t, err, "find organization Demo")
+	org, err := models.FindOrganizationByName("Test Org")
+	assert.NoError(s.t, err, "find organization Test Org")
 
 	s.orgID = org.ID.String()
 }

From 315875b46aa553998ba3520721fbd315c57a994f Mon Sep 17 00:00:00 2001
From: Shyam Kumar <shyam.kumar@justwatch.com>
Date: Mon, 18 May 2026 23:35:21 +0200
Subject: [PATCH 3/4] try to fix ui tests

---
 web_src/src/test/setup.ts | 8 ++++++++
 1 file changed, 8 insertions(+)

diff --git a/web_src/src/test/setup.ts b/web_src/src/test/setup.ts
index d0de870dc5..8da51dcd7f 100644
--- a/web_src/src/test/setup.ts
+++ b/web_src/src/test/setup.ts
@@ -1 +1,9 @@
 import "@testing-library/jest-dom";
+
+class ResizeObserverMock {
+  observe() {}
+  unobserve() {}
+  disconnect() {}
+}
+
+global.ResizeObserver = ResizeObserverMock;

From 1384ed71dd1a43d2e960f634325c4992178fff8d Mon Sep 17 00:00:00 2001
From: Shyam Kumar <shyam.kumar@justwatch.com>
Date: Mon, 18 May 2026 23:37:41 +0200
Subject: [PATCH 4/4] add tests

---
 web_src/src/pages/auth/OwnerSetup.spec.tsx    | 293 ++++++++++++++++++
 .../src/pages/auth/ownerSetup/OwnerStep.tsx   |   2 +-
 2 files changed, 294 insertions(+), 1 deletion(-)
 create mode 100644 web_src/src/pages/auth/OwnerSetup.spec.tsx

diff --git a/web_src/src/pages/auth/OwnerSetup.spec.tsx b/web_src/src/pages/auth/OwnerSetup.spec.tsx
new file mode 100644
index 0000000000..1097041846
--- /dev/null
+++ b/web_src/src/pages/auth/OwnerSetup.spec.tsx
@@ -0,0 +1,293 @@
+import { render, screen, waitFor } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { beforeEach, describe, expect, it, vi } from "vitest";
+import OwnerSetup from "./OwnerSetup";
+
+vi.mock("@/posthog", () => ({
+  isPostHogEnabled: false,
+  posthog: { getActiveMatchingSurveys: vi.fn() },
+}));
+
+const mockFetch = vi.fn();
+vi.stubGlobal("fetch", mockFetch);
+
+const mockLocationAssign = vi.fn();
+Object.defineProperty(window, "location", {
+  value: { set href(url: string) { mockLocationAssign(url); } },
+  writable: true,
+});
+
+type User = ReturnType<typeof userEvent.setup>;
+
+async function fillOwnerForm(
+  user: User,
+  overrides: { organizationName?: string; email?: string } = {},
+) {
+  const orgInput = screen.getByPlaceholderText("Acme Inc.");
+  await user.clear(orgInput);
+  await user.type(orgInput, overrides.organizationName ?? "Acme Corp");
+  await user.type(screen.getByPlaceholderText("First name"), "Jane");
+  await user.type(screen.getByPlaceholderText("Last name"), "Doe");
+  await user.type(screen.getByPlaceholderText("you@example.com"), overrides.email ?? "jane@example.com");
+  await user.type(screen.getByPlaceholderText("Password"), "Password1");
+  await user.type(screen.getByPlaceholderText("Confirm password"), "Password1");
+}
+
+async function advanceToSmtpPrompt(user: User) {
+  await fillOwnerForm(user);
+  await user.click(screen.getByRole("button", { name: "Next" }));
+  await screen.findByText("Private network access");
+  await user.click(screen.getByRole("button", { name: "Next" }));
+  await screen.findByText("Set up email delivery?");
+}
+
+async function advanceToSmtpConfig(user: User) {
+  await advanceToSmtpPrompt(user);
+  await user.click(screen.getByRole("button", { name: "Set up SMTP" }));
+  await screen.findByText("SMTP configuration");
+}
+
+describe("OwnerSetup", () => {
+  beforeEach(() => {
+    mockFetch.mockReset();
+    mockLocationAssign.mockReset();
+  });
+
+  describe("owner step", () => {
+    it("renders with Organization Name defaulting to Demo", () => {
+      render(<OwnerSetup />);
+      expect(screen.getByPlaceholderText("Acme Inc.")).toHaveValue("Demo");
+    });
+
+    it("shows validation errors when required fields are empty", async () => {
+      const user = userEvent.setup();
+      render(<OwnerSetup />);
+      await user.click(screen.getByRole("button", { name: "Next" }));
+      expect(await screen.findByText("Email is required.")).toBeInTheDocument();
+      expect(screen.getByText("First name is required.")).toBeInTheDocument();
+      expect(screen.getByText("Last name is required.")).toBeInTheDocument();
+      expect(screen.getByText("Password is required.")).toBeInTheDocument();
+    });
+
+    it("shows invalid email error", async () => {
+      const user = userEvent.setup();
+      render(<OwnerSetup />);
+      await user.type(screen.getByPlaceholderText("you@example.com"), "not-an-email");
+      await user.click(screen.getByRole("button", { name: "Next" }));
+      expect(await screen.findByText("Please enter a valid email address.")).toBeInTheDocument();
+    });
+
+    it("shows password strength error", async () => {
+      const user = userEvent.setup();
+      render(<OwnerSetup />);
+      await user.type(screen.getByPlaceholderText("Password"), "weak");
+      await user.click(screen.getByRole("button", { name: "Next" }));
+      expect(
+        await screen.findByText("Password must be 8+ characters with at least 1 number and 1 capital letter."),
+      ).toBeInTheDocument();
+    });
+
+    it("shows error when passwords do not match", async () => {
+      const user = userEvent.setup();
+      render(<OwnerSetup />);
+      await user.type(screen.getByPlaceholderText("Password"), "Password1");
+      await user.type(screen.getByPlaceholderText("Confirm password"), "Different1");
+      await user.click(screen.getByRole("button", { name: "Next" }));
+      expect(await screen.findByText("Passwords do not match.")).toBeInTheDocument();
+    });
+
+    it("advances to private network step when form is valid", async () => {
+      const user = userEvent.setup();
+      render(<OwnerSetup />);
+      await fillOwnerForm(user);
+      await user.click(screen.getByRole("button", { name: "Next" }));
+      expect(await screen.findByText("Private network access")).toBeInTheDocument();
+    });
+  });
+
+  describe("private network step", () => {
+    it("goes back to owner step", async () => {
+      const user = userEvent.setup();
+      render(<OwnerSetup />);
+      await fillOwnerForm(user);
+      await user.click(screen.getByRole("button", { name: "Next" }));
+      await screen.findByText("Private network access");
+      await user.click(screen.getByRole("button", { name: "Back" }));
+      expect(await screen.findByText("Set up owner account")).toBeInTheDocument();
+    });
+
+    it("advances to SMTP prompt step", async () => {
+      const user = userEvent.setup();
+      render(<OwnerSetup />);
+      await fillOwnerForm(user);
+      await user.click(screen.getByRole("button", { name: "Next" }));
+      await screen.findByText("Private network access");
+      await user.click(screen.getByRole("button", { name: "Next" }));
+      expect(await screen.findByText("Set up email delivery?")).toBeInTheDocument();
+    });
+  });
+
+  describe("SMTP prompt step", () => {
+    it("submits without SMTP when skipped and redirects", async () => {
+      mockFetch.mockResolvedValue({ ok: true, json: async () => ({ organization_id: "org-123" }) });
+      const user = userEvent.setup();
+      render(<OwnerSetup />);
+      await advanceToSmtpPrompt(user);
+      await user.click(screen.getByRole("button", { name: "Do this later" }));
+      await waitFor(() => expect(mockLocationAssign).toHaveBeenCalledWith("/org-123"));
+    });
+
+    it("advances to SMTP config when Set up SMTP is clicked", async () => {
+      const user = userEvent.setup();
+      render(<OwnerSetup />);
+      await advanceToSmtpPrompt(user);
+      await user.click(screen.getByRole("button", { name: "Set up SMTP" }));
+      expect(await screen.findByText("SMTP configuration")).toBeInTheDocument();
+    });
+
+    it("goes back to private network step", async () => {
+      const user = userEvent.setup();
+      render(<OwnerSetup />);
+      await advanceToSmtpPrompt(user);
+      await user.click(screen.getByRole("button", { name: "Back" }));
+      expect(await screen.findByText("Private network access")).toBeInTheDocument();
+    });
+  });
+
+  describe("SMTP config step", () => {
+    it("shows validation errors for missing required SMTP fields", async () => {
+      const user = userEvent.setup();
+      render(<OwnerSetup />);
+      await advanceToSmtpConfig(user);
+      await user.click(screen.getByRole("button", { name: "Finish setup" }));
+      expect(await screen.findByText("SMTP host is required.")).toBeInTheDocument();
+      expect(screen.getByText("SMTP port is required.")).toBeInTheDocument();
+      expect(screen.getByText("SMTP from email is required.")).toBeInTheDocument();
+    });
+
+    it("shows error when SMTP port is not a number", async () => {
+      const user = userEvent.setup();
+      render(<OwnerSetup />);
+      await advanceToSmtpConfig(user);
+      await user.type(screen.getByPlaceholderText("smtp.example.com"), "smtp.example.com");
+      await user.type(screen.getByPlaceholderText("587"), "abc");
+      await user.type(screen.getByPlaceholderText("noreply@example.com"), "noreply@example.com");
+      await user.click(screen.getByRole("button", { name: "Finish setup" }));
+      expect(await screen.findByText("SMTP port must be a number.")).toBeInTheDocument();
+    });
+
+    it("shows error when username provided without password", async () => {
+      const user = userEvent.setup();
+      render(<OwnerSetup />);
+      await advanceToSmtpConfig(user);
+      await user.type(screen.getByPlaceholderText("smtp.example.com"), "smtp.example.com");
+      await user.type(screen.getByPlaceholderText("587"), "587");
+      await user.type(screen.getByPlaceholderText("smtp-user"), "user");
+      await user.type(screen.getByPlaceholderText("noreply@example.com"), "noreply@example.com");
+      await user.click(screen.getByRole("button", { name: "Finish setup" }));
+      expect(
+        await screen.findByText("SMTP password is required when username is provided."),
+      ).toBeInTheDocument();
+    });
+
+    it("submits with SMTP config and redirects", async () => {
+      mockFetch.mockResolvedValue({ ok: true, json: async () => ({ organization_id: "org-456" }) });
+      const user = userEvent.setup();
+      render(<OwnerSetup />);
+      await advanceToSmtpConfig(user);
+      await user.type(screen.getByPlaceholderText("smtp.example.com"), "smtp.example.com");
+      await user.type(screen.getByPlaceholderText("587"), "587");
+      await user.type(screen.getByPlaceholderText("noreply@example.com"), "noreply@example.com");
+      await user.click(screen.getByRole("button", { name: "Finish setup" }));
+      await waitFor(() => expect(mockLocationAssign).toHaveBeenCalledWith("/org-456"));
+    });
+
+    it("can skip SMTP from the config step", async () => {
+      mockFetch.mockResolvedValue({ ok: true, json: async () => ({ organization_id: "org-789" }) });
+      const user = userEvent.setup();
+      render(<OwnerSetup />);
+      await advanceToSmtpConfig(user);
+      await user.click(screen.getByRole("button", { name: "Do this later" }));
+      await waitFor(() => expect(mockLocationAssign).toHaveBeenCalledWith("/org-789"));
+    });
+
+    it("goes back to SMTP prompt", async () => {
+      const user = userEvent.setup();
+      render(<OwnerSetup />);
+      await advanceToSmtpConfig(user);
+      await user.click(screen.getByRole("button", { name: "Back" }));
+      expect(await screen.findByText("Set up email delivery?")).toBeInTheDocument();
+    });
+  });
+
+  describe("API submission", () => {
+    it("sends organization_name in the request body", async () => {
+      mockFetch.mockResolvedValue({ ok: true, json: async () => ({ organization_id: "org-123" }) });
+      const user = userEvent.setup();
+      render(<OwnerSetup />);
+      await fillOwnerForm(user, { organizationName: "My Company" });
+      await user.click(screen.getByRole("button", { name: "Next" }));
+      await screen.findByText("Private network access");
+      await user.click(screen.getByRole("button", { name: "Next" }));
+      await screen.findByText("Set up email delivery?");
+      await user.click(screen.getByRole("button", { name: "Do this later" }));
+      await waitFor(() => expect(mockFetch).toHaveBeenCalled());
+      const body = JSON.parse(mockFetch.mock.calls[0][1].body);
+      expect(body.organization_name).toBe("My Company");
+    });
+
+    it("sends Demo as organization_name when left at default", async () => {
+      mockFetch.mockResolvedValue({ ok: true, json: async () => ({ organization_id: "org-123" }) });
+      const user = userEvent.setup();
+      render(<OwnerSetup />);
+      await user.type(screen.getByPlaceholderText("you@example.com"), "jane@example.com");
+      await user.type(screen.getByPlaceholderText("First name"), "Jane");
+      await user.type(screen.getByPlaceholderText("Last name"), "Doe");
+      await user.type(screen.getByPlaceholderText("Password"), "Password1");
+      await user.type(screen.getByPlaceholderText("Confirm password"), "Password1");
+      await user.click(screen.getByRole("button", { name: "Next" }));
+      await screen.findByText("Private network access");
+      await user.click(screen.getByRole("button", { name: "Next" }));
+      await screen.findByText("Set up email delivery?");
+      await user.click(screen.getByRole("button", { name: "Do this later" }));
+      await waitFor(() => expect(mockFetch).toHaveBeenCalled());
+      const body = JSON.parse(mockFetch.mock.calls[0][1].body);
+      expect(body.organization_name).toBe("Demo");
+    });
+
+    it("shows error banner when API returns an error message", async () => {
+      mockFetch.mockResolvedValue({
+        ok: false,
+        status: 500,
+        json: async () => ({ message: "Server exploded" }),
+      });
+      const user = userEvent.setup();
+      render(<OwnerSetup />);
+      await advanceToSmtpPrompt(user);
+      await user.click(screen.getByRole("button", { name: "Do this later" }));
+      expect(await screen.findByText("Server exploded")).toBeInTheDocument();
+    });
+
+    it("shows conflict message when instance is already initialized", async () => {
+      mockFetch.mockResolvedValue({
+        ok: false,
+        status: 409,
+        json: async () => { throw new Error("no json"); },
+      });
+      const user = userEvent.setup();
+      render(<OwnerSetup />);
+      await advanceToSmtpPrompt(user);
+      await user.click(screen.getByRole("button", { name: "Do this later" }));
+      expect(await screen.findByText("This instance is already initialized.")).toBeInTheDocument();
+    });
+
+    it("shows network error message on fetch failure", async () => {
+      mockFetch.mockRejectedValue(new Error("Network down"));
+      const user = userEvent.setup();
+      render(<OwnerSetup />);
+      await advanceToSmtpPrompt(user);
+      await user.click(screen.getByRole("button", { name: "Do this later" }));
+      expect(await screen.findByText("Network error occurred")).toBeInTheDocument();
+    });
+  });
+});
diff --git a/web_src/src/pages/auth/ownerSetup/OwnerStep.tsx b/web_src/src/pages/auth/ownerSetup/OwnerStep.tsx
index 422b7abe73..d22437712d 100644
--- a/web_src/src/pages/auth/ownerSetup/OwnerStep.tsx
+++ b/web_src/src/pages/auth/ownerSetup/OwnerStep.tsx
@@ -49,7 +49,7 @@ export const OwnerStep: React.FC<OwnerStepProps> = ({
       <h4 className="mb-1 text-xl font-medium text-gray-800 dark:text-white">Set up owner account</h4>
       <Text className="text-gray-800 dark:text-gray-300">Create an account for this SuperPlane instance.</Text>
     </div>
-    <form onSubmit={onNext} className="space-y-4">
+    <form onSubmit={onNext} noValidate className="space-y-4">
       <ErrorBanner message={error} />
       <div>
         <Label className="mb-2 block text-left">