get contributors for collections moderation cards

Author: mkovalua

src/app/features/moderation/components/collection-submission-item/collection-submission-item.component.html

@@ -42,7 +42,7 @@
           <span class="mx-1 flex align-items-start">|</span>
         }
         <p class="font-normal">
-          <span class="font-bold">{{ attribute.label }}:</span> {{ attribute.value }}
+          <span class="font-bold">test {{ attribute.label }}:</span> {{ attribute.value }}
         </p>
       }
     </div>

src/app/features/moderation/components/collection-submission-item/collection-submission-item.component.ts

@@ -4,7 +4,7 @@ import { TranslatePipe } from '@ngx-translate/core';
 
 import { Button } from 'primeng/button';
 
-import { ChangeDetectionStrategy, Component, computed, inject, input } from '@angular/core';
+import { ChangeDetectionStrategy, Component, computed, inject, input, output } from '@angular/core';
 import { ActivatedRoute, Router } from '@angular/router';
 
 import { collectionFilterNames } from '@osf/features/collections/constants';
@@ -29,7 +29,8 @@ export class CollectionSubmissionItemComponent {
   private activatedRoute = inject(ActivatedRoute);
 
   submission = input.required<CollectionSubmissionWithGuid>();
-
+  loadContributors = output<void>();
+  loadMoreContributors = output<void>();
   collectionProvider = select(CollectionsSelectors.getCollectionProvider);
 
   readonly reviewStatusIcon = ReviewStatusIcon;

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

@@ -2,7 +2,12 @@
   <div class="submission-container mt-5">
     @for (item of submissions(); track $index) {
       <div class="submission-item">
-        <osf-submission-item [submission]="item"></osf-submission-item>
+        <osf-submission-item
+          [submission]="item"
+          (loadContributors)="loadContributors(item)"
+          (loadMoreContributors)="loadMoreContributors(item)"
+        >
+        </osf-submission-item>
       </div>
     }
   </div>

src/app/features/moderation/components/collection-submissions-list/collection-submissions-list.component.ts

@@ -1,9 +1,15 @@
-import { select } from '@ngxs/store';
+import { createDispatchMap, select } from '@ngxs/store';
 
 import { TranslatePipe } from '@ngx-translate/core';
 
 import { ChangeDetectionStrategy, Component } from '@angular/core';
 
+import {
+  GetCollectionSubmissionContributors,
+  LoadMoreCollectionSubmissionContributors,
+} from '@osf/features/moderation/store/collections-moderation';
+import { CollectionSubmissionWithGuid } from '@shared/models/collections/collections.models';
+
 import { CollectionsModerationSelectors } from '../../store/collections-moderation';
 import { CollectionSubmissionItemComponent } from '../collection-submission-item/collection-submission-item.component';
 
@@ -16,4 +22,17 @@ import { CollectionSubmissionItemComponent } from '../collection-submission-item
 })
 export class CollectionSubmissionsListComponent {
   submissions = select(CollectionsModerationSelectors.getCollectionSubmissions);
+
+  readonly actions = createDispatchMap({
+    getCollectionSubmissionContributors: GetCollectionSubmissionContributors,
+    loadMoreCollectionSubmissionContributors: LoadMoreCollectionSubmissionContributors,
+  });
+
+  loadContributors(item: CollectionSubmissionWithGuid) {
+    this.actions.getCollectionSubmissionContributors(item.id, 1);
+  }
+
+  loadMoreContributors(item: CollectionSubmissionWithGuid) {
+    this.actions.loadMoreCollectionSubmissionContributors(item.id);
+  }
 }

src/app/features/moderation/store/collections-moderation/collections-moderation.actions.ts

