@oronts/vendure-data-hub-plugin 0.1.0

package/dashboard/utils/formatters.ts

@@ -0,0 +1,92 @@
+import type { JsonValue } from '../../shared/types';
+
+export function formatValue(value: JsonValue, maxLength = 50): string {
+    if (value === null || value === undefined) {
+        return '\u2014';
+    }
+    if (typeof value === 'object') {
+        return JSON.stringify(value);
+    }
+    if (typeof value === 'boolean') {
+        return value ? 'true' : 'false';
+    }
+    const str = String(value);
+    return str.length > maxLength ? str.substring(0, maxLength) + '...' : str;
+}
+
+export function formatCellValue(value: JsonValue): string {
+    return formatValue(value, 50);
+}
+
+export function formatKey(key: string): string {
+    return key
+        .replace(/([A-Z])/g, ' $1')
+        .replace(/^./, s => s.toUpperCase())
+        .replace(/[_-]/g, ' ')
+        .replace(/\s+/g, ' ')
+        .trim();
+}
+
+export function formatDateTime(date: Date | string | number, options?: Intl.DateTimeFormatOptions): string {
+    const dateObj = date instanceof Date ? date : new Date(date);
+    if (isNaN(dateObj.getTime())) return '\u2014';
+
+    const defaultOptions: Intl.DateTimeFormatOptions = {
+        year: 'numeric',
+        month: 'short',
+        day: 'numeric',
+        hour: '2-digit',
+        minute: '2-digit',
+    };
+
+    return dateObj.toLocaleString('en-US', options || defaultOptions);
+}
+
+export function formatSmartDateTime(date: Date | string | number): string {
+    const dateObj = date instanceof Date ? date : new Date(date);
+    if (isNaN(dateObj.getTime())) return '\u2014';
+
+    const now = new Date();
+    const isToday = dateObj.toDateString() === now.toDateString();
+
+    if (isToday) {
+        return dateObj.toLocaleTimeString();
+    }
+    return dateObj.toLocaleString(undefined, {
+        month: 'short',
+        day: 'numeric',
+        hour: '2-digit',
+        minute: '2-digit',
+    });
+}
+
+export function formatDiffValue(value: unknown, maxLength = 50): string {
+    if (value === null) return 'null';
+    if (value === undefined) return 'undefined';
+    if (typeof value === 'string') return value.length > maxLength ? `${value.slice(0, maxLength)}…` : value;
+    if (typeof value === 'number' || typeof value === 'boolean') return String(value);
+    if (Array.isArray(value)) return `[${value.length} items]`;
+    if (typeof value === 'object') return `{${Object.keys(value).length} keys}`;
+    return String(value);
+}
+
+export function cn(...classes: (string | boolean | undefined | null)[]): string {
+    return classes.filter((c): c is string => typeof c === 'string' && c.length > 0).join(' ');
+}
+
+export function formatFileSize(bytes: number): string {
+    if (bytes < 1024) return `${bytes} B`;
+    if (bytes < 1024 * 1024) return `${(bytes / 1024).toFixed(1)} KB`;
+    return `${(bytes / (1024 * 1024)).toFixed(1)} MB`;
+}
+
+/**
+ * Converts a camelCase field name to a human-readable label.
+ * Example: 'databaseType' -> 'Database Type', 'remotePath' -> 'Remote Path'
+ *
+ * Delegates to {@link formatKey} which handles the same conversion plus
+ * underscores, hyphens, and extra whitespace normalization.
+ */
+export function formatFieldLabel(field: string): string {
+    return formatKey(field);
+}

package/dashboard/utils/icon-resolver.ts

@@ -0,0 +1,35 @@
+import { icons, type LucideIcon } from 'lucide-react';
+
+/**
+ * Convert a kebab-case icon name to PascalCase for lucide-react lookup.
+ * e.g. 'arrow-down' → 'ArrowDown', 'file-text' → 'FileText'
+ */
+function kebabToPascal(name: string): string {
+    return name
+        .split('-')
+        .map(part => part.charAt(0).toUpperCase() + part.slice(1))
+        .join('');
+}
+
+/**
+ * Resolve a backend icon name string (e.g. 'code', 'globe', 'file-text')
+ * to a LucideIcon component. Accepts both kebab-case and PascalCase input.
+ * Returns undefined if the name is not recognized, allowing callers to provide a fallback.
+ *
+ * Uses lucide-react's `icons` export for fully dynamic resolution —
+ * no manual map needed when new icons are used.
+ */
+export function resolveIconName(name: string | undefined | null): LucideIcon | undefined {
+    if (!name) return undefined;
+
+    // If already PascalCase (no hyphens), try direct lookup first
+    if (!name.includes('-')) {
+        const pascalName = name.charAt(0).toUpperCase() + name.slice(1);
+        const direct = icons[pascalName as keyof typeof icons];
+        if (direct) return direct;
+    }
+
+    // Convert kebab-case to PascalCase and look up
+    const pascalCase = kebabToPascal(name);
+    return icons[pascalCase as keyof typeof icons];
+}

