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 15, 2024
1 parent 70a9dc1 commit 0fa7b34
Show file tree
Hide file tree
Showing 46 changed files with 1,260 additions and 162 deletions.
1 change: 1 addition & 0 deletions apps/datahub/src/app/app.component.ts
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@ import { ThemeService } from '@geonetwork-ui/util/shared'
styleUrls: ['./app.component.css'],
})
export class AppComponent implements OnInit {

ngOnInit(): void {
const favicon = getThemeConfig().FAVICON
if (favicon) ThemeService.setFavicon(favicon)
Expand Down
12 changes: 8 additions & 4 deletions apps/datahub/src/app/app.module.ts
Original file line number Diff line number Diff line change
Expand Up @@ -80,6 +80,8 @@ 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'
import { UiWidgetsModule } from '@geonetwork-ui/ui/widgets'

export const metaReducers: MetaReducer[] = !environment.production ? [] : []
// https://github.com/nrwl/nx/issues/191
Expand All @@ -100,6 +102,7 @@ export const metaReducers: MetaReducer[] = !environment.production ? [] : []
KeyFiguresComponent,
NavigationMenuComponent,
RecordRelatedRecordsComponent,
RecordUserFeedbacksComponent,
RecordMetadataComponent,
RecordOtherlinksComponent,
RecordDownloadsComponent,
Expand All @@ -110,16 +113,16 @@ export const metaReducers: MetaReducer[] = !environment.production ? [] : []
BrowserAnimationsModule,
RouterModule.forRoot([], {
initialNavigation: 'enabledBlocking',
scrollPositionRestoration: 'enabled',
scrollPositionRestoration: 'enabled'
}),
StoreModule.forRoot(
{},
{
metaReducers,
runtimeChecks: {
strictStateImmutability: false,
strictActionImmutability: false,
},
strictActionImmutability: false
}
}
),
!environment.production ? StoreDevtoolsModule.instrument() : [],
Expand All @@ -130,7 +133,7 @@ export const metaReducers: MetaReducer[] = !environment.production ? [] : []
DefaultRouterModule.forRoot({
searchStateId: 'mainSearch',
searchRouteComponent: SearchPageComponent,
recordRouteComponent: RecordPageComponent,
recordRouteComponent: RecordPageComponent
}),
FeatureRecordModule,
FeatureCatalogModule,
Expand All @@ -144,6 +147,7 @@ export const metaReducers: MetaReducer[] = !environment.production ? [] : []
UiInputsModule,
UiCatalogModule,
MatTabsModule,
UiWidgetsModule
],
providers: [
importProvidersFrom(FeatureAuthModule),
Expand Down
Original file line number Diff line number Diff line change
@@ -1,24 +1,24 @@
<div *ngIf="(facade.error$ | async) === null">
<div *ngIf="(metadataViewFacade.error$ | async) === null">
<div
id="about"
class="container-lg px-4 mb-9 mt-8 sm:mb-16 sm:mt-10 lg:mx-auto"
>
<gn-ui-metadata-info
class="sm:block"
*ngIf="(facade.isPresent$ | async) === false"
*ngIf="(metadataViewFacade.isPresent$ | async) === false"
[metadata]="{}"
[incomplete]="true"
>
</gn-ui-metadata-info>
<div
*ngIf="(facade.isPresent$ | async) === true"
*ngIf="(metadataViewFacade.isPresent$ | async) === true"
class="grid gap-8 grid-cols-1 sm:gap-6 sm:grid-cols-3"
>
<div class="sm:col-span-2">
<gn-ui-metadata-info
class="sm:block"
[metadata]="facade.metadata$ | async"
[incomplete]="facade.isIncomplete$ | async"
[metadata]="metadataViewFacade.metadata$ | async"
[incomplete]="metadataViewFacade.isIncomplete$ | async"
(keyword)="onInfoKeywordClick($event)"
>
</gn-ui-metadata-info>
Expand All @@ -32,15 +32,15 @@
</gn-ui-image-overlay-preview>
<gn-ui-metadata-contact
(organizationClick)="onOrganizationClick($event)"
[metadata]="facade.metadata$ | async"
[metadata]="metadataViewFacade.metadata$ | async"
>
</gn-ui-metadata-contact>
<div *ngIf="metadataQualityDisplay">
<p class="text text-gray-700 text-xs mb-3 uppercase" translate>
record.metadata.quality
</p>
<gn-ui-metadata-quality
[metadata]="facade.metadata$ | async"
[metadata]="metadataViewFacade.metadata$ | async"
[metadataQualityDisplay]="metadataQualityDisplay"
></gn-ui-metadata-quality>
</div>
Expand Down 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 @@ -138,7 +138,7 @@
<div class="h-48 overflow-visible">
<div class="container-lg px-4 lg:mx-auto">
<datahub-record-related-records
[records]="facade.related$ | async"
[records]="metadataViewFacade.related$ | async"
></datahub-record-related-records>
</div>
</div>
Expand All @@ -148,14 +148,25 @@
</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$"
[metadataUuid]="metadataUuid$ | async"
></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"
*ngIf="metadataViewFacade.error$ | async as error"
>
<gn-ui-search-results-error
*ngIf="error.notFound"
[type]="errorTypes.RECORD_NOT_FOUND"
[recordId]="(facade.metadata$ | async).uniqueIdentifier"
[recordId]="(metadataViewFacade.metadata$ | async).uniqueIdentifier"
></gn-ui-search-results-error>
<gn-ui-search-results-error
*ngIf="error.otherError"
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -7,58 +7,74 @@ 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.metadataViewFacade.mapApiLinks$,
this.metadataViewFacade.geoDataLinks$
]).pipe(
map(
([mapLinks, geoDataLinks]) =>
mapLinks?.length > 0 || geoDataLinks?.length > 0
)
)

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

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

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

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

