Phase 0: Gap Analysis Report

Executive Summary

The editor monorepo has a mature module foundation that is architecturally aligned with gograb-modules. The core module system (@libs-core/module-base) already supports:

• ModuleManifest with full metadata
• ModuleEmbeddableComponent interface
• BrowserModuleContract lifecycle
• @ModuleDecorator for auto-registration
• AI metadata for intelligent composition
• Configuration schemas

The gaps are not architectural - they are in integration and depth.

Current Module Inventory

Complete Modules (Production Ready)

Layout Template Modules (Production Ready)

Stub Modules (Need Expansion)

Identified Gaps

Gap 1: Widget-to-Embeddable Bridge (CRITICAL)

Problem: The WidgetRegistryService and module embeddableComponents are completely disconnected.

Evidence from WidgetRegistryService:

// Current sources of widgets:
// 1. BasicWidgetRegistry (button, text, image, etc.)
// 2. Local storage user widgets
// 3. Backend API space widgets

// MISSING: Module embeddable components!

Impact:

• Module embeddables (e.g., UserListWidgetComponent from user-management) don't appear in the editor widget palette
• Space builders can't drag-and-drop module components onto pages
• No automatic discovery of module widgets

Solution Required:

• Create module-adapter library with bridge service
• Add syncEmbeddablesFromModules() to WidgetRegistryService
• Create EmbeddableHostWidget to render any embeddable

Gap 2: Business Module Depth (IMPORTANT)

Problem: Business modules (product-catalog, blog, portfolio, saas) are stubs with only a single widget.

Example - product-catalog current state:

// ONLY has:
embeddableComponents: [
  {
    id: 'product-catalog:list-widget',
    componentType: ProductListWidgetComponent,
    // ... single widget
  }
]

// MISSING:
// - routes (product list, detail, cart, checkout)
// - services (ProductService, CartService)
// - actions (AddToCart, Checkout)
// - state management
// - backend integration

Solution Required:

• Expand product-catalog into full ecommerce module
• Or create new comprehensive ecommerce module

Gap 3: Module Route Integration (IMPORTANT)

Problem: Singularity renders visual pages, but module routes are separate.

Current behavior:

• /space/:slug/page-name → Singularity renders visual page
• Module routes registered but not unified with space navigation

Solution Required:

• Unified routing strategy in Singularity
• Module routes appear in space navigation
• Seamless transition between visual pages and module pages

Gap 4: Configuration UI (MODERATE)

Problem: Modules have configuration schemas but no UI to configure them.

Example from sidebar-nav:

configuration: {
  headerTitle: { type: 'string', label: 'Header Title', default: 'Navigation' },
  theme: { type: 'select', options: ['minimal', 'rich', 'dark'] },
  // ... 20+ configuration options
}

Current: No panel in Singularity to edit these configurations visually.

Solution Required:

• Module Configuration Panel component
• Dynamic form generation from schema
• Save configuration per module instance

Architecture Analysis

ModuleManifest Interface (Excellent)

Location: libs/core/module-base/src/lib/contracts/module-manifest.interface.ts

The interface is comprehensive with:

• embeddableComponents - Array of embeddable UI components
• publicActions - Callable actions from other modules
• routes - Angular routes for the module
• configuration - Dynamic configuration schema
• navigation - Menu items and navigation config
• metadata - AI metadata for intelligent composition
• repositories - Data access repositories
• dataStrategy - Storage and sync configuration

Assessment: No changes needed to the interface.

ModuleEmbeddableComponent Interface (Excellent)

Location: libs/core/module-base/src/lib/contracts/embeddable-component.interface.ts

export interface ModuleEmbeddableComponent {
  readonly id: string;
  readonly componentType: Type<unknown>;
  readonly displayName: string;
  readonly description?: string;
  readonly category: ModuleEmbeddableComponentCategory;
  readonly permissions?: readonly string[];
  readonly inputs?: readonly ModuleParameterMetadata[];
  readonly thumbnail?: string;
}

Assessment: Complete. Matches gograb-modules pattern.

WidgetRegistryService (Needs Update)

Location: libs/libs-structural/editor-web-lib/src/lib/services/widget-registry.service.ts

Current widget sources:

1. BasicWidgetRegistryService - Built-in widgets (button, text, etc.)
2. Local storage - User-created composite widgets
3. Backend API - Space-specific widgets

Missing: Module embeddable components

Required Addition:

// NEW METHOD NEEDED:
syncEmbeddablesFromModules(): void {
  const modules = inject(ModuleRegistryService).getAllModules();
  for (const module of modules) {
    for (const embeddable of module.manifest.embeddableComponents || []) {
      this.registerFromEmbeddable(embeddable);
    }
  }
}

Comparison with gograb-modules

What gograb-modules has that we should adopt:

1. WidgetDataBinding Pattern - Data binding built into widget base class
2. BaseWidgetComponent - Common lifecycle helpers for widgets
3. DynamicPageComponent - Renders pages from widget configuration

What editor has that gograb-modules should adopt:

1. Comprehensive Storage System - Flash persistence, offline-first
2. Real Backend API - MongoDB, real-time sync
3. Theme Runtime - Advanced theming with persistence
4. AI Metadata - Richer AI composition support
5. Singularity - Powerful orchestration layer

Implementation Priority

Phase 1: Widget-Embeddable Bridge (Weeks 2-3)

1. Create libs/core/module-adapter/ library
2. Update WidgetRegistryService to discover module embeddables
3. Create EmbeddableHostWidget component

Phase 2: Reference Implementation (Week 4)

1. Verify user-management module works end-to-end
2. Test embeddable appears in widget palette
3. Test drag-and-drop to Singularity pages

Phase 3: Ecommerce Module (Weeks 5-10)

1. Create comprehensive ecommerce module
2. Full services, routes, UI, embeddables
3. Backend API integration

Phase 4: Singularity Integration (Weeks 11-12)

1. Module route rendering in Singularity
2. Module configuration panel
3. Module store/installer

Files to Create

Files to Modify

Conclusion

The editor monorepo has an excellent architectural foundation. The hybrid integration requires:

1. Bridge layer to connect module embeddables to widget system
2. Business module depth to provide real functionality (ecommerce)
3. Route integration to unify visual pages and module pages
4. Configuration UI to make modules configurable visually

Estimated effort: 12-14 weeks as planned.

Status: Gap Analysis Complete
Next Step: Phase 1 - Create module-adapter library