@burdenoff/microfe-devportal 2026.625.9 → 2026.626.1

package/dist/devportal/pages/StoreSubmissionPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"StoreSubmissionPage.js","names":[],"sources":["../../../src/devportal/pages/StoreSubmissionPage.tsx"],"sourcesContent":["import type { FC } from \"react\";\nimport { useEffect, useState } from \"react\";\nimport { useNavigate, useParams } from \"react-router-dom\";\nimport {\n  ArrowLeft,\n  CheckCircle2,\n  Clock,\n  RefreshCw,\n  XCircle,\n  AlertTriangle,\n  Store as StoreIcon,\n} from \"lucide-react\";\nimport { graphqlFetch } from \"@burdenoff/fe-libs/shared/graphql\";\nimport { useDevportalEventBus } from \"../events\";\nimport { useTr } from \"../utils/i18n\";\nimport { useDevportalPermission } from \"../hooks\";\nimport { DEVPORTAL_PERMISSIONS } from \"../constants/permissions\";\n\ntype SubmissionStatus =\n  | \"DRAFT\"\n  | \"PENDING_REVIEW\"\n  | \"PUBLISHED\"\n  | \"REJECTED\"\n  | \"UNKNOWN\";\n\ntype StoreSubmission = {\n  productId: string;\n  status: SubmissionStatus;\n  submittedAt: string | null;\n  reviewedAt: string | null;\n  publishedAt: string | null;\n  reviewNotes: string | null;\n  rejectedReason: string | null;\n};\n\ntype Application = {\n  id: string;\n  name: string;\n  slug: string;\n  status: string;\n  reviewStatus: string;\n  iconUrl: string | null;\n  metadata: Record<string, unknown> | null;\n};\n\nconst APP_QUERY = /* GraphQL */ `\n  query DevportalAppForSubmission($id: ID!) {\n    application(id: $id) {\n      id\n      name\n      slug\n      status\n      reviewStatus\n      iconUrl\n      metadata\n    }\n  }\n`;\n\nconst SUBMIT_MUTATION = /* GraphQL */ `\n  mutation DevportalSubmitForReview($id: ID!, $notes: String) {\n    submitApplicationForReview(id: $id, notes: $notes) {\n      id\n      status\n      submittedAt\n      metadata\n    }\n  }\n`;\n\nfunction inferSubmission(app: Application | null): StoreSubmission | null {\n  if (!app) return null;\n  const metadata = (app.metadata ?? {}) as Record<string, unknown>;\n  const productId =\n    typeof metadata.storeProductId === \"string\" ? metadata.storeProductId : \"\";\n  const rawStatus =\n    typeof metadata.storeSubmissionStatus === \"string\"\n      ? metadata.storeSubmissionStatus\n      : null;\n  const status: SubmissionStatus =\n    rawStatus === \"PENDING_REVIEW\" ||\n    rawStatus === \"PUBLISHED\" ||\n    rawStatus === \"REJECTED\" ||\n    rawStatus === \"DRAFT\"\n      ? rawStatus\n      : \"UNKNOWN\";\n  return {\n    productId,\n    status,\n    submittedAt:\n      typeof metadata.storeSubmissionAt === \"string\"\n        ? metadata.storeSubmissionAt\n        : null,\n    reviewedAt: null,\n    publishedAt: null,\n    reviewNotes: null,\n    rejectedReason: null,\n  };\n}\n\ntype StatusMeta = {\n  i18nKey: string;\n  fallback: string;\n  icon: typeof CheckCircle2;\n  tone: string;\n};\n\nconst statusLabels: Record<SubmissionStatus, StatusMeta> = {\n  DRAFT: {\n    i18nKey: \"devportal.storeSubmission.status.draft\",\n    fallback: \"Draft\",\n    icon: Clock,\n    tone: \"text-text-secondary\",\n  },\n  PENDING_REVIEW: {\n    i18nKey: \"devportal.storeSubmission.status.pending\",\n    fallback: \"Pending review\",\n    icon: Clock,\n    tone: \"text-status-warning-text\",\n  },\n  PUBLISHED: {\n    i18nKey: \"devportal.storeSubmission.status.published\",\n    fallback: \"Published\",\n    icon: CheckCircle2,\n    tone: \"text-status-success-text\",\n  },\n  REJECTED: {\n    i18nKey: \"devportal.storeSubmission.status.rejected\",\n    fallback: \"Rejected\",\n    icon: XCircle,\n    tone: \"text-status-danger-text\",\n  },\n  UNKNOWN: {\n    i18nKey: \"devportal.storeSubmission.status.unknown\",\n    fallback: \"Not yet submitted\",\n    icon: AlertTriangle,\n    tone: \"text-text-tertiary\",\n  },\n};\n\nexport const StoreSubmissionPage: FC = () => {\n  const { appId } = useParams<{ appId: string }>();\n  const navigate = useNavigate();\n  const bus = useDevportalEventBus();\n  const tr = useTr();\n  const submitPerm = useDevportalPermission(DEVPORTAL_PERMISSIONS.APP_SUBMIT);\n  const [app, setApp] = useState<Application | null>(null);\n  const [loading, setLoading] = useState(true);\n  const [error, setError] = useState<string | null>(null);\n  const [submitting, setSubmitting] = useState(false);\n  const [notes, setNotes] = useState(\"\");\n  const load = async () => {\n    if (!appId) return;\n    setLoading(true);\n    setError(null);\n    try {\n      const result = await graphqlFetch<{ application: Application | null }>({\n        gateway: \"global\",\n        query: APP_QUERY,\n        variables: { id: appId },\n      });\n      if (result.errors?.length) {\n        throw new Error(\n          result.errors[0]?.message ??\n            tr(\n              \"devportal.storeSubmission.errors.loadFailed\",\n              \"Failed to load application\",\n            ),\n        );\n      }\n      setApp(result.data?.application ?? null);\n    } catch (err) {\n      setError(\n        err instanceof Error\n          ? err.message\n          : tr(\n              \"devportal.storeSubmission.errors.loadFailed\",\n              \"Failed to load application\",\n            ),\n      );\n    } finally {\n      setLoading(false);\n    }\n  };\n\n  useEffect(() => {\n    void load();\n  }, [appId]); // eslint-disable-line react-hooks/exhaustive-deps\n\n  useEffect(() => {\n    const name = app?.name;\n    if (!appId || !name) return;\n    const reg = (\n      window as unknown as {\n        __breadcrumbRegistry?: {\n          register: (id: string, name: string) => void;\n          unregister: (id: string) => void;\n        };\n      }\n    ).__breadcrumbRegistry;\n    reg?.register(appId, name);\n    return () => reg?.unregister(appId);\n  }, [appId, app?.name]);\n\n  const submit = async () => {\n    if (!appId) return;\n    setSubmitting(true);\n    setError(null);\n    try {\n      const result = await graphqlFetch({\n        gateway: \"global\",\n        query: SUBMIT_MUTATION,\n        variables: { id: appId, notes: notes || null },\n      });\n      if (result.errors?.length) {\n        throw new Error(\n          result.errors[0]?.message ??\n            tr(\n              \"devportal.storeSubmission.errors.submitFailed\",\n              \"Submission failed\",\n            ),\n        );\n      }\n      bus.emit(\"devportal.app.submitted\", { appId });\n      await load();\n    } catch (err) {\n      setError(\n        err instanceof Error\n          ? err.message\n          : tr(\n              \"devportal.storeSubmission.errors.submitFailed\",\n              \"Submission failed\",\n            ),\n      );\n    } finally {\n      setSubmitting(false);\n    }\n  };\n\n  const submission = inferSubmission(app);\n  const statusMeta = submission\n    ? statusLabels[submission.status]\n    : statusLabels.UNKNOWN;\n  const StatusIcon = statusMeta.icon;\n\n  return (\n    <main\n      className=\"min-h-screen bg-surface-default\"\n      aria-labelledby=\"store-submission-heading\"\n    >\n      <div className=\"border-b border-border-default bg-surface-raised\">\n        <div className=\"mx-auto max-w-3xl px-6 py-4\">\n          <div className=\"flex items-center gap-3\">\n            <button\n              type=\"button\"\n              onClick={() => navigate(-1)}\n              className=\"inline-flex items-center gap-2 rounded-md px-3 py-1.5 text-sm text-text-secondary hover:bg-surface-hover hover:text-text-primary focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary\"\n            >\n              <ArrowLeft className=\"h-4 w-4\" aria-hidden=\"true\" />\n              {tr(\"devportal.common.back\", \"Back\")}\n            </button>\n            <div className=\"flex items-center gap-2\">\n              <StoreIcon\n                className=\"h-5 w-5 text-text-primary\"\n                aria-hidden=\"true\"\n              />\n              <h1\n                id=\"store-submission-heading\"\n                className=\"text-xl font-semibold text-text-primary\"\n              >\n                {tr(\"devportal.storeSubmission.title\", \"Store submission\")}\n              </h1>\n            </div>\n          </div>\n        </div>\n      </div>\n\n      <div className=\"mx-auto max-w-3xl px-6 py-6\">\n        {error && (\n          <div\n            role=\"alert\"\n            className=\"mb-4 rounded-md border border-border-danger bg-surface-danger-muted px-4 py-3 text-sm text-text-danger\"\n          >\n            {error}\n          </div>\n        )}\n\n        {loading && !app ? (\n          <div\n            className=\"py-16 text-center text-text-secondary\"\n            role=\"status\"\n            aria-live=\"polite\"\n          >\n            {tr(\"devportal.storeSubmission.loading\", \"Loading application…\")}\n          </div>\n        ) : !app ? (\n          <div className=\"py-16 text-center text-text-secondary\">\n            {tr(\"devportal.storeSubmission.notFound\", \"Application not found.\")}\n          </div>\n        ) : (\n          <div className=\"space-y-4\">\n            {/* App header */}\n            <div className=\"rounded-lg border border-border-default bg-surface-raised p-4\">\n              <div className=\"flex items-center gap-3\">\n                {app.iconUrl ? (\n                  <img\n                    src={app.iconUrl}\n                    alt=\"\"\n                    className=\"h-14 w-14 flex-shrink-0 rounded-md object-cover\"\n                  />\n                ) : (\n                  <div className=\"flex h-14 w-14 flex-shrink-0 items-center justify-center rounded-md bg-surface-muted text-text-secondary\">\n                    {app.name.slice(0, 2).toUpperCase()}\n                  </div>\n                )}\n                <div className=\"min-w-0 flex-1\">\n                  <h2 className=\"text-lg font-semibold text-text-primary\">\n                    {app.name}\n                  </h2>\n                  <p className=\"font-mono text-xs text-text-tertiary\">\n                    {app.slug}\n                  </p>\n                </div>\n                <div\n                  className={`flex items-center gap-1.5 ${statusMeta.tone}`}\n                  role=\"status\"\n                >\n                  <StatusIcon className=\"h-5 w-5\" aria-hidden=\"true\" />\n                  <span className=\"text-sm font-medium\">\n                    {tr(statusMeta.i18nKey, statusMeta.fallback)}\n                  </span>\n                </div>\n              </div>\n            </div>\n\n            {/* Timeline */}\n            {submission && submission.status !== \"UNKNOWN\" && (\n              <div className=\"rounded-lg border border-border-default bg-surface-raised p-4\">\n                <h3 className=\"mb-3 text-sm font-semibold text-text-primary\">\n                  {tr(\n                    \"devportal.storeSubmission.timeline\",\n                    \"Submission timeline\",\n                  )}\n                </h3>\n                <ul className=\"space-y-2 text-sm\">\n                  {submission.submittedAt && (\n                    <li className=\"flex items-center gap-2\">\n                      <Clock\n                        className=\"h-4 w-4 text-text-tertiary\"\n                        aria-hidden=\"true\"\n                      />\n                      <span className=\"text-text-secondary\">\n                        {tr(\n                          \"devportal.storeSubmission.submitted\",\n                          \"Submitted:\",\n                        )}\n                      </span>\n                      <span className=\"text-text-primary\">\n                        {new Date(submission.submittedAt).toLocaleString()}\n                      </span>\n                    </li>\n                  )}\n                  {submission.reviewedAt && (\n                    <li className=\"flex items-center gap-2\">\n                      <CheckCircle2\n                        className=\"h-4 w-4 text-text-tertiary\"\n                        aria-hidden=\"true\"\n                      />\n                      <span className=\"text-text-secondary\">\n                        {tr(\"devportal.storeSubmission.reviewed\", \"Reviewed:\")}\n                      </span>\n                      <span className=\"text-text-primary\">\n                        {new Date(submission.reviewedAt).toLocaleString()}\n                      </span>\n                    </li>\n                  )}\n                  {submission.publishedAt && (\n                    <li className=\"flex items-center gap-2\">\n                      <CheckCircle2\n                        className=\"h-4 w-4 text-status-success-text\"\n                        aria-hidden=\"true\"\n                      />\n                      <span className=\"text-text-secondary\">\n                        {tr(\n                          \"devportal.storeSubmission.published\",\n                          \"Published:\",\n                        )}\n                      </span>\n                      <span className=\"text-text-primary\">\n                        {new Date(submission.publishedAt).toLocaleString()}\n                      </span>\n                    </li>\n                  )}\n                </ul>\n                {submission.reviewNotes && (\n                  <div className=\"mt-3 rounded-md bg-surface-muted p-3\">\n                    <p className=\"text-xs font-medium text-text-secondary\">\n                      {tr(\n                        \"devportal.storeSubmission.reviewerNotes\",\n                        \"Reviewer notes\",\n                      )}\n                    </p>\n                    <p className=\"mt-1 text-sm text-text-primary\">\n                      {submission.reviewNotes}\n                    </p>\n                  </div>\n                )}\n                {submission.rejectedReason && (\n                  <div\n                    className=\"mt-3 rounded-md border border-border-danger bg-surface-danger-muted p-3\"\n                    role=\"alert\"\n                  >\n                    <p className=\"text-xs font-medium text-text-danger\">\n                      {tr(\n                        \"devportal.storeSubmission.rejectionReason\",\n                        \"Rejection reason\",\n                      )}\n                    </p>\n                    <p className=\"mt-1 text-sm text-text-primary\">\n                      {submission.rejectedReason}\n                    </p>\n                  </div>\n                )}\n              </div>\n            )}\n\n            {/* Submit / resubmit */}\n            {(!submission ||\n              submission.status === \"UNKNOWN\" ||\n              submission.status === \"DRAFT\" ||\n              submission.status === \"REJECTED\") && (\n              <div className=\"rounded-lg border border-border-default bg-surface-raised p-4\">\n                <h3 className=\"mb-2 text-sm font-semibold text-text-primary\">\n                  {submission?.status === \"REJECTED\"\n                    ? tr(\n                        \"devportal.storeSubmission.resubmitForReview\",\n                        \"Resubmit for review\",\n                      )\n                    : tr(\n                        \"devportal.storeSubmission.submitForReview\",\n                        \"Submit for review\",\n                      )}\n                </h3>\n                <p className=\"mb-3 text-sm text-text-secondary\">\n                  {tr(\n                    \"devportal.storeSubmission.help\",\n                    \"Your application will be sent to the store's review queue. Whether it's auto-published or requires admin approval depends on the target store's configuration.\",\n                  )}\n                </p>\n                <label className=\"block\" htmlFor=\"store-submission-notes\">\n                  <span className=\"sr-only\">\n                    {tr(\n                      \"devportal.storeSubmission.notesLabel\",\n                      \"Notes for the reviewer (optional)\",\n                    )}\n                  </span>\n                </label>\n                <textarea\n                  id=\"store-submission-notes\"\n                  value={notes}\n                  onChange={(e) => setNotes(e.target.value)}\n                  rows={3}\n                  placeholder={tr(\n                    \"devportal.storeSubmission.notesLabel\",\n                    \"Notes for the reviewer (optional)\",\n                  )}\n                  className=\"mb-3 w-full rounded-md border border-border-default bg-surface-default px-3 py-2 text-sm text-text-primary focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary\"\n                />\n                <button\n                  type=\"button\"\n                  onClick={() => void submit()}\n                  disabled={submitting || !submitPerm.allowed}\n                  aria-disabled={submitting || !submitPerm.allowed}\n                  title={\n                    !submitPerm.allowed\n                      ? tr(\n                          \"devportal.common.noPermission\",\n                          \"You do not have permission to perform this action\",\n                        )\n                      : undefined\n                  }\n                  className=\"inline-flex items-center gap-2 rounded-md bg-action-primary-bg px-4 py-2 text-sm font-semibold text-action-primary-text hover:opacity-90 disabled:opacity-60 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary\"\n                >\n                  {submitting && (\n                    <RefreshCw\n                      className=\"h-4 w-4 animate-spin\"\n                      aria-hidden=\"true\"\n                    />\n                  )}\n                  {submission?.status === \"REJECTED\"\n                    ? tr(\"devportal.storeSubmission.resubmit\", \"Resubmit\")\n                    : tr(\n                        \"devportal.storeSubmission.submitForReview\",\n                        \"Submit for review\",\n                      )}\n                </button>\n              </div>\n            )}\n\n            {submission?.productId && (\n              <div className=\"rounded-lg border border-border-default bg-surface-raised p-4\">\n                <p className=\"text-xs font-medium text-text-secondary\">\n                  {tr(\n                    \"devportal.storeSubmission.storeProductId\",\n                    \"Store product ID\",\n                  )}\n                </p>\n                <code className=\"mt-1 block break-all font-mono text-xs text-text-primary\">\n                  {submission.productId}\n                </code>\n              </div>\n            )}\n          </div>\n        )}\n      </div>\n    </main>\n  );\n};\n"],"mappings":"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"}
+{"version":3,"file":"StoreSubmissionPage.js","names":[],"sources":["../../../src/devportal/pages/StoreSubmissionPage.tsx"],"sourcesContent":["import type { FC } from \"react\";\nimport { useEffect, useState } from \"react\";\nimport { useNavigate, useParams } from \"react-router-dom\";\nimport {\n  ArrowLeft,\n  CheckCircle2,\n  Clock,\n  RefreshCw,\n  XCircle,\n  AlertTriangle,\n  Store as StoreIcon,\n} from \"lucide-react\";\nimport { graphqlFetch } from \"@burdenoff/fe-libs/shared/graphql\";\nimport { IllustratedEmptyState, PagePurpose } from \"@burdenoff/fe-libs/ui\";\nimport { useDevportalEventBus } from \"../events\";\nimport { useTr } from \"../utils/i18n\";\nimport { useDevportalPermission } from \"../hooks\";\nimport { DEVPORTAL_PERMISSIONS } from \"../constants/permissions\";\n\ntype SubmissionStatus =\n  | \"DRAFT\"\n  | \"PENDING_REVIEW\"\n  | \"PUBLISHED\"\n  | \"REJECTED\"\n  | \"UNKNOWN\";\n\ntype StoreSubmission = {\n  productId: string;\n  status: SubmissionStatus;\n  submittedAt: string | null;\n  reviewedAt: string | null;\n  publishedAt: string | null;\n  reviewNotes: string | null;\n  rejectedReason: string | null;\n};\n\ntype Application = {\n  id: string;\n  name: string;\n  slug: string;\n  status: string;\n  reviewStatus: string;\n  iconUrl: string | null;\n  metadata: Record<string, unknown> | null;\n};\n\nconst APP_QUERY = /* GraphQL */ `\n  query DevportalAppForSubmission($id: ID!) {\n    application(id: $id) {\n      id\n      name\n      slug\n      status\n      reviewStatus\n      iconUrl\n      metadata\n    }\n  }\n`;\n\nconst SUBMIT_MUTATION = /* GraphQL */ `\n  mutation DevportalSubmitForReview($id: ID!, $notes: String) {\n    submitApplicationForReview(id: $id, notes: $notes) {\n      id\n      status\n      submittedAt\n      metadata\n    }\n  }\n`;\n\nfunction inferSubmission(app: Application | null): StoreSubmission | null {\n  if (!app) return null;\n  const metadata = (app.metadata ?? {}) as Record<string, unknown>;\n  const productId =\n    typeof metadata.storeProductId === \"string\" ? metadata.storeProductId : \"\";\n  const rawStatus =\n    typeof metadata.storeSubmissionStatus === \"string\"\n      ? metadata.storeSubmissionStatus\n      : null;\n  const status: SubmissionStatus =\n    rawStatus === \"PENDING_REVIEW\" ||\n    rawStatus === \"PUBLISHED\" ||\n    rawStatus === \"REJECTED\" ||\n    rawStatus === \"DRAFT\"\n      ? rawStatus\n      : \"UNKNOWN\";\n  return {\n    productId,\n    status,\n    submittedAt:\n      typeof metadata.storeSubmissionAt === \"string\"\n        ? metadata.storeSubmissionAt\n        : null,\n    reviewedAt: null,\n    publishedAt: null,\n    reviewNotes: null,\n    rejectedReason: null,\n  };\n}\n\ntype StatusMeta = {\n  i18nKey: string;\n  fallback: string;\n  icon: typeof CheckCircle2;\n  tone: string;\n};\n\nconst statusLabels: Record<SubmissionStatus, StatusMeta> = {\n  DRAFT: {\n    i18nKey: \"devportal.storeSubmission.status.draft\",\n    fallback: \"Draft\",\n    icon: Clock,\n    tone: \"text-text-secondary\",\n  },\n  PENDING_REVIEW: {\n    i18nKey: \"devportal.storeSubmission.status.pending\",\n    fallback: \"Pending review\",\n    icon: Clock,\n    tone: \"text-status-warning-text\",\n  },\n  PUBLISHED: {\n    i18nKey: \"devportal.storeSubmission.status.published\",\n    fallback: \"Published\",\n    icon: CheckCircle2,\n    tone: \"text-status-success-text\",\n  },\n  REJECTED: {\n    i18nKey: \"devportal.storeSubmission.status.rejected\",\n    fallback: \"Rejected\",\n    icon: XCircle,\n    tone: \"text-status-danger-text\",\n  },\n  UNKNOWN: {\n    i18nKey: \"devportal.storeSubmission.status.unknown\",\n    fallback: \"Not yet submitted\",\n    icon: AlertTriangle,\n    tone: \"text-text-tertiary\",\n  },\n};\n\nexport const StoreSubmissionPage: FC = () => {\n  const { appId } = useParams<{ appId: string }>();\n  const navigate = useNavigate();\n  const bus = useDevportalEventBus();\n  const tr = useTr();\n  const submitPerm = useDevportalPermission(DEVPORTAL_PERMISSIONS.APP_SUBMIT);\n  const [app, setApp] = useState<Application | null>(null);\n  const [loading, setLoading] = useState(true);\n  const [error, setError] = useState<string | null>(null);\n  const [submitting, setSubmitting] = useState(false);\n  const [notes, setNotes] = useState(\"\");\n  const load = async () => {\n    if (!appId) return;\n    setLoading(true);\n    setError(null);\n    try {\n      const result = await graphqlFetch<{ application: Application | null }>({\n        gateway: \"global\",\n        query: APP_QUERY,\n        variables: { id: appId },\n      });\n      if (result.errors?.length) {\n        throw new Error(\n          result.errors[0]?.message ??\n            tr(\n              \"devportal.storeSubmission.errors.loadFailed\",\n              \"Failed to load application\",\n            ),\n        );\n      }\n      setApp(result.data?.application ?? null);\n    } catch (err) {\n      setError(\n        err instanceof Error\n          ? err.message\n          : tr(\n              \"devportal.storeSubmission.errors.loadFailed\",\n              \"Failed to load application\",\n            ),\n      );\n    } finally {\n      setLoading(false);\n    }\n  };\n\n  useEffect(() => {\n    void load();\n  }, [appId]); // eslint-disable-line react-hooks/exhaustive-deps\n\n  useEffect(() => {\n    const name = app?.name;\n    if (!appId || !name) return;\n    const reg = (\n      window as unknown as {\n        __breadcrumbRegistry?: {\n          register: (id: string, name: string) => void;\n          unregister: (id: string) => void;\n        };\n      }\n    ).__breadcrumbRegistry;\n    reg?.register(appId, name);\n    return () => reg?.unregister(appId);\n  }, [appId, app?.name]);\n\n  const submit = async () => {\n    if (!appId) return;\n    setSubmitting(true);\n    setError(null);\n    try {\n      const result = await graphqlFetch({\n        gateway: \"global\",\n        query: SUBMIT_MUTATION,\n        variables: { id: appId, notes: notes || null },\n      });\n      if (result.errors?.length) {\n        throw new Error(\n          result.errors[0]?.message ??\n            tr(\n              \"devportal.storeSubmission.errors.submitFailed\",\n              \"Submission failed\",\n            ),\n        );\n      }\n      bus.emit(\"devportal.app.submitted\", { appId });\n      await load();\n    } catch (err) {\n      setError(\n        err instanceof Error\n          ? err.message\n          : tr(\n              \"devportal.storeSubmission.errors.submitFailed\",\n              \"Submission failed\",\n            ),\n      );\n    } finally {\n      setSubmitting(false);\n    }\n  };\n\n  const submission = inferSubmission(app);\n  const statusMeta = submission\n    ? statusLabels[submission.status]\n    : statusLabels.UNKNOWN;\n  const StatusIcon = statusMeta.icon;\n\n  return (\n    <main\n      className=\"min-h-screen bg-surface-default\"\n      aria-labelledby=\"store-submission-heading\"\n    >\n      <div className=\"border-b border-border-default bg-surface-raised\">\n        <div className=\"mx-auto max-w-3xl px-6 py-4\">\n          <div className=\"flex items-center gap-3\">\n            <button\n              type=\"button\"\n              onClick={() => navigate(-1)}\n              className=\"inline-flex items-center gap-2 rounded-md px-3 py-1.5 text-sm text-text-secondary hover:bg-surface-hover hover:text-text-primary focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary\"\n            >\n              <ArrowLeft className=\"h-4 w-4\" aria-hidden=\"true\" />\n              {tr(\"devportal.common.back\", \"Back\")}\n            </button>\n            <div className=\"flex items-center gap-2\">\n              <StoreIcon\n                className=\"h-5 w-5 text-text-primary\"\n                aria-hidden=\"true\"\n              />\n              <h1\n                id=\"store-submission-heading\"\n                className=\"text-xl font-semibold text-text-primary\"\n              >\n                {tr(\"devportal.storeSubmission.title\", \"Store submission\")}\n              </h1>\n            </div>\n          </div>\n        </div>\n      </div>\n\n      <div className=\"mx-auto max-w-3xl px-6 py-6\">\n        <PagePurpose className=\"mb-5\">\n          {tr(\n            \"devportal.storeSubmission.purpose\",\n            \"Finalize the details the marketplace needs before your app can be reviewed — pricing, categories, and required assets. Completing this is what makes the app eligible to submit for publication.\",\n          )}\n        </PagePurpose>\n\n        {error && (\n          <div\n            role=\"alert\"\n            className=\"mb-4 rounded-md border border-border-danger bg-surface-danger-muted px-4 py-3 text-sm text-text-danger\"\n          >\n            {error}\n          </div>\n        )}\n\n        {loading && !app ? (\n          <div\n            className=\"py-16 text-center text-text-secondary\"\n            role=\"status\"\n            aria-live=\"polite\"\n          >\n            {tr(\"devportal.storeSubmission.loading\", \"Loading application…\")}\n          </div>\n        ) : !app ? (\n          <IllustratedEmptyState\n            illustration=\"empty-generic\"\n            title={tr(\n              \"devportal.storeSubmission.notFoundTitle\",\n              \"Application not found\",\n            )}\n            description={tr(\n              \"devportal.storeSubmission.notFound\",\n              \"Application not found.\",\n            )}\n          />\n        ) : (\n          <div className=\"space-y-4\">\n            {/* App header */}\n            <div className=\"rounded-lg border border-border-default bg-surface-raised p-4\">\n              <div className=\"flex items-center gap-3\">\n                {app.iconUrl ? (\n                  <img\n                    src={app.iconUrl}\n                    alt=\"\"\n                    className=\"h-14 w-14 flex-shrink-0 rounded-md object-cover\"\n                  />\n                ) : (\n                  <div className=\"flex h-14 w-14 flex-shrink-0 items-center justify-center rounded-md bg-surface-muted text-text-secondary\">\n                    {app.name.slice(0, 2).toUpperCase()}\n                  </div>\n                )}\n                <div className=\"min-w-0 flex-1\">\n                  <h2 className=\"text-lg font-semibold text-text-primary\">\n                    {app.name}\n                  </h2>\n                  <p className=\"font-mono text-xs text-text-tertiary\">\n                    {app.slug}\n                  </p>\n                </div>\n                <div\n                  className={`flex items-center gap-1.5 ${statusMeta.tone}`}\n                  role=\"status\"\n                >\n                  <StatusIcon className=\"h-5 w-5\" aria-hidden=\"true\" />\n                  <span className=\"text-sm font-medium\">\n                    {tr(statusMeta.i18nKey, statusMeta.fallback)}\n                  </span>\n                </div>\n              </div>\n            </div>\n\n            {/* Timeline */}\n            {submission && submission.status !== \"UNKNOWN\" && (\n              <div className=\"rounded-lg border border-border-default bg-surface-raised p-4\">\n                <h3 className=\"mb-3 text-sm font-semibold text-text-primary\">\n                  {tr(\n                    \"devportal.storeSubmission.timeline\",\n                    \"Submission timeline\",\n                  )}\n                </h3>\n                <ul className=\"space-y-2 text-sm\">\n                  {submission.submittedAt && (\n                    <li className=\"flex items-center gap-2\">\n                      <Clock\n                        className=\"h-4 w-4 text-text-tertiary\"\n                        aria-hidden=\"true\"\n                      />\n                      <span className=\"text-text-secondary\">\n                        {tr(\n                          \"devportal.storeSubmission.submitted\",\n                          \"Submitted:\",\n                        )}\n                      </span>\n                      <span className=\"text-text-primary\">\n                        {new Date(submission.submittedAt).toLocaleString()}\n                      </span>\n                    </li>\n                  )}\n                  {submission.reviewedAt && (\n                    <li className=\"flex items-center gap-2\">\n                      <CheckCircle2\n                        className=\"h-4 w-4 text-text-tertiary\"\n                        aria-hidden=\"true\"\n                      />\n                      <span className=\"text-text-secondary\">\n                        {tr(\"devportal.storeSubmission.reviewed\", \"Reviewed:\")}\n                      </span>\n                      <span className=\"text-text-primary\">\n                        {new Date(submission.reviewedAt).toLocaleString()}\n                      </span>\n                    </li>\n                  )}\n                  {submission.publishedAt && (\n                    <li className=\"flex items-center gap-2\">\n                      <CheckCircle2\n                        className=\"h-4 w-4 text-status-success-text\"\n                        aria-hidden=\"true\"\n                      />\n                      <span className=\"text-text-secondary\">\n                        {tr(\n                          \"devportal.storeSubmission.published\",\n                          \"Published:\",\n                        )}\n                      </span>\n                      <span className=\"text-text-primary\">\n                        {new Date(submission.publishedAt).toLocaleString()}\n                      </span>\n                    </li>\n                  )}\n                </ul>\n                {submission.reviewNotes && (\n                  <div className=\"mt-3 rounded-md bg-surface-muted p-3\">\n                    <p className=\"text-xs font-medium text-text-secondary\">\n                      {tr(\n                        \"devportal.storeSubmission.reviewerNotes\",\n                        \"Reviewer notes\",\n                      )}\n                    </p>\n                    <p className=\"mt-1 text-sm text-text-primary\">\n                      {submission.reviewNotes}\n                    </p>\n                  </div>\n                )}\n                {submission.rejectedReason && (\n                  <div\n                    className=\"mt-3 rounded-md border border-border-danger bg-surface-danger-muted p-3\"\n                    role=\"alert\"\n                  >\n                    <p className=\"text-xs font-medium text-text-danger\">\n                      {tr(\n                        \"devportal.storeSubmission.rejectionReason\",\n                        \"Rejection reason\",\n                      )}\n                    </p>\n                    <p className=\"mt-1 text-sm text-text-primary\">\n                      {submission.rejectedReason}\n                    </p>\n                  </div>\n                )}\n              </div>\n            )}\n\n            {/* Submit / resubmit */}\n            {(!submission ||\n              submission.status === \"UNKNOWN\" ||\n              submission.status === \"DRAFT\" ||\n              submission.status === \"REJECTED\") && (\n              <div className=\"rounded-lg border border-border-default bg-surface-raised p-4\">\n                <h3 className=\"mb-2 text-sm font-semibold text-text-primary\">\n                  {submission?.status === \"REJECTED\"\n                    ? tr(\n                        \"devportal.storeSubmission.resubmitForReview\",\n                        \"Resubmit for review\",\n                      )\n                    : tr(\n                        \"devportal.storeSubmission.submitForReview\",\n                        \"Submit for review\",\n                      )}\n                </h3>\n                <p className=\"mb-3 text-sm text-text-secondary\">\n                  {tr(\n                    \"devportal.storeSubmission.help\",\n                    \"Your application will be sent to the store's review queue. Whether it's auto-published or requires admin approval depends on the target store's configuration.\",\n                  )}\n                </p>\n                <label className=\"block\" htmlFor=\"store-submission-notes\">\n                  <span className=\"sr-only\">\n                    {tr(\n                      \"devportal.storeSubmission.notesLabel\",\n                      \"Notes for the reviewer (optional)\",\n                    )}\n                  </span>\n                </label>\n                <textarea\n                  id=\"store-submission-notes\"\n                  value={notes}\n                  onChange={(e) => setNotes(e.target.value)}\n                  rows={3}\n                  placeholder={tr(\n                    \"devportal.storeSubmission.notesLabel\",\n                    \"Notes for the reviewer (optional)\",\n                  )}\n                  className=\"mb-3 w-full rounded-md border border-border-default bg-surface-default px-3 py-2 text-sm text-text-primary focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary\"\n                />\n                <button\n                  type=\"button\"\n                  onClick={() => void submit()}\n                  disabled={submitting || !submitPerm.allowed}\n                  aria-disabled={submitting || !submitPerm.allowed}\n                  title={\n                    !submitPerm.allowed\n                      ? tr(\n                          \"devportal.common.noPermission\",\n                          \"You do not have permission to perform this action\",\n                        )\n                      : undefined\n                  }\n                  className=\"inline-flex items-center gap-2 rounded-md bg-action-primary-bg px-4 py-2 text-sm font-semibold text-action-primary-text hover:opacity-90 disabled:opacity-60 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary\"\n                >\n                  {submitting && (\n                    <RefreshCw\n                      className=\"h-4 w-4 animate-spin\"\n                      aria-hidden=\"true\"\n                    />\n                  )}\n                  {submission?.status === \"REJECTED\"\n                    ? tr(\"devportal.storeSubmission.resubmit\", \"Resubmit\")\n                    : tr(\n                        \"devportal.storeSubmission.submitForReview\",\n                        \"Submit for review\",\n                      )}\n                </button>\n              </div>\n            )}\n\n            {submission?.productId && (\n              <div className=\"rounded-lg border border-border-default bg-surface-raised p-4\">\n                <p className=\"text-xs font-medium text-text-secondary\">\n                  {tr(\n                    \"devportal.storeSubmission.storeProductId\",\n                    \"Store product ID\",\n                  )}\n                </p>\n                <code className=\"mt-1 block break-all font-mono text-xs text-text-primary\">\n                  {submission.productId}\n                </code>\n              </div>\n            )}\n          </div>\n        )}\n      </div>\n    </main>\n  );\n};\n"],"mappings":"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"}

