Skip to content

Commit

Permalink
feat: add comment and discussion module to record page
Browse files Browse the repository at this point in the history
feat: add comment and discussion module to record page

css

ajouts
  • Loading branch information
Romuald Caplier committed Apr 10, 2024
1 parent 70a9dc1 commit 9245dee
Show file tree
Hide file tree
Showing 38 changed files with 663 additions and 18 deletions.
2 changes: 2 additions & 0 deletions apps/datahub/src/app/app.module.ts
Original file line number Diff line number Diff line change
Expand Up @@ -80,6 +80,7 @@ import { RecordOtherlinksComponent } from './record/record-otherlinks/record-oth
import { RecordDownloadsComponent } from './record/record-downloads/record-downloads.component'
import { RecordApisComponent } from './record/record-apis/record-apis.component'
import { MatTabsModule } from '@angular/material/tabs'
import { RecordUserFeedbacksComponent } from './record/record-user-feedbacks/record-user-feedbacks.component'

export const metaReducers: MetaReducer[] = !environment.production ? [] : []
// https://github.com/nrwl/nx/issues/191
Expand All @@ -100,6 +101,7 @@ export const metaReducers: MetaReducer[] = !environment.production ? [] : []
KeyFiguresComponent,
NavigationMenuComponent,
RecordRelatedRecordsComponent,
RecordUserFeedbacksComponent,
RecordMetadataComponent,
RecordOtherlinksComponent,
RecordDownloadsComponent,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -77,7 +77,7 @@
<mat-tab [disabled]="(displayMap$ | async) === false">
<ng-template mat-tab-label>
<span class="tab-header-label sm:ml-32" translate
>record.tab.map</span
>record.tab.map</span
>
</ng-template>
<div
Expand Down Expand Up @@ -148,6 +148,16 @@
</div>
</div>
</div>
<div
id="userFeedbacks"
class="bg-primary-opacity-10 py-16"
>
<div class="container-lg px-4 lg:mx-auto">
<datahub-record-user-feedbacks
[organisationName$]="organisationName$"
></datahub-record-user-feedbacks>
</div>
</div>
<div
class="mt-12 p-4 max-w-[600px] m-auto text-[13px]"
*ngIf="facade.error$ | async as error"
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -7,48 +7,56 @@ import { filter, map, mergeMap } from 'rxjs/operators'
import { OrganizationsServiceInterface } from '@geonetwork-ui/common/domain/organizations.service.interface'
import {
Keyword,
Organization,
Organization
} from '@geonetwork-ui/common/domain/model/record'
import { MdViewFacade } from '@geonetwork-ui/feature/record'