@@ -29,3 +29,18 @@ export class CreateCollectionSubmissionAction {
 export class ClearCollectionModeration {
   static readonly type = '[Collections Moderation] ClearCollectionModeration';
 }
+
+export class GetCollectionSubmissionContributors {
+  static readonly type = `[Collections Moderation] Get Registry Submission Contributors`;
+
+  constructor(
+    public collectionId: string,
+    public page = 1
+  ) {}
+}
+
+export class LoadMoreCollectionSubmissionContributors {
+  static readonly type = `[Collections Moderation] Load More Collection Submission Contributors`;
+
+  constructor(public collectionId: string) {}
+}

src/app/features/moderation/store/collections-moderation/collections-moderation.state.ts

@@ -6,23 +6,33 @@ import { catchError, forkJoin, map, of, switchMap, tap } from 'rxjs';
 import { inject, Injectable } from '@angular/core';
 
 import { CollectionsService } from '@osf/shared/services/collections.service';
+import { DEFAULT_TABLE_PARAMS } from '@shared/constants/default-table-params.constants';
+import { ResourceType } from '@shared/enums/resource-type.enum';
 import { handleSectionError } from '@shared/helpers/state-error.handler';
+import { ContributorsService } from '@shared/services/contributors.service';
 
 import {
   ClearCollectionModeration,
   CreateCollectionSubmissionAction,
+  GetCollectionSubmissionContributors,
   GetCollectionSubmissions,
   GetSubmissionsReviewActions,
+  LoadMoreCollectionSubmissionContributors,
 } from './collections-moderation.actions';
 import { COLLECTIONS_MODERATION_STATE_DEFAULTS, CollectionsModerationStateModel } from './collections-moderation.model';
 
+// import { CollectionSubmissionWithGuid } from '@shared/services/collections.services/models';
+// 'models/collections/collections.models';
+// import { CollectionSubmissionWithGuid } from '@shared/services/collections.services/models';
+
 @State<CollectionsModerationStateModel>({
   name: 'collectionsModeration',
   defaults: COLLECTIONS_MODERATION_STATE_DEFAULTS,
 })
 @Injectable()
 export class CollectionsModerationState {
   collectionsService = inject(CollectionsService);
+  contributorsService = inject(ContributorsService);
 
   @Action(GetCollectionSubmissions)
   getCollectionSubmissions(ctx: StateContext<CollectionsModerationStateModel>, action: GetCollectionSubmissions) {
@@ -117,4 +127,87 @@ export class CollectionsModerationState {
   clearCollectionModeration(ctx: StateContext<CollectionsModerationStateModel>) {
     ctx.setState(COLLECTIONS_MODERATION_STATE_DEFAULTS);
   }
+
+  @Action(GetCollectionSubmissionContributors)
+  getCollectionSubmissionContributors(
+    ctx: StateContext<CollectionsModerationStateModel>,
+    action: GetCollectionSubmissionContributors
+  ) {
+    const state = ctx.getState();
+    const submission = state.collectionSubmissions.data.find((s) => s.id === action.collectionId);
+
+    if (submission?.contributors && submission.contributors.length > 0 && action.page === 1) {
+      return;
+    }
+
+    ctx.setState(
+      patch({
+        collectionSubmissions: {
+          ...state.collectionSubmissions,
+          isSubmitting: true,
+        },
+      })
+    );
+
+    return this.contributorsService
+      .getBibliographicContributors(
+        ResourceType.Collection,
+        action.collectionId,
+        action.page,
+        DEFAULT_TABLE_PARAMS.rows
+      )
+      .pipe(
+        tap((res) => {
+          const currentSubmission = state.collectionSubmissions.data.find((s) => s.id === action.collectionId);
+          const existingContributors = currentSubmission?.contributors || [];
+          const newContributors = action.page === 1 ? res.data : [...existingContributors, ...res.data];
+
+          ctx.patchState({
+            collectionSubmissions: {
+              ...state.collectionSubmissions,
+              data: state.collectionSubmissions.data.map((submission) =>
+                submission.id === action.collectionId
+                  ? {
+                      ...submission,
+                      contributors: newContributors,
+                      totalContributors: res.totalCount,
+                      contributorsLoading: false,
+                      contributorsPage: action.page,
+                    }
+                  : submission
+              ),
+            },
+          });
+        }),
+        catchError((error) => {
+          ctx.patchState({
+            collectionSubmissions: {
+              ...state.collectionSubmissions,
+              data: state.collectionSubmissions.data.map((submission) =>
+                submission.id === action.collectionId
+                  ? {
+                      ...submission,
+                      contributorsLoading: false,
+                    }
+                  : submission
+              ),
+            },
+          });
+          return handleSectionError(ctx, 'collectionSubmissions', error);
+        })
+      );
+  }
+
+  @Action(LoadMoreCollectionSubmissionContributors)
+  loadMoreCollectionSubmissionContributors(
+    ctx: StateContext<CollectionsModerationStateModel>,
+    action: LoadMoreCollectionSubmissionContributors
+  ) {
+    const state = ctx.getState();
+    const submission = state.collectionSubmissions.data.find((s) => s.id === action.collectionId);
+    const currentPage = submission?.contributorsPage || 1;
+    const nextPage = currentPage + 1;
+
+    return ctx.dispatch(new GetCollectionSubmissionContributors(action.collectionId, nextPage));
+  }
 }

src/app/shared/models/collections/collections.models.ts

@@ -89,6 +89,9 @@ export interface CollectionSubmissionWithGuid {
     fullName: string;
   };
   actions?: CollectionSubmissionReviewAction[];
+  totalContributors?: number;
+  contributorsLoading?: boolean;
+  contributorsPage?: number;
 }
 
 export type CollectionSubmissionActionType = 'collection_submission_actions';