Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Removal of storing the default image URL #66

Merged
merged 6 commits into from
Mar 4, 2024
Merged

Removal of storing the default image URL #66

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
9db1c57
fix: remove the use of the default image url as logo url
HenryT-CG Mar 3, 2024
4dacb81
fix: simplify code
HenryT-CG Mar 3, 2024
28d2bc3
fix: moved operator displaying to internal tab
HenryT-CG Mar 3, 2024
3f91ccc
fix: detect unique constraint violations
HenryT-CG Mar 3, 2024
3849dcb
fix: detect unique constraint violations
HenryT-CG Mar 3, 2024
49bcf32
fix: separate upload button
HenryT-CG Mar 3, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
19 changes: 19 additions & 0 deletions src/app/product-store/product-detail/product-intern/product-intern.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -75,6 +75,25 @@
</div>
</div>

<div class="flex flex-wrap row-gap-4">
<div class="w-12 sm:w-6 px-3">
<span class="p-float-label">
<input
pInputText
type="text"
readonly
id="portal_detail_internal_field_operator"
class="w-full pt-3 pb-2"
[value]="(product?.operator ? 'PRODUCT.OPERATOR.DEPLOYMENT' : 'PRODUCT.OPERATOR.MANUAL') | translate"
[pTooltip]="'PRODUCT.TOOLTIPS.OPERATOR' | translate"
tooltipPosition="top"
tooltipEvent="focus"
/>
<label for="portal_detail_internal_field_operator"> {{ 'PRODUCT.OPERATOR' | translate }}</label>
</span>
</div>
</div>

<div class="flex flex-wrap row-gap-4">
<div class="w-12 px-3">
<span class="p-float-label">
Expand Down
80 changes: 32 additions & 48 deletions src/app/product-store/product-detail/product-props/product-props.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -45,59 +45,44 @@
</span>
</div>

<div class="w-full sm:w-10 md:w-9 lg:w-6 px-3">
<div class="w-full sm:w-12 md:w-9 lg:w-12 px-3">
<div class="flex flex-wrap sm:flex-nowrap align-items-center row-gap-2 column-gap-4">
<input hidden type="file" accept="image/*" #selectedFileInputLogo (change)="onFileUpload($event, 'logo')" />
<app-image-container
*ngIf="fetchingLogoUrl"
[id]="'product_detail_item_logo_image'"
[imageUrl]="fetchingLogoUrl"
[small]="true"
[title]="'LOGO.TOOLTIPS.' + (fetchingLogoUrl ? 'IMAGE' : 'PLACEHOLDER') | translate"
></app-image-container>
<div class="flex flex-column w-full">
<div class="p-inputgroup mb-1" controlErrorAnchor>
<span class="p-float-label" [title]="'PRODUCT.TOOLTIPS.IMAGE_URL' | translate">
<input
pInputText
type="text"
id="product_detail_item_imageUrl"
formControlName="imageUrl"
(input)="inputChange($event)"
/>
<label for="product_detail_item_imageUrl">{{ 'PRODUCT.IMAGE_URL' | translate }}</label>
</span>
<span
id="product_detail_item_upload_logo2"
class="p-inputgroup-addon bg-primary pseudo-button"
[ngClass]="
changeMode === 'VIEW' ||
this.formGroup.controls['name'].value === '' ||
this.formGroup.controls['name'].value === null
? 'p-disabled'
: 'cursor-pointer'
"
[title]="'LOGO.TOOLTIPS.UPLOAD' | translate"
(click)="changeMode !== 'VIEW' ? selectedFileInputLogo.click() : null"
>
<span class="pi pi-upload"></span>
</span>
</div>
</div>
<input hidden type="file" accept="image/*" #selectedFileInputLogo (change)="onFileUpload($event, 'logo')" />
<button
pButton
id="product_detail_item_upload_logo2"
icon="pi pi-upload"
class="action-button p-button-icon-only"
[ngClass]="
changeMode === 'VIEW' ||
this.formGroup.controls['name'].value === '' ||
this.formGroup.controls['name'].value === null
? 'p-disabled'
: 'cursor-pointer'
"
[title]="'LOGO.TOOLTIPS.UPLOAD' | translate"
(click)="changeMode !== 'VIEW' ? selectedFileInputLogo.click() : null"
></button>
<span class="p-float-label w-full" [title]="'PRODUCT.TOOLTIPS.IMAGE_URL' | translate">
<input
pInputText
type="text"
class="w-full"
id="product_detail_item_image_url"
formControlName="imageUrl"
(input)="inputChange($event)"
/>
<label for="product_detail_item_image_url">{{ 'PRODUCT.IMAGE_URL' | translate }}</label>
</span>
</div>
</div>
<div class="w-full sm:w-10 md:w-9 lg:w-6 px-3">
<span class="p-float-label" [title]="'PRODUCT.TOOLTIPS.CLASSIFICATIONS' | translate">
<input
pInputText
type="text"
class="w-full"
id="product_detail_item_classifications"
formControlName="classifications"
/>
<label for="product_detail_item_classifications">{{ 'PRODUCT.CLASSIFICATIONS' | translate }}</label>
</span>
</div>