package/dist/devportal/pages/WebhookDetailPage.js

@@ -1,79 +1,80 @@
 import { useDevportal as e } from "../providers/DevportalProvider.js";
 import { EmptyState as t } from "../components/EmptyState.js";
-import { useDeleteWebhookMutation as n, useGetApplicationQuery as r, useGetWebhookDetailQuery as i, useTestWebhookMutation as a, useUpdateWebhookMutation as o } from "../../generated/global-operations.js";
-import { getErrorMessage as ee } from "../hooks/useGraphQL.js";
+import { useDeleteWebhookMutation as n, useGetApplicationQuery as r, useGetWebhookDetailQuery as i, useTestWebhookMutation as ee, useUpdateWebhookMutation as a } from "../../generated/global-operations.js";
+import { getErrorMessage as o } from "../hooks/useGraphQL.js";
 import { PageLayout as s, PageSection as c } from "../components/PageLayout.js";
 import { StatCard as l, StatCardGrid as u } from "../components/StatCard.js";
 import { StatusBadge as d } from "../components/StatusBadge.js";
-import { nativeImpact as f, nativeNotify as p } from "../../utils/nativeBridge.js";
-import { SecretDisplay as m } from "../components/SecretDisplay.js";
-import { DataTable as h, DetailList as g } from "../components/DataTable.js";
-import { Alert as _, ConfirmDialog as v } from "../components/ConfirmDialog.js";
-import { DEVPORTAL_PERMISSIONS as y } from "../constants/permissions.js";
-import { useDevportalPermission as b } from "../hooks/usePermission.js";
+import { nativeImpact as te, nativeNotify as f } from "../../utils/nativeBridge.js";
+import { SecretDisplay as ne } from "../components/SecretDisplay.js";
+import { DataTable as re, DetailList as ie } from "../components/DataTable.js";
+import { Alert as p, ConfirmDialog as m } from "../components/ConfirmDialog.js";
+import { DEVPORTAL_PERMISSIONS as h } from "../constants/permissions.js";
+import { useDevportalPermission as g } from "../hooks/usePermission.js";
 import "../hooks/index.js";
