feature: Add SOURCE_SORTING togglz

Author: DanielPalafox

src/app/record/components/affiliation-stacks-groups/affiliation-stacks-groups.component.html

@@ -21,7 +21,7 @@
     [(expandedContent)]="expandedContent['EMPLOYMENT']"
     (expandedContentChange)="expandedContentChange.emit(expandedContent)"
     [isPublicRecord]="isPublicRecord"
-    [sortTypes]="['title', 'start', 'end', 'source']"
+    [sortTypes]="sortTypes"
     [sortType]="'end'"
     (sort)="sortEvent($event, 'EMPLOYMENT')"
     id="cy-affiliation-employment"

src/app/record/components/affiliation-stacks-groups/affiliation-stacks-groups.component.ts

@@ -15,7 +15,7 @@ import {
   UserRecord,
   UserRecordOptions,
 } from 'src/app/types/record.local'
-import { SortData } from 'src/app/types/sort'
+import { SortData, SortOrderType } from 'src/app/types/sort'
 
 import { UserInfo } from '../../../types'
 import { TogglzService } from '../../../core/togglz/togglz.service'
@@ -54,6 +54,8 @@ export class AffiliationStacksGroupsComponent implements OnInit {
   @Output()
   expandedContentChange: EventEmitter<MainPanelsState> = new EventEmitter()
   professionalActivitiesTogglz = false
+  sourceSorting = false
+  sortTypes: SortOrderType[] = ['title', 'start', 'end']
 
   constructor(
     private _record: RecordService,
@@ -66,6 +68,10 @@ export class AffiliationStacksGroupsComponent implements OnInit {
       .getStateOf('PROFESSIONAL_ACTIVITIES')
       .pipe(take(1))
       .subscribe((value) => (this.professionalActivitiesTogglz = value))
+    this._togglz
+       .getStateOf('SOURCE_SORTING')
+       .pipe(take(1))
+       .subscribe((value) => (this.sourceSorting = value))
     this.$loading = this._recordAffiliationService.$loading
     this._record
       .getRecord({
@@ -106,6 +112,9 @@ export class AffiliationStacksGroupsComponent implements OnInit {
           }
         }
       })
+      if (this.sourceSorting) {
+        this.sortTypes.push('source')
+      }
   }
 
   trackByProfileAffiliationUiGroups(index, item: AffiliationUIGroup) {

src/app/record/components/funding-stacks-groups/funding-stacks-groups.component.html

@@ -15,7 +15,7 @@
     [isPublicRecord]="isPublicRecord"
     [(expandedContent)]="expandedContent['FUNDING']"
     (expandedContentChange)="expandedContentChange.emit(expandedContent)"
-    [sortTypes]="['date', 'title', 'type', 'source']"
+    [sortTypes]="sortTypes"
     [sortType]="'date'"
     (sort)="sortEvent($event)"
   >

src/app/record/components/funding-stacks-groups/funding-stacks-groups.component.ts

@@ -1,6 +1,6 @@
 import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core'
 import { Observable, Subject } from 'rxjs'
-import { first, takeUntil } from 'rxjs/operators'
+import { first, take, takeUntil } from 'rxjs/operators'
 import { UserService } from 'src/app/core'
 import { RecordCountriesService } from 'src/app/core/record-countries/record-countries.service'
 import { RecordService } from 'src/app/core/record/record.service'
@@ -11,10 +11,11 @@ import {
   UserRecordOptions,
 } from 'src/app/types/record.local'
 import { UserSession } from 'src/app/types/session.local'
-import { SortData } from 'src/app/types/sort'
+import { SortData, SortOrderType } from 'src/app/types/sort'
 
 import { RecordFundingsService } from '../../../core/record-fundings/record-fundings.service'
 import { UserInfo } from '../../../types'
+import { TogglzService } from '../../../core/togglz/togglz.service'
 
 @Component({
   selector: 'app-fundings',
@@ -40,16 +41,26 @@ export class FundingStacksGroupsComponent implements OnInit {
   ngOrcidFunding = $localize`:@@shared.funding:Funding`
   countryCodes: { key: string; value: string }[]
   loading = true
+  sourceSorting = false
+  sortTypes: SortOrderType[] = ['title', 'start', 'end']
 
   constructor(
     private _userSession: UserService,
     private _record: RecordService,
     private _recordFundingsService: RecordFundingsService,
-    private _recordCountryService: RecordCountriesService
+    private _recordCountryService: RecordCountriesService,
+    private _togglz: TogglzService
   ) {}
 
   ngOnInit(): void {
+    this._togglz
+       .getStateOf('SOURCE_SORTING')
+       .pipe(take(1))
+       .subscribe((value) => (this.sourceSorting = value))
     this.getRecord()
+    if (this.sourceSorting) {
+      this.sortTypes.push('source')
+    }
   }
 
   private getRecord() {

src/app/record/components/work-stack-group/work-stack-group.component.html

@@ -15,7 +15,7 @@
     [isPublicRecord]="isPublicRecord"
     [(expandedContent)]="expandedContent['WORK']"
     (expandedContentChange)="expandedContentChange.emit(expandedContent)"
-    [sortTypes]="['date', 'title', 'type', 'source']"
+    [sortTypes]="sortTypes"
     [sortType]="'date'"
     [addMenuOptions]="addMenuOptions"
     (sort)="sortEvent($event)"

src/app/record/components/work-stack-group/work-stack-group.component.ts

@@ -15,7 +15,7 @@ import { MatDialog } from '@angular/material/dialog'
 import { MatPaginatorIntl, PageEvent } from '@angular/material/paginator'
 import { isEmpty } from 'lodash'
 import { Observable, Subject } from 'rxjs'
-import { first } from 'rxjs/operators'
+import { first, take } from 'rxjs/operators'
 import { PlatformInfo, PlatformInfoService } from 'src/app/cdk/platform-info'
 import {
   ADD_EVENT_ACTION,
@@ -34,7 +34,7 @@ import {
   UserRecord,
   UserRecordOptions,
 } from 'src/app/types/record.local'
-import { SortData } from 'src/app/types/sort'
+import { SortData, SortOrderType } from 'src/app/types/sort'
 
 import { UserInfo } from '../../../types'
 import { ModalDeleteItemsComponent } from '../modals/modal-delete-item/modal-delete-items.component'
@@ -49,6 +49,7 @@ import { WorkBibtexModalComponent } from './modals/work-bibtex-modal/work-bibtex
 import { ModalCombineWorksWithSelectorComponent } from '../work/modals/modal-combine-works-with-selector/modal-combine-works-with-selector.component'
 import { GroupingSuggestions } from 'src/app/types/works.endpoint'
 import { AnnouncerService } from 'src/app/core/announcer/announcer.service'
+import { TogglzService } from '../../../core/togglz/togglz.service'
 
 @Component({
   selector: 'app-work-stack-group',
@@ -127,6 +128,8 @@ export class WorkStackGroupComponent implements OnInit {
   platform: PlatformInfo
   selectedWorks: string[] = []
   selectAll: false
+  sourceSorting = false
+  sortTypes: SortOrderType[] = ['title', 'start', 'end']
 
   @ViewChildren('selectAllCheckbox') selectAllCheckbox: MatCheckbox
   @ViewChildren('appWorkStacks') appWorkStacks: QueryList<WorkStackComponent>
@@ -138,10 +141,15 @@ export class WorkStackGroupComponent implements OnInit {
     private _record: RecordService,
     private _works: RecordWorksService,
     private _matPaginatorIntl: MatPaginatorIntl,
-    private _announce: AnnouncerService
+    private _announce: AnnouncerService,
+    private _togglz: TogglzService
   ) {}
 
   ngOnInit(): void {
+    this._togglz
+       .getStateOf('SOURCE_SORTING')
+       .pipe(take(1))
+       .subscribe((value) => (this.sourceSorting = value))
     this.$loading = this._works.$loading
     this._record
       .getRecord({ publicRecordId: this.isPublicRecord })
@@ -163,6 +171,9 @@ export class WorkStackGroupComponent implements OnInit {
     this._platform.get().subscribe((platform) => {
       this.platform = platform
     })
+    if (this.sourceSorting) {
+      this.sortTypes.push('source')
+    }
   }
 
   private getGroupingSuggestions() {