<div class="w-full sm:w-10 md:w-9 lg:w-6 px-3">
<span class="p-float-label" controlErrorAnchor>
Expand All @@ -124,16 +109,15 @@
</span>
</div>
<div class="w-full sm:w-10 md:w-9 lg:w-6 px-3">
<span class="p-float-label" [title]="'PRODUCT.TOOLTIPS.OPERATOR' | translate" controlErrorAnchor>
<span class="p-float-label" [title]="'PRODUCT.TOOLTIPS.CLASSIFICATIONS' | translate">
<input
readonly
pInputText
type="text"
class="w-full"
id="product_detail_item_operator"
[value]="'PRODUCT.OPERATOR.' + (product?.operator ? 'DEPLOYMENT' : 'MANUAL') | translate"
id="product_detail_item_classifications"
formControlName="classifications"
/>
<label for="product_detail_item_operator">{{ 'PRODUCT.OPERATOR' | translate }}</label>
<label for="product_detail_item_classifications">{{ 'PRODUCT.CLASSIFICATIONS' | translate }}</label>
</span>
</div>

Expand Down
66 changes: 55 additions & 11 deletions src/app/product-store/product-detail/product-props/product-props.component.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,6 @@ const mockForm = new FormGroup<ProductDetailForm>({
Validators.maxLength(255),
productNameValidator()
]),
operator: new FormControl<boolean | null>(null),
version: new FormControl<string | null>(null, [Validators.required, Validators.maxLength(255)]),
description: new FormControl<string | null>(null, [Validators.maxLength(255)]),
imageUrl: new FormControl<string | null>(null, [Validators.maxLength(255)]),
Expand Down Expand Up @@ -157,7 +156,6 @@ describe('ProductPropertyComponent', () => {
const formGroup = new FormGroup<ProductDetailForm>({
id: new FormControl<string | null>('id'),
name: new FormControl<string | null>('name'),
operator: new FormControl<boolean | null>(null),
version: new FormControl<string | null>('version'),
description: new FormControl<string | null>(null),
imageUrl: new FormControl<string | null>(null),
Expand All @@ -180,7 +178,6 @@ describe('ProductPropertyComponent', () => {
const formGroup = new FormGroup<ProductDetailForm>({
id: new FormControl<string | null>('id'),
name: new FormControl<string | null>('name'),
operator: new FormControl<boolean | null>(null),
version: new FormControl<string | null>('version'),
description: new FormControl<string | null>(null),
imageUrl: new FormControl<string | null>(null),
Expand All @@ -203,7 +200,6 @@ describe('ProductPropertyComponent', () => {
const formGroup = new FormGroup<ProductDetailForm>({
id: new FormControl<string | null>('id'),
name: new FormControl<string | null>('name'),
operator: new FormControl<boolean | null>(null),
version: new FormControl<string | null>('version'),
description: new FormControl<string | null>(null),
imageUrl: new FormControl<string | null>(null),
Expand All @@ -224,17 +220,26 @@ describe('ProductPropertyComponent', () => {
})
})

it('should display unique constraint error if error code points to it', () => {
it('should display unique constraint error if name already exists', () => {
const error = {
error: {
errorCode: 'PERSIST_ENTITY_FAILED'
errorCode: 'PERSIST_ENTITY_FAILED',
detail:
"could not execute statement [ERROR: duplicate key value violates unique constraint 'ui_product_name' ...",
params: [
{
key: 'constraint',
value:
"could not execute statement [ERROR: duplicate key value violates unique constraint 'ui_product_name' ..."
},
{ key: 'constraintName', value: 'ui_product_name' }
]
}
}
apiServiceSpy.updateProduct.and.returnValue(throwError(() => error))
const formGroup = new FormGroup<ProductDetailForm>({
id: new FormControl<string | null>('id'),
name: new FormControl<string | null>('name'),
operator: new FormControl<boolean | null>(null),
version: new FormControl<string | null>('version'),
description: new FormControl<string | null>(null),
imageUrl: new FormControl<string | null>(null),
Expand All @@ -244,15 +249,56 @@ describe('ProductPropertyComponent', () => {
classifications: new FormControl<string[] | null>(null)
})
component.formGroup = formGroup as FormGroup<ProductDetailForm>
component.changeMode = 'EDIT'
component.formGroup.controls['name'].setValue('')

component.onSave()

expect(component.formGroup.valid).toBeTrue()
expect(msgServiceSpy.error).toHaveBeenCalledWith({
summaryKey: 'ACTIONS.EDIT.PRODUCT.NOK',
detailKey: 'VALIDATION.PRODUCT.UNIQUE_CONSTRAINT.NAME'
})
})

it('should display unique constraint error if basepath already exists', () => {
const error = {
error: {
errorCode: 'PERSIST_ENTITY_FAILED',
detail:
"could not execute statement [ERROR: duplicate key value violates unique constraint 'ui_product_base_path' ...",
params: [
{
key: 'constraint',
value:
"could not execute statement [ERROR: duplicate key value violates unique constraint 'ui_product_base_path' ..."
},
{ key: 'constraintName', value: 'ui_product_base_path' }
]
}
}
apiServiceSpy.updateProduct.and.returnValue(throwError(() => error))
const formGroup = new FormGroup<ProductDetailForm>({
id: new FormControl<string | null>('id'),
name: new FormControl<string | null>('name'),
version: new FormControl<string | null>('version'),
description: new FormControl<string | null>(null),
imageUrl: new FormControl<string | null>(null),
basePath: new FormControl<string | null>('path'),
displayName: new FormControl<string | null>('display'),
iconName: new FormControl<string | null>('icon'),
classifications: new FormControl<string[] | null>(null)
})
component.formGroup = formGroup as FormGroup<ProductDetailForm>
component.changeMode = 'EDIT'
component.formGroup.controls['basePath'].setValue('')

component.onSave()

expect(component.formGroup.valid).toBeTrue()
expect(msgServiceSpy.error).toHaveBeenCalledWith({
summaryKey: 'ACTIONS.EDIT.PRODUCT.NOK',
detailKey: 'VALIDATION.PRODUCT.UNIQUE_CONSTRAINT'
detailKey: 'VALIDATION.PRODUCT.UNIQUE_CONSTRAINT.BASEPATH'
})
})

Expand All @@ -274,7 +320,6 @@ describe('ProductPropertyComponent', () => {
const formGroup = new FormGroup<ProductDetailForm>({
id: new FormControl<string | null>('id'),
name: new FormControl<string | null>('name'),
operator: new FormControl<boolean | null>(null),
version: new FormControl<string | null>('version'),
description: new FormControl<string | null>(null),
imageUrl: new FormControl<string | null>(null),
Expand All @@ -298,7 +343,6 @@ describe('ProductPropertyComponent', () => {
const formGroup = new FormGroup<ProductDetailForm>({
id: new FormControl<string | null>(null, Validators.required),
name: new FormControl<string | null>('name'),
operator: new FormControl<boolean | null>(null),
version: new FormControl<string | null>('version'),
description: new FormControl<string | null>(null),
imageUrl: new FormControl<string | null>(null),
Expand Down Expand Up @@ -416,7 +460,7 @@ describe('ProductPropertyComponent', () => {
it('should return an image url', () => {
component.formGroup.controls['imageUrl'].setValue('url')

const result = component.getImageUrl()
const result = component.prepareImageUrl()

expect(result).toEqual('url')
})
Expand Down
38 changes: 10 additions & 28 deletions src/app/product-store/product-detail/product-props/product-props.component.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,6 @@ import { ChangeMode } from '../product-detail.component'
export interface ProductDetailForm {
id: FormControl<string | null>
name: FormControl<string | null>
operator: FormControl<boolean | null>
version: FormControl<string | null>
description: FormControl<string | null>
imageUrl: FormControl<string | null>
Expand Down Expand Up @@ -74,7 +73,6 @@ export class ProductPropertyComponent implements OnChanges, OnInit {
productNameValidator()
]),
displayName: new FormControl(null, [Validators.required, Validators.minLength(2), Validators.maxLength(255)]),
operator: new FormControl(null),
version: new FormControl(null, [Validators.required, Validators.maxLength(255)]),
description: new FormControl(null, [Validators.maxLength(255)]),
imageUrl: new FormControl(null, [Validators.maxLength(255)]),
Expand All @@ -88,29 +86,19 @@ export class ProductPropertyComponent implements OnChanges, OnInit {

ngOnInit(): void {
let productName = this.formGroup.controls['name'].value!
let requestParametersGet: GetImageRequestParams = {
refId: productName,
refType: RefType.Logo
}
if (
requestParametersGet.refId === undefined ||
requestParametersGet.refId === '' ||
requestParametersGet.refId === null
) {
if (!productName) {
this.logoImageWasUploaded = false
} else {
this.imageApi.getImage(requestParametersGet).subscribe(() => {
this.imageApi.getImage({ refId: productName, refType: RefType.Logo }).subscribe(() => {
this.logoImageWasUploaded = true
})
}
this.fetchingLogoUrl = this.getImageUrl()
this.fetchingLogoUrl = this.prepareImageUrl()
}

ngOnChanges(): void {
if (this.product) {
this.formGroup.patchValue({
...this.product
})
this.formGroup.patchValue({ ...this.product })
this.productId = this.changeMode !== 'COPY' ? this.product.id : undefined
this.productName = this.product.name // business key => manage the change!
} else {
Expand All @@ -135,17 +123,13 @@ export class ProductPropertyComponent implements OnChanges, OnInit {
}

private createProduct() {
let imgUrl = this.formGroup.controls['imageUrl'].value
if ((imgUrl == '' || imgUrl == null) && !this.logoImageWasUploaded) {
imgUrl = 'http://pragmaticscrum.info/wp-content/uploads/2016/06/t1.jpg'
}
this.productApi
.createProduct({
createProductRequest: {
name: this.formGroup.value['name'],
version: this.formGroup.value['version'],
description: this.formGroup.value['description'],
imageUrl: imgUrl,
imageUrl: this.formGroup.controls['imageUrl'].value,
basePath: this.formGroup.value['basePath'],
displayName: this.formGroup.value['displayName'],
iconName: this.formGroup.value['iconName'],
Expand All @@ -162,18 +146,14 @@ export class ProductPropertyComponent implements OnChanges, OnInit {
}

private updateProduct() {
let imgUrl = this.formGroup.controls['imageUrl'].value
if ((imgUrl == '' || imgUrl == null) && !this.logoImageWasUploaded) {
imgUrl = 'http://pragmaticscrum.info/wp-content/uploads/2016/06/t1.jpg'
}
this.productApi
.updateProduct({
id: this.productId!,
updateProductRequest: {
name: this.formGroup.value['name'],
version: this.formGroup.value['version'],
description: this.formGroup.value['description'],
imageUrl: imgUrl,
imageUrl: this.formGroup.controls['imageUrl'].value,
basePath: this.formGroup.value['basePath'],
displayName: this.formGroup.value['displayName'],
iconName: this.formGroup.value['iconName'],
Expand All @@ -193,7 +173,9 @@ export class ProductPropertyComponent implements OnChanges, OnInit {
if (err.error?.errorCode === 'PERSIST_ENTITY_FAILED') {
this.msgService.error({
summaryKey: 'ACTIONS.' + this.changeMode + '.PRODUCT.NOK',
detailKey: 'VALIDATION.PRODUCT.UNIQUE_CONSTRAINT'
detailKey:
'VALIDATION.PRODUCT.UNIQUE_CONSTRAINT.' +
(err.error?.detail.indexOf('ui_product_base_path') > 0 ? 'BASEPATH' : 'NAME')
})
} else {
this.msgService.error({ summaryKey: 'ACTIONS.' + this.changeMode + '.PRODUCT.NOK' })
Expand Down Expand Up @@ -259,7 +241,7 @@ export class ProductPropertyComponent implements OnChanges, OnInit {
}
}

getImageUrl(): string {
prepareImageUrl(): string {
let imgUrl = this.formGroup.controls['imageUrl'].value
if (imgUrl == '' || imgUrl == null) {
return this.imageApi.configuration.basePath + '/images/' + this.formGroup.controls['name'].value + '/logo'
Expand Down
Loading
Loading