-import x from "../../node_modules/.bun/date-fns@3.6.0/node_modules/date-fns/format.js";
-import { useEffect as S, useMemo as C, useState as w } from "react";
-import { useI18n as te } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
-import { AlertCircle as ne, CheckCircle as T, Clock as re, ExternalLink as ie, Loader2 as ae, Pause as oe, Play as se, Send as ce, Trash2 as le, Webhook as ue, XCircle as E } from "lucide-react";
-import { useParams as D } from "react-router-dom";
-import { jsx as O, jsxs as k } from "react/jsx-runtime";
+import _ from "../../node_modules/date-fns/format.js";
+import { useEffect as v, useMemo as y, useState as b } from "react";
+import { useI18n as ae } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
+import { AlertCircle as oe, CheckCircle as x, Clock as S, ExternalLink as se, Loader2 as ce, Pause as C, Play as w, Send as T, Trash2 as le, Webhook as ue, XCircle as de } from "lucide-react";
+import { useParams as fe } from "react-router-dom";
+import { jsx as E, jsxs as D } from "react/jsx-runtime";
+import { CTAOverflowMenu as O, EmphasisPanel as k, NextSteps as A } from "@burdenoff/fe-libs/ui";
 //#region src/devportal/pages/WebhookDetailPage.tsx
