[Fix] Employee Fields Edition on Job Page

packages/plugins/job-employee-ui/src/lib/components/job-employee/job-employee.component.html

@@ -32,6 +32,7 @@ <h4>
 				[settings]="settingsSmartTable"
 				[source]="smartTableSource"
 				(editConfirm)="onEditConfirm($event)"
+				(editCancel)="onEditCancel($event)"
 				(userRowSelect)="onSelectEmployee($event)"
 			></angular2-smart-table>
 		</div>

packages/plugins/job-employee-ui/src/lib/components/job-employee/job-employee.component.ts

@@ -10,7 +10,7 @@ import { TranslateService } from '@ngx-translate/core';
 import { Cell } from 'angular2-smart-table';
 import { NgxPermissionsService } from 'ngx-permissions';
 import { ID, IEmployee, IOrganization, LanguagesEnum, PermissionsEnum } from '@gauzy/contracts';
-import { API_PREFIX, distinctUntilChange } from '@gauzy/ui-core/common';
+import { API_PREFIX, distinctUntilChange, isNotNullOrUndefined } from '@gauzy/ui-core/common';
 import {
 	PageDataTableRegistryService,
 	EmployeesService,
@@ -30,6 +30,8 @@ import {
 	NumberEditorComponent,
 	EmployeeLinkEditorComponent,
 	PaginationFilterBaseComponent,
+	NonEditableNumberEditorComponent,
+	JobSearchAvailabilityEditorComponent,
 	ToggleSwitcherComponent
 } from '@gauzy/ui-core/shared';
 
@@ -240,7 +242,11 @@ export class JobEmployeeComponent extends PaginationFilterBaseComponent implemen
 			width: '10%', // The width of the column
 			isSortable: false, // Indicates whether the column is sortable
 			isEditable: false, // Indicates whether the column is editable
-			valuePrepareFunction: (rawValue: any) => rawValue || 0
+			valuePrepareFunction: (rawValue: any) => (isNotNullOrUndefined(rawValue) ? rawValue : 0),
+			editor: {
+				type: 'custom',
+				component: NonEditableNumberEditorComponent
+			}
 		});
 
 		// Register the data table column
@@ -253,7 +259,11 @@ export class JobEmployeeComponent extends PaginationFilterBaseComponent implemen
 			width: '10%', // The width of the column
 			isSortable: false, // Indicates whether the column is sortable
 			isEditable: false, // Indicates whether the column is editable
-			valuePrepareFunction: (rawValue: any) => rawValue || 0
+			valuePrepareFunction: (rawValue: any) => (isNotNullOrUndefined(rawValue) ? rawValue : 0),
+			editor: {
+				type: 'custom',
+				component: NonEditableNumberEditorComponent
+			}
 		});
 
 		// Register the data table column
@@ -307,7 +317,7 @@ export class JobEmployeeComponent extends PaginationFilterBaseComponent implemen
 			type: 'custom', // The type of the column
 			width: '20%', // The width of the column
 			isSortable: false, // Indicates whether the column is sortable
-			isEditable: false, // Indicates whether the column is editable
+			isEditable: true, // Indicates whether the column is editable
 			renderComponent: ToggleSwitcherComponent,
 			componentInitFunction: (instance: ToggleSwitcherComponent, cell: Cell) => {
 				// Get the employee data from the cell
@@ -323,6 +333,10 @@ export class JobEmployeeComponent extends PaginationFilterBaseComponent implemen
 					// Call the JobSearchStoreService to update the job search availability
 					this._jobSearchStoreService.updateJobSearchAvailability(this.organization, employee, toggle);
 				});
+			},
+			editor: {
+				type: 'custom',
+				component: JobSearchAvailabilityEditorComponent
 			}
 		});
 	}
@@ -530,6 +544,21 @@ export class JobEmployeeComponent extends PaginationFilterBaseComponent implemen
 		}
 	}
 
