Feat/289 - Collections moderation

src/app/core/interceptors/auth.interceptor.ts

@@ -6,7 +6,7 @@ export const authInterceptor: HttpInterceptorFn = (
   req: HttpRequest<unknown>,
   next: HttpHandlerFn
 ): Observable<HttpEvent<unknown>> => {
-  const authToken = '2rjFZwmdDG4rtKj7hGkEMO6XyHBM2lN7XBbsA1e8OqcFhOWu6Z7fQZiheu9RXtzSeVrgOt';
+  const authToken = 'UlO9O9GNKgVzJD7pUeY53jiQTKJ4U2znXVWNvh0KZQruoENuILx0IIYf9LoDz7Duq72EIm';
   // UlO9O9GNKgVzJD7pUeY53jiQTKJ4U2znXVWNvh0KZQruoENuILx0IIYf9LoDz7Duq72EIm kyrylo
   // 2rjFZwmdDG4rtKj7hGkEMO6XyHBM2lN7XBbsA1e8OqcFhOWu6Z7fQZiheu9RXtzSeVrgOt roman nastyuk
   // yZ485nN6MfhqvGrfU4Xk5BEnq0T6LM50nQ6H9VrYaMTaZUQNTuxnIwlp0Wpz879RCsK9GQ NM stage3

src/app/features/collections/collections.routes.ts

@@ -3,9 +3,10 @@ import { provideStates } from '@ngxs/store';
 import { Routes } from '@angular/router';
 
 import { AddToCollectionState } from '@osf/features/collections/store/add-to-collection';
-import { CollectionsState } from '@osf/features/collections/store/collections';
+import { CollectionsModerationState } from '@osf/features/moderation/store/collections-moderation';
 import { ConfirmLeavingGuard } from '@shared/guards';
-import { ContributorsState, ProjectsState } from '@shared/stores';
+import { BookmarksState, CitationsState, ContributorsState, NodeLinksState, ProjectsState } from '@shared/stores';
+import { CollectionsState } from '@shared/stores/collections';
 
 export const collectionsRoutes: Routes = [
   {
@@ -42,10 +43,20 @@ export const collectionsRoutes: Routes = [
         canDeactivate: [ConfirmLeavingGuard],
       },
       {
-        path: ':id/moderation',
+        path: ':collectionId/moderation',
         loadChildren: () =>
           import('@osf/features/moderation/collection-moderation.routes').then((m) => m.collectionModerationRoutes),
       },
+      {
+        path: ':collectionId/moderation/:id',
+        loadComponent: () =>
+          import(
+            '@osf/features/moderation/components/collection-submission-overview/collection-submission-overview.component'
+          ).then((mod) => mod.CollectionSubmissionOverviewComponent),
+        providers: [
+          provideStates([NodeLinksState, CitationsState, CollectionsModerationState, CollectionsState, BookmarksState]),
+        ],
+      },
     ],
   },
 ];

src/app/features/collections/components/add-to-collection/add-to-collection.component.ts

@@ -26,10 +26,10 @@ import { AddToCollectionSteps } from '@osf/features/collections/enums';
 import {
   ClearAddToCollectionState,
   CreateCollectionSubmission,
-} from '@osf/features/collections/store/add-to-collection/add-to-collection.actions';
-import { CollectionsSelectors, GetCollectionProvider } from '@osf/features/collections/store/collections';
+} from '@osf/features/collections/store/add-to-collection';
 import { LoadingSpinnerComponent } from '@shared/components';
 import { CanDeactivateComponent } from '@shared/models';
