Skip to content

Commit

Permalink
fix: remove the all item from dropdown lists (#288)
Browse files Browse the repository at this point in the history
  • Loading branch information
@HenryT-CG
HenryT-CG authored Oct 29, 2024
1 parent e9aa9bf commit 83303df
Show file tree
Hide file tree
Showing 10 changed files with 62 additions and 105 deletions.
57 changes: 30 additions & 27 deletions src/app/announcement/announcement-detail/announcement-detail.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,7 @@
<textarea
#announcementTitle
pInputTextarea
id="am_announcement_detail_form_title"
id="am_detail_form_title"
type="text"
style="min-height: 2.5rem"
class="w-full textarea-sm"
Expand All @@ -45,9 +45,7 @@
tooltipPosition="top"
tooltipEvent="hover"
></textarea>
<label class="ocx-required-label" for="am_announcement_detail_form_title">
{{ 'ANNOUNCEMENT.TITLE' | translate }}
</label>
<label class="ocx-required-label" for="am_detail_form_title"> {{ 'ANNOUNCEMENT.TITLE' | translate }} </label>
</span>
</div>
<div class="w-full relative">
Expand All @@ -64,7 +62,7 @@
<textarea
#announcementContent
pInputTextarea
id="am_announcement_detail_form_content"
id="am_detail_form_content"
class="w-full textarea-md"
formControlName="content"
rows="3"
Expand All @@ -75,50 +73,51 @@
tooltipPosition="top"
tooltipEvent="hover"
></textarea>
<label for="am_announcement_detail_form_content">{{ 'ANNOUNCEMENT.CONTENT' | translate }}</label>
<label for="am_detail_form_content">{{ 'ANNOUNCEMENT.CONTENT' | translate }}</label>
</span>
</div>

<div class="w-full flex flex-column sm:flex-row row-gap-3 sm:row-gap-4 column-gap-5">
<div class="flex-grow-1">
<span class="p-float-label">
<p-dropdown
id="am_announcement_detail_form_workspace_name"
#workspaceName
id="am_detail_form_workspace_name"
class="input-field"
styleClass="w-full"
[options]="allWorkspaces"
[autoDisplayFirst]="true"
[appendTo]="'body'"
[showClear]="true"
formControlName="workspaceName"
[aria-label]="'ANNOUNCEMENT.WORKSPACE' | translate"
[pTooltip]="'ANNOUNCEMENT.TOOLTIPS.WORKSPACE' | translate"
tooltipPosition="top"
tooltipEvent="hover"
>
</p-dropdown>
<label for="am_announcement_detail_form_workspace_name"> {{ 'ANNOUNCEMENT.WORKSPACE' | translate }} </label>
<label for="am_detail_form_workspace_name"> {{ 'ANNOUNCEMENT.WORKSPACE' | translate }} </label>
</span>
</div>

<div class="flex-grow-1">
<span class="p-float-label">
<p-dropdown
id="am_announcement_detail_form_application_name"
id="am_detail_form_application_name"
class="input-field"
styleClass="w-full"
[options]="allProducts"
[autoDisplayFirst]="true"
[appendTo]="'body'"
[showClear]="true"
formControlName="productName"
[aria-label]="'ANNOUNCEMENT.APPLICATION' | translate"
[ariaLabel]="'ANNOUNCEMENT.APPLICATION' | translate"
[pTooltip]="'ANNOUNCEMENT.TOOLTIPS.APPLICATION' | translate"
tooltipPosition="top"
tooltipEvent="hover"
>
</p-dropdown>
<label for="am_announcement_detail_form_application_name">
{{ 'ANNOUNCEMENT.APPLICATION' | translate }}
</label>
<label for="am_detail_form_application_name"> {{ 'ANNOUNCEMENT.APPLICATION' | translate }} </label>
</span>
</div>
</div>
Expand All @@ -128,7 +127,7 @@
<div>
<span class="p-float-label" controlErrorAnchor>
<p-calendar
inputId="announcement_detail_form_start_date"
inputId="am_detail_form_start_date"
type="text"
formControlName="startDate"
styleClass="w-15rem"
Expand All @@ -141,11 +140,12 @@
[showIcon]="true"
[showOnFocus]="false"
appendTo="body"
aria-labelledby="am_detail_form_start_date"
[pTooltip]="'ANNOUNCEMENT.TOOLTIPS.START_DATE' | translate"
tooltipPosition="top"
tooltipEvent="hover"
></p-calendar>
<label class="ocx-required-label" for="am_announcement_detail_form_start_date">
<label class="ocx-required-label" for="am_detail_form_start_date">
{{ 'ANNOUNCEMENT.START_DATE' | translate }}
</label>
</span>
Expand All @@ -155,7 +155,7 @@
<div>
<span class="p-float-label" controlErrorAnchor>
<p-calendar
inputId="announcement_detail_form_end_date"
inputId="am_detail_form_end_date"
type="text"
formControlName="endDate"
styleClass="w-15rem"
Expand All @@ -172,13 +172,13 @@
tooltipPosition="top"
tooltipEvent="hover"
></p-calendar>
<label for="am_announcement_detail_form_end_date"> {{ 'ANNOUNCEMENT.END_DATE' | translate }}</label>
<label for="am_detail_form_end_date"> {{ 'ANNOUNCEMENT.END_DATE' | translate }}</label>
</span>
</div>
</div>
<div class="mr-4 flex flex-column justify-content-center sm:align-items-center row-gap-1">
<p-inputSwitch
inputId="announcement_detail_form_status"
inputId="am_detail_form_status"
class="input-switch-xl"
formControlName="status"
trueValue="ACTIVE"
Expand All @@ -187,7 +187,7 @@
tooltipPosition="top"
tooltipEvent="hover"
></p-inputSwitch>
<label class="text-xs float-label" for="am_announcement_detail_form_status">
<label class="text-xs float-label" for="am_detail_form_status">
{{ 'ENUMS.ANNOUNCEMENT_STATUS.' + formGroup.controls['status'].value | translate }}
</label>
</div>
Expand All @@ -197,20 +197,20 @@
formGroup.controls['endDate'].errors?.hasOwnProperty('invalidDateRange')
"
class="col-12 py-0 ml-1 sm:pl-3 control-error"
for="am_announcement_detail_form_start_date"
for="am_detail_form_start_date"
>
{{ 'VALIDATION.ERRORS.INVALID_DATE_RANGE' | translate }}
</label>
</div>

<div class="w-full flex flex-column row-gap-2 sm:flex-row sm:justify-content-evenly sm:align-items-end">
<div class="p-0 md:text-right flex flex-column md:justify-content-end">
<label class="float-label mb-1 text-sm font-medium" for="am_announcement_detail_form_priority"
<label class="float-label mb-1 text-sm font-medium" for="am_detail_form_priority"
>{{ 'ANNOUNCEMENT.PRIORITY' | translate }}
</label>
<p-selectButton
#announcmenPriority
id="am_announcement_detail_form_priority"
id="am_detail_form_priority"
formControlName="priority"
[options]="(priorityOptions$ | async) ?? []"
[pTooltip]="'ANNOUNCEMENT.TOOLTIPS.PRIORITY' | translate"
Expand All @@ -219,7 +219,7 @@
></p-selectButton>
</div>
<span
id="am_announcement_detail_preview_icon"
id="am_detail_preview_icon"
class="p-2 pi text-xl border-round hidden sm:block"
[class.pi-info-circle]="announcmentType.value === 'INFO'"
[class.pi-calendar]="announcmentType.value === 'EVENT'"
Expand All @@ -232,14 +232,15 @@
tooltipEvent="hover"
></span>
<div class="p-0 flex flex-column">
<label class="float-label mb-1 text-sm font-medium" for="am_announcement_detail_form_type">
<label class="float-label mb-1 text-sm font-medium" for="am_detail_form_type">
{{ 'ANNOUNCEMENT.TYPE' | translate }}
</label>
<p-selectButton
#announcmentType
id="am_announcement_detail_form_type"
id="am_detail_form_type"
formControlName="type"
[options]="(typeOptions$ | async) ?? []"
[ariaLabel]="'ANNOUNCEMENT.TOOLTIPS.TYPE' | translate"
[pTooltip]="'ANNOUNCEMENT.TOOLTIPS.TYPE' | translate"
tooltipPosition="top"
tooltipEvent="hover"
Expand All @@ -252,20 +253,22 @@
<ng-template pTemplate="footer">
<div class="flex flex-wrap justify-content-end gap-2 mb-1">
<p-button
id="am_announcement_detail_button_cancel"
id="am_detail_action_cancel"
icon="pi pi-times"
(onClick)="onDialogHide()"
[label]="'ACTIONS.CANCEL' | translate"
[ariaLabel]="'ACTIONS.CANCEL' | translate"
[pTooltip]="'ACTIONS.TOOLTIPS.CANCEL_AND_CLOSE' | translate"
tooltipPosition="top"
tooltipEvent="hover"
></p-button>
<p-button
id="am_announcement_detail_button_save"
id="am_detail_action_save"
icon="pi pi-save"
(onClick)="onSave()"
[disabled]="!formGroup.valid"
[label]="'ACTIONS.SAVE' | translate"
[ariaLabel]="'ACTIONS.SAVE' | translate"
[pTooltip]="'ACTIONS.TOOLTIPS.SAVE' | translate"
tooltipPosition="top"
tooltipEvent="hover"
Expand Down
12 changes: 0 additions & 12 deletions src/app/announcement/announcement-detail/announcement-detail.component.spec.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -210,18 +210,6 @@ describe('AnnouncementDetailComponent', () => {
})
})

