@bcrumbs.net/inbox 0.0.63 → 0.0.65

package/src/app/dashboard/components/DashboardSections.d.ts

@@ -1,7 +1,8 @@
-import { Agent, AgentsReportQuery, ConvTagsReportQuery, ConvsReportQuery, Conversation } from '../../../graphql.autogenerated';
+import { Agent, AgentsReportQuery, ConvTagsReportQuery, ConvsReportQuery, Conversation, ConvStagesReportQuery } from '../../../graphql.autogenerated';
 import React from 'react';
 type AgentReportNode = NonNullable<AgentsReportQuery['agentsReport']['nodes']>[number];
 type ConvTagReportNode = NonNullable<ConvTagsReportQuery['convTagsReport']['nodes']>[number];
+type ConvLifecycleReportNode = NonNullable<ConvStagesReportQuery['convStagesReport']['nodes']>[number];
 type ConvReportNode = NonNullable<ConvsReportQuery['convsReport']['nodes']>[number];
 type ReportNode = AgentReportNode | ConvReportNode;
 interface DashboardSectionsProps {
@@ -11,7 +12,11 @@ interface DashboardSectionsProps {
     agentsLoading?: boolean;
     agentsReportLoading?: boolean;
     convTagsReportData?: ConvTagReportNode[];
+    convLifecycleReportData?: ConvLifecycleReportNode[];
+    /** Workspace lifecycle stage names in configured order. */
+    convLifecycleStages?: string[];
     convTagsReportLoading?: boolean;
+    convLifecycleReportLoading?: boolean;
     totalMessages?: number;
     convsLoading?: boolean;
     integrationId?: string;
@@ -25,5 +30,5 @@ interface DashboardSectionsProps {
     selectedPeriod: string;
     reportNodes: ReportNode[];
 }
-declare const _default: React.MemoExoticComponent<({ agentsData, allAgentsData, agentsReportData, agentsLoading, agentsReportLoading, convTagsReportData, convTagsReportLoading, totalMessages, convsLoading, integrationId, agentIds, assignedConversations, unassignedConversations, liveConvs, periodFilteredLiveConvs, startDate, endDate, selectedPeriod, reportNodes, }: DashboardSectionsProps) => import("@emotion/react/jsx-runtime").JSX.Element>;
+declare const _default: React.MemoExoticComponent<({ agentsData, allAgentsData, agentsReportData, agentsLoading, agentsReportLoading, convTagsReportData, convTagsReportLoading, totalMessages, convsLoading, integrationId, agentIds, assignedConversations, unassignedConversations, liveConvs, periodFilteredLiveConvs, startDate, endDate, selectedPeriod, reportNodes, convLifecycleReportData, convLifecycleStages, convLifecycleReportLoading, }: DashboardSectionsProps) => import("@emotion/react/jsx-runtime").JSX.Element>;
 export default _default;

package/src/app/dashboard/components/InboxDashboard.d.ts

@@ -5,6 +5,8 @@ export interface InboxDashboardProps {
     selectedAgents: string[];
     agentsData?: Agent[];
     agentsLoading?: boolean;
+    /** Reports whether this section still waits for data — used by the PDF export. */
+    onLoadingChange?: (loading: boolean) => void;
 }
-declare const InboxDashboard: ({ selectedChannel, selectedPeriod, selectedAgents, agentsData, agentsLoading, }: InboxDashboardProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+declare const InboxDashboard: ({ selectedChannel, selectedPeriod, selectedAgents, agentsData, agentsLoading, onLoadingChange, }: InboxDashboardProps) => import("@emotion/react/jsx-runtime").JSX.Element;
 export default InboxDashboard;

package/src/app/dashboard/hooks/useDashboardPdfMeta.d.ts

@@ -0,0 +1,31 @@
+type Option = {
+    value: string;
+    text: string;
+};
+export type DashboardPdfMetaInput = {
+    reportPeriod: {
+        options: Option[];
+        selected: string;
+    };
+    broadcastPeriod: {
+        options: Option[];
+        selected: string;
+    };
+    channelOptions: Option[];
+    selectedChannel?: string;
+    agents: {
+        options: Option[];
+        selected: string[];
+    };
+};
+export type DashboardPdfMeta = {
+    title: string;
+    meta: {
+        label: string;
+        value: string;
+    }[];
+    filename: string;
+};
+/** Builds the localized header lines and the file name used by the dashboard PDF export. */
+export declare function useDashboardPdfMeta({ reportPeriod, broadcastPeriod, channelOptions, selectedChannel, agents, }: DashboardPdfMetaInput): DashboardPdfMeta;
+export default useDashboardPdfMeta;

package/src/app/dashboard/hooks/useDashboardTabsPdfExport.d.ts

@@ -0,0 +1,26 @@
+import { RefObject } from 'react';
+export type DashboardSectionKey = 'reports' | 'broadcast';
+export type DashboardPdfExportPhase = 'loadingData' | 'renderingCharts' | 'generatingPdf';
+export type DashboardPdfExportStatus = 'processing' | 'completed' | 'failed';
+export type DashboardTabsPdfExportInput = {
+    targetRef: RefObject<HTMLElement>;
+    filename: string;
+};
+export type DashboardTabsPdfExport = {
+    exporting: boolean;
+    /** True while both dashboard tabs must stay mounted for the capture. */
+    renderAllSections: boolean;
+    setSectionLoading: (section: DashboardSectionKey, loading: boolean) => void;
+    exportAllSections: () => Promise<void>;
+    /** Progress percentage (0-100) for the export dialog. */
+    progress: number;
+    /** Which step of the export is running, for the dialog status text. */
+    phase: DashboardPdfExportPhase;
+    status: DashboardPdfExportStatus;
+    progressDialogOpen: boolean;
+    cancelExport: () => void;
+    closeProgressDialog: () => void;
+};
+/** Mounts every dashboard section, waits for its data, then exports the whole board as one PDF. */
+export declare function useDashboardTabsPdfExport({ targetRef, filename }: DashboardTabsPdfExportInput): DashboardTabsPdfExport;
+export default useDashboardTabsPdfExport;

package/src/app/dashboard/utils/dashboardReportExports.d.ts

@@ -1,6 +1,7 @@
 import { BroadcastReportFragment, Conversation } from '../../../graphql.autogenerated';
 import { CsvCell } from '../../../utils/exportCsv';
-export type DashboardExportReportKey = 'opened_chats' | 'conversation_analytics' | 'agent_performance' | 'tag_performance' | 'broadcast_recipients' | 'campaign_progress' | 'status_distribution';
+import { LifecycleStageNode } from './lifecycleStages';
+export type DashboardExportReportKey = 'opened_chats' | 'chats_by_lifecycle' | 'conversation_analytics' | 'agent_performance' | 'tag_performance' | 'broadcast_recipients' | 'campaign_progress' | 'status_distribution';
 export declare function dashboardExportFilename(reportKey: DashboardExportReportKey, startDate: string): string;
 /** Matches ticket examples: "21 sec", "4m 30s", "2h 05m". */
 export declare function formatExportDuration(seconds: number): string;
@@ -13,6 +14,18 @@ export interface OpenedChatsExportLabels {
 }
 export declare function buildOpenedChatsExportRows(conversations: Pick<Conversation, 'createdAt' | 'assigneeId'>[], startDate: string, endDate: string): CsvCell[][];
 export declare function exportOpenedChatsCsv(conversations: Pick<Conversation, 'createdAt' | 'assigneeId'>[], startDate: string, endDate: string, labels: OpenedChatsExportLabels): void;
+export interface LifecycleStagesExportLabels {
+    date: string;
+    total: string;
+    /** Display name for each canonical stage key; the key is used when missing. */
+    stageNames: Record<string, string>;
+}
+/**
+ * One row per day with a column per stage and the day's total, then a totals row.
+ * Totals come from every report row, so the last row always matches the pie chart.
+ */
+export declare function buildLifecycleStagesExportRows(nodes: LifecycleStageNode[], stages: string[], configuredStages: string[], startDate: string, endDate: string): CsvCell[][];
+export declare function exportLifecycleStagesCsv(nodes: LifecycleStageNode[], stages: string[], configuredStages: string[], startDate: string, endDate: string, labels: LifecycleStagesExportLabels): void;
 export interface ConversationAnalyticsExportLabels {
     date: string;
     conversations: string;
@@ -27,6 +40,7 @@ export declare function exportConversationAnalyticsCsv(reportNodes: {
 }[], startDate: string, endDate: string, labels: ConversationAnalyticsExportLabels): void;
 export interface AgentPerformanceExportRow {
     agentName: string;
+    averageRating: number | null;
     conversationCount: number;
     newClientConvCount: number;
     agentMessagesCount: number;
@@ -36,6 +50,7 @@ export interface AgentPerformanceExportRow {
 }
 export interface AgentPerformanceExportLabels {
     agent: string;
+    rating: string;
     closed: string;
     uniqueClosed: string;
     messagesSent: string;

package/src/app/dashboard/utils/exportDashboardPdf.d.ts

@@ -0,0 +1,19 @@
+export interface ExportDashboardPdfOptions {
+    element: HTMLElement;
+    filename: string;
+    /** Checked between steps; when it returns true the export stops without downloading. */
+    isCancelled?: () => boolean;
+}
+export declare function prepareClone(doc: Document): void;
+/** Walks up from the element to find the first non-transparent background color. */
+export declare function resolveBackgroundColor(element: HTMLElement): string;
+export interface PdfPageLayout {
+    contentWidthPt: number;
+    pxToPt: number;
+    pageHeightPx: number;
+    totalPages: number;
+}
+/** Maps a full-height capture onto A4 pages: how many pages, and how many source pixels each holds. */
+export declare function calculatePdfPageLayout(canvasWidth: number, canvasHeight: number): PdfPageLayout;
+/** Renders the given dashboard container into a paginated A4 PDF and downloads it. */
+export declare function exportDashboardPdf({ element, filename, isCancelled }: ExportDashboardPdfOptions): Promise<void>;

package/src/app/dashboard/utils/lifecycleStages.d.ts

@@ -0,0 +1,53 @@
+/** Stage key for conversations that have no lifecycle stage. */
+export declare const NOT_SET_STAGE = "notSet";
+/**
+ * Main colors for lifecycle slices (light surface), assigned in this fixed order to stages 1–8.
+ * The order is what keeps neighbouring slices apart for colour-blind readers: it was checked
+ * with a palette validator for 2–8 slices, including the last-to-first pair a donut closes.
+ * Change the values or the order only after re-running that validation.
+ */
+export declare const LIFECYCLE_STAGE_COLORS: readonly ["#2a78d6", "#eb6834", "#1baf7a", "#eda100", "#e87ba4", "#008300", "#4a3aa7", "#e34948"];
+/**
+ * Extra main colors for stages 9–12. Each one stays clearly apart from every other main color
+ * (ΔE ≥ 15 for normal vision and ≥ 8 for colour-blind vision), not just from its neighbours.
+ * Light blue is faint on white (about 2:1), so the legend label carries it.
+ */
+export declare const LIFECYCLE_STAGE_EXTRA_COLORS: readonly ["#92074c", "#82b5ef", "#ac4aa6", "#7706fd"];
+/**
+ * Lighter or darker versions of main hues for stages 13–18. They keep neighbouring slices apart,
+ * but each sits close to one of the main colors, so these stages lean more on the legend labels.
+ */
+export declare const LIFECYCLE_STAGE_VARIANT_COLORS: readonly ["#9f0117", "#a56f00", "#ab446e", "#52bc4c", "#a33902", "#01724d"];
+/** Conversations without a stage read as "no data", so they get a neutral. */
+export declare const NOT_SET_STAGE_COLOR = "#9da4ae";
+/** Stages past the sequence (19 and up) share one darker neutral, so no series color ever means two stages. */
+export declare const LIFECYCLE_OVERFLOW_COLOR = "#6c737f";
+export interface LifecycleStageNode {
+    stage: string;
+    conversationCount: number;
+    createdAt: string;
+}
+export interface LifecycleStageTotal {
+    /** Canonical stage key: the configured stage name, the raw report name, or NOT_SET_STAGE. */
+    stage: string;
+    value: number;
+    color: string;
+}
+/**
+ * Maps a report stage name onto the workspace's configured spelling (case-insensitive),
+ * and folds blank or "notSet" values into NOT_SET_STAGE.
+ */
+export declare function createStageResolver(configuredStages: string[]): (stage?: string | null) => string;
+/**
+ * Orders every stage the chart may show: configured stages in workspace order, then stages the
+ * report returned that are no longer configured (alphabetically), then "not set".
+ * A stage's color comes from its position here, so it stays the same when filters hide other stages.
+ */
+export declare function orderLifecycleStages(configuredStages: string[], reportedStages: Iterable<string>): string[];
+/** Color for the stage at `index` of the ordered stage list. */
+export declare function lifecycleStageColor(stage: string, index: number): string;
+/**
+ * Sums conversations per stage across days and channels, in chart order.
+ * Stages with no conversations are left out; colors still follow each stage's position.
+ */
+export declare function buildLifecycleStageTotals(nodes: LifecycleStageNode[], configuredStages: string[]): LifecycleStageTotal[];

package/src/app/dashboard/utils/reportHelpers.d.ts

@@ -14,3 +14,12 @@ export type FirstResponseReportSlice = {
  * Uses firstResponseConversationCount when present.
  */
 export declare function getFirstResponseWeightForReport(node: FirstResponseReportSlice): number;
+/** Fields needed to weight averageRating when aggregating report rows. */
+export type RatingReportSlice = {
+    conversationCount?: number | null;
+    responseRate?: number | null;
+    averageRating?: number | null;
+};
+/** Weighted average rating across report nodes; null when no rated conversations. */
+export declare function aggregateAverageRating(reports: RatingReportSlice[]): number | null;
+export declare function formatAgentRating(rating: number | null | undefined): string;

package/src/app/gatewayHome/components/ChecklistStep.d.ts

@@ -0,0 +1,15 @@
+import type { ReactNode } from 'react';
+import type { SetupStepStatus } from '../types';
+type ChecklistStepProps = {
+    index: number;
+    title: string;
+    status: SetupStepStatus;
+    optional?: boolean;
+    summary?: string | null;
+    expanded: boolean;
+    isLast: boolean;
+    onToggle: () => void;
+    children?: ReactNode;
+};
+declare const ChecklistStep: ({ index, title, status, optional, summary, expanded, isLast, onToggle, children, }: ChecklistStepProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+export default ChecklistStep;

package/src/app/gatewayHome/components/CreditBalanceCard.d.ts

@@ -0,0 +1,6 @@
+type CreditBalanceCardProps = {
+    workspaceId: number;
+    remainingCredits: number | null;
+};
+declare const CreditBalanceCard: ({ workspaceId, remainingCredits }: CreditBalanceCardProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+export default CreditBalanceCard;

package/src/app/gatewayHome/components/MessageStats.d.ts

@@ -0,0 +1,5 @@
+type MessageStatsProps = {
+    workspaceId: number;
+};
+declare const MessageStats: ({ workspaceId }: MessageStatsProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+export default MessageStats;

package/src/app/gatewayHome/components/SetupChecklist.d.ts

@@ -0,0 +1,11 @@
+import type { GatewaySetup } from '../hooks/useGatewaySetup';
+type SetupChecklistProps = {
+    workspaceId: number;
+    setup: GatewaySetup;
+    apiKeyToken: string | null;
+    lastSentTo: string | null;
+    onApiKeyGenerated: (token: string) => void;
+    onGoToDashboard: () => void;
+};
+declare const SetupChecklist: (props: SetupChecklistProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+export default SetupChecklist;

package/src/app/gatewayHome/components/console/QuickstartConsole.d.ts

@@ -0,0 +1,11 @@
+import type { IntegrationFragment } from '../../../../graphql.autogenerated';
+import type { RunResult } from '../../types';
+type QuickstartConsoleProps = {
+    workspaceId: number;
+    apiKeyToken: string | null;
+    webhookUrl: string | null;
+    integrations: IntegrationFragment[];
+    onSent: (to: string, result: RunResult) => void;
+};
+declare const QuickstartConsole: ({ workspaceId, apiKeyToken, webhookUrl, integrations, onSent }: QuickstartConsoleProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+export default QuickstartConsole;

package/src/app/gatewayHome/components/console/RunRequestBar.d.ts

@@ -0,0 +1,15 @@
+import type { RunResult } from '../../types';
+type RunRequestBarProps = {
+    to: string;
+    onToChange: (value: string) => void;
+    /** Shown only when no key is known in this session (keys are revealed once). */
+    needsApiKey: boolean;
+    apiKeyInput: string;
+    onApiKeyInputChange: (value: string) => void;
+    disabledReason: string | null;
+    running: boolean;
+    result: RunResult | null;
+    onRun: () => void;
+};
+declare const RunRequestBar: (props: RunRequestBarProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+export default RunRequestBar;

package/src/app/gatewayHome/components/console/consoleStyles.d.ts

@@ -0,0 +1,77 @@
+/// <reference types="react" />
+/** Dark "terminal" surface from the design, built on the --bc-dark / --bc-light-color tokens. */
+export declare const ConsoleSurface: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, {}>;
+export declare const ConsoleHeader: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const ConsoleTitle: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, {}>;
+export declare const Endpoint: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, {}>;
+export declare const PillRow: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const Pill: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+} & {
+    active: boolean;
+}, import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, {}>;
+/** Code keeps left-to-right order in RTL (Arabic) layouts. */
+export declare const CodePanel: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const CodeTabs: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const LangTab: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+} & {
+    active: boolean;
+}, import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, {}>;
+export declare const Code: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLPreElement>, HTMLPreElement>, {}>;
+export declare const ConsoleNote: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
+export declare const ConsoleInput: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+}, import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, {}>;
+export declare const ConsoleSelect: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+}, import("react").DetailedHTMLProps<import("react").SelectHTMLAttributes<HTMLSelectElement>, HTMLSelectElement>, {}>;
+export declare const ResponseBox: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const StatusText: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+} & {
+    ok: boolean;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
+export declare const TabsEnd: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const TemplateRow: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/src/app/gatewayHome/components/steps/ApiKeyStepBody.d.ts

@@ -0,0 +1,8 @@
+type ApiKeyStepBodyProps = {
+    workspaceId: number;
+    token: string | null;
+    onGenerated: (token: string) => void;
+    onSaved: () => void;
+};
+declare const ApiKeyStepBody: ({ workspaceId, token, onGenerated, onSaved }: ApiKeyStepBodyProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+export default ApiKeyStepBody;

package/src/app/gatewayHome/components/steps/ChannelStepBody.d.ts

@@ -0,0 +1,3 @@
+/** Channels are connected on the management page; the checklist refetches when the tab regains focus. */
+declare const ChannelStepBody: () => import("@emotion/react/jsx-runtime").JSX.Element;
+export default ChannelStepBody;

package/src/app/gatewayHome/components/steps/MetaStepBody.d.ts

@@ -0,0 +1,6 @@
+type MetaStepBodyProps = {
+    onDone: () => void;
+    onSkip: () => void;
+};
+declare const MetaStepBody: ({ onDone, onSkip }: MetaStepBodyProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+export default MetaStepBody;

package/src/app/gatewayHome/components/steps/WebhookStepBody.d.ts

@@ -0,0 +1,7 @@
+type WebhookStepBodyProps = {
+    workspaceId: number;
+    onSaved: () => void;
+    onSkip: () => void;
+};
+declare const WebhookStepBody: ({ workspaceId, onSaved, onSkip }: WebhookStepBodyProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+export default WebhookStepBody;

package/src/app/gatewayHome/components/styles.d.ts

@@ -0,0 +1,29 @@
+/// <reference types="react" />
+export declare const Muted: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
+export declare const SmallMuted: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
+export declare const Badge: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
+export declare const ButtonRow: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const TextInput: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+}, import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, {}>;
+export declare const MonoBox: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const WarningText: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;

package/src/app/gatewayHome/config/constants.d.ts

@@ -0,0 +1,22 @@
+import { CreditPack } from '../../../graphql.billing.autogenerated';
+import { IntegrationType } from '../../../graphql.autogenerated';
+import type { ChannelKind, RequestKind, SnippetLang } from '../types';
+export declare const MESSAGES_ENDPOINT: string;
+export declare const META_PAYMENT_URL = "https://business.facebook.com/billing_hub/payment_settings";
+export declare const API_KEY_PLACEHOLDER = "YOUR_API_KEY";
+export declare const SAMPLE_TEXT = "Your order #1042 has shipped.";
+export declare const SAMPLE_IMAGE_URL = "https://example.com/receipt.png";
+export declare const REQUEST_KINDS: RequestKind[];
+export declare const SNIPPET_LANGS: SnippetLang[];
+export declare const CHANNELS: Array<{
+    kind: ChannelKind;
+    types: IntegrationType[];
+}>;
+/** Credit packs sold through Polar; mirrors CREDIT_PACKS in SubscriptionCreditsCard. */
+export declare const CREDIT_PACKS: Array<{
+    pack: CreditPack;
+    usd: number;
+    credits: number;
+}>;
+export declare const DEFAULT_CREDIT_PACK: "CREDITS_20";
+export declare const SETUP_STORAGE_KEY = "bc-gateway-home-setup";

package/src/app/gatewayHome/hooks/useGatewaySetup.d.ts

@@ -0,0 +1,59 @@
+import { IntegrationState } from '../../../graphql.autogenerated';
+import { type LocalSetupChoices } from '../utils/setupStorage';
+import type { SetupStepId, SetupStepStatus } from '../types';
+/**
+ * Derives the Gateway checklist from live data:
+ * - channel / apiKey / webhook: the workspace has at least one of them
+ * - firstMessage: the credit wallet recorded at least one send attempt
+ * - meta / webhook skip: the user's choice, kept per workspace in the browser
+ * Setup counts as complete once an API key exists and a message was attempted.
+ */
+export declare function useGatewaySetup(workspaceId: number): {
+    statuses: Record<SetupStepId, SetupStepStatus>;
+    nextStep: SetupStepId | null;
+    isComplete: boolean;
+    loaded: boolean;
+    creditWallet: {
+        __typename?: "CreditWalletView" | undefined;
+        workspaceId: number;
+        balanceMicroUsd: string;
+        pendingMicroUsd: string;
+        remainingMicroUsd: string;
+        remainingCredits: number;
+        remainingMessages: number;
+        lifetimePurchasedMicroUsd: string;
+        lifetimeUsedMicroUsd: string;
+        lifetimeAttemptCount: string;
+        pendingAttempts: string;
+        usedAttempts: string;
+        usedMicroUsd: string;
+        usedCredits: number;
+    } | null;
+    webhookUrl: string;
+    integrations: {
+        __typename?: "Integration" | undefined;
+        workspaceId: number;
+        id: string;
+        name: string;
+        identifier?: string | null | undefined;
+        type: import("../../../graphql.autogenerated").IntegrationType;
+        properties?: any;
+        state: IntegrationState;
+        createdAt: any;
+        deletedAt?: any;
+        patchedAt?: any;
+        callingEnabled?: boolean | null | undefined;
+    }[];
+    setChoice: (step: keyof LocalSetupChoices, status: SetupStepStatus) => void;
+    markDone: (step: SetupStepId) => void;
+    refetchApiKeys: (variables?: Partial<import("../../../graphql.autogenerated").Exact<{
+        input: import("../../../graphql.autogenerated").ApiKeysInput;
+    }>> | undefined) => Promise<import("@apollo/client").ApolloQueryResult<import("../../../graphql.autogenerated").ApiKeysQuery>>;
+    refetchWebhooks: (variables?: Partial<import("../../../graphql.autogenerated").Exact<{
+        input: import("../../../graphql.autogenerated").WebhooksInput;
+    }>> | undefined) => Promise<import("@apollo/client").ApolloQueryResult<import("../../../graphql.autogenerated").WebhooksQuery>>;
+    refetchWallet: (variables?: Partial<import("../../../graphql.billing.autogenerated").Exact<{
+        input: import("../../../graphql.billing.autogenerated").CreditWalletInput;
+    }>> | undefined) => Promise<import("@apollo/client").ApolloQueryResult<import("../../../graphql.billing.autogenerated").CreditWalletQuery>>;
+};
+export type GatewaySetup = ReturnType<typeof useGatewaySetup>;

package/src/app/gatewayHome/hooks/useMessageStats.d.ts

@@ -0,0 +1,17 @@
+export type DailyMessageCount = {
+    /** UTC midnight of the day. */
+    date: Date;
+    count: number;
+};
+/**
+ * Messages in the last 30 days, delivery rate, and a per-day series for the last 14 days.
+ * Days are UTC. Past days come from the hourly report (up to the end of yesterday) and
+ * today comes from the live `messageReportToday` query, so no hour is counted twice.
+ */
+export declare function useMessageStats(workspaceId: number): {
+    loading: boolean;
+    totalMessages: number;
+    /** 0..1, or null when no outgoing message has a status yet. */
+    deliveredRate: number | null;
+    daily: DailyMessageCount[];
+};

package/src/app/gatewayHome/hooks/useQuickstartRequest.d.ts

@@ -0,0 +1,31 @@
+/// <reference types="react" />
+import type { IntegrationFragment } from '../../../graphql.autogenerated';
+import type { ChannelKind, RequestKind, RunResult } from '../types';
+type QuickstartOptions = {
+    workspaceId: number;
+    apiKeyToken: string | null;
+    integrations: IntegrationFragment[];
+    onSent: (to: string, result: RunResult) => void;
+};
+/** State and actions behind the Quickstart console: what to send, where, and running it. */
+export declare function useQuickstartRequest({ workspaceId, apiKeyToken, integrations, onSent }: QuickstartOptions): {
+    kind: RequestKind;
+    setKind: import("react").Dispatch<import("react").SetStateAction<RequestKind>>;
+    channel: ChannelKind;
+    setChannel: import("react").Dispatch<import("react").SetStateAction<ChannelKind>>;
+    availableChannels: Partial<Record<ChannelKind, IntegrationFragment>>;
+    templates: import("../types").TemplateOption[];
+    template: import("../types").TemplateOption;
+    setTemplateName: import("react").Dispatch<import("react").SetStateAction<string>>;
+    to: string;
+    setTo: import("react").Dispatch<import("react").SetStateAction<string>>;
+    apiKeyInput: string;
+    setApiKeyInput: import("react").Dispatch<import("react").SetStateAction<string>>;
+    needsApiKey: boolean;
+    body: Record<string, unknown> | null;
+    disabledReason: string | null;
+    running: boolean;
+    result: RunResult | null;
+    run: () => Promise<void>;
+};
+export {};

package/src/app/gatewayHome/hooks/useSendableTemplates.d.ts

@@ -0,0 +1,9 @@
+import type { TemplateOption } from '../types';
+/**
+ * Approved WhatsApp templates that need no parameters, so the console can send them as-is.
+ * The list query has no components, so each template's details are fetched (and cached by Apollo).
+ */
+export declare function useSendableTemplates(workspaceId: number, integrationId?: string): {
+    templates: TemplateOption[];
+    loading: boolean;
+};

package/src/app/gatewayHome/pages/GatewayHomePage.d.ts

@@ -0,0 +1 @@
+export default function GatewayHomePage(): import("@emotion/react/jsx-runtime").JSX.Element;

package/src/app/gatewayHome/types/index.d.ts

@@ -0,0 +1,21 @@
+export type RequestKind = 'text' | 'template' | 'image' | 'webhook';
+export type ChannelKind = 'whatsapp' | 'instagram' | 'facebook' | 'telegram';
+export type SnippetLang = 'cURL' | 'Node.js' | 'Python' | 'PHP' | 'Java' | 'C#' | 'Go';
+export type SetupStepId = 'channel' | 'apiKey' | 'webhook' | 'meta' | 'firstMessage';
+export type SetupStepStatus = 'pending' | 'done' | 'skipped';
+export type TemplateOption = {
+    name: string;
+    language: string;
+};
+export type MessageRequestInput = {
+    workspaceId: number;
+    integrationId?: string;
+    to: string;
+    kind: Exclude<RequestKind, 'webhook'>;
+    template?: TemplateOption;
+};
+export type RunResult = {
+    status: number;
+    ok: boolean;
+    body: string;
+};

package/src/app/gatewayHome/utils/buildRequestBody.d.ts

@@ -0,0 +1,7 @@
+import type { MessageRequestInput } from '../types';
+/** Keeps digits only: the REST API expects the number without "+" or spaces. */
+export declare function normalizePhone(value: string): string;
+/** Body for POST /core/v1/messages — mirrors SendMessageRequestDto in core. */
+export declare function buildRequestBody(input: MessageRequestInput): Record<string, unknown>;
+/** Sample INCOMING_MESSAGE payload as documented in bc-api-docs (apis/webhooks). */
+export declare function buildWebhookPayload(workspaceId: number, to: string): Record<string, unknown>;