@Component({
selector: 'datahub-record-metadata',
templateUrl: './record-metadata.component.html',
styleUrls: ['./record-metadata.component.css'],
changeDetection: ChangeDetectionStrategy.OnPush,
changeDetection: ChangeDetectionStrategy.OnPush
})
export class RecordMetadataComponent {
@Input() metadataQualityDisplay: boolean

displayMap$ = combineLatest([
this.facade.mapApiLinks$,
this.facade.geoDataLinks$,
this.facade.geoDataLinks$
]).pipe(
map(
([mapLinks, geoDataLinks]) =>
mapLinks?.length > 0 || geoDataLinks?.length > 0
)
)

displayData$ = combineLatest([
this.facade.dataLinks$,
this.facade.geoDataLinks$,
this.facade.geoDataLinks$
]).pipe(
map(
([dataLinks, geoDataLinks]) =>
dataLinks?.length > 0 || geoDataLinks?.length > 0
)
)

displayDownload$ = this.facade.downloadLinks$.pipe(
map((links) => links?.length > 0)
)
displayApi$ = this.facade.apiLinks$.pipe(map((links) => links?.length > 0))

displayOtherLinks = this.facade.otherLinks$.pipe(
map((links) => links?.length > 0)
)
displayRelated$ = this.facade.related$.pipe(
map((records) => records?.length > 0)
)

organisationName$ = this.facade.metadata$.pipe(
map((record) => record?.ownerOrganization?.name),
filter(Boolean)
)

sourceLabel$ = this.facade.metadata$.pipe(
map((record) => record?.extras?.catalogUuid as string),
filter((uuid) => !!uuid),
Expand Down Expand Up @@ -78,7 +86,8 @@ export class RecordMetadataComponent {
private searchService: SearchService,
private sourceService: SourcesService,
private orgsService: OrganizationsServiceInterface
) {}
) {
}

onTabIndexChange(index: number): void {
this.selectedTabIndex$.next(index)
Expand All @@ -90,6 +99,7 @@ export class RecordMetadataComponent {
onInfoKeywordClick(keyword: Keyword) {
this.searchService.updateFilters({ any: keyword.label })
}

onOrganizationClick(org: Organization) {
this.orgsService
.getFiltersForOrgs([org])
Expand Down
Empty file.
Original file line number Diff line number Diff line change
@@ -0,0 +1,50 @@
<p
class="font-title text-[28px] text-title font-medium mb-11"
translate
>
record.metadata.userFeedbacks
</p>
<div
id="new-comment"
class="my-5 flex flex-col"
>
<gn-ui-text-input
[(value)]="newComment"
(valueChange)="onNewCommentValueChange()"
[hint]="'Rédiger votre commentaire ici...'"
(keyup.enter)="publishNewComment()"
class=""
extraClass="bg-transparent"
></gn-ui-text-input>
<div
*ngIf="!isNewCommentEmpty"
id="new-comment-buttons"
class="flex flex-row justify-end p-2"
>
<gn-ui-button
[type]="'outline'"
(buttonClick)="publishNewComment()"
title="Publish"
extraClass="!p-[0.5em]"
>
<span translate>
Publish
</span>
</gn-ui-button>
</div>
</div>
<div *ngIf="userFeedbacksParents">
<div
class="mb-4 w-full"
*ngFor="let userFeedback of userFeedbacksParents"
>
<gn-ui-user-feedback-item
[userFeedback]="userFeedback"
[userFeedBacksAnswers]="userFeedBacksAnswers.get(userFeedback.uuid)"
[isActiveUserEditor]="isActiveUserEditor"
[activeUser]="activeUser"
(newAnswerEmitter)="onNewAnswer($event)"
></gn-ui-user-feedback-item>
</div>
</div>

Original file line number Diff line number Diff line change
@@ -0,0 +1,24 @@
import { ComponentFixture, TestBed } from '@angular/core/testing'

import { RecordUserFeedbacksComponent } from './record-user-feedbacks.component'

describe('RelatedRecordsComponent', () => {
let component: RecordUserFeedbacksComponent
let fixture: ComponentFixture<RecordUserFeedbacksComponent>

beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [RecordUserFeedbacksComponent],
}).compileComponents()
})

beforeEach(() => {
fixture = TestBed.createComponent(RecordUserFeedbacksComponent)
component = fixture.componentInstance
fixture.detectChanges()
})

it('should create', () => {
expect(component).toBeTruthy()
})
})
Original file line number Diff line number Diff line change
@@ -0,0 +1,109 @@
import { ChangeDetectionStrategy, ChangeDetectorRef, Component, Input, OnDestroy, OnInit } from '@angular/core'
import { MdViewFacade } from '@geonetwork-ui/feature/record'
import { filter, takeUntil } from 'rxjs/operators'
import { RecordUserFeedbacksService } from './record-user-feedbacks.service'
import { Observable, Subject } from 'rxjs'
import { UserFeedback } from '@geonetwork-ui/common/domain/model/record'
import { PlatformServiceInterface } from '@geonetwork-ui/common/domain/platform.service.interface'
import { UserModel } from '@geonetwork-ui/common/domain/model/user'

@Component({
selector: 'datahub-record-user-feedbacks',
templateUrl: './record-user-feedbacks.component.html',
styleUrls: ['./record-user-feedbacks.component.css'],
changeDetection: ChangeDetectionStrategy.OnPush
})