describe(': submitFormValues', () => {
it('should prevent non-existing workspace name from being saved', () => {
component.formGroup = formGroup
component.formGroup.patchValue({ workspaceName: 'all', productName: 'all' })

const result = (component as any).submitFormValues()

expect(result.workspaceName).toBeUndefined()
expect(result.productName).toBeUndefined()
})
})

it('should display warning when trying to save an anncmt with invalid dateRange', () => {
component.formGroup = formGroup
component.formGroup.setErrors({ dateRange: true })
Expand Down
9 changes: 0 additions & 9 deletions src/app/announcement/announcement-detail/announcement-detail.component.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -42,15 +42,12 @@ export class AnnouncementDetailComponent implements OnChanges {

announcementId: string | undefined
announcementDeleteVisible = false
workspaces: SelectItem[] = []
products: SelectItem[] = []
public dateFormat: string
public timeFormat: string
public isLoading = false
public displayDateRangeError = false
// form
formGroup: FormGroup
autoResize!: boolean
public typeOptions$: Observable<SelectItem[]> = of([])
public statusOptions$: Observable<SelectItem[]> = of([])
public priorityOptions$: Observable<SelectItem[]> = of([])
Expand Down Expand Up @@ -81,7 +78,6 @@ export class AnnouncementDetailComponent implements OnChanges {
})
this.formGroup.controls['startDate'].addValidators([Validators.required, dateRangeValidator(this.formGroup)])
this.formGroup.controls['endDate'].addValidators([dateRangeValidator(this.formGroup)])
this.autoResize = true
}

ngOnChanges() {
Expand Down Expand Up @@ -134,8 +130,6 @@ export class AnnouncementDetailComponent implements OnChanges {
startDate: this.announcement?.startDate ? new Date(this.announcement.startDate) : null,
endDate: this.announcement?.endDate ? new Date(this.announcement.endDate) : null
})
if (!this.announcement?.workspaceName) this.formGroup.controls['workspaceName'].setValue('all')
if (!this.announcement?.productName) this.formGroup.controls['productName'].setValue('all')
}

