Circular Dependencies Fix

How we resolved circular dependencies between widget-builder and core-angular

Circular Dependencies Fix 🔄

Problem

A circular dependency was detected between widget-builder and core-angular.

libs-widgets/widget-builder 
  → core-angular 
  → @libs-ui/auth-ui 
  → libs-ui-core/ui-core 
  → libs-widgets/widgets 
  → libs-widgets/widget-builder

Solution

1. Specific File Imports

Changed from barrel exports to specific file paths:

// ❌ Before
import { UniverseContextService, API_BASE_URL } from '@libs-foundational/core-angular';

// ✅ After
import { UniverseContextService } from '@libs-foundational/core-angular/lib/services/universe-context.service';
import { API_BASE_URL } from '@libs-foundational/core-angular/lib/tokens/api-base.token';

2. Removed Unused Imports

// ❌ Removed
import { WidgetsEmbeddableRegistryService, EmbeddableDefinition, PropertyGroup } from '@libs-widgets/widgets';

3. Local Interface Definitions

// ✅ Defined locally to avoid import
interface StoragePropertyGroup {
  category: string;
  properties: Array<{ key: string; value: unknown }>;
}

Files Modified

  1. widget-builder-workspace.component.ts - Fixed imports
  2. widget-live-preview.component.ts - Removed unused imports
  3. spacing-properties-group.component.ts - Changed import path

Prevention

✅ Use specific file imports when dealing with cross-library dependencies
✅ Remove unused imports immediately
✅ Define local interfaces when possible
✅ Avoid barrel exports for deeply nested dependencies


Result: Clean build, no circular dependencies detected.