Skip to content

Commit

Permalink
[BP] refactor(datahub): added an error message when record has no link.
Browse files Browse the repository at this point in the history
  • Loading branch information
Romuald Caplier authored and jahow committed Jun 21, 2024
1 parent 0892e6d commit a312510
Show file tree
Hide file tree
Showing 21 changed files with 266 additions and 70 deletions.
92 changes: 89 additions & 3 deletions apps/datahub-e2e/src/e2e/datasetDetailPage.cy.ts
Original file line number Diff line number Diff line change
Expand Up @@ -542,6 +542,15 @@ describe('dataset pages', () => {
})
})
})

describe('When there is no link', () => {
beforeEach(() => {
cy.visit('/dataset/a3774ef6-809d-4dd1-984f-9254f49cbd0a')
})
it('display the error datasetHasNoLink error block', () => {
cy.get('[data-test="dataset-has-no-link-block"]').should('exist')
})
})
})
})
})
Expand Down Expand Up @@ -685,9 +694,86 @@ describe('api form', () => {
.find('gn-ui-copy-text-button')
.find('input')
.invoke('val')
.then((newUrl) => {
expect(newUrl).to.not.eq(url)
})
.should('not.eq', url)
})
})
})

describe('userFeedback', () => {
describe('when not logged in', () => {
beforeEach(() => {
cy.visit('/dataset/accroche_velos')
cy.get('datahub-record-user-feedbacks').as('userFeedback')
})
it('should sort comments', () => {
cy.get('gn-ui-user-feedback-item')
.find('[data-cy="commentText"]')
.as('commentText')

cy.get('@commentText')
.first()
.then((div) => {
const firstCommentBeforeSort = div.text().trim()
cy.get('@userFeedback')
.find('gn-ui-dropdown-selector')
.openDropdown()
.children('button')
.eq(1)
.click()

cy.get('gn-ui-user-feedback-item')
.find('[data-cy="commentText"]')
.first()
.invoke('text')
.invoke('trim')
.should('not.eq', firstCommentBeforeSort)
})
})
it("shouldn't be able to comment", () => {
cy.get('datahub-record-user-feedbacks')
.find('gn-ui-text-area')
.should('not.exist')
})
})

describe('when logged in', () => {
beforeEach(() => {
cy.login()
cy.visit('/dataset/accroche_velos')
})
it('should publish a comment', () => {
cy.get('datahub-record-user-feedbacks')
.find('gn-ui-text-area')
.first()
.should('exist')
.type('Something')

cy.get('datahub-record-user-feedbacks')
.find('gn-ui-button')
.eq(1)
.should('exist')
})
it('should answer to a comment', () => {
cy.get('gn-ui-user-feedback-item')
.find('gn-ui-text-area')
.first()
.should('exist')
.type('Something')

cy.get('gn-ui-user-feedback-item')
.find('gn-ui-button')
.eq(0)
.should('exist')
})
})
})

describe('When the metadata does not exists', () => {
beforeEach(() => {
cy.visit('/dataset/xyz')
})
it('should display an error message', () => {
cy.get('gn-ui-error').should('exist')
cy.screenshot({ capture: 'viewport' })
})
})
Original file line number Diff line number Diff line change
Expand Up @@ -130,7 +130,12 @@
></datahub-record-apis>
</div>
</div>