metadataUuid$ = this.metadataViewFacade.metadata$.pipe(
map((record) => record?.uniqueIdentifier),
filter(Boolean)
)

sourceLabel$ = this.metadataViewFacade.metadata$.pipe(
map((record) => record?.extras?.catalogUuid as string),
filter((uuid) => !!uuid),
mergeMap((uuid) => this.sourceService.getSourceLabel(uuid))
)

errorTypes = ErrorType

selectedTabIndex$ = new BehaviorSubject(0)

thumbnailUrl$ = this.facade.metadata$.pipe(
thumbnailUrl$ = this.metadataViewFacade.metadata$.pipe(
map((metadata) => {
// in order to differentiate between metadata not loaded yet
// and url not defined
Expand All @@ -74,11 +90,12 @@ export class RecordMetadataComponent {
showOverlay = true

constructor(
public facade: MdViewFacade,
public metadataViewFacade: MdViewFacade,
private searchService: SearchService,
private sourceService: SourcesService,
private orgsService: OrganizationsServiceInterface
) {}
) {
}

onTabIndexChange(index: number): void {
this.selectedTabIndex$.next(index)
Expand All @@ -90,6 +107,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,85 @@
<div
id="userFeedbacks"
class="flex flex-row justify-between mb-11"
>
<p
class="font-title text-[28px] text-title font-medium"
translate
>
record.metadata.userFeedbacks
</p>
<div>
<gn-ui-dropdown-selector
[title]="'record.metadata.userFeedbacks.sortSelector.label' | translate"
(selectValue)="changerTri($event)"
[choices]="sortingStrategyList"
[selected]="selectedSortingStrategy$ | async"
>
</gn-ui-dropdown-selector>
</div>
</div>

<ng-container *ngIf="isAllUserFeedbackLoading else userFeedbacksSection">
<div class="flex justify-center h-[300px] pt-[145px]">
<gn-ui-spinning-loader></gn-ui-spinning-loader>
</div>
</ng-container>

<ng-template
#userFeedbacksSection
>
<div
class="m-6 flex flex-col h-auto w-full"
>
<div class="flex flex-row items-center w-full h-auto pr-6">
<mat-icon class="material-symbols-outlined grow-0">edit</mat-icon>
<gn-ui-text-area
[(value)]="newComment"
[disabled]="isAddUserFeedbackLoading"
(valueChange)="onNewCommentValueChange()"
(keyup.control.enter)="publishNewComment()"
[placeholder]="'record.metadata.userFeedbacks.newComment.placeholder' | translate"
class="grow ml-3 leading-10"
extraClass="bg-transparent border-0 placeholder-primary-darker text-primary-darker"
></gn-ui-text-area>
<div
*ngIf="!isNewCommentEmpty"
id="new-comment-buttons"
class="flex flex-row justify-end p-2"
>
<gn-ui-button
[disabled]="isAddUserFeedbackLoading"
[type]="'outline'"
(buttonClick)="publishNewComment()"
title="Publish"
extraClass="!p-[0.5em] text-primary-darker border-primary-darker"
>
<span translate *ngIf="!isAddUserFeedbackLoading">
record.metadata.userFeedbacks.publishButton
</span>
<ng-container *ngIf="isAddUserFeedbackLoading">
<div class="flex justify-center w-full">
<gn-ui-spinning-loader></gn-ui-spinning-loader>
</div>
</ng-container>
</gn-ui-button>
</div>
</div>
</div>

<div *ngIf="userFeedbacksParents">
<div
class="mb-4 w-full"
*ngFor="let userFeedbackParent of userFeedbacksParents"
>
<gn-ui-user-feedback-item
[userFeedbackParent]="userFeedbackParent"
[userFeedBacksAnswers]="userFeedBacksAnswers.get(userFeedbackParent.uuid)"
[isActiveUserEditor]="isActiveUserEditor"
[activeUser]="activeUser"
[isAddUserFeedbackLoading]="isAddUserFeedbackLoading"
(newUserFeedbackAnswer)="onNewUserFeedbackAnswer($event)"
></gn-ui-user-feedback-item>
</div>
</div>
</ng-template>
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()
})
})
Loading

0 comments on commit 0fa7b34

Please sign in to comment.