@next-vibe/checker 1.0.11 → 1.0.12

package/src/app/api/[locale]/system/unified-interface/shared/widgets/logic/link-list.ts

@@ -0,0 +1,127 @@
+/**
+ * Link List Widget Logic
+ * Shared data extraction and processing for LINK_LIST widget
+ * Used by both React and CLI implementations
+ */
+
+import type { WidgetData } from "../types";
+
+/**
+ * Individual link item
+ */
+export interface LinkItem {
+  url: string;
+  title?: string;
+  description?: string;
+  icon?: string;
+  favicon?: string;
+  [key: string]: WidgetData;
+}
+
+/**
+ * Processed link list data structure
+ */
+export interface ProcessedLinkList {
+  items: LinkItem[];
+  title?: string;
+  description?: string;
+  layout: "list" | "grid";
+  columns: number;
+}
+
+/**
+ * Extract and validate link list data from WidgetData
+ */
+export function extractLinkListData(
+  value: WidgetData,
+): ProcessedLinkList | null {
+  let items: WidgetData[] = [];
+  let title = "";
+  let description = "";
+  let layout = "list";
+  let columns = 1;
+
+  // Handle raw array format (from responseArrayField)
+  if (Array.isArray(value)) {
+    items = value;
+  }
+  // Handle object format with items property
+  else if (typeof value === "object" && value !== null) {
+    items = "items" in value && Array.isArray(value.items) ? value.items : [];
+    title =
+      "title" in value && typeof value.title === "string" ? value.title : "";
+    description =
+      "description" in value && typeof value.description === "string"
+        ? value.description
+        : "";
+    layout =
+      "layout" in value && typeof value.layout === "string"
+        ? value.layout
+        : "list";
+    columns =
+      "columns" in value && typeof value.columns === "number"
+        ? value.columns
+        : 1;
+  } else {
+    return null;
+  }
+
+  if (!items || !Array.isArray(items) || items.length === 0) {
+    return null;
+  }
+
+  // Validate and process items
+  const validItems = items
+    .map((item: WidgetData) => {
+      if (typeof item !== "object" || item === null || Array.isArray(item)) {
+        return null;
+      }
+
+      const url = "url" in item && typeof item.url === "string" ? item.url : "";
+      if (!url) {
+        return null;
+      }
+
+      const title =
+        "title" in item && typeof item.title === "string" ? item.title : "";
+      const description =
+        "description" in item && typeof item.description === "string"
+          ? item.description
+          : "";
+      const icon =
+        "icon" in item && typeof item.icon === "string" ? item.icon : "";
+      const favicon =
+        "favicon" in item && typeof item.favicon === "string"
+          ? item.favicon
+          : "";
+
+      return {
+        url,
+        title,
+        description,
+        icon,
+        favicon,
+        ...item,
+      } as LinkItem;
+    })
+    .filter((item): item is LinkItem => item !== null);
+
+  if (validItems.length === 0) {
+    return null;
+  }
+
+  return {
+    items: validItems,
+    title,
+    description,
+    layout: layout === "grid" ? "grid" : "list",
+    columns: Math.max(1, Math.min(4, columns)),
+  };
+}
+
+/**
+ * Get grid columns class based on column count
+ */
+export function getGridColumns(columns: number): number {
+  return Math.max(1, Math.min(4, columns));
+}

package/src/app/api/[locale]/system/unified-interface/shared/widgets/logic/link.ts

@@ -0,0 +1,68 @@
+/**
+ * Link Widget Logic
+ * Shared data extraction and processing for LINK widget
+ * Used by both React and CLI implementations
+ */
+
+import type { WidgetData } from "../types";
+
+/**
+ * Processed link data structure
+ */
+export interface ProcessedLink {
+  url: string;
+  text: string;
+  openInNewTab: boolean;
+}
+
+/**
+ * Extract and validate link data from WidgetData
+ */
+export function extractLinkData(value: WidgetData): ProcessedLink | null {
+  // Handle string value directly (simple URL)
+  if (typeof value === "string") {
+    return {
+      url: value,
+      text: value,
+      openInNewTab: true,
+    };
+  }
+
+  // Handle object value with link properties
+  if (typeof value === "object" && value !== null && !Array.isArray(value)) {
+    const url =
+      "url" in value && typeof value.url === "string" ? value.url : "";
+    const text =
+      "text" in value && typeof value.text === "string" ? value.text : url;
+    const openInNewTab =
+      "openInNewTab" in value && typeof value.openInNewTab === "boolean"
+        ? value.openInNewTab
+        : true;
+
+    if (!url) {
+      return null;
+    }
+
+    return {
+      url,
+      text,
+      openInNewTab,
+    };
+  }
+
+  // Invalid type
+  return null;
+}
+
+/**
+ * Validate if a string is a valid URL
+ */
+export function isValidUrl(url: string): boolean {
+  try {
+    // oxlint-disable-next-line no-new
+    new URL(url);
+    return true;
+  } catch {
+    return false;
+  }
+}

