126853: Themeable SubmissionSectionContainerComponent and SubmissionFormFooterComponent

Author: Atmire-Kristof

src/app/submission/form/footer/themed-submission-form-footer.component.ts

@@ -0,0 +1,27 @@
+import { ThemedComponent } from '../../../shared/theme-support/themed.component';
+import { SubmissionFormFooterComponent } from './submission-form-footer.component';
+import { Component, Input } from '@angular/core';
+
+@Component({
+  selector: 'ds-themed-submission-form-footer',
+  styleUrls: [],
+  templateUrl: '../../../shared/theme-support/themed.component.html',
+})
+export class ThemedSubmissionFormFooterComponent extends ThemedComponent<SubmissionFormFooterComponent> {
+  @Input() submissionId: string;
+
+  protected inAndOutputNames: (keyof SubmissionFormFooterComponent & keyof this)[] = ['submissionId'];
+
+  protected getComponentName(): string {
+    return 'SubmissionFormFooterComponent';
+  }
+
+  protected importThemedComponent(themeName: string): Promise<any> {
+    return import(`../../../../themes/${themeName}/app/submission/form/footer/submission-form-footer.component`);
+  }
+
+  protected importUnthemedComponent(): Promise<any> {
+    return import(`./submission-form-footer.component`);
+  }
+
+}

src/app/submission/form/submission-form.component.html

@@ -28,12 +28,12 @@
     <div class="submission-form-content">
         <ds-themed-loading *ngIf="(isLoading() | async)" message="Loading..."></ds-themed-loading>
         <ng-container *ngFor="let object of (submissionSections | async)">
-            <ds-submission-section-container [collectionId]="collectionId"
-                                             [submissionId]="submissionId"
-                                             [sectionData]="object"></ds-submission-section-container>
+            <ds-themed-submission-section-container [collectionId]="collectionId"
+                                                    [submissionId]="submissionId"
+                                                    [sectionData]="object"></ds-themed-submission-section-container>
         </ng-container>
     </div>
     <div *ngIf="!(isLoading() | async)" class="submission-form-footer mt-3 mb-3 position-sticky">
-        <ds-submission-form-footer [submissionId]="submissionId"></ds-submission-form-footer>
+        <ds-themed-submission-form-footer [submissionId]="submissionId"></ds-themed-submission-form-footer>
     </div>
 </div>

src/app/submission/sections/container/themed-section-container.component.ts

@@ -0,0 +1,29 @@
+import { ThemedComponent } from '../../../shared/theme-support/themed.component';
+import { SubmissionSectionContainerComponent } from './section-container.component';
+import { Component, Input } from '@angular/core';
+import { SectionDataObject } from '../models/section-data.model';
+
+@Component({
+  selector: 'ds-themed-submission-section-container',
+  styleUrls: [],
+  templateUrl: '../../../shared/theme-support/themed.component.html',
+})
+export class ThemedSubmissionSectionContainerComponent extends ThemedComponent<SubmissionSectionContainerComponent> {
+  @Input() collectionId: string;
+  @Input() sectionData: SectionDataObject;
+  @Input() submissionId: string;
+
+  protected inAndOutputNames: (keyof SubmissionSectionContainerComponent & keyof this)[] = ['collectionId', 'sectionData', 'submissionId'];
+
+  protected getComponentName(): string {
+    return 'SubmissionSectionContainerComponent';
+  }
+
+  protected importThemedComponent(themeName: string): Promise<any> {
+    return import(`../../../../themes/${themeName}/app/submission/sections/container/section-container.component`);
+  }
+
+  protected importUnthemedComponent(): Promise<any> {
+    return import(`./section-container.component`);
+  }
+}

src/app/submission/submission.module.ts

@@ -67,6 +67,8 @@ import {
 } from './sections/sherpa-policies/metadata-information/metadata-information.component';
 import { SectionFormOperationsService } from './sections/form/section-form-operations.service';
 import {SubmissionSectionIdentifiersComponent} from './sections/identifiers/section-identifiers.component';
+import { ThemedSubmissionSectionContainerComponent } from './sections/container/themed-section-container.component';
+import { ThemedSubmissionFormFooterComponent } from './form/footer/themed-submission-form-footer.component';
 
 const ENTRY_COMPONENTS = [
   // put only entry components that use custom decorator
@@ -106,6 +108,8 @@ const DECLARATIONS = [
   PublicationInformationComponent,
   MetadataInformationComponent,
   ThemedSubmissionSectionUploadFileComponent,
+  ThemedSubmissionSectionContainerComponent,
+  ThemedSubmissionFormFooterComponent,
 ];
 
 @NgModule({

src/themes/custom/app/submission/form/footer/submission-form-footer.component.html

@@ -0,0 +1,15 @@
+import {
+  SubmissionFormFooterComponent as BaseComponent
+} from '../../../../../../app/submission/form/footer/submission-form-footer.component';
+import { Component } from '@angular/core';
+
+@Component({
+  selector: 'ds-submission-form-footer',
+  // styleUrls: ['./submission-form-footer.component.scss'],
+  styleUrls: ['../../../../../../app/submission/form/footer/submission-form-footer.component.scss'],
+  // templateUrl: './submission-form-footer.component.html'
+  templateUrl: '../../../../../../app/submission/form/footer/submission-form-footer.component.html'
+})
+export class SubmissionFormFooterComponent extends BaseComponent {
+
+}

src/themes/custom/app/submission/form/footer/submission-form-footer.component.scss

@@ -0,0 +1,15 @@
+import {
+  SubmissionSectionContainerComponent as BaseComponent
+} from '../../../../../../app/submission/sections/container/section-container.component';
+import { Component } from '@angular/core';
+
+@Component({
+  selector: 'ds-submission-upload-section-file',
+  // styleUrls: ['./section-container.component.scss'],
+  styleUrls: ['../../../../../../app/submission/sections/container/section-container.component.scss'],
+  // templateUrl: './section-container.component.html'
+  templateUrl: '../../../../../../app/submission/sections/container/section-container.component.html'
+})
+export class SubmissionSectionContainerComponent extends BaseComponent {
+
+}