Skip to content

Commit

Permalink
feat(editor): graphic overview simplifications
Browse files Browse the repository at this point in the history
  • Loading branch information
@LHBruneton-C2C
LHBruneton-C2C committed Aug 20, 2024
1 parent a9a6128 commit e92f231
Show file tree
Hide file tree
Showing 6 changed files with 26 additions and 38 deletions.
1 change: 0 additions & 1 deletion libs/feature/editor/src/lib/components/overview-upload/overview-upload.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,6 @@
[maxSizeMB]="5"
[previewUrl]="resourceUrl"
[altText]="resourceAltText"
[formControl]="formControl"
(fileChange)="handleFileChange($event)"
(urlChange)="handleUrlChange($event)"
(altTextChange)="handleAltTextChange($event)"
Expand Down
10 changes: 5 additions & 5 deletions libs/feature/editor/src/lib/components/overview-upload/overview-upload.component.spec.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -68,7 +68,7 @@ describe('OverviewUploadComponent', () => {
expect(recordsApiService.getAllResources).toHaveBeenCalledWith(metadataUuid)
expect(component.resourceAltText).toEqual(imageFileName)
expect(component.resourceFileName).toEqual(imageFileName)
expect(component.resourceUrl.href).toEqual(imageUrl)
expect(component.resourceUrl).toEqual(imageUrl)
})

