Consolidating types across the project

src/client/components/shared/AlertCard.tsx

@@ -6,25 +6,7 @@
  */
 
 import { ReactElement, ReactNode } from "react";
-
-/**
- * Visual style variants for the alert card.
- * @typedef {"error"|"warning"|"info"|"success"} AlertVariant
- */
-export type AlertVariant = "error" | "warning" | "info" | "success";
-
-interface AlertCardProps {
-  /** The visual style variant of the alert */
-  variant: AlertVariant;
-  /** Optional title displayed prominently */
-  title?: string;
-  /** Main message content */
-  children: ReactNode;
-  /** Optional callback when dismiss button is clicked */
-  onDismiss?: () => void;
-  /** Additional CSS classes */
-  className?: string;
-}
+import type { AlertVariant, AlertCardProps } from "../../types";
 
 const variantStyles: Record<AlertVariant, {
   container: string;

src/client/components/shared/ProgressBar.tsx

@@ -5,25 +5,7 @@
  */
 
 import { ReactElement } from "react";
-
-/**
- * Props for the ProgressBar component.
- * @interface ProgressBarProps
- */
-interface ProgressBarProps {
-  /** Current progress value */
-  current: number;
-  /** Total/maximum value */
-  total: number;
-  /** Whether the progress is actively running (shows animation) */
-  isActive?: boolean;
-  /** Label shown on the left side */
-  activeLabel?: string;
-  /** Label shown when complete */
-  completeLabel?: string;
-  /** Additional CSS classes */
-  className?: string;
-}
+import type { ProgressBarProps } from "../../types";
 
 /**
  * A reusable progress bar component with percentage display.

src/client/components/shared/StatsCard.tsx

@@ -5,25 +5,7 @@
  */
 
 import { ReactElement } from "react";
-
-/**
- * Props for the StatsCard component.
- * @interface StatsCardProps
- */
-interface StatsCardProps {
-  /** The main numeric value to display */
-  value: number;
-  /** Label text below the value */
-  label: string;
-  /** Background color (CSS color string or Tailwind class) */
-  backgroundColor?: string;
-  /** Text color for the value (defaults to white) */
-  valueColor?: string;
-  /** Text color for the label (defaults to slightly transparent) */
-  labelColor?: string;
-  /** Additional CSS classes */
-  className?: string;
-}
+import type { StatsCardProps } from "../../types";
 
 /**
  * A reusable stats card component for displaying numeric metrics.

src/client/components/shared/T2Table.tsx

@@ -7,27 +7,7 @@ import {
   useReactTable,
   PaginationState,
 } from "@tanstack/react-table";
-
-/** Props for {@link T2Table}. */
-interface T2TableProps<TData> {
-  /** Row data to render. */
-  sourceData?: TData[];
-  /** Total number of records across all pages, used for pagination display. */
-  totalPages?: number;
-  /** Column definitions (TanStack Table {@link ColumnDef} array). */
-  columns?: ColumnDef<TData>[];
-  /** Callbacks for navigating between pages. */
-  paginationHandlers?: {
-    nextPage?(pageIndex: number, pageSize: number): void;
-    previousPage?(pageIndex: number, pageSize: number): void;
-  };
-  /** Called with the TanStack row object when a row is clicked. */
-  rowClickHandler?(row: Row<TData>): void;
-  /** Returns additional CSS classes for a given row (e.g. for highlight states). */
-  getRowClassName?(row: Row<TData>): string;
-  /** Optional slot rendered in the toolbar area (e.g. a search input). */
-  children?: ReactNode;
-}
+import type { T2TableProps } from "../../types";
 
 /**
  * A paginated data table with a two-row sticky header.