<ng-container *ngIf="displayDatasetHasNoLinkBlock$ | async">
<gn-ui-error
data-test="dataset-has-no-link-block"
[type]="errorTypes.DATASET_HAS_NO_LINK"
></gn-ui-error>
</ng-container>
<div id="related-records" *ngIf="displayRelated$ | async">
<div>
<div class="h-48 overflow-visible">
Expand All @@ -150,14 +155,14 @@
class="mt-12 p-4 max-w-[600px] m-auto text-[13px]"
*ngIf="facade.error$ | async as error"
>
<gn-ui-search-results-error
<gn-ui-error
*ngIf="error.notFound"
[type]="errorTypes.RECORD_NOT_FOUND"
[recordId]="(facade.metadata$ | async).uniqueIdentifier"
></gn-ui-search-results-error>
<gn-ui-search-results-error
></gn-ui-error>
<gn-ui-error
*ngIf="error.otherError"
[type]="errorTypes.RECEIVED_ERROR"
[error]="error.otherError"
></gn-ui-search-results-error>
></gn-ui-error>
</div>
Original file line number Diff line number Diff line change
Expand Up @@ -10,10 +10,7 @@ import { By } from '@angular/platform-browser'
import { SourcesService } from '@geonetwork-ui/feature/catalog'
import { MapManagerService } from '@geonetwork-ui/feature/map'
import { SearchService } from '@geonetwork-ui/feature/search'
import {
ErrorType,
SearchResultsErrorComponent,
} from '@geonetwork-ui/ui/elements'
import { ErrorComponent, ErrorType } from '@geonetwork-ui/ui/elements'
import { TranslateModule } from '@ngx-translate/core'
import { BehaviorSubject, of } from 'rxjs'
import { RecordMetadataComponent } from './record-metadata.component'
Expand Down Expand Up @@ -168,7 +165,7 @@ describe('RecordMetadataComponent', () => {
MockDataOtherlinksComponent,
MockDataApisComponent,
MockRelatedComponent,
SearchResultsErrorComponent,
ErrorComponent,
MockMetadataInfoComponent,
MockMetadataContactComponent,
MockRecordApiFormComponent,
Expand Down Expand Up @@ -598,9 +595,9 @@ describe('RecordMetadataComponent', () => {
describe('error handling', () => {
describe('normal', () => {
it('does not show errors', () => {
const result = fixture.debugElement.query(
By.directive(SearchResultsErrorComponent)
)
facade.otherLinks$.next([''])
fixture.detectChanges()
const result = fixture.debugElement.query(By.directive(ErrorComponent))
expect(result).toBeFalsy()
})
})
Expand All @@ -610,9 +607,7 @@ describe('RecordMetadataComponent', () => {
fixture.detectChanges()
})
it('shows error', () => {
const result = fixture.debugElement.query(
By.directive(SearchResultsErrorComponent)
)
const result = fixture.debugElement.query(By.directive(ErrorComponent))

expect(result).toBeTruthy()
expect(result.componentInstance.type).toBe(ErrorType.RECORD_NOT_FOUND)
Expand All @@ -628,14 +623,30 @@ describe('RecordMetadataComponent', () => {
fixture.detectChanges()
})
it('shows error', () => {
const result = fixture.debugElement.query(
By.directive(SearchResultsErrorComponent)
)
const result = fixture.debugElement.query(By.directive(ErrorComponent))

expect(result).toBeTruthy()
expect(result.componentInstance.type).toBe(ErrorType.RECEIVED_ERROR)
expect(result.componentInstance.error).toBe('This is an Error!')
})
})

describe('When there are no link (download, api or other links)', () => {
beforeEach(() => {
facade.apiLinks$.next([])
facade.downloadLinks$.next([])
facade.otherLinks$.next([])
fixture.detectChanges()
})
it('shows the no link error block', () => {
const result = fixture.debugElement.query(
By.css('[data-test="dataset-has-no-link-block"]')
)
expect(result).toBeTruthy()
expect(result.componentInstance.type).toBe(
ErrorType.DATASET_HAS_NO_LINK
)
})
})
})
})
Original file line number Diff line number Diff line change
Expand Up @@ -49,6 +49,17 @@ export class RecordMetadataComponent {
map((records) => records?.length > 0)
)

displayDatasetHasNoLinkBlock$ = combineLatest([
this.displayDownload$,
this.displayApi$,
this.displayOtherLinks,
]).pipe(
map(
([displayDownload, displayApi, displayOtherLinks]) =>
!displayDownload && !displayApi && !displayOtherLinks
)
)

sourceLabel$ = this.facade.metadata$.pipe(
map((record) => record?.extras?.catalogUuid as string),
filter((uuid) => !!uuid),
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -42,16 +42,16 @@
</div>

<div class="p-4 max-w-[600px] m-auto text-[13px]">
<gn-ui-search-results-error
<gn-ui-error
*ngIf="(errorCode$ | async) === 0"
[type]="errorTypes.COULD_NOT_REACH_API"
>
</gn-ui-search-results-error>
<gn-ui-search-results-error
</gn-ui-error>
<gn-ui-error
*ngIf="(error$ | async) !== null && (errorCode$ | async) !== 0"
[type]="errorTypes.RECEIVED_ERROR"
[error]="errorMessage$ | async"
></gn-ui-search-results-error>
></gn-ui-error>
</div>

<ng-template #favoriteToggle let-record>
Expand Down
2 changes: 1 addition & 1 deletion libs/ui/elements/src/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@ export * from './lib/downloads-list/downloads-list.component'
export * from './lib/link-card/link-card.component'
export * from './lib/pagination/pagination.component'
export * from './lib/related-record-card/related-record-card.component'
export * from './lib/search-results-error/search-results-error.component'
export * from './lib/error/error.component'
export * from './lib/user-preview/user-preview.component'
export * from './lib/max-lines/max-lines.component'
export * from './lib/record-api-form/record-api-form.component'
Expand Down
Original file line number Diff line number Diff line change
@@ -1,7 +1,10 @@
<div
class="p-[1.7em] bg-red-50 text-red-800 text-[1.5em] text-center rounded-lg"
>
<div *ngIf="type === types.COULD_NOT_REACH_API">
<div
*ngIf="type === types.COULD_NOT_REACH_API"
data-test="could-not-reach-api-error"
>
<div class="relative opacity-40">
<mat-icon class="material-symbols-outlined face">face</mat-icon>
<mat-icon class="material-symbols-outlined question-mark1"
Expand All @@ -13,14 +16,26 @@
</div>
<div translate>search.error.couldNotReachApi</div>
</div>
<div *ngIf="type === types.RECEIVED_ERROR">
<div
*ngIf="type === types.DATASET_HAS_NO_LINK"
data-test="dataset-has-no-link-error"
>
<div class="relative opacity-40">
<mat-icon class="material-symbols-outlined face">computer</mat-icon>
</div>
<div translate>search.error.recordHasnolink</div>
</div>
<div *ngIf="type === types.RECEIVED_ERROR" data-test="received-error-error">
<div class="relative opacity-40">
<mat-icon class="material-symbols-outlined face">mood_bad</mat-icon>
</div>
<div translate>search.error.receivedError</div>
<div *ngIf="error">{{ error }}</div>
</div>
<div *ngIf="type === types.RECORD_NOT_FOUND">
<div
*ngIf="type === types.RECORD_NOT_FOUND"
data-test="record-not-found-error"
>
<div class="relative opacity-40">
<mat-icon class="material-symbols-outlined computer">computer</mat-icon>
<mat-icon class="material-symbols-outlined computer-question-mark"
Expand Down
86 changes: 86 additions & 0 deletions libs/ui/elements/src/lib/error/error.component.spec.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,86 @@
import { ComponentFixture, TestBed } from '@angular/core/testing'

import { ErrorComponent, ErrorType } from './error.component'
import { DebugElement, NO_ERRORS_SCHEMA } from '@angular/core'
import { By } from '@angular/platform-browser'

describe('ErrorComponent', () => {
let component: ErrorComponent
let fixture: ComponentFixture<ErrorComponent>
let compiled: DebugElement

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

beforeEach(() => {
fixture = TestBed.createComponent(ErrorComponent)
component = fixture.componentInstance
compiled = fixture.debugElement
})

it('should create', () => {
expect(component).toBeTruthy()
})

describe('ErrorType', () => {
describe('ErrorType.COULD_NOT_REACH_API', () => {
beforeEach(() => {
component.type = ErrorType.COULD_NOT_REACH_API
fixture.detectChanges()
})

it('COULD_NOT_REACH_API block is displayed.', () => {
const errorBlock = compiled.query(
By.css('[data-test="could-not-reach-api-error"]')
)
expect(errorBlock).toBeTruthy()
})
})

describe('ErrorType.RECEIVED_ERROR', () => {
beforeEach(() => {
component.type = ErrorType.RECEIVED_ERROR
fixture.detectChanges()
})

it('RECEIVED_ERROR block is displayed.', () => {
const errorBlock = compiled.query(
By.css('[data-test="received-error-error"]')
)
expect(errorBlock).toBeTruthy()
})
})

describe('ErrorType.RECORD_NOT_FOUND', () => {
beforeEach(() => {
component.type = ErrorType.RECORD_NOT_FOUND
fixture.detectChanges()
})

it('RECORD_NOT_FOUND block is displayed.', () => {
const errorBlock = compiled.query(
By.css('[data-test="record-not-found-error"]')
)
expect(errorBlock).toBeTruthy()
})
})

describe('ErrorType.NO_LINK', () => {
beforeEach(() => {
component.type = ErrorType.DATASET_HAS_NO_LINK
fixture.detectChanges()
})

it('NO_LINK block is displayed.', () => {
const errorBlock = compiled.query(
By.css('[data-test="dataset-has-no-link-error"]')
)
expect(errorBlock).toBeTruthy()
})
})
})
})
Loading

0 comments on commit a312510

Please sign in to comment.