it('should put the file resource on file change', () => {
Expand All @@ -80,7 +80,7 @@ describe('OverviewUploadComponent', () => {
'public'
)
expect(component.resourceAltText).toEqual(imageFileName)
expect(component.resourceUrl.href).toEqual(imageUrl)
expect(component.resourceUrl).toEqual(imageUrl)
})

it('should put the file resource on alt text change', () => {
Expand All @@ -105,7 +105,7 @@ describe('OverviewUploadComponent', () => {
'public'
)
expect(component.resourceAltText).toEqual(imageFileName)
expect(component.resourceUrl.href).toEqual(imageUrl)
expect(component.resourceUrl).toEqual(imageUrl)
})

it('should delete the resource corresponding to the metadata UUID on delete', () => {
Expand All @@ -115,7 +115,7 @@ describe('OverviewUploadComponent', () => {
metadataUuid,
imageFileName
)
expect(component.resourceAltText).toBeNull()
expect(component.resourceUrl).toBeNull()
expect(component.resourceAltText).toEqual('')
expect(component.resourceUrl).toEqual('')
})
})
41 changes: 18 additions & 23 deletions libs/feature/editor/src/lib/components/overview-upload/overview-upload.component.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,12 +15,6 @@ import { UiInputsModule } from '@geonetwork-ui/ui/inputs'
import { FormControl } from '@angular/forms'
import { GraphicOverview } from '@geonetwork-ui/common/domain/model/record'

const extractFileNameFromUrl = (url: string): string => {
const pattern = new RegExp(`attachments/([^/?#]+)(?:[/?#]|$)`, 'i')
const match = url.match(pattern)
return match ? match[1] : ''
}

@Component({
selector: 'gn-ui-overview-upload',
standalone: true,
Expand All @@ -35,9 +29,9 @@ export class OverviewUploadComponent implements OnInit, OnChanges {
@Output() overviewChange = new EventEmitter<GraphicOverview | null>()
@Output() altTextChange: EventEmitter<string> = new EventEmitter()

resourceAltText = '' // = ressourceFileName by default
resourceFileName = ''
resourceUrl: URL
resourceAltText: string
resourceFileName: string
resourceUrl: string

constructor(
private recordsApiService: RecordsApiService,
Expand All @@ -48,14 +42,13 @@ export class OverviewUploadComponent implements OnInit, OnChanges {
this.recordsApiService.getAllResources(this.metadataUuid).subscribe({
next: (resources) => {
if (resources && resources.length > 0) {
this.resourceUrl = new URL(resources[0]?.url)
this.resourceAltText =
this.resourceAltText === ''
? resources[0].filename
: this.resourceAltText
this.resourceFileName = extractFileNameFromUrl(resources[0]?.url)
this.resourceUrl = resources[0].url
this.resourceFileName = resources[0].filename
if (!this.resourceAltText) {
this.resourceAltText = this.resourceFileName
}
} else {
this.resourceUrl = null
this.resourceUrl = ''
this.resourceAltText = ''
this.resourceFileName = ''
}
Expand All @@ -71,7 +64,7 @@ export class OverviewUploadComponent implements OnInit, OnChanges {
.putResource(this.metadataUuid, file, 'public')
.subscribe({
next: (resource) => {
this.resourceUrl = new URL(resource.url)
this.resourceUrl = resource.url
this.resourceAltText = resource.filename

this.overviewChange.emit({
Expand All @@ -90,7 +83,7 @@ export class OverviewUploadComponent implements OnInit, OnChanges {
.putResourceFromURL(this.metadataUuid, url, 'public')
.subscribe({
next: (resource) => {
this.resourceUrl = new URL(resource.url)
this.resourceUrl = resource.url
this.resourceAltText = resource.filename

this.overviewChange.emit({
Expand All @@ -108,19 +101,21 @@ export class OverviewUploadComponent implements OnInit, OnChanges {
this.resourceAltText = newAltText

this.overviewChange.emit({
url: this.resourceUrl,
url: new URL(this.resourceUrl),
description: this.resourceAltText,
})

this.cd.markForCheck()
}

handleDelete() {
//this.formControl.markAsDirty()
this.recordsApiService
.delResource(this.metadataUuid, this.resourceFileName)
.subscribe({
next: () => {
this.resourceAltText = null
this.resourceUrl = null
this.resourceAltText = ''
this.resourceUrl = ''

this.overviewChange.emit(null)

Expand All @@ -133,7 +128,7 @@ export class OverviewUploadComponent implements OnInit, OnChanges {
private errorHandle = (error: never) => {
console.error(error)

this.resourceUrl = null
this.resourceUrl = ''
this.resourceAltText = ''
this.resourceFileName = ''

Expand All @@ -157,7 +152,7 @@ export class OverviewUploadComponent implements OnInit, OnChanges {
} else {
return
}
if (overview.description && overview.description !== '') {
if (overview.description) {
this.resourceAltText = overview.description
this.cd.markForCheck()
}
Expand Down
1 change: 0 additions & 1 deletion libs/feature/editor/src/lib/components/record-form/record-form.component.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,6 @@ export class RecordFormComponent {
if (!model) {
return
}
console.log(newValue)
this.facade.updateRecordField(model, newValue)
}

Expand Down
2 changes: 1 addition & 1 deletion libs/ui/inputs/src/lib/image-input/image-input.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -51,7 +51,7 @@
<div class="w-full h-full flex flex-col gap-2">
<label
gnUiFilesDrop
class="block flex-1 border-2 border-dashed border-gray-300 rounded-lg p-6 flex flex-col items-center justify-center gap-4 hover:cursor-pointer"
class="block flex-1 border-2 border-dashed border-gray-300 rounded-lg p-6 flex flex-col items-center justify-center gap-4"
(dragFilesOver)="handleDragFilesOver($event)"
(dropFiles)="handleDropFiles($event)"
>
Expand Down
9 changes: 2 additions & 7 deletions libs/ui/inputs/src/lib/image-input/image-input.component.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,6 @@ import { ButtonComponent } from '../button/button.component'
import { FilesDropDirective } from '../files-drop/files-drop.directive'
import { TranslateModule } from '@ngx-translate/core'
import { marker } from '@biesbjerg/ngx-translate-extract-marker'
import { FormControl, ReactiveFormsModule } from '@angular/forms'

@Component({
selector: 'gn-ui-image-input',
Expand All @@ -31,13 +30,11 @@ import { FormControl, ReactiveFormsModule } from '@angular/forms'
FilesDropDirective,
MatProgressSpinnerModule,
TranslateModule,
ReactiveFormsModule,
],
})
export class ImageInputComponent {
@Input() formControl!: FormControl
@Input() maxSizeMB: number
@Input() previewUrl?: URL
@Input() previewUrl?: string
@Input() altText?: string
@Input() uploadProgress?: number
@Input() uploadError?: boolean
Expand Down Expand Up @@ -130,8 +127,7 @@ export class ImageInputComponent {
const file = new File([blob], name)
this.fileChange.emit(file)
},
error: (error) => {
console.error(error)
error: () => {
this.downloadError = true
this.cd.markForCheck()
this.urlChange.emit(this.urlInputValue)
Expand Down Expand Up @@ -169,7 +165,6 @@ export class ImageInputComponent {
}

handleDelete() {
this.formControl.markAsDirty()
this.delete.emit()
}

Expand Down

0 comments on commit e92f231

Please sign in to comment.