+	/**
+	 * Handles the cancellation of an edit operation in the smart table.
+	 * Refreshes the data table to reflect any changes made.
+	 *
+	 * @param event - The event object containing details about the canceled edit.
+	 *
+	 */
+	onEditCancel(event: any): void {
+		// Optionally, you can log the event for debugging purposes
+		console.log('Edit canceled for row:', event);
+
+		// Refresh the data table to revert any changes made during the edit
+		this.smartTableSource.refresh();
+	}
+
 	/**
 	 * Applies translations to the Smart Table settings when the language changes.
 	 * This method listens for the onLangChange event from the translateService.

packages/ui-core/shared/src/lib/table-components/editors/index.ts

@@ -1,2 +1,4 @@
 export * from './number-editor.component';
 export * from './employee-link-editor.component';
+export * from './job-search-availability-editor.component';
+export * from './non-editable-number-editor.component';

packages/ui-core/shared/src/lib/table-components/editors/job-search-availability-editor.component.ts

@@ -0,0 +1,74 @@
+import { AfterViewInit, ChangeDetectorRef, Component, Input, OnInit, ViewChild } from '@angular/core';
+import { filter, tap } from 'rxjs';
+import { Cell, DefaultEditor } from 'angular2-smart-table';
+import { UntilDestroy, untilDestroyed } from '@ngneat/until-destroy';
+import { IEmployee, IOrganization } from '@gauzy/contracts';
+import { distinctUntilChange } from '@gauzy/ui-core/common';
+import { JobSearchStoreService, Store } from '@gauzy/ui-core/core';
+import { ToggleSwitcherComponent } from '../toggle-switcher/toggle-switcher.component';
+
+@UntilDestroy({ checkProperties: true })
+@Component({
+	template: `
+		<ngx-toggle-switcher [label]="false" (onSwitched)="updateJobSearchAvailability($event)"></ngx-toggle-switcher>
+	`
+})
+export class JobSearchAvailabilityEditorComponent extends DefaultEditor implements AfterViewInit, OnInit {
+	public organization: IOrganization;
+	public employee: IEmployee;
+
+	// Reference to the cell object
+	@Input() cell!: Cell;
+
+	// Reference to the ToggleSwitcherComponent instance
+	@ViewChild(ToggleSwitcherComponent) switcher!: ToggleSwitcherComponent;
+
+	constructor(
+		private readonly _cdr: ChangeDetectorRef,
+		private readonly _store: Store,
+		private readonly _jobSearchStoreService: JobSearchStoreService
+	) {
+		super();
+	}
+
+	ngOnInit() {
+		this._store.selectedOrganization$
+			.pipe(
+				distinctUntilChange(),
+				filter((organization: IOrganization) => !!organization),
+				tap((organization: IOrganization) => {
+					this.organization = organization;
+					this.employee = this.cell.getRow()?.getData();
+				}),
+				untilDestroyed(this)
+			)
+			.subscribe();
+	}
+
+	ngAfterViewInit(): void {
+		if (!this.switcher) {
+			return;
+		}
+		this.switcher.value = this.employee?.isJobSearchActive || false;
+		this._cdr.detectChanges(); // Force change detection to update the UI
+	}
+
+	/**
+	 * Updates the job search availability status of an employee within the organization.
+	 *
+	 * @param isJobSearchActive - A boolean flag indicating whether the job search is active.
+	 */
+	updateJobSearchAvailability(isJobSearchActive: boolean): void {
+		try {
+			// Call the service to update the job search availability status
+			this._jobSearchStoreService.updateJobSearchAvailability(
+				this.organization,
+				this.employee,
+				isJobSearchActive
+			);
+		} catch (error) {
+			// Log the error for debugging purposes
+			console.log('Error while updating job search availability:', error);
+		}
+	}
+}

packages/ui-core/shared/src/lib/table-components/editors/non-editable-number-editor.component.ts

@@ -0,0 +1,28 @@
+import { Component, Input, OnInit } from '@angular/core';
+import { Cell, DefaultEditor } from 'angular2-smart-table';
+
+@Component({
+	template: `
+		<div>
+			{{ cellValue }}
+		</div>
+	`
+})
+export class NonEditableNumberEditorComponent extends DefaultEditor implements OnInit {
+	cellValue!: string | number;
+
+	@Input() cell!: Cell;
+
+	ngOnInit() {
+		const value = this.cell.getValue();
+		if (value === null || value === undefined) {
+			console.warn('Cell value is null or undefined');
+			this.cellValue = '';
+		} else if (typeof value === 'number' || typeof value === 'string') {
+			this.cellValue = value;
+		} else {
+			console.error('Unexpected cell value type:', typeof value);
+			this.cellValue = '';
+		}
+	}
+}

packages/ui-core/shared/src/lib/table-components/index.ts

@@ -11,6 +11,7 @@ export * from './document-date/document-date.component';
 export * from './document-url/document-url.component';
 export * from './editors/number-editor.component';
 export * from './editors/employee-link-editor.component';
+export * from './editors/job-search-availability-editor.component';
 export * from './email/email.component';
 export * from './employee-links/employee-links.component';
 export * from './employee-with-links/employee-with-links.component';
@@ -39,6 +40,7 @@ export * from './toggle-switcher/toggle-switcher.component';
 export * from './trust-html/trust-html.component';
 export * from './value-with-units/value-with-units.component';
 export * from './visibility/visibility.component';
+export * from './editors/non-editable-number-editor.component';
 
 // Export the table components main module
 export * from './table-components.module';

packages/ui-core/shared/src/lib/table-components/table-components.module.ts

@@ -5,7 +5,12 @@ import { NbIconModule, NbTooltipModule, NbBadgeModule, NbToggleModule, NbButtonM
 import { TranslateModule } from '@ngx-translate/core';
 import { ComponentsModule } from '../components/components.module';
 import { PipesModule } from '../pipes/pipes.module';
-import { EmployeeLinkEditorComponent, NumberEditorComponent } from './editors';
+import {
+	EmployeeLinkEditorComponent,
+	JobSearchAvailabilityEditorComponent,
+	NonEditableNumberEditorComponent,
+	NumberEditorComponent
+} from './editors';
 import { AllowScreenshotCaptureComponent } from './allow-screenshot-capture/allow-screenshot-capture.component';
 import { AssignedToComponent } from './assigned-to/assigned-to.component';
 import { ClickableLinkComponent } from './clickable-link/clickable-link.component';
@@ -104,7 +109,9 @@ import { TaskBadgeViewComponentModule } from '../tasks/task-badge-view/task-badg
 		ToggleSwitcherComponent,
 		TrustHtmlLinkComponent,
 		ValueWithUnitComponent,
-		VisibilityComponent
+		VisibilityComponent,
+		NonEditableNumberEditorComponent,
+		JobSearchAvailabilityEditorComponent
 	],
 	exports: [
 		AllowScreenshotCaptureComponent,
@@ -129,6 +136,8 @@ import { TaskBadgeViewComponentModule } from '../tasks/task-badge-view/task-badg
 		InvoiceTotalValueComponent,
 		NotesWithTagsComponent,
 		NumberEditorComponent,
+		JobSearchAvailabilityEditorComponent,
+		NonEditableNumberEditorComponent,
 		OrganizationWithTagsComponent,
 		PhoneUrlComponent,
 		PictureNameTagsComponent,