Merge branch 'main' of github.com:CenterForOpenScience/angular-osf into feat/502-add-community-metadata

Author: nmykhalkevch-exoft

src/app/features/preprints/components/preprint-details/preprint-warning-banner/preprint-warning-banner.component.html

@@ -0,0 +1,3 @@
+<p-message styleClass="w-full" icon="fas fa-triangle-exclamation" severity="warn">
+  {{ 'preprints.details.warningBanner' | translate }}
+</p-message>

src/app/features/preprints/components/preprint-details/preprint-warning-banner/preprint-warning-banner.component.spec.ts

@@ -0,0 +1,36 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { provideNoopAnimations } from '@angular/platform-browser/animations';
+
+import { PreprintWarningBannerComponent } from './preprint-warning-banner.component';
+
+import { OSFTestingModule } from '@testing/osf.testing.module';
+
+describe('PreprintWarningBannerComponent', () => {
+  let component: PreprintWarningBannerComponent;
+  let fixture: ComponentFixture<PreprintWarningBannerComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [PreprintWarningBannerComponent, OSFTestingModule],
+      providers: [provideNoopAnimations()],
+    }).compileComponents();
+
+    fixture = TestBed.createComponent(PreprintWarningBannerComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+
+  it('should show correct icon and text', () => {
+    const banner: HTMLElement = fixture.nativeElement;
+    const icon = banner.querySelector('i');
+    const text = banner.querySelector('span');
+    expect(icon).toBeDefined();
+    expect(text).toBeDefined();
+    expect(icon?.getAttribute('ng-reflect-ng-class')).toEqual('fas fa-triangle-exclamation');
+    expect(text?.textContent?.trim()).toEqual('preprints.details.warningBanner');
+  });
+});

src/app/features/preprints/components/preprint-details/preprint-warning-banner/preprint-warning-banner.component.ts

@@ -0,0 +1,15 @@
+import { TranslatePipe } from '@ngx-translate/core';
+
+import { Message } from 'primeng/message';
+
+import { ChangeDetectionStrategy, Component } from '@angular/core';
+
+@Component({
+  selector: 'osf-preprint-warning-banner',
+  imports: [TranslatePipe, Message],
+  templateUrl: './preprint-warning-banner.component.html',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+})
+export class PreprintWarningBannerComponent {
+  //
+}

src/app/features/preprints/components/stepper/review-step/review-step.component.html

@@ -28,7 +28,13 @@ <h3>
         }}
       </h3>
       <div class="flex flex-row gap-2 align-items-center">
-        <img [src]="provider()?.squareColorNoTransparentImageUrl" alt="Provider logo" height="36" width="36" />
+        <img
+          class="fit-contain"
+          [src]="provider()?.squareColorNoTransparentImageUrl"
+          alt="Provider logo"
+          height="36"
+          width="36"
+        />
         <p>{{ provider()?.name }}</p>
       </div>
     </section>

src/app/features/preprints/pages/preprint-details/preprint-details.component.html

@@ -68,6 +68,9 @@ <h1>{{ preprint()!.title }}</h1>
   </section>
 
   <section class="flex-1 flex flex-column gap-2 bg-white py-2 px-3 md:px-4">
+    @if (isOsfPreprint()) {
+      <osf-preprint-warning-banner />
+    }
     @if (moderationStatusBannerVisible()) {
       <osf-moderation-status-banner
         [provider]="preprintProvider()!"

src/app/features/preprints/pages/preprint-details/preprint-details.component.spec.ts

@@ -69,4 +69,8 @@ describe.skip('PreprintDetailsComponent', () => {
   it('should create', () => {
     expect(component).toBeTruthy();
   });
+
+  it('isOsfPreprint should be true if providerId === osf', () => {
+    expect(component.isOsfPreprint()).toBeTruthy();
+  });
 });

src/app/features/preprints/pages/preprint-details/preprint-details.component.ts

@@ -50,6 +50,8 @@ import { ReviewPermissions, UserPermissions } from '@shared/enums';
 import { MetaTagsService } from '@shared/services';
 import { ContributorsSelectors } from '@shared/stores';
 
+import { PreprintWarningBannerComponent } from '../../components/preprint-details/preprint-warning-banner/preprint-warning-banner.component';
+
 import { environment } from 'src/environments/environment';
 
 @Component({
@@ -64,6 +66,7 @@ import { environment } from 'src/environments/environment';
     StatusBannerComponent,
     TranslatePipe,
     PreprintTombstoneComponent,
+    PreprintWarningBannerComponent,
     ModerationStatusBannerComponent,
     MakeDecisionComponent,
   ],
@@ -235,6 +238,10 @@ export class PreprintDetailsComponent implements OnInit, OnDestroy {
     );
   });
 
