import { jsxs as a, jsx as t, Fragment as _e } from "react/jsx-runtime";
import { useRef as q, useState as i, useEffect as G, useCallback as l } from "react";
import { useNavigate as Qe, useSearchParams as Ze } from "react-router-dom";
import { useTranslation as Je } from "react-i18next";
import { ArrowLeft as ye, Headset as Ye, Check as et, Trash2 as Ne, Info as tt, ExternalLink as rt, Building2 as te, Bug as at, Lightbulb as st, AppWindow as nt, MessageSquare as ct, HelpCircle as it, Image as Ce, Upload as ke, X as we, Paperclip as ot, Monitor as lt, AlertTriangle as dt, Loader2 as mt, Send as ut, FileText as pt, File as ht } from "lucide-react";
import { W as ft, h as gt, a0 as P, a2 as De, a1 as re, l as vt, b as se, a3 as ne } from "./index-Dh9kUeDn.js";
import { S as bt } from "./ScreenshotAnnotator-DEuQRcin.js";
const ae = [
  {
    value: "Bug",
    label: "Report a Bug",
    labelKey: "tickets.types.bug",
    description: "Something is not working correctly",
    descriptionKey: "tickets.types.bugDescription",
    icon: at
  },
  {
    value: "FeatureRequest",
    label: "Request a Feature",
    labelKey: "tickets.types.featureRequest",
    description: "Suggest an improvement or new feature",
    descriptionKey: "tickets.types.featureRequestDescription",
    icon: st
  },
  {
    value: "ApplicationRequest",
    label: "Request an Application",
    labelKey: "tickets.types.applicationRequest",
    description: "Request access to a new application",
    descriptionKey: "tickets.types.applicationRequestDescription",
    icon: nt
  },
  {
    value: "Support",
    label: "General Support",
    labelKey: "tickets.types.support",
    description: "Need help with something",
    descriptionKey: "tickets.types.supportDescription",
    icon: ct
  },
  {
    value: "Question",
    label: "Ask a Question",
    labelKey: "tickets.types.question",
    description: "Have a question about the platform",
    descriptionKey: "tickets.types.questionDescription",
    icon: it
  }
], xt = [
  { value: "Low", label: "Low", labelKey: "tickets.priority.low", description: "Can wait, not urgent", descriptionKey: "tickets.priority.lowDescription" },
  { value: "Medium", label: "Medium", labelKey: "tickets.priority.medium", description: "Normal priority", descriptionKey: "tickets.priority.mediumDescription" },
  { value: "High", label: "High", labelKey: "tickets.priority.high", description: "Important, needs attention soon", descriptionKey: "tickets.priority.highDescription" },
  { value: "Critical", label: "Critical", labelKey: "tickets.priority.critical", description: "Urgent, blocking work", descriptionKey: "tickets.priority.criticalDescription" }
], Se = 10 * 1024 * 1024, Te = 5, yt = [".pdf", ".doc", ".docx", ".xls", ".xlsx", ".txt", ".csv", ".zip", ".rar", ".7z", ".png", ".jpg", ".jpeg", ".gif", ".webp", ".bmp"];
function Nt(n) {
  return n < 1024 ? `${n} B` : n < 1024 * 1024 ? `${(n / 1024).toFixed(1)} KB` : `${(n / (1024 * 1024)).toFixed(1)} MB`;
}
function kt(n) {
  return n.includes("pdf") ? pt : n.startsWith("image/") ? Ce : ht;
}
function wt(n, u) {
  if (!n) return { draft: null, selectedTenant: null };
  const r = P.getDraft(n);
  if (!r) return { draft: null, selectedTenant: null };
  let x = null;
  if (r.tenantId && r.tenantSlug) {
    const h = u.find((f) => f.id === r.tenantId);
    h && (x = h);
  }
  return { draft: r, selectedTenant: x };
}
function Dt(n) {
  if (!n?.screenshot) return { screenshot: null, autoSelectType: null };
  let u = null;
  return n.recentErrors.length > 0 && (u = "Bug"), { screenshot: n.screenshot, autoSelectType: u };
}
async function St(n, u, r) {
  try {
    const h = await (await fetch(u)).blob(), f = new File([h], "screenshot.png", { type: "image/png" });
    if (r) {
      const w = new FormData();
      w.append("file", f);
      const M = { "X-Tenant-Slug": r.slug };
      await se.post(`/api/support/my-tickets/${n}/attachments`, w, {
        headers: { "Content-Type": "multipart/form-data", ...M }
      });
    } else
      await ne.uploadAttachment(n, f);
  } catch {
  }
}
async function Tt(n, u, r) {
  for (const x of u)
    try {
      if (r) {
        const h = new FormData();
        h.append("file", x.file);
        const f = { "X-Tenant-Slug": r.slug };
        await se.post(`/api/support/my-tickets/${n}/attachments`, h, {
          headers: { "Content-Type": "multipart/form-data", ...f }
        });
      } else
        await ne.uploadAttachment(n, x.file);
    } catch {
    }
}
function Kt() {
  const n = Qe(), [u] = Ze(), { t: r } = Je(["support", "common"]), { isGlpi: x, glpiBaseUrl: h } = ft(), { currentTenant: f, userTenants: w, isGlobalView: M } = gt(), R = q(null), F = q(null), [y, ce] = i(null), [Ie, B] = i(!1), T = f ?? y;
  G(() => {
    !f && M && w.length > 0 && B(!0);
  }, [f, M, w.length]);
  const O = u.get("draft"), [D, K] = i(1), [m, U] = i(null), [b, X] = i(""), [N, V] = i(""), [C, _] = i("Medium"), [ie, oe] = i(!1), [le, g] = i(null), [v, Ae] = i(null), [Q, Pe] = i(!0), [de, z] = i(null), [S, L] = i(null), [me, Z] = i(!1), [I, ue] = i([]), [pe, J] = i(!1), [o, Re] = i(O), [Fe, he] = i(!1), [Be, fe] = i(!1), p = q(null), ge = q(!1), E = q(!1), $ = l(() => {
    if (!o) return !1;
    const e = P.updateDraft(o, {
      type: m,
      title: b,
      description: N,
      priority: C,
      includeScreenshot: !!S,
      includeErrorLogs: !1,
      screenshot: S ?? void 0,
      tenantId: T?.id,
      tenantSlug: T?.slug,
      tenantName: T?.name
    });
    return e.success && (E.current = !1, he(!0), setTimeout(() => he(!1), 2e3)), e.success;
  }, [o, m, b, N, C, S, T]), Y = l(() => {
    if (o) return o;
    const e = P.createDraft();
    return Re(e.id), e.id;
  }, [o]);
  G(() => {
    if (ge.current && !(!m && !b && !N)) {
      if (E.current = !0, !o) {
        Y();
        return;
      }
      return p.current && clearTimeout(p.current), p.current = setTimeout(() => {
        $();
      }, 1e3), () => {
        p.current && clearTimeout(p.current);
      };
    }
  }, [m, b, N, C, S, o, $, Y]), G(() => {
    const e = () => {
      E.current && o && $();
    };
    return window.addEventListener("beforeunload", e), () => {
      window.removeEventListener("beforeunload", e), E.current && o && $(), p.current && clearTimeout(p.current);
    };
  }, [o, $]);
  const Ke = l(() => {
    o && P.deleteDraft(o), p.current && (clearTimeout(p.current), p.current = null), n(-1);
  }, [o, n]);
  G(() => {
    const { draft: e, selectedTenant: s } = wt(O, w);
    if (e && (e.type && (U(e.type), K(2)), e.title && X(e.title), e.description && V(e.description), e.priority && _(e.priority), e.screenshot && (z(e.screenshot), L(e.screenshot)), s && ce(s)), !e) {
      const A = ["Bug", "FeatureRequest", "Suggestion", "ApplicationRequest", "Support", "Question"], ee = u.get("type"), be = u.get("subject"), xe = u.get("body");
      ee && A.includes(ee) && (U(ee), K(2)), be && X(decodeURIComponent(be)), xe && V(decodeURIComponent(xe));
    }
    const d = De.loadContext(), { screenshot: c, autoSelectType: j } = Dt(d);
    c && !S && (z(c), L(c), j && !m && (U(j), _("High"))), De.clearContext();
    const k = re.captureBrowserInfo();
    Ae(k), setTimeout(() => {
      ge.current = !0;
    }, 100);
  }, [O]);
  const H = l((e) => {
    if (!e.type.startsWith("image/")) {
      g(r("tickets.create.invalidImageType", "Please select a valid image file"));
      return;
    }
    if (e.size > Se) {
      g(r("tickets.create.imageTooLarge", "Image must be less than 10MB"));
      return;
    }
    const s = new FileReader();
    s.onload = (d) => {
      const c = d.target?.result;
      z(c), L(c), g(null);
    }, s.onerror = () => {
      g(r("tickets.create.imageReadError", "Failed to read image file"));
    }, s.readAsDataURL(e);
  }, [r]), Le = l((e) => {
    const s = e.target.files?.[0];
    s && H(s);
  }, [H]), Ee = l((e) => {
    e.preventDefault(), e.stopPropagation(), Z(!0);
  }, []), $e = l((e) => {
    e.preventDefault(), e.stopPropagation(), Z(!1);
  }, []), je = l((e) => {
    e.preventDefault(), e.stopPropagation(), Z(!1);
    const s = e.dataTransfer.files;
    if (s.length > 0) {
      const d = s[0];
      d.type.startsWith("image/") ? H(d) : g(r("tickets.create.invalidImageType", "Please select a valid image file"));
    }
  }, [H, r]), qe = l(() => {
    z(null), L(null), R.current && (R.current.value = "");
  }, []), Me = l((e) => {
    L(e);
  }, []), ve = l((e) => {
    if (e.type.startsWith("image/"))
      return !0;
    const s = "." + e.name.split(".").pop()?.toLowerCase();
    return yt.includes(s);
  }, []), W = l((e) => {
    const s = [];
    for (let d = 0; d < e.length; d++) {
      const c = e[d];
      if (I.length + s.length >= Te) {
        g(r("tickets.create.maxAttachments", `Maximum ${Te} attachments allowed`));
        break;
      }
      if (c.size > Se) {
        g(r("tickets.create.fileTooLarge", `File "${c.name}" is too large (max 10MB)`));
        continue;
      }
      if (!ve(c)) {
        g(r("tickets.create.invalidFileType", `File type not allowed: ${c.name}`));
        continue;
      }
      I.some((k) => k.name === c.name && k.size === c.size) || s.push({
        id: crypto.randomUUID(),
        file: c,
        name: c.name,
        size: c.size,
        type: c.type
      });
    }
    s.length > 0 && (ue((d) => [...d, ...s]), g(null));
  }, [I, ve, r]), Ue = l((e) => {
    const s = e.target.files;
    s && W(s), F.current && (F.current.value = "");
  }, [W]), ze = l((e) => {
    e.preventDefault(), e.stopPropagation(), J(!0);
  }, []), He = l((e) => {
    e.preventDefault(), e.stopPropagation(), J(!1);
  }, []), We = l((e) => {
    e.preventDefault(), e.stopPropagation(), J(!1);
    const s = e.dataTransfer.files;
    s.length > 0 && W(s);
  }, [W]), Ge = l((e) => {
    ue((s) => s.filter((d) => d.id !== e));
  }, []), Oe = async () => {
    if (!(!m || !b.trim() || !N.trim())) {
      if (!T) {
        B(!0);
        return;
      }
      try {
        oe(!0), g(null);
        let e = N.trim();
        Q && v && (e += `

---
**System Information:**
` + re.formatForDescription(v));
        const s = v || re.captureBrowserInfo(), d = vt.getRecentErrors().slice(0, 5), c = {
          sourceUrl: window.location.href,
          browser: {
            name: s.browser,
            version: s.browserVersion,
            language: s.language
          },
          os: {
            name: s.os,
            version: s.osVersion
          },
          device: {
            type: s.deviceType,
            screenResolution: s.screenResolution
          },
          recentErrors: d.map((A) => ({
            message: A.message,
            stack: A.stack,
            component: A.component,
            timestamp: A.timestamp.toISOString()
          }))
        }, j = y ? { "X-Tenant-Slug": y.slug } : {}, k = y ? await se.post("/api/support/my-tickets", {
          title: b.trim(),
          description: e,
          type: m,
          priority: C,
          clientContext: c
        }, { headers: j }) : await ne.create({
          title: b.trim(),
          description: e,
          type: m,
          priority: C,
          clientContext: c
        });
        S && await St(k.id, S, y), await Tt(k.id, I, y), o && P.deleteDraft(o), p.current && (clearTimeout(p.current), p.current = null), E.current = !1, n(`/support/my-tickets/${k.id}?tab=submitted`);
      } catch (e) {
        const s = e && typeof e == "object" && "message" in e ? e.message : null;
        g(s || r("tickets.create.submitError", "Failed to create ticket. Please try again."));
      } finally {
        oe(!1);
      }
    }
  }, Xe = () => /* @__PURE__ */ a("div", { className: "space-y-4", children: [
    /* @__PURE__ */ t("h2", { className: "text-lg font-semibold mb-4", children: r("tickets.create.selectType", "What type of request do you have?") }),
    /* @__PURE__ */ t("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4", children: ae.map((e) => /* @__PURE__ */ t(
      "button",
      {
        onClick: () => {
          U(e.value), K(2);
        },
        className: `card p-4 text-left hover:shadow-md transition-shadow ${m === e.value ? "ring-2 ring-[var(--color-primary-600)]" : ""}`,
        children: /* @__PURE__ */ a("div", { className: "flex items-start gap-4", children: [
          /* @__PURE__ */ t("div", { className: "p-3 rounded-lg bg-[var(--bg-secondary)]", children: /* @__PURE__ */ t(e.icon, { className: "w-6 h-6" }) }),
          /* @__PURE__ */ a("div", { children: [
            /* @__PURE__ */ t("h3", { className: "font-medium", children: r(e.labelKey, e.label) }),
            /* @__PURE__ */ t("p", { className: "text-sm text-[var(--text-secondary)]", children: r(e.descriptionKey, e.description) })
          ] })
        ] })
      },
      e.value
    )) })
  ] }), Ve = () => /* @__PURE__ */ a("div", { className: "space-y-6", children: [
    /* @__PURE__ */ a("div", { className: "flex items-center gap-4 mb-6", children: [
      /* @__PURE__ */ t("button", { onClick: () => K(1), className: "btn btn-ghost p-2", children: /* @__PURE__ */ t(ye, { className: "w-5 h-5" }) }),
      /* @__PURE__ */ a("div", { children: [
        /* @__PURE__ */ t("h2", { className: "text-lg font-semibold", children: r(ae.find((e) => e.value === m)?.labelKey || "", { defaultValue: ae.find((e) => e.value === m)?.label }) }),
        /* @__PURE__ */ t("p", { className: "text-sm text-[var(--text-secondary)]", children: r("tickets.create.fillDetails", "Fill in the details below") })
      ] })
    ] }),
    /* @__PURE__ */ a("div", { children: [
      /* @__PURE__ */ a("label", { className: "block text-sm font-medium mb-2", children: [
        r("tickets.form.title", "Title"),
        " ",
        /* @__PURE__ */ t("span", { className: "text-[var(--error-text)]", children: "*" })
      ] }),
      /* @__PURE__ */ t(
        "input",
        {
          type: "text",
          value: b,
          onChange: (e) => X(e.target.value),
          placeholder: r("tickets.create.titlePlaceholder", "Brief summary of your request"),
          className: "input w-full",
          maxLength: 200
        }
      ),
      /* @__PURE__ */ a("p", { className: "text-xs text-[var(--text-secondary)] mt-1", children: [
        b.length,
        "/200 ",
        r("common:text.characters", "characters")
      ] })
    ] }),
    /* @__PURE__ */ a("div", { children: [
      /* @__PURE__ */ a("label", { className: "block text-sm font-medium mb-2", children: [
        r("tickets.create.description", "Description"),
        " ",
        /* @__PURE__ */ t("span", { className: "text-[var(--error-text)]", children: "*" })
      ] }),
      /* @__PURE__ */ t(
        "textarea",
        {
          value: N,
          onChange: (e) => V(e.target.value),
          placeholder: m === "Bug" ? r("tickets.create.bugPlaceholder", "Please describe the issue in detail. Include steps to reproduce, expected behavior, and actual behavior.") : m === "FeatureRequest" ? r("tickets.create.featurePlaceholder", "Describe the feature you would like to see and why it would be useful.") : m === "ApplicationRequest" ? r("tickets.create.applicationPlaceholder", "Which application do you need access to and why?") : r("tickets.create.defaultPlaceholder", "Please provide as much detail as possible."),
          className: "input w-full h-40",
          maxLength: 5e3
        }
      ),
      /* @__PURE__ */ a("p", { className: "text-xs text-[var(--text-secondary)] mt-1", children: [
        N.length,
        "/5000 ",
        r("common:text.characters", "characters")
      ] })
    ] }),
    /* @__PURE__ */ a("div", { children: [
      /* @__PURE__ */ t("label", { className: "block text-sm font-medium mb-2", children: r("tickets.create.priority", "Priority") }),
      /* @__PURE__ */ t("div", { className: "grid grid-cols-2 md:grid-cols-4 gap-2", children: xt.map((e) => /* @__PURE__ */ a(
        "button",
        {
          type: "button",
          onClick: () => _(e.value),
          className: `p-3 rounded-lg border text-center transition-colors ${C === e.value ? "border-[var(--color-primary-600)] bg-[var(--color-primary-600)]/10" : "border-[var(--border-color)] hover:bg-[var(--bg-hover)]"}`,
          children: [
            /* @__PURE__ */ t("div", { className: "font-medium", children: r(e.labelKey, e.label) }),
            /* @__PURE__ */ t("div", { className: "text-xs text-[var(--text-secondary)]", children: r(e.descriptionKey, e.description) })
          ]
        },
        e.value
      )) })
    ] }),
    /* @__PURE__ */ a("div", { children: [
      /* @__PURE__ */ a("label", { className: "block text-sm font-medium mb-2", children: [
        /* @__PURE__ */ t(Ce, { className: "w-4 h-4 inline mr-2" }),
        r("tickets.create.screenshot", "Screenshot"),
        /* @__PURE__ */ a("span", { className: "text-[var(--text-secondary)] font-normal ml-2", children: [
          "(",
          r("common:text.optional", "optional"),
          ")"
        ] })
      ] }),
      de ? /* @__PURE__ */ a("div", { className: "space-y-3", children: [
        /* @__PURE__ */ a("div", { className: "flex items-center justify-between", children: [
          /* @__PURE__ */ t("span", { className: "text-sm text-[var(--text-secondary)]", children: r("tickets.create.screenshotUploaded", "Screenshot uploaded - you can annotate it below") }),
          /* @__PURE__ */ t(
            "button",
            {
              type: "button",
              onClick: qe,
              className: "btn btn-ghost p-2 text-[var(--error-text)]",
              title: r("tickets.create.removeScreenshot", "Remove screenshot"),
              children: /* @__PURE__ */ t(we, { className: "w-4 h-4" })
            }
          )
        ] }),
        /* @__PURE__ */ t(
          bt,
          {
            screenshot: de,
            onAnnotatedScreenshot: Me
          }
        )
      ] }) : /* @__PURE__ */ a(
        "div",
        {
          className: `border-2 border-dashed rounded-lg p-6 text-center cursor-pointer transition-colors ${me ? "border-[var(--color-primary-600)] bg-[var(--color-primary-600)]/10" : "border-[var(--border-color)] hover:border-[var(--color-primary-600)] hover:bg-[var(--bg-hover)]"}`,
          onClick: () => R.current?.click(),
          onKeyDown: (e) => {
            (e.key === "Enter" || e.key === " ") && (e.preventDefault(), R.current?.click());
          },
          role: "button",
          tabIndex: 0,
          onDragOver: Ee,
          onDragLeave: $e,
          onDrop: je,
          children: [
            /* @__PURE__ */ t(ke, { className: "w-8 h-8 mx-auto mb-2 text-[var(--text-secondary)]" }),
            /* @__PURE__ */ t("p", { className: "text-sm text-[var(--text-secondary)]", children: me ? r("tickets.create.dropScreenshotNow", "Drop image here") : r("tickets.create.uploadScreenshot", "Click or drag & drop to upload a screenshot") }),
            /* @__PURE__ */ t("p", { className: "text-xs text-[var(--text-muted)] mt-1", children: r("tickets.create.uploadScreenshotHint", "PNG, JPG, or GIF up to 10MB") }),
            /* @__PURE__ */ t(
              "input",
              {
                ref: R,
                type: "file",
                accept: "image/*",
                onChange: Le,
                className: "hidden"
              }
            )
          ]
        }
      )
    ] }),
    /* @__PURE__ */ a("div", { children: [
      /* @__PURE__ */ a("label", { className: "block text-sm font-medium mb-2", children: [
        /* @__PURE__ */ t(ot, { className: "w-4 h-4 inline mr-2" }),
        r("tickets.create.attachments", "Attachments"),
        /* @__PURE__ */ a("span", { className: "text-[var(--text-secondary)] font-normal ml-2", children: [
          "(",
          r("common:text.optional", "optional"),
          ")"
        ] })
      ] }),
      /* @__PURE__ */ a(
        "div",
        {
          className: `border-2 border-dashed rounded-lg p-4 text-center cursor-pointer transition-colors ${pe ? "border-[var(--color-primary-600)] bg-[var(--color-primary-600)]/10" : "border-[var(--border-color)] hover:border-[var(--color-primary-600)] hover:bg-[var(--bg-hover)]"}`,
          onClick: () => F.current?.click(),
          onKeyDown: (e) => {
            (e.key === "Enter" || e.key === " ") && (e.preventDefault(), F.current?.click());
          },
          role: "button",
          tabIndex: 0,
          onDragOver: ze,
          onDragLeave: He,
          onDrop: We,
          children: [
            /* @__PURE__ */ t(ke, { className: "w-6 h-6 mx-auto mb-1 text-[var(--text-secondary)]" }),
            /* @__PURE__ */ t("p", { className: "text-sm text-[var(--text-secondary)]", children: pe ? r("tickets.create.dropFilesNow", "Drop files here") : r("tickets.create.uploadAttachments", "Click or drag & drop to add documents") }),
            /* @__PURE__ */ t("p", { className: "text-xs text-[var(--text-muted)] mt-1", children: r("tickets.create.attachmentsHint", "PDF, Word, Excel, TXT, CSV, ZIP (max 10MB each, up to 5 files)") }),
            /* @__PURE__ */ t(
              "input",
              {
                ref: F,
                type: "file",
                multiple: !0,
                accept: ".pdf,.doc,.docx,.xls,.xlsx,.txt,.csv,.zip,.rar,.7z,image/*",
                onChange: Ue,
                className: "hidden"
              }
            )
          ]
        }
      ),
      I.length > 0 && /* @__PURE__ */ t("div", { className: "mt-3 space-y-2", children: I.map((e) => {
        const s = kt(e.type);
        return /* @__PURE__ */ a(
          "div",
          {
            className: "flex items-center justify-between p-2 rounded-lg bg-[var(--bg-secondary)]",
            children: [
              /* @__PURE__ */ a("div", { className: "flex items-center gap-2 min-w-0", children: [
                /* @__PURE__ */ t(s, { className: "w-4 h-4 text-[var(--text-secondary)] flex-shrink-0" }),
                /* @__PURE__ */ t("span", { className: "text-sm truncate", children: e.name }),
                /* @__PURE__ */ a("span", { className: "text-xs text-[var(--text-muted)] flex-shrink-0", children: [
                  "(",
                  Nt(e.size),
                  ")"
                ] })
              ] }),
              /* @__PURE__ */ t(
                "button",
                {
                  type: "button",
                  onClick: () => Ge(e.id),
                  className: "btn btn-ghost p-1 text-[var(--error-text)]",
                  title: r("tickets.create.removeAttachment", "Remove attachment"),
                  children: /* @__PURE__ */ t(we, { className: "w-4 h-4" })
                }
              )
            ]
          },
          e.id
        );
      }) })
    ] }),
    v && /* @__PURE__ */ a("div", { className: "border border-[var(--border-color)] rounded-lg p-4", children: [
      /* @__PURE__ */ a("div", { className: "flex items-center justify-between mb-3", children: [
        /* @__PURE__ */ a("div", { className: "flex items-center gap-2", children: [
          /* @__PURE__ */ t(lt, { className: "w-4 h-4 text-[var(--text-secondary)]" }),
          /* @__PURE__ */ t("span", { className: "text-sm font-medium", children: r("tickets.create.systemInfo", "System Information") })
        ] }),
        /* @__PURE__ */ a("label", { className: "flex items-center gap-2 cursor-pointer", children: [
          /* @__PURE__ */ t(
            "input",
            {
              type: "checkbox",
              checked: Q,
              onChange: (e) => Pe(e.target.checked),
              className: "rounded border-[var(--border-color)]"
            }
          ),
          /* @__PURE__ */ t("span", { className: "text-xs text-[var(--text-secondary)]", children: r("tickets.create.includeSystemInfo", "Include in ticket") })
        ] })
      ] }),
      /* @__PURE__ */ a("div", { className: `grid grid-cols-2 md:grid-cols-3 gap-3 text-sm ${Q ? "" : "opacity-50"}`, children: [
        /* @__PURE__ */ a("div", { children: [
          /* @__PURE__ */ a("span", { className: "text-[var(--text-secondary)]", children: [
            r("tickets.create.browser", "Browser"),
            ":"
          ] }),
          /* @__PURE__ */ a("span", { className: "ml-2 font-medium", children: [
            v.browser,
            " ",
            v.browserVersion
          ] })
        ] }),
        /* @__PURE__ */ a("div", { children: [
          /* @__PURE__ */ a("span", { className: "text-[var(--text-secondary)]", children: [
            r("tickets.create.os", "OS"),
            ":"
          ] }),
          /* @__PURE__ */ a("span", { className: "ml-2 font-medium", children: [
            v.os,
            " ",
            v.osVersion
          ] })
        ] }),
        /* @__PURE__ */ a("div", { children: [
          /* @__PURE__ */ a("span", { className: "text-[var(--text-secondary)]", children: [
            r("tickets.create.device", "Device"),
            ":"
          ] }),
          /* @__PURE__ */ t("span", { className: "ml-2 font-medium", children: v.deviceType })
        ] }),
        /* @__PURE__ */ a("div", { children: [
          /* @__PURE__ */ a("span", { className: "text-[var(--text-secondary)]", children: [
            r("tickets.create.screen", "Screen"),
            ":"
          ] }),
          /* @__PURE__ */ t("span", { className: "ml-2 font-medium", children: v.screenResolution })
        ] }),
        /* @__PURE__ */ a("div", { children: [
          /* @__PURE__ */ a("span", { className: "text-[var(--text-secondary)]", children: [
            r("tickets.create.language", "Language"),
            ":"
          ] }),
          /* @__PURE__ */ t("span", { className: "ml-2 font-medium", children: v.language })
        ] })
      ] })
    ] }),
    le && /* @__PURE__ */ a("div", { className: "p-4 rounded-lg bg-[var(--error-bg)] text-[var(--error-text)] flex items-center gap-2", children: [
      /* @__PURE__ */ t(dt, { className: "w-5 h-5" }),
      le
    ] }),
    /* @__PURE__ */ a("div", { className: "flex items-center justify-between pt-4 border-t border-[var(--border-color)]", children: [
      /* @__PURE__ */ t("button", { onClick: () => K(1), className: "btn btn-secondary", children: r("common:buttons.back", "Back") }),
      /* @__PURE__ */ a(
        "button",
        {
          onClick: Oe,
          disabled: !b.trim() || !N.trim() || ie,
          className: "btn btn-primary",
          children: [
            ie ? /* @__PURE__ */ t(mt, { className: "w-4 h-4 animate-spin mr-2" }) : /* @__PURE__ */ t(ut, { className: "w-4 h-4 mr-2" }),
            r("tickets.create.submit", "Submit Ticket")
          ]
        }
      )
    ] })
  ] });
  return /* @__PURE__ */ a("div", { className: "max-w-3xl mx-auto", children: [
    /* @__PURE__ */ a("div", { className: "flex items-center gap-4 mb-6", children: [
      /* @__PURE__ */ t("button", { onClick: () => n(-1), className: "btn btn-ghost p-2", children: /* @__PURE__ */ t(ye, { className: "w-5 h-5" }) }),
      /* @__PURE__ */ a("div", { className: "flex-1", children: [
        /* @__PURE__ */ a("h1", { className: "text-2xl font-bold flex items-center gap-2", children: [
          /* @__PURE__ */ t(Ye, { className: "w-6 h-6" }),
          r("tickets.create.title", "Create New Ticket")
        ] }),
        /* @__PURE__ */ t("p", { className: "text-[var(--text-secondary)]", children: r("tickets.create.subtitle", "Submit a support request or report an issue") })
      ] }),
      /* @__PURE__ */ a("div", { className: "flex items-center gap-2", children: [
        /* @__PURE__ */ a("div", { className: `flex items-center gap-1 text-xs text-[var(--success-text)] transition-opacity duration-300 ${Fe ? "opacity-100" : "opacity-0"}`, children: [
          /* @__PURE__ */ t(et, { className: "w-3.5 h-3.5" }),
          /* @__PURE__ */ t("span", { children: r("common:drafts.autoSaved", "Draft saved") })
        ] }),
        o && /* @__PURE__ */ t(
          "button",
          {
            onClick: () => fe(!0),
            className: "btn btn-ghost p-2 text-[var(--text-secondary)] hover:text-[var(--error-text)]",
            title: r("common:drafts.discard", "Discard draft"),
            children: /* @__PURE__ */ t(Ne, { className: "w-4 h-4" })
          }
        )
      ] })
    ] }),
    x ? /* @__PURE__ */ a("div", { className: "mb-6 p-4 rounded-lg bg-[var(--info-bg)] border border-[var(--info-border)]", children: [
      /* @__PURE__ */ a("div", { className: "flex items-center gap-3 mb-3", children: [
        /* @__PURE__ */ t(tt, { className: "w-5 h-5 text-[var(--info-text)] flex-shrink-0" }),
        /* @__PURE__ */ t("p", { className: "font-medium text-[var(--info-text)]", children: r("glpi.cannotCreateTicket", "Tickets are managed by GLPI. Please create tickets directly in GLPI.") })
      ] }),
      h && /* @__PURE__ */ a(
        "a",
        {
          href: h,
          target: "_blank",
          rel: "noopener noreferrer",
          className: "btn btn-primary inline-flex items-center gap-2",
          children: [
            /* @__PURE__ */ t(rt, { className: "w-4 h-4" }),
            r("glpi.openGlpi")
          ]
        }
      )
    ] }) : /* @__PURE__ */ a(_e, { children: [
      /* @__PURE__ */ a("div", { className: "flex items-center gap-4 mb-8", children: [
        /* @__PURE__ */ a("div", { className: `flex items-center gap-2 ${D >= 1 ? "text-[var(--color-primary-600)]" : "text-[var(--text-secondary)]"}`, children: [
          /* @__PURE__ */ t("div", { className: `w-8 h-8 rounded-full flex items-center justify-center ${D >= 1 ? "bg-[var(--color-primary-600)] text-white" : "bg-[var(--bg-secondary)]"}`, children: "1" }),
          /* @__PURE__ */ t("span", { className: "font-medium", children: r("tickets.create.stepSelectType", "Select Type") })
        ] }),
        /* @__PURE__ */ t("div", { className: `flex-1 h-0.5 ${D >= 2 ? "bg-[var(--color-primary-600)]" : "bg-[var(--border-color)]"}` }),
        /* @__PURE__ */ a("div", { className: `flex items-center gap-2 ${D >= 2 ? "text-[var(--color-primary-600)]" : "text-[var(--text-secondary)]"}`, children: [
          /* @__PURE__ */ t("div", { className: `w-8 h-8 rounded-full flex items-center justify-center ${D >= 2 ? "bg-[var(--color-primary-600)] text-white" : "bg-[var(--bg-secondary)]"}`, children: "2" }),
          /* @__PURE__ */ t("span", { className: "font-medium", children: r("tickets.create.stepDetails", "Details") })
        ] })
      ] }),
      y && !f && /* @__PURE__ */ a("div", { className: "mb-4 p-3 rounded-lg bg-[var(--info-bg)] border border-[var(--info-border)] flex items-center justify-between", children: [
        /* @__PURE__ */ a("div", { className: "flex items-center gap-2 text-sm text-[var(--info-text)]", children: [
          /* @__PURE__ */ t(te, { className: "w-4 h-4" }),
          /* @__PURE__ */ t("span", { children: r("support:tickets.tenantPicker.creatingFor", "Creating ticket for:") }),
          /* @__PURE__ */ t("span", { className: "font-semibold", children: y.name })
        ] }),
        /* @__PURE__ */ t(
          "button",
          {
            onClick: () => B(!0),
            className: "text-xs text-[var(--info-text)] underline hover:no-underline",
            children: r("common:actions.change", "Change")
          }
        )
      ] }),
      /* @__PURE__ */ a("div", { className: "card p-6", children: [
        D === 1 && Xe(),
        D === 2 && Ve()
      ] })
    ] }),
    Be && /* @__PURE__ */ t("div", { className: "fixed inset-0 bg-black/50 backdrop-blur-sm flex items-center justify-center z-50 p-4", children: /* @__PURE__ */ a("div", { className: "card w-full max-w-md p-6", children: [
      /* @__PURE__ */ a("div", { className: "flex items-center gap-3 mb-4", children: [
        /* @__PURE__ */ t("div", { className: "w-10 h-10 rounded-full bg-[var(--error-bg)] flex items-center justify-center", children: /* @__PURE__ */ t(Ne, { className: "w-5 h-5 text-[var(--error-text)]" }) }),
        /* @__PURE__ */ t("h2", { className: "text-xl font-bold", children: r("common:drafts.discardConfirmTitle", "Discard draft?") })
      ] }),
      /* @__PURE__ */ t("p", { className: "text-[var(--text-secondary)] mb-6", children: r("common:drafts.discardConfirmMessage", "This draft will be permanently deleted. This action cannot be undone.") }),
      /* @__PURE__ */ a("div", { className: "flex justify-end gap-3", children: [
        /* @__PURE__ */ t("button", { onClick: () => fe(!1), className: "btn btn-secondary", children: r("common:actions.cancel", "Cancel") }),
        /* @__PURE__ */ t("button", { onClick: Ke, className: "btn bg-[var(--error-text)] text-white hover:opacity-90", children: r("common:drafts.discard", "Discard") })
      ] })
    ] }) }),
    Ie && /* @__PURE__ */ t("div", { className: "fixed inset-0 bg-black/50 backdrop-blur-sm flex items-center justify-center z-50 p-4", children: /* @__PURE__ */ a("div", { className: "card w-full max-w-md p-6", children: [
      /* @__PURE__ */ a("div", { className: "flex items-center gap-3 mb-4", children: [
        /* @__PURE__ */ t("div", { className: "w-10 h-10 rounded-full bg-[var(--info-bg)] flex items-center justify-center", children: /* @__PURE__ */ t(te, { className: "w-5 h-5 text-[var(--info-text)]" }) }),
        /* @__PURE__ */ a("div", { children: [
          /* @__PURE__ */ t("h2", { className: "text-xl font-bold", children: r("support:tickets.tenantPicker.title", "Select Workspace") }),
          /* @__PURE__ */ t("p", { className: "text-sm text-[var(--text-secondary)]", children: r("support:tickets.tenantPicker.description", "Choose a workspace to create the ticket in") })
        ] })
      ] }),
      /* @__PURE__ */ t("div", { className: "space-y-2 max-h-64 overflow-y-auto", children: w.filter((e) => e.status === "Active").map((e) => /* @__PURE__ */ t(
        "button",
        {
          onClick: () => {
            ce(e), B(!1);
            const s = o || Y();
            s && P.updateDraft(s, {
              tenantId: e.id,
              tenantSlug: e.slug,
              tenantName: e.name
            });
          },
          className: `w-full p-3 rounded-lg border text-left transition-colors hover:bg-[var(--bg-hover)] ${y?.id === e.id ? "border-[var(--color-primary-600)] bg-[var(--color-primary-600)]/10" : "border-[var(--border-color)]"}`,
          children: /* @__PURE__ */ a("div", { className: "flex items-center gap-3", children: [
            /* @__PURE__ */ t(te, { className: "w-5 h-5 text-[var(--text-secondary)]" }),
            /* @__PURE__ */ a("div", { className: "flex-1 min-w-0", children: [
              /* @__PURE__ */ t("div", { className: "font-medium truncate", children: e.name }),
              e.organisationName && /* @__PURE__ */ t("div", { className: "text-xs text-[var(--text-secondary)] truncate", children: e.organisationName })
            ] }),
            /* @__PURE__ */ t("span", { className: `text-xs px-2 py-0.5 rounded-full ${e.type === "Personal" ? "bg-[var(--info-bg)] text-[var(--info-text)]" : "bg-[var(--success-bg)] text-[var(--success-text)]"}`, children: e.type === "Personal" ? r("common:tenant.personal", "Personal") : r("common:tenant.business", "Business") })
          ] })
        },
        e.id
      )) }),
      /* @__PURE__ */ t("div", { className: "flex justify-end gap-3 mt-4 pt-4 border-t border-[var(--border-color)]", children: /* @__PURE__ */ t(
        "button",
        {
          onClick: () => {
            B(!1), T || n(-1);
          },
          className: "btn btn-secondary",
          children: r("common:actions.cancel", "Cancel")
        }
      ) })
    ] }) })
  ] });
}
export {
  Kt as UserCreateTicketPage
};
//# sourceMappingURL=UserCreateTicketPage-BfZIpwtj.js.map