/**
Expand Down Expand Up @@ -176,11 +170,8 @@ export class AnnouncementDetailComponent implements OnChanges {
}
}

// eslint-disable-next-line @typescript-eslint/no-explicit-any
private submitFormValues(): any {
const announcement: Announcement = { ...this.formGroup.value }
if (announcement.workspaceName === 'all') announcement.workspaceName = undefined
if (announcement.productName === 'all') announcement.productName = undefined
return announcement
}

Expand Down
15 changes: 3 additions & 12 deletions src/app/announcement/announcement-search/announcement-search.component.spec.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -148,7 +148,7 @@ describe('AnnouncementSearchComponent', () => {
})
})

it('should search anncmts assigned to one workspace', (done) => {
it('should search announcements assigned to one workspace', (done) => {
apiServiceSpy.searchAnnouncements.and.returnValue(of({ stream: [announcementData[1]] }))
component.criteria = { workspaceName: 'ADMIN' }
const reuseCriteria = false
Expand All @@ -165,17 +165,12 @@ describe('AnnouncementSearchComponent', () => {
})
})

it('should search anncmts in all workspaces and products', (done) => {
it('should search announcements for all workspaces and products', (done) => {
apiServiceSpy.searchAnnouncements.and.returnValue(of({ stream: announcementData }))
component.criteria = { workspaceName: 'all', productName: 'all' }
const resultCriteria = {
workspaceName: undefined,
productName: undefined
}
component.criteria = {}
const reuseCriteria = false

component.onSearch({ announcementSearchCriteria: component.criteria }, reuseCriteria)
expect(component.criteria).toEqual(resultCriteria)

component.announcements$!.subscribe({
next: (data) => {
Expand Down Expand Up @@ -457,10 +452,6 @@ describe('AnnouncementSearchComponent', () => {
expect(result).toEqual(false)
})

it('should provide the translation for ALL', () => {
expect(component.allItem?.label).toEqual('ANNOUNCEMENT.ALL')
})

it('should provide a translation if unknown workspace is listed', () => {
let key = component.getTranslationKeyForNonExistingWorkspaces('unknown workspace')

Expand Down
Loading

0 comments on commit 83303df

Please sign in to comment.