From b3060707ddd5318e9ba0a77ef5ffe5662ec1d507 Mon Sep 17 00:00:00 2001
From: Yura Bondarenko <yura.bondarenko@atmire.com>
Date: Mon, 16 May 2022 18:10:27 +0200
Subject: [PATCH] Make ThemedComponent reproject slots to wrapped component

---
 src/app/shared/theme-support/themed.component.html |  6 +++++-
 src/app/shared/theme-support/themed.component.ts   | 11 ++++++++---
 2 files changed, 13 insertions(+), 4 deletions(-)

diff --git a/src/app/shared/theme-support/themed.component.html b/src/app/shared/theme-support/themed.component.html
index 4256518a10..a39b288f0e 100644
--- a/src/app/shared/theme-support/themed.component.html
+++ b/src/app/shared/theme-support/themed.component.html
@@ -1 +1,5 @@
-<ng-template #vcr></ng-template>
+<ng-template #vcr>
+</ng-template>
+<div #content>
+  <ng-content></ng-content>
+</div>
diff --git a/src/app/shared/theme-support/themed.component.ts b/src/app/shared/theme-support/themed.component.ts
index 87f182a5ff..973a3a26f6 100644
--- a/src/app/shared/theme-support/themed.component.ts
+++ b/src/app/shared/theme-support/themed.component.ts
@@ -8,7 +8,8 @@ import {
   OnDestroy,
   ComponentFactoryResolver,
   ChangeDetectorRef,
-  OnChanges
+  OnChanges,
+  ElementRef
 } from '@angular/core';
 import { hasValue, isNotEmpty } from '../empty.util';
 import { from as fromPromise, Observable, of as observableOf, Subscription } from 'rxjs';
@@ -23,6 +24,7 @@ import { GenericConstructor } from '../../core/shared/generic-constructor';
 })
 export abstract class ThemedComponent<T> implements OnInit, OnDestroy, OnChanges {
   @ViewChild('vcr', { read: ViewContainerRef }) vcr: ViewContainerRef;
+  @ViewChild('content') themedElementContent: ElementRef;
   protected compRef: ComponentRef<T>;
 
   protected lazyLoadSub: Subscription;
@@ -33,7 +35,7 @@ export abstract class ThemedComponent<T> implements OnInit, OnDestroy, OnChanges
   constructor(
     protected resolver: ComponentFactoryResolver,
     protected cdr: ChangeDetectorRef,
-    protected themeService: ThemeService
+    protected themeService: ThemeService,
   ) {
   }
 
@@ -88,7 +90,10 @@ export abstract class ThemedComponent<T> implements OnInit, OnDestroy, OnChanges
       }),
     ).subscribe((constructor: GenericConstructor<T>) => {
       const factory = this.resolver.resolveComponentFactory(constructor);
-      this.compRef = this.vcr.createComponent(factory);
+
+      const contentNodes = [[...this.themedElementContent.nativeElement.children].map(node => node)] || undefined;
+
+      this.compRef = this.vcr.createComponent(factory, undefined, undefined, contentNodes);
       this.connectInputsAndOutputs();
       this.cdr.markForCheck();
     });