+import { CollectionsSelectors, GetCollectionProvider } from '@shared/stores';
 import { ProjectsSelectors } from '@shared/stores/projects/projects.selectors';
 
 import {

src/app/features/collections/components/add-to-collection/collection-metadata-step/collection-metadata-step.component.ts

@@ -13,7 +13,7 @@ import { FormControl, FormGroup, ReactiveFormsModule, Validators } from '@angula
 import { collectionFilterTypes } from '@osf/features/collections/constants/filter-types.const';
 import { AddToCollectionSteps } from '@osf/features/collections/enums';
 import { CollectionFilterEntry } from '@osf/features/collections/models';
-import { CollectionsSelectors, GetCollectionDetails } from '@osf/features/collections/store/collections';
+import { CollectionsSelectors, GetCollectionDetails } from '@shared/stores';
 
 @Component({
   selector: 'osf-collection-metadata-step',

src/app/features/collections/components/add-to-collection/select-project-step/select-project-step.component.ts

@@ -23,10 +23,10 @@ import { FormsModule } from '@angular/forms';
 
 import { UserSelectors } from '@core/store/user';
 import { AddToCollectionSteps } from '@osf/features/collections/enums';
-import { CollectionsSelectors, GetUserCollectionSubmissions } from '@osf/features/collections/store/collections';
 import { GetProjects, SetSelectedProject } from '@osf/shared/stores';
 import { CustomOption } from '@shared/models';
 import { Project } from '@shared/models/projects';
+import { CollectionsSelectors, GetUserCollectionSubmissions } from '@shared/stores/collections';
 import { ProjectsSelectors } from '@shared/stores/projects/projects.selectors';
 
 @Component({

src/app/features/collections/components/collections-discover/collections-discover.component.ts

@@ -13,8 +13,9 @@ import { FormControl } from '@angular/forms';
 import { ActivatedRoute, Router, RouterLink } from '@angular/router';
 
 import { CollectionsHelpDialogComponent, CollectionsMainContentComponent } from '@osf/features/collections/components';
-import { CollectionsFilters } from '@osf/features/collections/models';
 import { CollectionsQuerySyncService } from '@osf/features/collections/services';
+import { LoadingSpinnerComponent, SearchInputComponent } from '@shared/components';
+import { CollectionsFilters } from '@shared/models';
 import {
   ClearCollections,
   ClearCollectionSubmissions,
@@ -24,8 +25,7 @@ import {
   SearchCollectionSubmissions,
   SetPageNumber,
   SetSearchValue,
-} from '@osf/features/collections/store/collections';
-import { LoadingSpinnerComponent, SearchInputComponent } from '@shared/components';
+} from '@shared/stores/collections';
 
 @Component({
   selector: 'osf-collections-discover',

src/app/features/collections/components/collections-filter-chips/collections-filter-chips.component.ts

@@ -18,7 +18,7 @@ import {
   SetStatusFilters,
   SetStudyDesignFilters,
   SetVolumeFilters,
-} from '@osf/features/collections/store/collections';
+} from '@shared/stores/collections';
 
 @Component({
   selector: 'osf-collections-filter-chips',

src/app/features/collections/components/collections-filters/collections-filters.component.ts

@@ -22,7 +22,7 @@ import {
   SetStatusFilters,
   SetStudyDesignFilters,
   SetVolumeFilters,
-} from '@osf/features/collections/store/collections';
+} from '@shared/stores/collections';
 
 @Component({
   selector: 'osf-collections-filters',

src/app/features/collections/components/collections-main-content/collections-main-content.component.ts

@@ -12,7 +12,7 @@ import { FormsModule } from '@angular/forms';
 
 import { CollectionsFilterChipsComponent } from '@osf/features/collections/components';
 import { collectionsSortOptions } from '@osf/features/collections/constants';
-import { CollectionsSelectors, SetSortBy } from '@osf/features/collections/store/collections';
+import { CollectionsSelectors, SetSortBy } from '@shared/stores/collections';
 import { IS_WEB } from '@shared/utils';
 
 import { CollectionsFiltersComponent } from '../collections-filters/collections-filters.component';
@@ -38,7 +38,7 @@ export class CollectionsMainContentComponent {
   protected readonly sortOptions = collectionsSortOptions;
   protected isWeb = toSignal(inject(IS_WEB));
   protected selectedSort = select(CollectionsSelectors.getSortBy);
-  protected collectionSubmissions = select(CollectionsSelectors.getCollectionSubmissions);
+  protected collectionSubmissions = select(CollectionsSelectors.getCollectionSubmissionsSearchResult);
   protected isCollectionSubmissionsLoading = select(CollectionsSelectors.getCollectionSubmissionsLoading);
 
   protected isFiltersOpen = signal(false);

src/app/features/collections/components/collections-search-result-card/collections-search-result-card.component.ts

@@ -4,7 +4,7 @@ import { DatePipe } from '@angular/common';
 import { ChangeDetectionStrategy, Component, computed, input } from '@angular/core';
 
 import { collectionFilterNames } from '@osf/features/collections/constants';
-import { CollectionSubmission } from '@osf/features/collections/models';
+import { CollectionSubmission } from '@shared/models';
 
 @Component({
   selector: 'osf-collections-search-result-card',

src/app/features/collections/components/collections-search-results/collections-search-results.component.ts

@@ -8,8 +8,8 @@ import { Skeleton } from 'primeng/skeleton';
 
 import { ChangeDetectionStrategy, Component, computed } from '@angular/core';
 
-import { CollectionsSelectors, SetPageNumber } from '@osf/features/collections/store/collections';
 import { CustomPaginatorComponent } from '@osf/shared/components';
+import { CollectionsSelectors, SetPageNumber } from '@shared/stores/collections';
 
 import { CollectionsSearchResultCardComponent } from '../collections-search-result-card/collections-search-result-card.component';
 
@@ -21,7 +21,7 @@ import { CollectionsSearchResultCardComponent } from '../collections-search-resu
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class CollectionsSearchResultsComponent {
-  protected searchResults = select(CollectionsSelectors.getCollectionSubmissions);
+  protected searchResults = select(CollectionsSelectors.getCollectionSubmissionsSearchResult);
   protected isCollectionDetailsLoading = select(CollectionsSelectors.getCollectionDetailsLoading);
   protected isCollectionSubmissionsLoading = select(CollectionsSelectors.getCollectionSubmissionsLoading);
   protected totalSubmissions = select(CollectionsSelectors.getTotalSubmissions);

src/app/features/collections/models/index.ts

@@ -1,8 +1,4 @@
 export * from './collection-filter-entry.model';
 export * from './collection-license-json-api.models';
-export * from './collection-submission-payload';
-export * from './collections.models';
-export * from './collections-filters.model';
-export * from './collections-json-api.models';
 export * from './collections-query-params.model';
 export * from './project-metadata-form.model';

src/app/features/collections/services/add-to-collection.service.ts

@@ -3,10 +3,8 @@ import { map, Observable } from 'rxjs';
 import { inject, Injectable } from '@angular/core';
 
 import { JsonApiService } from '@core/services';
-import { CollectionsMapper } from '@osf/features/collections/mappers';
-import { CollectionSubmissionPayload } from '@osf/features/collections/models';
-import { LicensesMapper } from '@shared/mappers';
-import { License, LicensesResponseJsonApi } from '@shared/models';
+import { CollectionsMapper, LicensesMapper } from '@shared/mappers';
+import { CollectionSubmissionPayload, License, LicensesResponseJsonApi } from '@shared/models';
 
 import { environment } from 'src/environments/environment';
 

src/app/features/collections/services/collections-query-sync.service.ts

@@ -6,14 +6,10 @@ import { ActivatedRoute, Router } from '@angular/router';
 
 import { collectionsSortOptions } from '@osf/features/collections/constants';
 import { queryParamsKeys } from '@osf/features/collections/constants/query-params-keys.const';
-import { CollectionQueryParams, CollectionsFilters } from '@osf/features/collections/models';
-import {
-  CollectionsSelectors,
-  SetAllFilters,
-  SetSearchValue,
-  SetSortBy,
-} from '@osf/features/collections/store/collections';
-import { SetPageNumber } from '@osf/features/collections/store/collections/collections.actions';
+import { CollectionQueryParams } from '@osf/features/collections/models';
+import { CollectionsFilters } from '@shared/models';
+import { CollectionsSelectors, SetAllFilters, SetSearchValue, SetSortBy } from '@shared/stores/collections';
+import { SetPageNumber } from '@shared/stores/collections/collections.actions';
 
 @Injectable()
 export class CollectionsQuerySyncService {

src/app/features/collections/services/index.ts

@@ -1,4 +1,3 @@
 export * from './add-to-collection.service';
-export * from './collections.service';
 export * from './collections-query-sync.service';
 export * from './project-metadata-form.service';

src/app/features/collections/store/add-to-collection/add-to-collection.actions.ts

@@ -1,4 +1,4 @@
-import { CollectionSubmissionPayload } from '@osf/features/collections/models';
+import { CollectionSubmissionPayload } from '@shared/models';
 
 export class GetCollectionLicenses {
   static readonly type = '[Add To Collection] Get Collection Licenses';

src/app/features/moderation/collection-moderation.routes.ts

@@ -2,9 +2,11 @@ import { provideStates } from '@ngxs/store';
 
 import { Routes } from '@angular/router';
 
+import { CollectionsModerationState } from '@osf/features/moderation/store/collections-moderation';
 import { ResourceType } from '@osf/shared/enums';
+import { CollectionsState } from '@shared/stores/collections';
 
-import { ModeratorsState } from './store/moderation';
+import { ModeratorsState } from './store/moderators';
 import { CollectionModerationTab } from './enums';
 
 export const collectionModerationRoutes: Routes = [
@@ -27,6 +29,7 @@ export const collectionModerationRoutes: Routes = [
             (m) => m.CollectionModerationSubmissionsComponent
           ),
         data: { tab: CollectionModerationTab.AllItems },
+        providers: [provideStates([CollectionsModerationState, CollectionsState])],
       },
       {
         path: 'moderators',

src/app/features/moderation/components/add-moderator-dialog/add-moderator-dialog.component.ts

@@ -17,7 +17,7 @@ import { CustomPaginatorComponent, LoadingSpinnerComponent, SearchInputComponent
 
 import { AddModeratorType } from '../../enums';
 import { ModeratorAddModel, ModeratorDialogAddModel } from '../../models';
-import { ClearUsers, ModeratorsSelectors, SearchUsers } from '../../store/moderation';
+import { ClearUsers, ModeratorsSelectors, SearchUsers } from '../../store/moderators';
 
 @Component({
   selector: 'osf-add-moderator-dialog',

src/app/features/moderation/components/collection-moderation-submissions/collection-moderation-submissions.component.html

@@ -1,19 +1,18 @@
 <div class="flex flex-column-reverse justify-content-between align-items-center gap-3 md:flex-row">
   <div class="flex gap-3">
-    <p-selectbutton
+    <p-selectButton
       class="review-state-select flex-wrap"
       [options]="submissionReviewOptions"
-      [ngModel]="selectedReviewOption"
+      [ngModel]="reviewStatus()"
       (ngModelChange)="changeReviewStatus($event)"
       optionLabel="label"
       optionValue="value"
     >
       <ng-template #item let-item>
         <osf-icon [iconClass]="item.icon" [class]="item.value"></osf-icon>
-        <p>{{ totalCount }}</p>
         <p>{{ item.label | translate }}</p>
       </ng-template>
-    </p-selectbutton>
+    </p-selectButton>
   </div>
 
   <div class="w-full md:w-4">
@@ -27,4 +26,18 @@
   </div>
 </div>
 
-<osf-submissions-list [submissions]="submissions"></osf-submissions-list>
+@if (!isLoading()) {
+  <osf-submissions-list></osf-submissions-list>
+
+  @if (collectionSubmissions().length > pageSize) {
+    <osf-custom-paginator
+      class="submissions-paginator"
+      [totalCount]="totalSubmissions()"
+      [rows]="pageSize"
+      [first]="firstIndex()"
+      (pageChanged)="onPageChange($event)"
+    />
+  }
+} @else {
+  <osf-loading-spinner />
+}