export class RecordUserFeedbacksComponent implements OnInit, OnDestroy {

@Input() organisationName$: Observable<string>

private destroy$ = new Subject<void>()

userFeedbacksParents: UserFeedback[] = []
userFeedBacksAnswers: Map<string, UserFeedback[]> = new Map()

isActiveUserEditor = false
newComment = ''

isNewCommentEmpty = true

activeUser?: UserModel

constructor(
private facade: MdViewFacade,
private userFeedBackService: RecordUserFeedbacksService,
private cdr: ChangeDetectorRef,
private platformServiceInterface: PlatformServiceInterface
) {
}

ngOnInit(): void {

this.platformServiceInterface.getMe()
.pipe(
filter(Boolean),
takeUntil(this.destroy$)
).subscribe(user => {
this.activeUser = user
this.isActiveUserEditor =
user.profile === 'Administrator'
|| user.profile === 'UserAdmin'
|| user.profile === 'Reviewer'
|| user.profile === 'Editor'
})

this.facade.userFeedbacks$.pipe(
filter(Boolean),
takeUntil(this.destroy$)
).subscribe(userFeedbacks => {

this.userFeedbacksParents = userFeedbacks
.filter(userFeedbacks => userFeedbacks.parentUuid === null)
.sort(this.userFeedBackService.sortByDateFromNewestToOldest)

const enfants = userFeedbacks
.filter(userFeedbacks => userFeedbacks.parentUuid !== null)
.sort(this.userFeedBackService.sortByDateFromOldestToNewest)

enfants.forEach(userFeedbacksAnswer => {
const parent = this.userFeedBacksAnswers.get(userFeedbacksAnswer.parentUuid)
if (parent) {
parent.push(userFeedbacksAnswer)
} else {
this.userFeedBacksAnswers.set(userFeedbacksAnswer.parentUuid, [userFeedbacksAnswer])
}
})

this.cdr.markForCheck()
})
}

ngOnDestroy(): void {
this.destroy$.next()
this.destroy$.complete()
}

onNewCommentValueChange() {
this.isNewCommentEmpty = this.newComment.length === 0
}

onNewAnswer(newUserFeedback: UserFeedback) {
this.userFeedBackService.postUserFeedback(newUserFeedback)
}

publishNewComment() {
const newFeedback: UserFeedback = {
uuid: undefined,
comment: this.newComment,
parentUuid: null,
date: undefined,
authorUserId: Number.parseInt(this.activeUser?.id), // todo: il faut faire quelque chose avec ces userId number alors que tout le reste est en uuid...
authorEmail: this.activeUser?.email,
authorName: `${this.activeUser?.name} ${this.activeUser?.surname}`
}

this.userFeedBackService.postUserFeedback(newFeedback)
this.newComment = ''
}
}
Empty file.
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
import { Injectable } from '@angular/core'
import { UserFeedback } from '@geonetwork-ui/common/domain/model/record'
import { PlatformServiceInterface } from '@geonetwork-ui/common/domain/platform.service.interface'

@Injectable({
providedIn: 'root',
})
export class RecordUserFeedbacksService {

constructor(
private platformServiceInterface: PlatformServiceInterface
) {
}

postUserFeedback(userFeedback: UserFeedback): void {
this.platformServiceInterface.postUserFeedbacks(userFeedback)
}

sortByDateFromNewestToOldest(userFeedbackA: UserFeedback, userFeedbackB: UserFeedback): number {
return new Date(userFeedbackB.date).getTime() - new Date(userFeedbackA.date).getTime()
}

sortByDateFromOldestToNewest(userFeedbackA: UserFeedback, userFeedbackB: UserFeedback): number {
return new Date(userFeedbackA.date).getTime() - new Date(userFeedbackB.date).getTime()
}
}
19 changes: 18 additions & 1 deletion libs/api/repository/src/lib/gn4/platform/gn4-platform.mapper.ts
Original file line number Diff line number Diff line change
Expand Up @@ -8,10 +8,13 @@ import { AvatarServiceInterface } from '../auth/avatar.service.interface'
import { map } from 'rxjs/operators'
import { Observable, of } from 'rxjs'
import { ThesaurusModel } from '@geonetwork-ui/common/domain/model/thesaurus/thesaurus.model'
import { UserFeedback } from '@geonetwork-ui/common/domain/model/record'

@Injectable()
export class Gn4PlatformMapper {
constructor(private avatarService: AvatarServiceInterface) {}
constructor(private avatarService: AvatarServiceInterface) {
}

userFromMeApi(apiUser: MeResponseApiModel): Observable<UserModel | null> {
if (!apiUser) return of(null)
const {
Expand All @@ -28,6 +31,7 @@ export class Gn4PlatformMapper {
.getProfileIcon(hash)
.pipe(map((profileIcon) => ({ ...user, profileIcon } as UserModel)))
}

userFromApi(apiUser: UserApiModel): UserModel {
if (!apiUser) return null
const {
Expand Down Expand Up @@ -65,4 +69,17 @@ export class Gn4PlatformMapper {
}
})
}

userFeedbacksFromApi(userFeedbacks: any[]): UserFeedback[] {
return userFeedbacks.map(userFeedback => ({
uuid: userFeedback.uuid,
comment: userFeedback.comment,
authorUserId: userFeedback.authorUserId,
authorName: userFeedback.authorName,
authorEmail: userFeedback.authorEmail,
published: userFeedback.published,
parentUuid: userFeedback.parentUuid,
date: userFeedback.date,
}))
}
}
Loading

0 comments on commit 9245dee

Please sign in to comment.