package/dashboard/utils/index.ts

@@ -0,0 +1,60 @@
+export {
+    formatFileSize,
+    formatValue,
+    formatCellValue,
+    formatKey,
+    formatFieldLabel,
+    formatDateTime,
+    formatSmartDateTime,
+    formatDiffValue,
+    cn,
+} from './formatters';
+
+export {
+    getAdapterTypeLabel,
+    normalizeStepType,
+    getAdapterTypeForStep,
+} from './step-helpers';
+
+export {
+    filterAndGroupAdaptersByCategory,
+} from './adapter-grouping';
+
+export { normalizeString } from './string-helpers';
+
+export {
+    prepareDynamicFields,
+} from './field-preparation';
+
+export type { FileType } from './column-analysis';
+
+export {
+    getCombinedTriggers,
+    updateDefinitionWithTriggers,
+} from './trigger-sync';
+
+export {
+    CODE_PATTERN,
+    validateUrl,
+    validateHostname,
+    validatePort,
+    validateTriggerConfig,
+    validateImportWizardStep,
+    validateExportWizardStep,
+} from './form-validation';
+
+export type { FormValidationResult } from './form-validation';
+
+export {
+    generatePipelineCode,
+    importConfigToPipelineDefinition,
+    exportConfigToPipelineDefinition,
+} from './wizard-to-pipeline';
+
+export type { AdapterResolver, LoaderAdapterInfo } from './wizard-to-pipeline';
+
+export { resolveIconName } from './icon-resolver';
+
+export { createQueryKeys } from './query-key-factory';
+export type { StandardQueryKeys } from './query-key-factory';
+

package/dashboard/utils/query-key-factory.ts

@@ -0,0 +1,54 @@
+/**
+ * Query Key Factory
+ *
+ * Generates standardized TanStack Query key structures for API hooks.
+ * Ensures consistent cache key patterns across all data-fetching hooks.
+ *
+ * Standard key hierarchy:
+ *   [baseName]                           -> all (for broad invalidation)
+ *   [baseName, 'list']                   -> lists (invalidate all lists)
+ *   [baseName, 'list', options]          -> list (specific list query)
+ *   [baseName, 'detail']                 -> details (invalidate all details)
+ *   [baseName, 'detail', id]            -> detail (specific detail query)
+ */
+
+/**
+ * Standard query key structure returned by createQueryKeys.
+ *
+ * Hook files extend this with domain-specific keys as needed
+ * (e.g. `timeline`, `errors`, `codes`).
+ */
+export interface StandardQueryKeys {
+    all: readonly [string];
+    lists: () => readonly [string, string];
+    list: (...args: Array<string | number | Record<string, unknown> | undefined>) => readonly unknown[];
+    details: () => readonly [string, string];
+    detail: (id: string) => readonly [string, string, string];
+}
+
+/**
+ * Creates a standard query key factory for a given base entity name.
+ *
+ * @param baseName  The root key segment (e.g. 'pipelines', 'connections', 'secrets')
+ * @returns An object with `all`, `lists()`, `list(...)`, `details()`, `detail(id)` key builders
+ *
+ * @example
+ * ```ts
+ * const keys = createQueryKeys('pipelines');
+ * keys.all          // ['pipelines']
+ * keys.lists()      // ['pipelines', 'list']
+ * keys.list(opts)   // ['pipelines', 'list', opts]
+ * keys.details()    // ['pipelines', 'detail']
+ * keys.detail('1')  // ['pipelines', 'detail', '1']
+ * ```
+ */
+export function createQueryKeys(baseName: string): StandardQueryKeys {
+    const all = [baseName] as const;
+    return {
+        all,
+        lists: () => [...all, 'list'] as const,
+        list: (...args: Array<string | number | Record<string, unknown> | undefined>) => [...all, 'list', ...args] as const,
+        details: () => [...all, 'detail'] as const,
+        detail: (id: string) => [...all, 'detail', id] as const,
+    };
+}

