homeio

1/* @vitest-environment jsdom */
2
3import { fireEvent, render, screen, waitFor } from "@testing-library/react";
4import { beforeEach, describe, expect, it, vi } from "vitest";
5
6import type { StoreAppDetail } from "@/lib/shared/contracts/apps";
7
8const useStoreAppMock = vi.fn();
9const useAppComposeMock = vi.fn();
10const useStoreActionsMock = vi.fn();
11
12vi.mock("@/modules/apps/hooks/useStoreApp", () => ({
13  useStoreApp: (...args: unknown[]) => useStoreAppMock(...args),
14}));
15
16vi.mock("@/modules/apps/hooks/useAppCompose", () => ({
17  useAppCompose: (...args: unknown[]) => useAppComposeMock(...args),
18}));
19
20vi.mock("@/modules/apps/hooks/useStoreActions", () => ({
21  useStoreActions: (...args: unknown[]) => useStoreActionsMock(...args),
22}));
23
24import { AppConfiguratorPanel } from "@/modules/apps/components/configurator/app-configurator-panel";
25
26const template: StoreAppDetail = {
27  id: "home-assistant",
28  name: "Home Assistant",
29  description: "Home automation",
30  platform: "linux",
31  categories: ["Automation"],
32  logoUrl: "https://example.com/ha.png",
33  repositoryUrl: "https://github.com/home-assistant/core",
34  stackFile: "compose.yml",
35  status: "not_installed",
36  webUiPort: 8123,
37  updateAvailable: false,
38  localDigest: null,
39  remoteDigest: null,
40  note: "Install note",
41  env: [],
42  screenshots: [],
43  installedConfig: null,
44};
45
46function setupActions() {
47  const saveAppSettings = vi.fn().mockResolvedValue(undefined);
48  const installApp = vi.fn().mockResolvedValue(undefined);
49  const installCustomApp = vi.fn().mockResolvedValue(undefined);
50
51  useStoreActionsMock.mockReturnValue({
52    saveAppSettings,
53    installApp,
54    installCustomApp,
55  });
56
57  return { saveAppSettings, installApp, installCustomApp };
58}
59
60describe("AppConfiguratorPanel", () => {
61  beforeEach(() => {
62    useStoreAppMock.mockReset();
63    useAppComposeMock.mockReset();
64    useStoreActionsMock.mockReset();
65
66    useStoreAppMock.mockReturnValue({
67      data: null,
68      isLoading: false,
69    });
70    useAppComposeMock.mockReturnValue({
71      data: {
72        compose:
73          'services:\n  app:\n    image: ghcr.io/example/app:latest\n    ports:\n      - "8123:8123"\n',
74        primary: {
75          image: "ghcr.io/example/app:latest",
76          ports: ["8123:8123"],
77        },
78        primaryServiceName: "app",
79      },
80      isLoading: false,
81      isError: false,
82      error: null,
83    });
84  });
85
86  it("selects compose source by context", () => {
87    setupActions();
88
89    const installedTarget = {
90      appId: "home-assistant",
91      appName: "Home Assistant",
92      dashboardUrl: "http://homeio.local:8123",
93      containerName: "home-assistant",
94    };
95
96    const { rerender } = render(
97      <AppConfiguratorPanel context="catalog_install" template={template} />,
98    );
99    expect(useAppComposeMock).toHaveBeenCalledWith(
100      "home-assistant",
101      true,
102      "catalog",
103    );
104
105    rerender(
106      <AppConfiguratorPanel context="installed_edit" target={installedTarget} />,
107    );
108    expect(useAppComposeMock).toHaveBeenCalledWith(
109      "home-assistant",
110      true,
111      "installed",
112    );
113  });
114
115  it("shows docker run tab only for custom install context", () => {
116    setupActions();
117
118    const { rerender } = render(
119      <AppConfiguratorPanel context="custom_install" />,
120    );
121
122    expect(screen.getByRole("button", { name: "Docker Run" })).toBeTruthy();
123
124    rerender(<AppConfiguratorPanel context="catalog_install" template={template} />);
125
126    expect(screen.queryByRole("button", { name: "Docker Run" })).toBeNull();
127  });
128
129  it("syncs classic edits into compose view", () => {
130    setupActions();
131
132    render(<AppConfiguratorPanel context="catalog_install" template={template} />);
133
134    fireEvent.change(screen.getByLabelText("Docker Image"), {
135      target: { value: "nginx:1.27" },
136    });
137
138    fireEvent.click(screen.getByRole("button", { name: "Docker Compose" }));
139
140    const composeEditor = screen.getByLabelText("Docker Compose") as HTMLTextAreaElement;
141    expect(composeEditor.value).toContain("image: nginx:1.27");
142  });
143
144  it("submits install in catalog context", async () => {
145    const { installApp } = setupActions();
146
147    render(<AppConfiguratorPanel context="catalog_install" template={template} />);
148
149    fireEvent.click(screen.getByRole("button", { name: "Install" }));
150
151    await waitFor(() => {
152      expect(installApp).toHaveBeenCalledTimes(1);
153    });
154    expect(installApp).toHaveBeenCalledWith(
155      expect.objectContaining({
156        appId: "home-assistant",
157        composeSource: expect.stringContaining("services:"),
158      }),
159    );
160  });
161
162  it("prefers injected store actions for catalog installs", async () => {
163    const { installApp: fallbackInstallApp } = setupActions();
164    const injectedInstallApp = vi.fn().mockResolvedValue(undefined);
165
166    render(
167      <AppConfiguratorPanel
168        context="catalog_install"
169        template={template}
170        actions={{
171          installApp: injectedInstallApp,
172        }}
173      />,
174    );
175
176    fireEvent.click(screen.getByRole("button", { name: "Install" }));
177
178    await waitFor(() => {
179      expect(injectedInstallApp).toHaveBeenCalledTimes(1);
180    });
181    expect(fallbackInstallApp).not.toHaveBeenCalled();
182  });
183
184  it("submits docker run install for custom context without manual port field", async () => {
185    const { installCustomApp } = setupActions();
186
187    render(<AppConfiguratorPanel context="custom_install" />);
188
189    fireEvent.change(screen.getByLabelText("App Name"), {
190      target: { value: "My Run App" },
191    });
192    fireEvent.change(screen.getByLabelText("Docker Run"), {
193      target: { value: "docker run --name my-run-app -p 8088:80 nginx:latest" },
194    });
195
196    fireEvent.click(screen.getByRole("button", { name: "Install" }));
197
198    await waitFor(() => {
199      expect(installCustomApp).toHaveBeenCalledWith(
200        expect.objectContaining({
201          name: "My Run App",
202          sourceType: "docker-run",
203          source: "docker run --name my-run-app -p 8088:80 nginx:latest",
204        }),
205      );
206    });
207
208    expect(screen.queryByLabelText("Web UI Port")).toBeNull();
209  });
210
211  it("shows the server host instead of localhost for legacy loopback app urls", () => {
212    setupActions();
213
214    useStoreAppMock.mockReturnValue({
215      data: {
216        ...template,
217        installedConfig: {
218          displayName: "Home Assistant",
219          iconUrl: template.logoUrl,
220          env: {},
221          stackName: "home-assistant",
222          composeSource: "services:\n  app:\n    image: ghcr.io/example/app:latest\n    environment:\n      APP_URL: http://localhost:8123\n",
223        },
224      },
225      isLoading: false,
226    });
227    useAppComposeMock.mockReturnValue({
228      data: {
229        compose:
230          'services:\n  app:\n    image: ghcr.io/example/app:latest\n    environment:\n      APP_URL: "http://localhost:8123"\n    ports:\n      - "8123:8123"\n',
231        primary: {
232          image: "ghcr.io/example/app:latest",
233          environment: {
234            APP_URL: "http://localhost:8123",
235          },
236          ports: ["8123:8123"],
237        },
238        primaryServiceName: "app",
239      },
240      isLoading: false,
241      isError: false,
242      error: null,
243    });
244
245    render(
246      <AppConfiguratorPanel
247        context="installed_edit"
248        target={{
249          appId: "home-assistant",
250          appName: "Home Assistant",
251          dashboardUrl: "http://192.168.1.12:8123",
252          containerName: "homeassistant",
253        }}
254      />,
255    );
256
257    expect(
258      (screen.getByLabelText("Web UI host") as HTMLInputElement).value,
259    ).toBe("192.168.1.12");
260  });
261});
262