Merged in task/dspace-cris-2024_02_x/DSC-2715 (pull request DSpace#4044)

Task/dspace cris 2024 02 x/DSC-2715

Approved-by: Andrea Barbasso

Author: Mattia Vianelli

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

@@ -6,7 +6,8 @@
                                         [uploadFilesOptions]="uploadFilesOptions"></ds-submission-upload-files>
             <div class="clearfix"></div>
         </div>
-
+      <ds-submission-legend *ngIf="shouldShowLegend" class="submission-form-header-legend">
+      </ds-submission-legend>
         <div class="submission-form-header-item mb-3 mb-sm-0 flex-sm-grow-1 flex-md-grow-0">
           <ng-container *ngIf="!isSectionHidden">
             <ds-submission-form-collection [currentCollectionId]="collectionId"

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

@@ -9,6 +9,10 @@
   flex-grow: 1;
 }
 
+.submission-form-header-legend {
+  width: 100%;
+}
+
 .submission-form-footer {
   border-radius: var(--bs-card-border-radius);
   bottom: 0;

src/app/submission/form/submission-form.component.spec.ts

@@ -286,6 +286,45 @@ describe('SubmissionFormComponent', () => {
       done();
     });
 
+    describe('submission legend', () => {
+      beforeEach(() => {
+        comp.collectionId = collectionId;
+        comp.submissionId = submissionId;
+        comp.submissionDefinition = submissionDefinition;
+        comp.selfUrl = selfUrl;
+        comp.sections = sectionsData;
+        comp.item = new Item();
+        comp.entityType = 'publication';
+        submissionServiceStub.getSubmissionObject.and.returnValue(observableOf(submissionState));
+        submissionServiceStub.getSubmissionSections.and.returnValue(observableOf(sectionsList));
+
+        // Mock isLoading$ to return false so the template renders
+        comp.isLoading$ = observableOf(false);
+
+        // Mock uploadEnabled$ to ensure template renders properly
+        comp.uploadEnabled$ = observableOf(false);
+      });
+
+      it('should display submission legend when shouldShowLegend is true', () => {
+        spyOnProperty(comp, 'shouldShowLegend', 'get').and.returnValue(true);
+
+        fixture.detectChanges();
+
+        const legendElement = fixture.debugElement.nativeElement.querySelector('ds-submission-legend');
+        expect(legendElement).toBeTruthy();
+        expect(legendElement.classList.contains('submission-form-header-legend')).toBe(true);
+      });
+
+      it('should not display submission legend when shouldShowLegend is false', () => {
+        spyOnProperty(comp, 'shouldShowLegend', 'get').and.returnValue(false);
+
+        fixture.detectChanges();
+
+        const legendElement = fixture.debugElement.nativeElement.querySelector('ds-submission-legend');
+        expect(legendElement).toBeNull();
+      });
+    });
+
   });
 });
 

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

@@ -22,6 +22,7 @@ import {
   switchMap,
 } from 'rxjs/operators';
 
+import { environment } from '../../../environments/environment';
 import { AuthService } from '../../core/auth/auth.service';
 import { SubmissionDefinitionsModel } from '../../core/config/models/config-submission-definitions.model';
 import { Collection } from '../../core/shared/collection.model';
@@ -46,6 +47,7 @@ import { SectionDataObject } from '../sections/models/section-data.model';
 import { SectionsService } from '../sections/sections.service';
 import { SectionsType } from '../sections/sections-type';
 import { SubmissionService } from '../submission.service';
+import { SubmissionLegendComponent } from '../submission-legend/submission-legend.component';
 import { SubmissionVisibility } from '../utils/visibility.util';
 import {
   SubmissionSectionModel,
@@ -71,6 +73,7 @@ import { ThemedSubmissionUploadFilesComponent } from './submission-upload-files/
     ThemedSubmissionUploadFilesComponent,
     SubmissionFormCollectionComponent,
     SubmissionFormSectionAddComponent,
+    SubmissionLegendComponent,
     TranslateModule,
   ],
   standalone: true,
@@ -334,6 +337,13 @@ export class SubmissionFormComponent implements OnChanges, OnDestroy {
     });
   }
 
+  /**
+   * Check if submission legend should be shown
+   */
+  get shouldShowLegend(): boolean {
+    return environment.submission.showLegend;
+  }
+
   /**
    * Check if submission form is loading
    */

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

@@ -0,0 +1 @@
+<p [innerHTML]="legendText | translate"></p>

src/app/submission/submission-legend/submission-legend.component.scss

@@ -0,0 +1,14 @@
+:host {
+  display: block;
+  margin-bottom: 1rem;
+}
+
+p {
+  margin: 0;
+  padding: 0.75rem 1rem;
+  border: 1px solid #dee2e6;
+  border-radius: 0.25rem;
+  background-color: rgba(0, 0, 0, 0.03);
+  font-size: 0.875rem;
+  color: #343a40;
+}

src/app/submission/submission-legend/submission-legend.component.spec.ts

@@ -0,0 +1,27 @@
+import {
+  ComponentFixture,
+  TestBed,
+} from '@angular/core/testing';
+import { TranslateModule } from '@ngx-translate/core';
+
+import { SubmissionLegendComponent } from './submission-legend.component';
+
+describe('SubmissionLegendComponent', () => {
+  let component: SubmissionLegendComponent;
+  let fixture: ComponentFixture<SubmissionLegendComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [ SubmissionLegendComponent, TranslateModule.forRoot() ],
+    })
+      .compileComponents();
+
+    fixture = TestBed.createComponent(SubmissionLegendComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/submission/submission-legend/submission-legend.component.ts

@@ -0,0 +1,13 @@
+import { Component } from '@angular/core';
+import { TranslateModule } from '@ngx-translate/core';
+
+@Component({
+  selector: 'ds-submission-legend',
+  templateUrl: './submission-legend.component.html',
+  styleUrls: ['./submission-legend.component.scss'],
+  standalone: true,
+  imports: [TranslateModule],
+})
+export class SubmissionLegendComponent {
+  legendText = 'submission.sections.general.legend';
+}

src/assets/i18n/en.json5

@@ -7125,6 +7125,8 @@
 
   "submission.sections.general.sections_not_valid": "There are incomplete sections.",
 
+  "submission.sections.general.legend": "<h3><b>Mandatory Fields</b></h3><p>Fields marked with an asterisk (*) must be completed before the submission can be finalized.</p>",
+
   "submission.sections.identifiers.info": "The following identifiers will be created for your item:",
 
   "submission.sections.identifiers.no_handle": "No handles have been minted for this item.",

src/assets/i18n/it.json5

@@ -11633,6 +11633,9 @@
   // "submission.sections.general.sections_not_valid": "There are incomplete sections.",
   "submission.sections.general.sections_not_valid": "Ci sono sezioni incomplete.",
 
+  // "submission.sections.general.legend": "<h3><b>Mandatory Fields</b></h3><p>Fields marked with an asterisk (*) must be completed before the submission can be finalized.</p>",
+  "submission.sections.general.legend": "<h3><b>Campi Obbligatori</b></h3><p>I campi contrassegnati con un asterisco (*) devono essere compilati prima che la submission possa essere finalizzata.</p>",
+
   // "submission.sections.identifiers.info": "The following identifiers will be created for your item:",
   "submission.sections.identifiers.info": "Per questo item saranno generati i seguenti identificativi:",