package/dashboard/utils/step-helpers.ts

@@ -0,0 +1,32 @@
+import { StepType, ADAPTER_TYPES, CATEGORY_TO_STEP_TYPE, CATEGORY_TO_ADAPTER_TYPE, mapStepTypeToCategory } from '../constants/index';
+
+const ADAPTER_TYPE_LABELS: Record<string, string> = {
+    [ADAPTER_TYPES.EXTRACTOR]: 'Data Source',
+    [ADAPTER_TYPES.OPERATOR]: 'Transform Operation',
+    [ADAPTER_TYPES.LOADER]: 'Destination',
+    [ADAPTER_TYPES.ENRICHER]: 'Enrichment',
+    [ADAPTER_TYPES.EXPORTER]: 'Export Format',
+    [ADAPTER_TYPES.FEED]: 'Feed Type',
+    [ADAPTER_TYPES.SINK]: 'Search Engine',
+    [ADAPTER_TYPES.VALIDATOR]: 'Validation Rule',
+    [ADAPTER_TYPES.ROUTER]: 'Routing Logic',
+};
+
+export function getAdapterTypeLabel(adapterType: string | null): string {
+    return (adapterType && ADAPTER_TYPE_LABELS[adapterType]) ?? 'Adapter';
+}
+
+export function normalizeStepType(type: string): StepType {
+    if (CATEGORY_TO_STEP_TYPE[type]) {
+        return CATEGORY_TO_STEP_TYPE[type] as StepType;
+    }
+    return type.toUpperCase() as StepType;
+}
+
+export function getAdapterTypeForStep(type: string): string | null {
+    if (CATEGORY_TO_ADAPTER_TYPE[type]) {
+        return CATEGORY_TO_ADAPTER_TYPE[type];
+    }
+    const category = mapStepTypeToCategory(type);
+    return CATEGORY_TO_ADAPTER_TYPE[category] ?? null;
+}

package/dashboard/utils/string-helpers.ts

@@ -0,0 +1,4 @@
+export function normalizeString(str: string, options?: { includeDots?: boolean }): string {
+    const pattern = options?.includeDots ? /[_\-\s.]/g : /[_\-\s]/g;
+    return str.toLowerCase().replace(pattern, '');
+}

package/dashboard/utils/template-helpers.ts

@@ -0,0 +1,26 @@
+/**
+ * Shared helper functions for import/export template hooks.
+ * Eliminates duplication between use-import-templates.ts and use-export-templates.ts.
+ */
+
+interface Identifiable {
+    id: string;
+    name: string;
+    description: string;
+    requiredFields: string[];
+    tags?: string[];
+}
+
+/**
+ * Search templates by name, description, requiredFields, and tags.
+ */
+export function filterTemplates<T extends Identifiable>(templates: T[], query: string): T[] {
+    if (!query.trim()) return templates;
+    const q = query.toLowerCase();
+    return templates.filter(t =>
+        t.name.toLowerCase().includes(q) ||
+        t.description.toLowerCase().includes(q) ||
+        t.requiredFields?.some(f => f.toLowerCase().includes(q)) ||
+        t.tags?.some(tag => tag.toLowerCase().includes(q)),
+    );
+}

package/dashboard/utils/trigger-sync.ts