package/src/app/api/[locale]/system/unified-interface/shared/widgets/logic/loading.ts

@@ -0,0 +1,81 @@
+/**
+ * Loading Widget Logic
+ * Shared data extraction and processing for LOADING widget
+ * Used by both React and CLI implementations
+ */
+
+import type { WidgetData } from "../types";
+
+/**
+ * Processed loading data structure
+ */
+export interface ProcessedLoading {
+  message?: string;
+  progress?: number;
+  indeterminate: boolean;
+}
+
+/**
+ * Extract and validate loading data from WidgetData
+ */
+export function extractLoadingData(value: WidgetData): ProcessedLoading {
+  // Handle string value directly (loading message)
+  if (typeof value === "string") {
+    return {
+      message: value,
+      indeterminate: true,
+    };
+  }
+
+  // Handle number value (progress percentage)
+  if (typeof value === "number") {
+    return {
+      progress: Math.max(0, Math.min(100, value)),
+      indeterminate: false,
+    };
+  }
+
+  // Handle object value with loading properties
+  if (typeof value === "object" && value !== null && !Array.isArray(value)) {
+    const message =
+      "message" in value && typeof value.message === "string"
+        ? value.message
+        : undefined;
+    const progress =
+      "progress" in value && typeof value.progress === "number"
+        ? Math.max(0, Math.min(100, value.progress))
+        : undefined;
+    const indeterminate =
+      "indeterminate" in value && typeof value.indeterminate === "boolean"
+        ? value.indeterminate
+        : progress === undefined;
+
+    return {
+      message,
+      progress,
+      indeterminate,
+    };
+  }
+
+  // Default loading state
+  return {
+    indeterminate: true,
+  };
+}
+
+/**
+ * Get loading spinner frame for CLI animation
+ */
+export function getSpinnerFrame(frameIndex: number): string {
+  const frames = ["⠋", "⠙", "⠹", "⠸", "⠼", "⠴", "⠦", "⠧", "⠇", "⠏"];
+  return frames[frameIndex % frames.length];
+}
+
+/**
+ * Format progress bar for CLI display
+ */
+export function formatProgressBar(progress: number, width = 20): string {
+  const filled = Math.round((progress / 100) * width);
+  const empty = width - filled;
+  return `[${"=".repeat(filled)}${" ".repeat(empty)}] ${progress}%`;
+}

package/src/app/api/[locale]/system/unified-interface/shared/widgets/logic/markdown.ts

