All files / src/features/Events/EventDetail constants.ts

100% Statements 15/15
100% Branches 6/6
100% Functions 2/2
100% Lines 13/13

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72                16x                                 16x 16x     16x       306x 70x     29x 5x   24x       16x     16x                             16x               16x  
/**
 * PayBuilder 032-b — Event Tickets & Transactions Management.
 *
 * Shared constants for the redesigned Event Detail view (contextual menu,
 * tabs and the transactions table).
 */
import { PageAnimationsType } from "@shared/BannerAnimations/animations";
 
export const EVENT_DETAIL_TABS = {
  TRANSACTIONS: "transactions",
  INVENTORY: "inventory",
  TICKETS: "tickets",
  HOST: "host",
  REVIEWS: "reviews",
} as const;
 
export type EventDetailTab =
  (typeof EVENT_DETAIL_TABS)[keyof typeof EVENT_DETAIL_TABS];
 
/**
 * PayBuilder 034 — the active tab lives in the query string so the side panel
 * can link straight to one (`.../events/42?tab=reviews&review=7`). Held in the
 * URL rather than component state because the panel's Reply and View all have
 * to arrive on the Reviews tab, which local state cannot express.
 */
export const EVENT_DETAIL_TAB_PARAM = "tab";
export const EVENT_DETAIL_REVIEW_PARAM = "review";
 
/** Narrows an arbitrary `?tab=` value; anything unknown falls back to the default. */
export const parseEventDetailTab = (
  value: string | null,
  allowReviews: boolean,
): EventDetailTab => {
  const isKnown = Object.values(EVENT_DETAIL_TABS).some((tab) => tab === value);
  if (!isKnown) return EVENT_DETAIL_TABS.TRANSACTIONS;
  // A link to Reviews with the flag off must not strand the merchant on a tab
  // that is not rendered.
  if (value === EVENT_DETAIL_TABS.REVIEWS && !allowReviews) {
    return EVENT_DETAIL_TABS.TRANSACTIONS;
  }
  return value as EventDetailTab;
};
 
export const STORED_EVENT_TRANSACTIONS_ROWS_PER_PAGE =
  "stored_event_transactions_rows_per_page";
 
export const STORED_EVENT_TICKETS_ROWS_PER_PAGE =
  "stored_event_tickets_rows_per_page";
 
/**
 * A definite width cap for head content that would otherwise report a wide
 * max-content size inside the transactions table's `<caption>` — nowrap
 * breadcrumb text, and the horizontally scrolling Date/Location cards. That
 * table is `table-layout: auto`, so anything reporting a natural width wider
 * than the screen grows the table itself and scrolls the banner, tabs and rows
 * sideways as one.
 *
 * Deliberately a `max-width` paired with `width: 100%` rather than the
 * `width: 0` / `min-width: 100%` trick: a percentage min-width resolves to zero
 * when the containing block is indefinite, which silently collapses the element
 * instead of merely capping it. Mobile page gutters are 20px a side.
 */
export const VIEWPORT_WIDTH_CAP = "calc(100vw - 40px)";
 
/**
 * The page's animated banner backdrop. Shared with `Table`'s
 * `compactAnimationPage` so the collapsed scroll header is backed by the same
 * animation as the full banner it replaces — Events use the Events list's.
 */
export const EVENT_BANNER_ANIMATION_PAGE: PageAnimationsType =
  "merchantPaymentForms";