-var A = (e) => e ? x(new Date(e), "MMM d, yyyy HH:mm:ss") : "Never", j = () => {
-	let { appId: j, webhookId: M } = D(), { navigate: N, basePath: P } = e(), { t: F } = te(), I = (e, t) => {
-		let n = F(e);
+var j = (e) => e ? _(new Date(e), "MMM d, yyyy HH:mm:ss") : "Never", M = () => {
+	let { appId: M, webhookId: N } = fe(), { navigate: P, basePath: F } = e(), { t: I } = ae(), L = (e, t) => {
+		let n = I(e);
 		return n === e ? t : n;
-	}, { allowed: L } = b(y.WEBHOOK_UPDATE), { allowed: R } = b(y.WEBHOOK_DELETE), [z, B] = w(!1), [V, H] = w(!1), [U, W] = w(null), [de, G] = w(!1), { data: K } = r({
-		variables: { id: j ?? "" },
-		skip: !j,
+	}, { allowed: R } = g(h.WEBHOOK_UPDATE), { allowed: z } = g(h.WEBHOOK_DELETE), [B, V] = b(!1), [pe, H] = b(!1), [U, W] = b(null), [me, G] = b(!1), { data: K } = r({
+		variables: { id: M ?? "" },
+		skip: !M,
 		fetchPolicy: "cache-first"
 	});
-	S(() => {
+	v(() => {
 		let e = K?.application?.name;
-		if (!j || !e) return;
+		if (!M || !e) return;
 		let t = window.__breadcrumbRegistry;
-		return t?.register(j, e), () => t?.unregister(j);
-	}, [j, K?.application?.name]);
-	let { data: q, loading: fe, error: J, refetch: Y } = i({
+		return t?.register(M, e), () => t?.unregister(M);
+	}, [M, K?.application?.name]);
+	let { data: q, loading: he, error: J, refetch: Y } = i({
 		variables: {
-			id: M || "",
+			id: N || "",
 			limit: 20,
 			offset: 0
 		},
-		skip: !M,
+		skip: !N,
 		fetchPolicy: "cache-and-network"
-	}), [pe, { loading: me }] = o(), [he, { loading: ge }] = n(), [X, { loading: _e }] = a(), Z = q?.webhook;
-	S(() => {
-		let e = Z?.name;
-		if (!M || !e) return;
+	}), [ge, { loading: _e }] = a(), [ve, { loading: ye }] = n(), [be, { loading: xe }] = ee(), X = q?.webhook;
+	v(() => {
+		let e = X?.name;
+		if (!N || !e) return;
 		let t = window.__breadcrumbRegistry;
-		return t?.register(M, e), () => t?.unregister(M);
-	}, [M, Z?.name]);
-	let Q = q?.webhookDeliveries?.edges?.map((e) => e.node) ?? [], $ = j || Z?.applicationId, ve = C(() => {
-		if (!Z) return 0;
-		let e = (Z.successCount ?? 0) + (Z.failureCount ?? 0);
-		return e === 0 ? 100 : Math.round((Z.successCount ?? 0) / e * 100);
-	}, [Z]), ye = (e) => {
-		N?.(`${P}${e}`);
-	}, be = async () => {
-		Z && (await pe({ variables: {
-			id: Z.id,
-			input: { isActive: !Z.isActive }
+		return t?.register(N, e), () => t?.unregister(N);
+	}, [N, X?.name]);
+	let Z = q?.webhookDeliveries?.edges?.map((e) => e.node) ?? [], Q = M || X?.applicationId, Se = y(() => {
+		if (!X) return 0;
+		let e = (X.successCount ?? 0) + (X.failureCount ?? 0);
+		return e === 0 ? 100 : Math.round((X.successCount ?? 0) / e * 100);
+	}, [X]), Ce = (e) => {
+		P?.(`${F}${e}`);
+	}, $ = async () => {
+		X && (await ge({ variables: {
+			id: X.id,
+			input: { isActive: !X.isActive }
 		} }), await Y());
-	}, xe = async () => {
-		if (Z) {
-			f("medium");
+	}, we = async () => {
+		if (X) {
+			te("medium");
 			try {
-				await he({ variables: { id: Z.id } }), p("success"), ye(`/apps/${Z.applicationId}/webhooks`);
+				await ve({ variables: { id: X.id } }), f("success"), Ce(`/apps/${X.applicationId}/webhooks`);
 			} catch {
-				p("error");
+				f("error");
 			}
 		}
-	}, Se = async () => {
-		if (!Z) return;
-		let e = (await X({ variables: {
-			id: Z.id,
-			eventType: Z.events[0] || "application.updated"
+	}, Te = async () => {
+		if (!X) return;
+		let e = (await be({ variables: {
+			id: X.id,
+			eventType: X.events[0] || "application.updated"
 		} })).data?.testWebhook;
 		if (!e) {
 			G(!1), W("Test request did not return a response.");
@@ -81,157 +82,168 @@ var A = (e) => e ? x(new Date(e), "MMM d, yyyy HH:mm:ss") : "Never", j = () => {
 		}
 		G(e.success), W(e.success ? `Test delivery succeeded with HTTP ${e.statusCode ?? 200}.` : e.error || "Webhook test failed."), await Y();
 	};
-	return fe && !Z ? /* @__PURE__ */ O(s, {
-		title: I("devportal.webhook", "Webhook"),
-		description: I("devportal.loadingWebhookDetails", "Loading webhook details"),
-		backLink: $ ? `/apps/${$}/webhooks` : "/webhooks",
-		backLabel: I("devportal.backToWebhooks", "Back to Webhooks"),
-		children: /* @__PURE__ */ O("div", {
-			className: "flex items-center justify-center py-16 text-muted-foreground",
-			children: /* @__PURE__ */ O(ae, { className: "h-8 w-8 animate-spin" })
+	return he && !X ? /* @__PURE__ */ E(s, {
+		title: L("devportal.webhook", "Webhook"),
+		description: L("devportal.loadingWebhookDetails", "Loading webhook details"),
+		backLink: Q ? `/apps/${Q}/webhooks` : "/webhooks",
+		backLabel: L("devportal.backToWebhooks", "Back to Webhooks"),
+		children: /* @__PURE__ */ E("div", {
+			className: "flex items-center justify-center py-16 text-text-secondary",
+			children: /* @__PURE__ */ E(ce, { className: "h-8 w-8 animate-spin" })
 		})
-	}) : J || !Z ? /* @__PURE__ */ O(s, {
-		title: I("devportal.webhook", "Webhook"),
-		description: I("devportal.webhookDetails", "Webhook details"),
-		backLink: $ ? `/apps/${$}/webhooks` : "/webhooks",
-		backLabel: I("devportal.backToWebhooks", "Back to Webhooks"),
-		children: /* @__PURE__ */ O(t, {
-			icon: /* @__PURE__ */ O(ne, {
+	}) : J || !X ? /* @__PURE__ */ E(s, {
+		title: L("devportal.webhook", "Webhook"),
+		description: L("devportal.webhookDetails", "Webhook details"),
+		backLink: Q ? `/apps/${Q}/webhooks` : "/webhooks",
+		backLabel: L("devportal.backToWebhooks", "Back to Webhooks"),
+		children: /* @__PURE__ */ E(t, {
+			icon: /* @__PURE__ */ E(oe, {
 				size: 32,
 				className: "text-status-error-text"
 			}),
-			title: I("devportal.unableToLoadWebhook", "Unable to load webhook"),
-			description: J ? ee(J) : I("devportal.webhookNotFound", "Webhook not found")
+			title: L("devportal.unableToLoadWebhook", "Unable to load webhook"),
+			description: J ? o(J) : L("devportal.webhookNotFound", "Webhook not found")
 		})
-	}) : /* @__PURE__ */ k(s, {
-		title: Z.name,
-		description: Z.description || "Webhook configuration and delivery history",
-		backLink: `/apps/${$}/webhooks`,
-		backLabel: I("devportal.backToWebhooks", "Back to Webhooks"),
-		actions: /* @__PURE__ */ k("div", {
-			className: "flex flex-wrap gap-2",
-			children: [
-				/* @__PURE__ */ k("button", {
-					type: "button",
-					onClick: () => {
-						W(null), H(!0);
-					},
-					className: "inline-flex items-center gap-2 rounded-md border px-3 py-2 text-sm font-medium hover:bg-accent",
-					children: [/* @__PURE__ */ O(ce, { size: 16 }), I("devportal.test", "Test")]
-				}),
-				/* @__PURE__ */ k("button", {
-					type: "button",
-					disabled: me || !L,
-					"aria-disabled": !L,
-					onClick: () => void be(),
-					className: "inline-flex items-center gap-2 rounded-md border px-3 py-2 text-sm font-medium hover:bg-accent disabled:cursor-not-allowed disabled:opacity-50",
-					children: [Z.isActive ? /* @__PURE__ */ O(oe, { size: 16 }) : /* @__PURE__ */ O(se, { size: 16 }), Z.isActive ? I("devportal.pauseWebhook", "Pause") : I("devportal.resumeWebhook", "Resume")]
-				}),
-				/* @__PURE__ */ k("button", {
-					type: "button",
-					onClick: () => B(!0),
-					disabled: !R,
-					"aria-disabled": !R,
-					className: "inline-flex items-center gap-2 rounded-md border border-status-error-border px-3 py-2 text-sm font-medium text-status-error-text hover:bg-status-error-bg-subtle disabled:opacity-50",
-					children: [/* @__PURE__ */ O(le, { size: 16 }), I("devportal.deleteWebhook", "Delete")]
-				})
-			]
+	}) : /* @__PURE__ */ D(s, {
+		title: X.name,
+		description: X.description || "Webhook configuration and delivery history",
+		purpose: L("devportal.webhookDetailPurpose", "This endpoint receives the events you subscribed to, signed with your secret. Check the delivery history to confirm your server is responding with 2xx, send a test event, and pause it if your endpoint is down so deliveries are not lost to repeated failures."),
+		backLink: `/apps/${Q}/webhooks`,
+		backLabel: L("devportal.backToWebhooks", "Back to Webhooks"),
+		actions: /* @__PURE__ */ E(O, {
+			primary: {
+				label: L("devportal.test", "Test"),
+				icon: /* @__PURE__ */ E(T, { size: 16 }),
+				onSelect: () => {
+					W(null), H(!0);
+				}
+			},
+			actions: [{
+				label: X.isActive ? L("devportal.pauseWebhook", "Pause") : L("devportal.resumeWebhook", "Resume"),
+				icon: X.isActive ? /* @__PURE__ */ E(C, { size: 16 }) : /* @__PURE__ */ E(w, { size: 16 }),
+				disabled: _e || !R,
+				onSelect: () => void $()
+			}, {
+				label: L("devportal.deleteWebhook", "Delete"),
+				icon: /* @__PURE__ */ E(le, { size: 16 }),
+				intent: "destructive",
+				disabled: !z,
+				onSelect: () => V(!0)
+			}]
 		}),
 		children: [
-			/* @__PURE__ */ k(u, {
+			/* @__PURE__ */ E(k, { children: /* @__PURE__ */ D(u, {
 				columns: 4,
 				children: [
-					/* @__PURE__ */ O(l, {
-						title: I("devportal.successRate", "Success Rate"),
-						value: `${ve}%`,
-						icon: /* @__PURE__ */ O(T, { size: 20 })
+					/* @__PURE__ */ E(l, {
+						title: L("devportal.successRate", "Success Rate"),
+						value: `${Se}%`,
+						icon: /* @__PURE__ */ E(x, { size: 20 })
 					}),
-					/* @__PURE__ */ O(l, {
-						title: I("devportal.successfulDeliveries", "Successful Deliveries"),
-						value: (Z.successCount ?? 0).toLocaleString(),
-						icon: /* @__PURE__ */ O(T, { size: 20 })
+					/* @__PURE__ */ E(l, {
+						title: L("devportal.successfulDeliveries", "Successful Deliveries"),
+						value: (X.successCount ?? 0).toLocaleString(),
+						icon: /* @__PURE__ */ E(x, { size: 20 })
 					}),
-					/* @__PURE__ */ O(l, {
-						title: I("devportal.failedDeliveries", "Failed Deliveries"),
-						value: (Z.failureCount ?? 0).toLocaleString(),
-						icon: /* @__PURE__ */ O(E, { size: 20 })
+					/* @__PURE__ */ E(l, {
+						title: L("devportal.failedDeliveries", "Failed Deliveries"),
+						value: (X.failureCount ?? 0).toLocaleString(),
+						icon: /* @__PURE__ */ E(de, { size: 20 })
 					}),
-					/* @__PURE__ */ O(l, {
-						title: I("devportal.lastTriggered", "Last Triggered"),
-						value: Z.lastTriggeredAt ? x(new Date(Z.lastTriggeredAt), "MMM d, HH:mm") : I("devportal.never", "Never"),
-						icon: /* @__PURE__ */ O(re, { size: 20 })
+					/* @__PURE__ */ E(l, {
+						title: L("devportal.lastTriggered", "Last Triggered"),
+						value: X.lastTriggeredAt ? _(new Date(X.lastTriggeredAt), "MMM d, HH:mm") : L("devportal.never", "Never"),
+						icon: /* @__PURE__ */ E(S, { size: 20 })
 					})
 				]
+			}) }),
+			/* @__PURE__ */ E(A, {
+				storageKey: `devportal-webhook-${X.id}`,
+				steps: [{
+					id: "test",
+					label: L("devportal.sendTestEvent", "Send a test event"),
+					description: L("devportal.webhookStepTest", "Confirm your endpoint receives and verifies the payload"),
+					icon: /* @__PURE__ */ E(T, { size: 16 }),
+					onClick: () => {
+						W(null), H(!0);
+					}
+				}, {
+					id: "toggle",
+					label: X.isActive ? L("devportal.pauseWebhook", "Pause deliveries") : L("devportal.resumeWebhook", "Resume deliveries"),
+					description: L("devportal.webhookStepToggle", "Pause while your endpoint is down to avoid lost retries"),
+					icon: X.isActive ? /* @__PURE__ */ E(C, { size: 16 }) : /* @__PURE__ */ E(w, { size: 16 }),
+					onClick: () => void $()
+				}]
 			}),
-			/* @__PURE__ */ O(c, {
-				title: I("devportal.configuration", "Configuration"),
-				children: /* @__PURE__ */ O(g, { items: [
+			/* @__PURE__ */ E(c, {
+				title: L("devportal.configuration", "Configuration"),
+				children: /* @__PURE__ */ E(ie, { items: [
 					{
-						label: I("devportal.status", "Status"),
-						value: /* @__PURE__ */ O(d, {
-							status: Z.status,
+						label: L("devportal.status", "Status"),
+						value: /* @__PURE__ */ E(d, {
+							status: X.status,
 							type: "webhook"
 						})
 					},
 					{
-						label: I("devportal.endpointUrl", "Endpoint URL"),
-						value: /* @__PURE__ */ k("span", {
+						label: L("devportal.endpointUrl", "Endpoint URL"),
+						value: /* @__PURE__ */ D("span", {
 							className: "flex flex-wrap items-center gap-2 font-mono text-sm",
-							children: [/* @__PURE__ */ O("span", {
+							children: [/* @__PURE__ */ E("span", {
 								className: "break-all",
-								children: Z.url
-							}), /* @__PURE__ */ O("a", {
-								href: Z.url,
+								children: X.url
+							}), /* @__PURE__ */ E("a", {
+								href: X.url,
 								target: "_blank",
 								rel: "noopener noreferrer",
 								className: "text-primary",
-								children: /* @__PURE__ */ O(ie, { size: 14 })
+								children: /* @__PURE__ */ E(se, { size: 14 })
 							})]
 						})
 					},
 					{
-						label: I("devportal.signingSecret", "Signing Secret"),
-						value: /* @__PURE__ */ O(m, {
-							value: Z.secret || "******",
+						label: L("devportal.signingSecret", "Signing Secret"),
+						value: /* @__PURE__ */ E(ne, {
+							value: X.secret || "******",
 							label: ""
 						})
 					},
 					{
-						label: I("devportal.subscribedEvents", "Subscribed Events"),
-						value: /* @__PURE__ */ O("div", {
+						label: L("devportal.subscribedEvents", "Subscribed Events"),
+						value: /* @__PURE__ */ E("div", {
 							className: "flex flex-wrap gap-1",
-							children: Z.events.map((e) => /* @__PURE__ */ O("code", {
-								className: "rounded bg-muted px-1.5 py-0.5 text-xs",
+							children: X.events.map((e) => /* @__PURE__ */ E("code", {
+								className: "rounded bg-bg-sunken px-1.5 py-0.5 text-xs",
 								children: e
 							}, e))
 						})
 					},
 					{
-						label: I("devportal.retryPolicy", "Retry Policy"),
-						value: Z.retryEnabled ? I("devportal.retryPolicyEnabled", `Up to ${Z.maxRetries ?? 0} retries`) : I("devportal.retriesDisabled", "Retries disabled")
+						label: L("devportal.retryPolicy", "Retry Policy"),
+						value: X.retryEnabled ? L("devportal.retryPolicyEnabled", `Up to ${X.maxRetries ?? 0} retries`) : L("devportal.retriesDisabled", "Retries disabled")
 					},
 					{
-						label: I("devportal.created", "Created"),
-						value: A(Z.createdAt)
+						label: L("devportal.created", "Created"),
+						value: j(X.createdAt)
 					},
 					{
-						label: I("devportal.updated", "Updated"),
-						value: A(Z.updatedAt)
+						label: L("devportal.updated", "Updated"),
+						value: j(X.updatedAt)
 					}
 				] })
 			}),
-			/* @__PURE__ */ O(c, {
-				title: I("devportal.recentDeliveries", "Recent Deliveries"),
-				children: Q.length > 0 ? /* @__PURE__ */ O(h, {
-					data: Q,
+			/* @__PURE__ */ E(c, {
+				title: L("devportal.recentDeliveries", "Recent Deliveries"),
+				children: Z.length > 0 ? /* @__PURE__ */ E(re, {
+					data: Z,
 					keyField: "id",
 					columns: [
 						{
 							key: "status",
-							header: I("devportal.status", "Status"),
-							render: (e) => /* @__PURE__ */ O("div", {
+							header: L("devportal.status", "Status"),
+							render: (e) => /* @__PURE__ */ E("div", {
 								className: "flex items-center gap-2",
-								children: /* @__PURE__ */ O(d, {
+								children: /* @__PURE__ */ E(d, {
 									status: e.status,
 									type: "delivery"
 								})
@@ -239,56 +251,57 @@ var A = (e) => e ? x(new Date(e), "MMM d, yyyy HH:mm:ss") : "Never", j = () => {
 						},
 						{
 							key: "eventType",
-							header: I("devportal.event", "Event"),
-							render: (e) => /* @__PURE__ */ O("code", {
+							header: L("devportal.event", "Event"),
+							render: (e) => /* @__PURE__ */ E("code", {
 								className: "text-xs",
 								children: e.eventType
 							})
 						},
 						{
 							key: "responseStatus",
-							header: I("devportal.response", "Response"),
+							header: L("devportal.response", "Response"),
 							render: (e) => e.responseStatus ?? "-"
 						},
 						{
 							key: "attemptNumber",
-							header: I("devportal.attempts", "Attempts"),
+							header: L("devportal.attempts", "Attempts"),
 							render: (e) => e.attemptNumber
 						},
 						{
 							key: "createdAt",
-							header: I("devportal.created", "Created"),
-							render: (e) => A(e.createdAt)
+							header: L("devportal.created", "Created"),
+							render: (e) => j(e.createdAt)
 						}
 					]
-				}) : /* @__PURE__ */ O(t, {
-					icon: /* @__PURE__ */ O(ue, { size: 24 }),
-					title: I("devportal.noDeliveriesYet", "No deliveries yet"),
-					description: I("devportal.noDeliveriesYetDescription", "Deliveries will appear here after the first matching event is sent to this endpoint.")
+				}) : /* @__PURE__ */ E(t, {
+					illustration: "empty-notifications",
+					icon: /* @__PURE__ */ E(ue, { size: 24 }),
+					title: L("devportal.noDeliveriesYet", "No deliveries yet"),
+					description: L("devportal.noDeliveriesYetDescription", "Deliveries will appear here after the first matching event is sent to this endpoint.")
 				})
 			}),
-			/* @__PURE__ */ O(v, {
-				open: z,
-				onOpenChange: B,
-				onConfirm: () => void xe(),
-				loading: ge,
-				title: I("devportal.deleteWebhookTitle", "Delete webhook"),
-				description: I("devportal.deleteWebhookDescription", "Deleting this webhook stops all future deliveries for this endpoint."),
-				confirmLabel: I("devportal.deleteWebhookConfirm", "Delete webhook"),
+			/* @__PURE__ */ E(m, {
+				open: B,
+				onOpenChange: V,
+				onConfirm: () => void we(),
+				loading: ye,
+				title: L("devportal.deleteWebhookTitle", "Delete webhook"),
+				description: L("devportal.deleteWebhookDescription", "Deleting this webhook stops all future deliveries for this endpoint."),
+				confirmLabel: L("devportal.deleteWebhookConfirm", "Delete webhook"),
 				variant: "danger"
 			}),
-			/* @__PURE__ */ O(v, {
-				open: V,
+			/* @__PURE__ */ E(m, {
+				open: pe,
 				onOpenChange: (e) => {
 					H(e), e || W(null);
 				},
-				onConfirm: () => void Se(),
-				loading: _e,
-				title: I("devportal.sendTestDelivery", "Send test delivery"),
-				description: I("devportal.sendTestDeliveryDescription", "A signed test event will be sent to the configured endpoint through the public gateway."),
-				confirmLabel: I("devportal.sendTestEvent", "Send test event"),
-				children: U && /* @__PURE__ */ O(_, {
-					variant: de ? "success" : "error",
+				onConfirm: () => void Te(),
+				loading: xe,
+				title: L("devportal.sendTestDelivery", "Send test delivery"),
+				description: L("devportal.sendTestDeliveryDescription", "A signed test event will be sent to the configured endpoint through the public gateway."),
+				confirmLabel: L("devportal.sendTestEvent", "Send test event"),
+				children: U && /* @__PURE__ */ E(p, {
+					variant: me ? "success" : "error",
 					children: U
 				})
 			})
@@ -296,6 +309,6 @@ var A = (e) => e ? x(new Date(e), "MMM d, yyyy HH:mm:ss") : "Never", j = () => {
 	});
 };
 //#endregion
-export { j as WebhookDetailPage };
+export { M as WebhookDetailPage };
 
 //# sourceMappingURL=WebhookDetailPage.js.map