@@ -0,0 +1,176 @@
+/**
+ * Markdown Widget Logic
+ * Shared data extraction and processing for MARKDOWN widget
+ * Used by both React and CLI implementations
+ */
+
+import type { WidgetData } from "../types";
+
+/**
+ * Processed markdown data structure
+ */
+export interface ProcessedMarkdown {
+  content: string;
+  sanitize: boolean;
+  allowHtml: boolean;
+}
+
+/**
+ * Markdown element types
+ */
+export interface MarkdownElement {
+  type:
+    | "heading"
+    | "paragraph"
+    | "bold"
+    | "italic"
+    | "code"
+    | "list"
+    | "link"
+    | "text";
+  content: string;
+  level?: number; // for headings (1-6)
+  ordered?: boolean; // for lists
+  url?: string; // for links
+}
+
+/**
+ * Parse markdown into structured elements (data-only, no ANSI codes)
+ * Returns structured data that can be rendered by both CLI and React
+ */
+export function parseMarkdownElements(content: string): MarkdownElement[] {
+  const elements: MarkdownElement[] = [];
+  const lines = content.split("\n");
+
+  for (const line of lines) {
+    if (!line.trim()) {
+      continue;
+    }
+
+    // Headings: # Heading
+    const headingMatch = line.match(/^(#{1,6})\s+(.+)$/);
+    if (headingMatch) {
+      elements.push({
+        type: "heading",
+        content: headingMatch[2],
+        level: headingMatch[1].length,
+      });
+      continue;
+    }
+
+    // Unordered lists: - Item or * Item
+    const unorderedListMatch = line.match(/^[-*]\s+(.+)$/);
+    if (unorderedListMatch) {
+      elements.push({
+        type: "list",
+        content: unorderedListMatch[1],
+        ordered: false,
+      });
+      continue;
+    }
+
+    // Ordered lists: 1. Item
+    const orderedListMatch = line.match(/^\d+\.\s+(.+)$/);
+    if (orderedListMatch) {
+      elements.push({
+        type: "list",
+        content: orderedListMatch[1],
+        ordered: true,
+      });
+      continue;
+    }
+
+    // Code blocks (inline): `code`
+    const codeMatch = line.match(/`([^`]+)`/);
+    if (codeMatch) {
+      elements.push({
+        type: "code",
+        content: codeMatch[1],
+      });
+      continue;
+    }
+
+    // Links: [text](url)
+    const linkMatch = line.match(/\[([^\]]+)\]\(([^)]+)\)/);
+    if (linkMatch) {
+      elements.push({
+        type: "link",
+        content: linkMatch[1],
+        url: linkMatch[2],
+      });
+      continue;
+    }
+
+    // Bold: **text** or __text__
+    const boldMatch = line.match(/\*\*([^*]+)\*\*|__([^_]+)__/);
+    if (boldMatch) {
+      elements.push({
+        type: "bold",
+        content: boldMatch[1] || boldMatch[2],
+      });
+      continue;
+    }
+
+    // Italic: *text* or _text_
+    const italicMatch = line.match(/\*([^*]+)\*|_([^_]+)_/);
+    if (italicMatch) {
+      elements.push({
+        type: "italic",
+        content: italicMatch[1] || italicMatch[2],
+      });
+      continue;
+    }
+
+    // Default: paragraph text
+    elements.push({
+      type: "paragraph",
+      content: line,
+    });
+  }
+
+  return elements;
+}
+
+/**
+ * Extract and validate markdown data from WidgetData
+ */
+export function extractMarkdownData(
+  value: WidgetData,
+): ProcessedMarkdown | null {
+  // Handle string value directly
+  if (typeof value === "string") {
+    return {
+      content: value,
+      sanitize: true,
+      allowHtml: false,
+    };
+  }
+
+  // Handle object value with markdown properties
+  if (typeof value === "object" && value !== null && !Array.isArray(value)) {
+    const content =
+      "content" in value && typeof value.content === "string"
+        ? value.content
+        : "";
+    const sanitize =
+      "sanitize" in value && typeof value.sanitize === "boolean"
+        ? value.sanitize
+        : true;
+    const allowHtml =
+      "allowHtml" in value && typeof value.allowHtml === "boolean"
+        ? value.allowHtml
+        : false;
+
+    if (!content) {
+      return null;
+    }
+
+    return {
+      content,
+      sanitize,
+      allowHtml,
+    };
+  }
+
+  return null;
+}

package/src/app/api/[locale]/system/unified-interface/shared/widgets/logic/metric-card.ts

@@ -0,0 +1,241 @@
+/**
+ * Metric Card Widget Logic
+ * Shared data extraction and processing for METRIC_CARD widget
+ * Used by both React and CLI implementations
+ */
+
+import type { UnifiedField } from "../../types/endpoint";
+import { WidgetType } from "../../types/enums";
+import type { WidgetData } from "../types";
+import { formatBytes } from "../utils/formatting";
+
+/**
+ * Metric configuration
+ */
+export interface MetricConfig {
+  format: "bytes" | "currency" | "number" | "percentage";
+  precision: number;
+  icon?: string;
+  unit?: string;
+  threshold?: {
+    warning?: number;
+    error?: number;
+  };
+}
+
+/**
+ * Processed metric card data structure
+ */
+export interface ProcessedMetricCard {
+  value: string | number;
+  label: string;
+  description?: string;
+  trend?: {
+    value: number;
+    direction: "up" | "down" | "neutral";
+  };
+  icon?: string;
+  color?: string;
+}
+
+/**
+ * Extract and validate metric card data from WidgetData
+ */
+export function extractMetricCardData(
+  value: WidgetData,
+): ProcessedMetricCard | null {
+  // Narrow to object type first
+  const isObject =
+    typeof value === "object" && value !== null && !Array.isArray(value);
+
+  if (!isObject) {
+    return null;
+  }
+
+  // Extract required value
+  const metricValue =
+    "value" in value &&
+    (typeof value.value === "string" || typeof value.value === "number")
+      ? value.value
+      : null;
+
+  if (metricValue === null) {
+    return null;
+  }
+
+  // Extract required label
+  const label =
+    "label" in value && typeof value.label === "string" ? value.label : "";
+
+  if (!label) {
+    return null;
+  }
+
+  // Extract optional properties
+  const description =
+    "description" in value && typeof value.description === "string"
+      ? value.description
+      : undefined;
+
+  const icon =
+    "icon" in value && typeof value.icon === "string" ? value.icon : undefined;
+
+  const color =
+    "color" in value && typeof value.color === "string"
+      ? value.color
+      : undefined;
+
+  // Extract trend if present
+  let trend: ProcessedMetricCard["trend"];
+  if (
+    "trend" in value &&
+    typeof value.trend === "object" &&
+    value.trend !== null &&
+    !Array.isArray(value.trend)
+  ) {
+    const trendValue =
+      "value" in value.trend && typeof value.trend.value === "number"
+        ? value.trend.value
+        : null;
+    const trendDirection =
+      "direction" in value.trend && typeof value.trend.direction === "string"
+        ? value.trend.direction
+        : null;
+
+    if (
+      trendValue !== null &&
+      (trendDirection === "up" ||
+        trendDirection === "down" ||
+        trendDirection === "neutral")
+    ) {
+      trend = {
+        value: trendValue,
+        direction: trendDirection,
+      };
+    }
+  }
+
+  return {
+    value: metricValue,
+    label,
+    description,
+    trend,
+    icon,
+    color,
+  };
+}
+
+/**
+ * Format metric value for display
+ */
+export function formatMetricValue(value: string | number): string {
+  if (typeof value === "number") {
+    return new Intl.NumberFormat("en-US").format(value);
+  }
+  return value;
+}
+
+/**
+ * Get trend display (e.g., "+5%", "-3%")
+ */
+export function formatTrendValue(trendValue: number): string {
+  const sign = trendValue > 0 ? "+" : "";
+  return `${sign}${trendValue}%`;
+}
+
+/**
+ * Get metric configuration from field
+ */
+export function getMetricConfig<TKey extends string>(
+  field: UnifiedField<TKey>,
+): MetricConfig {
+  const defaultConfig: MetricConfig = {
+    format: "number",
+    precision: 2,
+  };
+
+  if (field.ui.type !== WidgetType.METRIC_CARD) {
+    return defaultConfig;
+  }
+
+  const config = field.ui;
+
+  const formatValue =
+    typeof config.format === "string" ? config.format : "number";
+  const validFormats = ["bytes", "currency", "number", "percentage"] as const;
+  const format: "bytes" | "currency" | "number" | "percentage" =
+    validFormats.includes(formatValue as (typeof validFormats)[number])
+      ? (formatValue as (typeof validFormats)[number])
+      : "number";
+
+  return {
+    icon: typeof config.icon === "string" ? config.icon : undefined,
+    unit: typeof config.unit === "string" ? config.unit : undefined,
+    precision: typeof config.precision === "number" ? config.precision : 2,
+    threshold:
+      config.threshold && typeof config.threshold === "object"
+        ? (config.threshold as { warning?: number; error?: number })
+        : undefined,
+    format,
+  };
+}
+
+/**
+ * Format metric value with configuration
+ */
+export function formatMetricValueWithConfig(
+  value: WidgetData,
+  config: MetricConfig,
+): string {
+  if (typeof value !== "number") {
+    return String(value);
+  }
+
+  let formatted: string;
+
+  switch (config.format) {
+    case "percentage":
+      formatted = `${(value * 100).toFixed(config.precision)}%`;
+      break;
+    case "currency":
+      formatted = `$${value.toFixed(config.precision)}`;
+      break;
+    case "bytes":
+      formatted = formatBytes(value);
+      break;
+    default:
+      // For integer values (like counts), don't show decimal places
+      if (Number.isInteger(value) && config.precision === 2) {
+        formatted = value.toString();
+      } else {
+        formatted = value.toFixed(config.precision);
+      }
+      if (config.unit) {
+        formatted += ` ${config.unit}`;
+      }
+  }
+
+  return formatted;
+}
+
+/**
+ * Process lint summary data (special case for code quality)
+ */
+export function processLintSummary(summary: Record<string, WidgetData>): {
+  errors: number;
+  warnings: number;
+  info: number;
+  hasIssues: boolean;
+} {
+  const errors = Number(summary.errors || 0);
+  const warnings = Number(summary.warnings || 0);
+  const info = Number(summary.info || 0);
+  const hasIssues = Boolean(summary.hasIssues);
+
+  return {
+    errors,
+    warnings,
+    info,
+    hasIssues,
+  };
+}