+  isOsfPreprint = computed(() => {
+    return this.providerId() === 'osf';
+  });
+
   moderationStatusBannerVisible = computed(() => {
     return (
       this.moderationMode() &&

src/app/features/project/project.routes.ts

@@ -15,7 +15,6 @@ import {
 import { ActivityLogsState } from '@osf/shared/stores/activity-logs';
 
 import { CollectionsModerationState } from '../moderation/store/collections-moderation';
-import { NotificationSubscriptionState } from '../settings/notifications/store';
 
 import { AnalyticsState } from './analytics/store';
 import { SettingsState } from './settings/store';
@@ -63,7 +62,7 @@ export const projectRoutes: Routes = [
       {
         path: 'settings',
         loadComponent: () => import('../project/settings/settings.component').then((mod) => mod.SettingsComponent),
-        providers: [provideStates([SettingsState, ViewOnlyLinkState, NotificationSubscriptionState])],
+        providers: [provideStates([SettingsState, ViewOnlyLinkState])],
       },
       {
         path: 'contributors',

src/app/features/project/settings/components/index.ts

@@ -1,7 +1,7 @@
 export { ProjectDetailSettingAccordionComponent } from './project-detail-setting-accordion/project-detail-setting-accordion.component';
 export { ProjectSettingNotificationsComponent } from './project-setting-notifications/project-setting-notifications.component';
 export { SettingsAccessRequestsCardComponent } from './settings-access-requests-card/settings-access-requests-card.component';
-export { SettingsCommentingCardComponent } from './settings-commenting-card/settings-commenting-card.component';
+export { SettingsProjectAffiliationComponent } from './settings-project-affiliation/settings-project-affiliation.component';
 export { SettingsProjectFormCardComponent } from './settings-project-form-card/settings-project-form-card.component';
 export { SettingsRedirectLinkComponent } from './settings-redirect-link/settings-redirect-link.component';
 export { SettingsStorageLocationCardComponent } from './settings-storage-location-card/settings-storage-location-card.component';

src/app/features/project/settings/components/project-detail-setting-accordion/project-detail-setting-accordion.component.html

@@ -1,12 +1,12 @@
 <div
-  class="flex justify-between align-items-center mb-2 w-full border-bottom-1 border-gray-300 gap-2 flex-column sm:flex-row sm:gap-4"
+  class="flex justify-content-between align-items-center mb-2 w-full border-bottom-1 border-gray-300 gap-2 flex-column sm:flex-row sm:gap-4"
 >
   <div class="flex align-items-center gap-2 cursor-pointer w-full sm:w-5">
     <p-button
       [icon]="expanded() ? 'fas fa-minus' : 'fas fa-plus'"
       variant="text"
       severity="contrast"
-      (click)="toggle()"
+      (onClick)="toggle()"
     ></p-button>
 
     <span class="font-medium text-color">{{ title() }}</span>
@@ -22,32 +22,21 @@
             </span>
           }
 
-          <p-select
-            class="accordion-dropdown"
+          <osf-select
+            [noBorder]="true"
             [options]="control.options"
-            [(ngModel)]="control.value"
-            (ngModelChange)="emitValueChange.emit({ index: index, value: control.value })"
-          >
-            <ng-template let-item pTemplate="item">
-              <span>{{ item.label | translate }}</span>
-            </ng-template>
-
-            <ng-template let-item pTemplate="selectedItem">
-              {{ item.label | translate }}
-            </ng-template>
-          </p-select>
+            [(selectedValue)]="control.value"
+            [disabled]="disabledRightControls()"
+            (changeValue)="emitValueChange.emit({ index: index, value: control.value })"
+          ></osf-select>
         </div>
       }
     </div>
   }
 </div>
 
 @if (expanded()) {
-  <div
-    class="mt-2 pl-5 border-bottom-1 border-gray-300"
-    [attr.id]="'accordion-content-' + title()"
-    [attr.aria-labelledby]="'accordion-label-' + title()"
-  >
+  <div class="mt-2 pl-5 border-bottom-1 border-gray-300">
     <ng-content></ng-content>
   </div>
 }