import { useState } from "react";
import MailboxPage from "../../../govoplan-mail/webui/src/features/mail/MailboxPage";
import { generatedTranslations } from "../../../govoplan-mail/webui/src/i18n/generatedTranslations";
import { PlatformLanguageProvider } from "../src/i18n/LanguageContext";
import type { AuthInfo } from "../src/types";
import "../../../govoplan-mail/webui/src/styles/mail-profiles.css";

const settings = { apiBaseUrl: "", apiKey: "", accessToken: "" };

export default function MailToolbarScenario() {
  const parameters = new URLSearchParams(window.location.search);
  const [tenant, setTenant] = useState("first");
  const auth: AuthInfo = {
    user: { id: "mail-toolbar-user", account_id: "mail-toolbar-account", email: "mail-toolbar@example.test" },
    tenant: { id: `mail-toolbar-${tenant}`, name: "Mailbox toolbar fixture", slug: tenant },
    scopes: ["mail:mailbox:read", "mail:profile:read", "mail:profile:use", ...(parameters.has("bounce-allowed") ? ["mail:bounce:read"] : [])],
    roles: [], groups: [], profile_loaded: true, roles_loaded: true, groups_loaded: true
  };
  return <PlatformLanguageProvider preferredLanguageCode={parameters.get("language") ?? "en"} moduleTranslations={[generatedTranslations]}>
    {parameters.has("switch-tenant") && <button type="button" onClick={() => setTenant("second")}>Switch fixture tenant</button>}
    <MailboxPage settings={settings} auth={auth} />
  </PlatformLanguageProvider>;
}