[Fix]: #1935 add instant save for boolean, select and switch #1944

Original file line number	Diff line number	Diff line change
Expand Up		@@ -54,6 +54,7 @@ export type EditViewFn<T> = (props: {
		value: T;
		onChange: (value: T) => void;
		onChangeEnd: () => void;
	onImmediateSave?: (value: T) => void;
		otherProps?: Record<string, any>;
		}) => ReactNode;

Expand Down Expand Up		@@ -168,9 +169,26 @@ function EditableCellComp<T extends JSONValue>(props: EditableCellProps<T>) {
		}
		}, [dispatch, tmpValue, baseValue, value, onTableEvent, setIsEditing]);

	const onImmediateSave = useCallback((newValue: T) => {
	if (!mountedRef.current) return;

	setTmpValue(newValue);
	const changeValue = _.isNil(newValue) \|\| _.isEqual(newValue, baseValue) ? null : newValue;
	dispatch(
	changeChildAction(
	"changeValue",
	changeValue,
	false
	)
	);
	if(!_.isEqual(newValue, value)) {
	onTableEvent?.('columnEdited');
	}
	}, [dispatch, baseValue, value, onTableEvent]);

		const editView = useMemo(
	() => editViewFn?.({ value, onChange, onChangeEnd, otherProps }) ?? <></>,
	[editViewFn, value, onChange, onChangeEnd, otherProps]
	() => editViewFn?.({ value, onChange, onChangeEnd, onImmediateSave, otherProps }) ?? <></>,
	[editViewFn, value, onChange, onChangeEnd, onImmediateSave, otherProps]
		);

		const enterEditFn = useCallback(() => {
Expand Down

Show comments View file Open in desktop

Original file line number	Diff line number	Diff line change
Expand Up		@@ -64,6 +64,7 @@ type CheckBoxEditPropsType = {
		value: boolean;
		onChange: (value: boolean) => void;
		onChangeEnd: () => void;
	onImmediateSave?: (value: boolean) => void;
		};

		// Memoized checkbox edit component
Expand Down Expand Up		@@ -92,8 +93,13 @@ const CheckBoxEdit = React.memo((props: CheckBoxEditPropsType) => {

		const handleChange = useCallback((e: CheckboxChangeEvent) => {
		if (!mountedRef.current) return;
	props.onChange(e.target.checked);
	}, [props.onChange]);
	const newValue = e.target.checked;
	props.onChange(newValue);
	// Use immediate save to show Save Changes button without exiting edit mode
	if (props.onImmediateSave) {
	props.onImmediateSave(newValue);
	}
	}, [props.onChange, props.onImmediateSave]);

		return (
		<Wrapper
Expand Down Expand Up		@@ -171,6 +177,7 @@ export const BooleanComp = (function () {
		value={props.value}
		onChange={props.onChange}
		onChangeEnd={props.onChangeEnd}
	onImmediateSave={props.onImmediateSave}
		/>
		);
		})
Expand Down

Show comments View file Open in desktop

Original file line number	Diff line number	Diff line change
Expand Up		@@ -124,6 +124,7 @@ type SelectEditProps = {
		initialValue: string;
		onChange: (value: string) => void;
		onChangeEnd: () => void;
	onImmediateSave?: (value: string) => void;
		options: any[];
		onMainEvent?: (eventName: string) => void;
		};
Expand All		@@ -146,6 +147,11 @@ const SelectEdit = React.memo((props: SelectEditProps) => {
		props.onChange(val);
		setCurrentValue(val);

	// Use immediate save to show Save Changes button without exiting edit mode
	if (props.onImmediateSave) {
	props.onImmediateSave(val);
	}

		// Trigger the specific option's event handler
		const selectedOption = props.options.find(option => option.value === val);
		if (selectedOption?.onEvent) {
Expand All		@@ -156,7 +162,7 @@ const SelectEdit = React.memo((props: SelectEditProps) => {
		if (props.onMainEvent) {
		props.onMainEvent("click");
		}
	}, [props.onChange, props.options, props.onMainEvent]);
	}, [props.onChange, props.onImmediateSave, props.options, props.onMainEvent]);

		const handleEvent = useCallback(async (eventName: string) => {
		if (!mountedRef.current) return [] as unknown[];
Expand Down Expand Up		@@ -209,6 +215,7 @@ export const ColumnSelectComp = (function () {
		options={props.otherProps?.options \|\| []}
		onChange={props.onChange}
		onChangeEnd={props.onChangeEnd}
	onImmediateSave={props.onImmediateSave}
		onMainEvent={props.otherProps?.onEvent}
		/>
		</Wrapper>
Expand Down

Show comments View file Open in desktop

Original file line number	Diff line number	Diff line change
Expand Up		@@ -144,6 +144,10 @@ export const SwitchComp = (function () {
		disabled={false}
		onChange={(checked, e) => {
		props.onChange(checked);
	// Use immediate save to show Save Changes button without exiting edit mode
	if (props.onImmediateSave) {
	props.onImmediateSave(checked);
	}
		props.otherProps?.onEvent?.("change");
		props.otherProps?.onEvent?.(checked ? "true" : "false");
		}}
Expand Down

Navigation Menu