Skip to content

Commit 99a9711

Browse files
milanmajchrakmilanmajchrak
committed
fix: restore DataShare customizations per review feedback
- Restore ds-themed-about selector with eslint-disable (review point 7) - Restore model.context.label in form Add buttons (review point 12) - Restore signal-based one-section-at-a-time accordion (review point 14) - Update Cypress submission tests for one-at-a-time accordion behavior - Preserve a11y improvements (aria-labels, aria-hidden)
1 parent 69b9298 commit 99a9711

4 files changed

Lines changed: 38 additions & 14 deletions

File tree

‎cypress/e2e/submission.cy.ts‎

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -73,6 +73,9 @@ describe('New Submission page', () => {
7373
// (as it has required fields)
7474
cy.get('div#traditionalpageone-header i.fa-exclamation-circle').should('be.visible');
7575

76+
// DATASHARE: Open first section panel (DataShare uses one-section-at-a-time accordion)
77+
cy.get('#traditionalpageone-header button').click();
78+
7679
// Title field should have class "is-invalid" applied, as it's required
7780
cy.get('input#dc_title').should('have.class', 'is-invalid');
7881

@@ -122,14 +125,23 @@ describe('New Submission page', () => {
122125
// This page is restricted, so we will be shown the login form. Fill it out & submit.
123126
cy.loginViaForm(Cypress.env('DSPACE_TEST_SUBMIT_USER'), Cypress.env('DSPACE_TEST_SUBMIT_USER_PASSWORD'));
124127

128+
// DATASHARE: Open first section panel (DataShare uses one-section-at-a-time accordion)
129+
cy.get('#traditionalpageone-header button').click();
130+
125131
// Fill out all required fields (Title, Date)
126132
cy.get('input#dc_title').type('DSpace logo uploaded via e2e tests');
127133
cy.get('input#dc_date_issued_year').type('2022');
128134

135+
// DATASHARE: Open license section
136+
cy.get('#license-header button').click();
137+
129138
// Confirm the required license by checking checkbox
130139
// (NOTE: requires "force:true" cause Cypress claims this checkbox is covered by its own <span>)
131140
cy.get('input#granted').check( { force: true } );
132141

142+
// DATASHARE: Open upload section
143+
cy.get('#upload-header button').click();
144+
133145
// Before using Cypress drag & drop, we have to manually trigger the "dragover" event.
134146
// This ensures our UI displays the dropzone that covers the entire submission page.
135147
// (For some reason Cypress drag & drop doesn't trigger this even itself & upload won't work without this trigger)
@@ -204,6 +216,9 @@ describe('New Submission page', () => {
204216
} as Options,
205217
);
206218

219+
// DATASHARE: Open person section panel (DataShare uses one-section-at-a-time accordion)
220+
cy.get('#personStep-header button').click();
221+
207222
// Click the lookup button next to "Publication" field
208223
cy.get('button[data-test="lookup-button"]').click();
209224

‎src/app/info/about/themed-about.component.ts‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,8 @@ import { AboutComponent } from './about.component';
77
* Themed wrapper for Component
88
*/
99
@Component({
10-
selector: 'ds-about',
10+
// eslint-disable-next-line dspace-angular-ts/themed-component-selectors
11+
selector: 'ds-themed-about',
1112
styleUrls: [],
1213
templateUrl: '../../shared/theme-support/themed.component.html',
1314
standalone: true,

‎src/app/shared/form/form.component.html‎

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,8 @@
1212
(dfFocus)="onFocus($event)"
1313
(ngbEvent)="onCustomEvent($event)">
1414
<!-- DATASHARE start -->
15-
<ng-template modelType="ARRAY" let-group let-index="index" let-context="context">
15+
<!-- DATASHARE: Added let-model -->
16+
<ng-template modelType="ARRAY" let-model let-group let-index="index" let-context="context">
1617
<!--Array with repeatable items-->
1718
<div *ngIf="(!context.notRepeatable) && !isVirtual(context, index) && group.context.groups.length !== 1 && !isItemReadOnly(context, index)"
1819
class="col-xs-2 d-flex flex-column justify-content-sm-start align-items-end">
@@ -26,11 +27,11 @@
2627
<div *ngIf="(!context.notRepeatable) && index === (group.context.groups.length - 1) && !isItemReadOnly(context, index)" class="clearfix pl-4 w-100">
2728
<div class="btn-group" role="group">
2829
<button type="button" role="button" class="ds-form-add-more btn btn-link"
29-
title="{{'form.add' | translate}}"
30-
attr.aria-label="{{'form.add' | translate}}"
30+
title="{{'form.add' | translate}} {{ model.context.label }}"
31+
attr.aria-label="{{'form.add' | translate}} {{ model.context.label }}"
3132
(click)="insertItem($event, group.context, group.context.groups.length)">
32-
<span><i class="fas fa-plus"></i>&nbsp;{{'form.add' | translate}}</span>
33-
<!-- DATASHARE: kept i18n text for button name a11y compliance -->
33+
<span><i class="fas fa-plus"></i>&nbsp;{{ model.context.label }}</span>
34+
<!-- DATASHARE: Replaced {{'form.add' | translate}} with {{ model.context.label }} -->
3435
</button>
3536
</div>
3637
</div>

‎src/app/submission/sections/container/section-container.component.html‎

Lines changed: 15 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,12 @@
11
<div dsSection #sectionRef="sectionRef" [attr.id]="'section_' + sectionData.id"
22
[ngClass]="{ 'section-focus' : sectionRef.isSectionActive() }" [mandatory]="sectionData.mandatory"
33
[submissionId]="submissionId" [sectionType]="sectionData.sectionType" [sectionId]="sectionData.id">
4-
<!-- DATASHARE - note: reverted to upstream accordion behavior (all sections open by default) for CI compatibility -->
5-
<!-- DataShare's signal-based one-section-at-a-time behavior should be implemented in the datashare theme override instead -->
4+
<!-- DATASHARE - start -->
5+
<!-- Use the signal-based method to determine if the section is open and recording panel changes-->
66
<ngb-accordion #acc="ngbAccordion" *ngIf="(sectionRef.isEnabled() | async)"
7-
(panelChange)="sectionRef.sectionChange($event)" activeIds="{{ sectionData.id }}" [destroyOnHide]="false">
7+
(panelChange)="onPanelChange($event)" [activeIds]="datashareSubmissionFormSectionContainerService.openPanelId() === sectionData.id ? sectionData.id : ''" [destroyOnHide]="false"
8+
[class]="isSectionOpen() ? 'ds-open' : 'ds-closed'">
9+
<!-- DATASHARE - end -->
810
<ngb-panel id="{{ sectionData.id }}" [type]="sectionRef.isInfo() ? 'info' : ''">
911
<ng-template ngbPanelTitle>
1012
<span [ngClass]="{ 'text-white' : sectionRef.isInfo()}" class="float-left section-title" tabindex="0">{{
@@ -26,21 +28,26 @@
2628
<i *ngIf="sectionRef.isInfo()" class="fas fa-info-circle mr-3 text-white"
2729
title="{{'submission.sections.status.info.title' | translate}}" role="img"
2830
[attr.aria-label]="'submission.sections.status.info.aria' | translate"></i>
31+
<!-- DATASHARE - start -->
32+
<!-- Replaced sectionRef.isOpen() with isSectionOpen() to use the new signal-based method -->
2933
<a class="close" tabindex="0" role="button"
30-
[attr.aria-label]="(sectionRef.isOpen() ? 'submission.sections.toggle.aria.close' : 'submission.sections.toggle.aria.open') | translate: {sectionHeader: ('submission.sections.'+sectionData.header | translate)}"
31-
[title]="(sectionRef.isOpen() ? 'submission.sections.toggle.close' : 'submission.sections.toggle.open') | translate">
32-
<span *ngIf="sectionRef.isOpen()" [ngClass]="{ 'text-white' : sectionRef.isInfo()}"
34+
[attr.aria-label]="(isSectionOpen() ? 'submission.sections.toggle.aria.close' : 'submission.sections.toggle.aria.open') | translate: {sectionHeader: ('submission.sections.'+sectionData.header | translate)}"
35+
[title]="(isSectionOpen() ? 'submission.sections.toggle.close' : 'submission.sections.toggle.open') | translate">
36+
<span *ngIf="isSectionOpen()" [ngClass]="{ 'text-white' : sectionRef.isInfo()}"
3337
class="fas fa-chevron-up fa-fw"></span>
34-
<span *ngIf="!sectionRef.isOpen()" class="fas fa-chevron-down fa-fw"></span>
38+
<span *ngIf="!isSectionOpen()" class="fas fa-chevron-down fa-fw"></span>
3539
</a>
40+
<!-- DATASHARE - end -->
3641
<a href="javascript:void(0);" class="close mr-3" *ngIf="!sectionRef.isMandatory()"
3742
(click)="removeSection($event)"
3843
[attr.aria-label]="'submission.sections.remove' | translate: {sectionHeader: ('submission.sections.'+sectionData.header | translate)}">
3944
<i class="fas fa-trash-o" aria-hidden="true"></i>
4045
</a>
4146
</div>
4247
</ng-template>
43-
<ng-template ngbPanelContent>
48+
<!-- DATASHARE - start -->
49+
<ng-template ngbPanelContent *ngIf="datashareSubmissionFormSectionContainerService.openPanelId() === sectionData.id || ''">
50+
<!-- DATASHARE - end -->
4451
<div id="sectionGenericError_{{sectionData.id}}" *ngIf="sectionRef.hasGenericErrors()">
4552
<ds-alert *ngFor="let error of sectionRef.getErrors(); let i = index" [content]="error" [dismissible]="true"
4653
[type]="AlertTypeEnum.Error" (close)="sectionRef.removeError(i)"></ds-alert>

0 commit comments

Comments
 (0)