@@ -0,0 +1,138 @@
+/**
+ * Trigger Sync Utilities
+ *
+ * Syncs trigger configuration between UI representations:
+ * - Trigger STEPS in pipeline editor (visual nodes)
+ * - Triggers Tab in pipeline editor (form-based)
+ */
+
+import type { PipelineDefinition, PipelineStepDefinition, PipelineTrigger, StepType } from '../types';
+
+const TRIGGER_STEP_TYPE = 'TRIGGER' as StepType;
+
+/**
+ * Get all trigger steps from pipeline definition
+ */
+function getTriggerSteps(definition: PipelineDefinition): PipelineStepDefinition[] {
+    return (definition.steps ?? []).filter(step => step.type === TRIGGER_STEP_TYPE);
+}
+
+/**
+ * Get the first trigger step from pipeline definition
+ */
+function getTriggerStep(definition: PipelineDefinition): PipelineStepDefinition | null {
+    const triggers = getTriggerSteps(definition);
+    return triggers[0] ?? null;
+}
+
+/**
+ * Convert trigger step to PipelineTrigger (for TriggersPanel)
+ */
+function stepToTrigger(step: PipelineStepDefinition): PipelineTrigger {
+    return {
+        ...(step.config as PipelineTrigger),
+        stepKey: step.key,
+    };
+}
+
+/**
+ * Convert trigger steps to PipelineTrigger array
+ */
+function stepsToTriggers(steps: PipelineStepDefinition[]): PipelineTrigger[] {
+    return steps
+        .filter(step => step.type === TRIGGER_STEP_TYPE)
+        .map(stepToTrigger);
+}
+
+/**
+ * Convert a trigger config to a step
+ */
+function triggerToStep(
+    trigger: PipelineTrigger,
+    existingKey?: string
+): PipelineStepDefinition {
+    const { stepKey, ...triggerConfig } = trigger as PipelineTrigger & { stepKey?: string };
+
+    return {
+        key: existingKey ?? stepKey ?? `trigger-${Date.now()}`,
+        type: TRIGGER_STEP_TYPE,
+        config: triggerConfig,
+    };
+}
+
+/**
+ * Convert triggers from TriggersPanel back to steps
+ */
+function triggersToSteps(
+    triggers: PipelineTrigger[],
+    existingSteps: PipelineStepDefinition[]
+): PipelineStepDefinition[] {
+    const existingTriggerSteps = existingSteps.filter(s => s.type === TRIGGER_STEP_TYPE);
+    const nonTriggerSteps = existingSteps.filter(s => s.type !== TRIGGER_STEP_TYPE);
+
+    const newTriggerSteps: PipelineStepDefinition[] = triggers.map((trigger, index) => {
+        const triggerStepKey = (trigger as PipelineTrigger & { stepKey?: string }).stepKey;
+        const existingStep = triggerStepKey
+            ? existingTriggerSteps.find(s => s.key === triggerStepKey)
+            : existingTriggerSteps[index];
+
+        return triggerToStep(trigger, existingStep?.key);
+    });
+
+    return [...newTriggerSteps, ...nonTriggerSteps];
+}
+
+/**
+ * Get triggers for display in TriggersPanel
+ */
+export function getCombinedTriggers(definition: PipelineDefinition): PipelineTrigger[] {
+    return stepsToTriggers(getTriggerSteps(definition));
+}
+
+/**
+ * Update definition with new triggers
+ * Also updates edges so all triggers connect to the first execution step
+ */
+export function updateDefinitionWithTriggers(
+    definition: PipelineDefinition,
+    triggers: PipelineTrigger[]
+): PipelineDefinition {
+    const newSteps = triggersToSteps(triggers, definition.steps ?? []);
+
+    // Find the first non-trigger step (the execution entry point)
+    const firstExecutionStep = newSteps.find(s => s.type !== TRIGGER_STEP_TYPE);
+
+    // Get all trigger step keys
+    const triggerStepKeys = newSteps
+        .filter(s => s.type === TRIGGER_STEP_TYPE)
+        .map(s => s.key);
+
+    // Build new edges:
+    // 1. Remove all edges FROM trigger steps (we'll recreate them)
+    // 2. Keep all non-trigger edges
+    // 3. Add edges from each trigger to the first execution step
+    const existingEdges = definition.edges ?? [];
+    const nonTriggerEdges = existingEdges.filter(
+        e => !triggerStepKeys.includes(e.from)
+    );
+
+    // Create edges from triggers to first execution step
+    const triggerEdges: Array<{ from: string; to: string }> = [];
+    if (firstExecutionStep) {
+        for (const triggerKey of triggerStepKeys) {
+            // Check if this edge already exists
+            const edgeExists = nonTriggerEdges.some(
+                e => e.from === triggerKey && e.to === firstExecutionStep.key
+            );
+            if (!edgeExists) {
+                triggerEdges.push({ from: triggerKey, to: firstExecutionStep.key });
+            }
+        }
+    }
+
+    return {
+        ...definition,
+        steps: newSteps,
+        edges: [...nonTriggerEdges, ...triggerEdges],
+    };
+}