Fix/my reviewing

src/app/core/constants/nav-items.constant.ts

@@ -60,6 +60,11 @@ export const MENU_ITEMS: MenuItem[] = [
         label: 'navigation.preprintsSubRoutes.myPreprints',
         routerLinkActiveOptions: { exact: false },
       },
+      {
+        routerLink: '/preprints/my-reviewing',
+        label: 'navigation.preprintsSubRoutes.myReviewing',
+        routerLinkActiveOptions: { exact: true },
+      },
     ],
   },
   {

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

@@ -7,8 +7,6 @@ import { CollectionsState } from '@osf/features/collections/store/collections';
 import { ConfirmLeavingGuard } from '@shared/guards';
 import { ContributorsState, ProjectsState } from '@shared/stores';
 
-import { ModeratorsState } from '../moderation/store/moderation';
-
 export const collectionsRoutes: Routes = [
   {
     path: '',
@@ -45,11 +43,8 @@ export const collectionsRoutes: Routes = [
       },
       {
         path: ':id/moderation',
-        loadComponent: () =>
-          import('@osf/features/moderation/pages/collection-moderation/collection-moderation.component').then(
-            (m) => m.CollectionModerationComponent
-          ),
-        providers: [provideStates([ModeratorsState])],
+        loadChildren: () =>
+          import('@osf/features/moderation/collection-moderation.routes').then((m) => m.collectionModerationRoutes),
       },
     ],
   },

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

@@ -0,0 +1,48 @@
+import { provideStates } from '@ngxs/store';
+
+import { Routes } from '@angular/router';
+
+import { ResourceType } from '@osf/shared/enums';
+
+import { ModeratorsState } from './store/moderation';
+import { CollectionModerationTab } from './enums';
+
+export const collectionModerationRoutes: Routes = [
+  {
+    path: '',
+    loadComponent: () =>
+      import('@osf/features/moderation/pages/collection-moderation/collection-moderation.component').then(
+        (m) => m.CollectionModerationComponent
+      ),
+    children: [
+      {
+        path: '',
+        pathMatch: 'full',
+        redirectTo: 'all-items',
+      },
+      {
+        path: 'all-items',
+        loadComponent: () =>
+          import('./components/collection-moderation-submissions/collection-moderation-submissions.component').then(
+            (m) => m.CollectionModerationSubmissionsComponent
+          ),
+        data: { tab: CollectionModerationTab.AllItems },
+      },
+      {
+        path: 'moderators',
+        loadComponent: () =>
+          import('./components/moderators-list/moderators-list.component').then((m) => m.ModeratorsListComponent),
+        data: { resourceType: ResourceType.Collection, tab: CollectionModerationTab.Moderators },
+        providers: [provideStates([ModeratorsState])],
+      },
+      {
+        path: 'settings',
+        loadComponent: () =>
+          import('./components/notification-settings/notification-settings.component').then(
+            (m) => m.NotificationSettingsComponent
+          ),
+        data: { tab: CollectionModerationTab.Settings },
+      },
+    ],
+  },
+];

src/app/features/moderation/components/moderators-list/moderators-list.component.ts

@@ -7,7 +7,7 @@ import { DialogService } from 'primeng/dynamicdialog';
 
 import { debounceTime, distinctUntilChanged, filter, forkJoin, map, of, skip } from 'rxjs';
 
-import { ChangeDetectionStrategy, Component, DestroyRef, effect, inject, input, OnInit, signal } from '@angular/core';
+import { ChangeDetectionStrategy, Component, DestroyRef, effect, inject, OnInit, Signal, signal } from '@angular/core';
 import { takeUntilDestroyed, toSignal } from '@angular/core/rxjs-interop';
 import { FormControl } from '@angular/forms';
 import { ActivatedRoute } from '@angular/router';
@@ -39,8 +39,6 @@ import { ModeratorsTableComponent } from '../moderators-table/moderators-table.c
   providers: [DialogService],
 })
 export class ModeratorsListComponent implements OnInit {
-  resourceType = input.required<ResourceType>();
-
   protected searchControl = new FormControl<string>('');
 
   private readonly route = inject(ActivatedRoute);
@@ -50,7 +48,10 @@ export class ModeratorsListComponent implements OnInit {
   private readonly dialogService = inject(DialogService);
   private readonly toastService = inject(ToastService);
 
-  providerId = toSignal(this.route.params.pipe(map((params) => params['id'])) ?? of(undefined));
+  readonly providerId = toSignal(this.route.parent?.params.pipe(map((params) => params['id'])) ?? of(undefined));
+  readonly resourceType: Signal<ResourceType | undefined> = toSignal(
+    this.route.data.pipe(map((params) => params['resourceType'])) ?? of(undefined)
+  );
 
   moderators = signal([]);
   initialModerators = select(ModeratorsSelectors.getModerators);

src/app/features/moderation/components/my-reviewing-navigation/my-reviewing-navigation.component.html

@@ -2,14 +2,14 @@ <h4>{{ provider().name }}</h4>
 
 <div class="flex flex-column gap-2 mt-2">
   @for (tab of tabOptions; track $index) {
-    @let badge = tab.value === tabOption.Submissions ? submissionsCount : undefined;
+    @let badge = tab.value === tabOption.Submissions ? `${provider().submissionCount}` : undefined;
 
     <p-button
       class="link-btn"
       [link]="true"
       [label]="tab.label | translate"
       [badge]="badge"
-      [routerLink]="['/preprints', provider().id, 'moderation']"
+      [routerLink]="['/preprints', provider().id, 'moderation', tab.value]"
     ></p-button>
   }
 </div>

src/app/features/moderation/components/my-reviewing-navigation/my-reviewing-navigation.component.ts

@@ -19,7 +19,6 @@ import { PreprintModerationTab } from '../../enums';
 })
 export class MyReviewingNavigationComponent {
   provider = input.required<PreprintProviderShortInfo>();
-  submissionsCount = '2';
 
   readonly tabOptions = PREPRINT_REVIEWING_TABS;
   readonly tabOption = PreprintModerationTab;

src/app/features/moderation/components/recent-activity-list/recent-activity-list.component.html

@@ -6,26 +6,27 @@
     <p-skeleton height="2.5rem"></p-skeleton>
   </div>
 } @else {
-  @for (item of reviews(); track $index) {
-    <div class="recent-activity-item flex justify-content-between py-2">
-      <div class="flex align-items-center">
-        <osf-icon
-          [class]="reviewStatusIcon[item.toState].value"
-          [iconClass]="reviewStatusIcon[item.toState].icon"
-        ></osf-icon>
-        <span class="ml-2">{{ item.fromState }}</span>
-        <span class="capitalize">{{ 'moderation.submissionReview.submitted' | translate }}</span>
-        <span>{{ 'moderation.submissionReview.by' | translate }}</span>
-        <span>{{ item.trigger }}</span>
-      </div>
+  <div class="overflow-auto">
+    @for (item of reviews(); track $index) {
+      <div class="recent-activity-item flex align-items-center justify-content-between py-2 white-space-nowrap">
+        <div class="flex align-items-center gap-1">
+          <osf-icon
+            [class]="reviewStatusIcon[item.toState].value"
+            [iconClass]="reviewStatusIcon[item.toState].icon"
+          ></osf-icon>
+          <span class="ml-2">{{ item.creator.name }}</span>
+          <span>{{ preprintReviewStatus[item.toState].label | translate: { name: item.preprint.name } }}</span>
+          <span>{{ item.provider.name }}</span>
+        </div>
 
-      <p class="flex flex-wrap gap-1 mt-2">
-        {{ item.dateModified | date: 'MMM d, y h:mm a' }}
-      </p>
-    </div>
-  }
+        <p class="flex flex-wrap gap-1 ml-3">
+          {{ item.dateModified | date: 'MMM d, y h:mm a' }}
+        </p>
+      </div>
+    }
+  </div>
 
-  @if (totalCount()) {
+  @if (totalCount() > 10) {
     <osf-custom-paginator
       class="block mt-4"
       [first]="first()"

src/app/features/moderation/components/recent-activity-list/recent-activity-list.component.scss

@@ -9,16 +9,24 @@
 
 .pending {
   color: var(--yellow-1);
+  width: 16px;
+  height: 16px;
 }
 
 .accepted {
   color: var(--green-1);
+  width: 16px;
+  height: 16px;
 }
 
 .rejected {
   color: var(--red-1);
+  width: 16px;
+  height: 16px;
 }
 
 .withdrawn {
   color: var(--dark-blue-1);
+  width: 16px;
+  height: 16px;
 }

src/app/features/moderation/components/recent-activity-list/recent-activity-list.component.ts

@@ -7,7 +7,7 @@ import { TableModule } from 'primeng/table';
 import { DatePipe } from '@angular/common';
 import { ChangeDetectionStrategy, Component, input, output, signal } from '@angular/core';
 
-import { ReviewStatusIcon } from '@osf/features/moderation/constants';
+import { PreprintReviewStatus, ReviewStatusIcon } from '@osf/features/moderation/constants';
 import { CustomPaginatorComponent, IconComponent } from '@osf/shared/components';
 
 import { PreprintReviewActionModel } from '../../models';
@@ -28,6 +28,7 @@ export class RecentActivityListComponent {
 
   protected first = signal(0);
   readonly reviewStatusIcon = ReviewStatusIcon;
+  readonly preprintReviewStatus = PreprintReviewStatus;
 
   onPageChange(event: PaginatorState) {
     this.pageChanged.emit(event.page ?? 1);

src/app/features/moderation/constants/collection-moderation-tabs.const.ts

@@ -1,8 +1,8 @@
-import { SelectOption, TabOption } from '@osf/shared/models';
+import { CustomOption, SelectOption } from '@osf/shared/models';
 
 import { CollectionModerationTab, ModeratorPermission } from '../enums';
 
-export const COLLECTION_MODERATION_TABS: TabOption[] = [
+export const COLLECTION_MODERATION_TABS: CustomOption<string>[] = [
   { label: 'moderation.allItems', value: CollectionModerationTab.AllItems },
   { label: 'moderation.moderators', value: CollectionModerationTab.Moderators },
   { label: 'moderation.settings', value: CollectionModerationTab.Settings },

src/app/features/moderation/constants/index.ts

@@ -1,4 +1,5 @@
 export * from './collection-moderation-tabs.const';
+export * from './my-preprint-reviewing.const';
 export * from './preprint-moderation-tabs.const';
 export * from './preprint-settings-sections.const';
 export * from './registry-moderation-tabs.const';

src/app/features/moderation/constants/my-preprint-reviewing.const.ts

@@ -0,0 +1,16 @@
+import { SubmissionReviewStatus } from '../enums';
+
+export const PreprintReviewStatus: Record<SubmissionReviewStatus | string, { label: string }> = {
+  [SubmissionReviewStatus.Pending]: {
+    label: 'moderation.preprintReviewStatus.submitted',
+  },
+  [SubmissionReviewStatus.Accepted]: {
+    label: 'moderation.preprintReviewStatus.accepted',
+  },
+  [SubmissionReviewStatus.Rejected]: {
+    label: 'moderation.preprintReviewStatus.rejected',
+  },
+  [SubmissionReviewStatus.Withdrawn]: {
+    label: 'moderation.preprintReviewStatus.withdrawn',
+  },
+};

src/app/features/moderation/constants/preprint-moderation-tabs.const.ts

@@ -1,16 +1,16 @@
-import { TabOption } from '@osf/shared/models';
+import { CustomOption } from '@osf/shared/models';
 
 import { PreprintModerationTab } from '../enums';
 
-export const PREPRINT_MODERATION_TABS: TabOption[] = [
+export const PREPRINT_MODERATION_TABS: CustomOption<string>[] = [
   { label: 'moderation.submissions', value: PreprintModerationTab.Submissions },
   { label: 'moderation.withdrawalRequest', value: PreprintModerationTab.WithdrawalRequests },
   { label: 'moderation.moderators', value: PreprintModerationTab.Moderators },
   { label: 'moderation.notifications', value: PreprintModerationTab.Notifications },
   { label: 'moderation.settings', value: PreprintModerationTab.Settings },
 ];
 
-export const PREPRINT_REVIEWING_TABS: TabOption[] = [
+export const PREPRINT_REVIEWING_TABS: CustomOption<string>[] = [
   { label: 'moderation.submissions', value: PreprintModerationTab.Submissions },
   { label: 'moderation.moderators', value: PreprintModerationTab.Moderators },
   { label: 'moderation.notifications', value: PreprintModerationTab.Notifications },

src/app/features/moderation/constants/registry-moderation-tabs.const.ts

@@ -1,8 +1,8 @@
-import { TabOption } from '@osf/shared/models';
+import { CustomOption } from '@osf/shared/models';
 
 import { RegistryModerationTab } from '../enums';
 
-export const REGISTRY_MODERATION_TABS: TabOption[] = [
+export const REGISTRY_MODERATION_TABS: CustomOption<string>[] = [
   { label: 'moderation.submitted', value: RegistryModerationTab.Submitted },
   { label: 'moderation.pending', value: RegistryModerationTab.Pending },
   { label: 'moderation.moderators', value: RegistryModerationTab.Moderators },

src/app/features/moderation/enums/collection-moderation-tab.enum.ts

@@ -1,5 +1,5 @@
 export enum CollectionModerationTab {
-  AllItems = 1,
-  Moderators,
-  Settings,
+  AllItems = 'all-items',
+  Moderators = 'moderators',
+  Settings = 'settings',
 }

src/app/features/moderation/enums/preprint-moderation-tab.enum.ts

@@ -1,7 +1,7 @@
 export enum PreprintModerationTab {
-  Submissions = 1,
-  WithdrawalRequests,
-  Moderators,
-  Notifications,
-  Settings,
+  Submissions = 'submissions',
+  WithdrawalRequests = 'withdrawals',
+  Moderators = 'moderators',
+  Notifications = 'notifications',
+  Settings = 'settings',
 }

src/app/features/moderation/enums/registry-moderation-tab.enum.ts

@@ -1,6 +1,6 @@
 export enum RegistryModerationTab {
-  Submitted = 1,
-  Pending,
-  Moderators,
-  Settings,
+  Submitted = 'submitted',
+  Pending = 'pending',
+  Moderators = 'moderators',
+  Settings = 'settings',
 }

src/app/features/moderation/mappers/preprint-review-action.mapper.ts

@@ -1,18 +1,28 @@
 import { JsonApiResponseWithPaging } from '@osf/core/models';
 import { PaginatedData } from '@osf/shared/models';
 
-import { ReviewActionJsonApi } from '../models';
+import { PreprintRelatedCountJsonApi, ReviewActionJsonApi } from '../models';
 import { PreprintReviewActionModel } from '../models/preprint-review-action.model';
 
 export class PreprintReviewActionMapper {
   static fromResponse(response: ReviewActionJsonApi): PreprintReviewActionModel {
     return {
       id: response.id,
-      dateCreated: response.attributes.date_created,
       dateModified: response.attributes.date_modified,
       fromState: response.attributes.from_state,
       toState: response.attributes.to_state,
-      trigger: response.attributes.trigger,
+      creator: {
+        id: response.embeds.creator.data.id,
+        name: response.embeds.creator.data.attributes.full_name,
+      },
+      preprint: {
+        id: response.embeds.target.data.id,
+        name: response.embeds.target.data.attributes.title,
+      },
+      provider: {
+        id: response.embeds.provider.data.id,
+        name: response.embeds.provider.data.attributes.name,
+      },
     };
   }
 
@@ -24,4 +34,8 @@ export class PreprintReviewActionMapper {
       totalCount: response.links.meta.total,
     };
   }
+
+  static fromRelatedCounts(response: PreprintRelatedCountJsonApi) {
+    return response.relationships.preprints.links.related.meta.pending;
+  }
 }

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

@@ -3,6 +3,7 @@ export * from './moderator.model';
 export * from './moderator-add.model';
 export * from './moderator-dialog-add.model';
 export * from './moderator-json-api.model';
+export * from './preprint-related-count-json-api.model';
 export * from './preprint-review-action.model';
 export * from './preprint-review-action-json-api.model';
 export * from './submission.model';

src/app/features/moderation/models/preprint-related-count-json-api.model.ts

@@ -0,0 +1,17 @@
+export interface PreprintRelatedCountJsonApi {
+  relationships: {
+    preprints: {
+      links: {
+        related: {
+          meta: {
+            accepted: number;
+            initial: number;
+            pending: number;
+            rejected: number;
+            withdrawn: number;
+          };
+        };
+      };
+    };
+  };
+}