IntenseWebs/pgadmin4
3
0
Fork 0
mirror of https://github.com/pgadmin-org/pgadmin4.git synced 2024-11-29 12:03:52 -06:00
Code Issues Packages Projects Releases Wiki Activity

Fix an issue where clear color is not reflecting in color picker. #4392 (#5425)

Browse Source
This commit is contained in:
Aditya Toshniwal 2022-10-12 16:34:54 +05:30 committed by GitHub
parent 3c52139ce5
commit ae82a4b279
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 11 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
web/pgadmin/static/js/helpers/withColorPicker.js
View File

@ -29,9 +29,11 @@ export function withColorPicker(Component) {
};
const eleRef = useRef();
const pickrObj = useRef();
const onChangeRef = useRef(onChange);
const onSaveRef = useRef(onSave);
const setColor = (newVal) => {
pickrObj.current?.setColor((_.isUndefined(newVal) || newVal == '') ? pickrOptions.defaultColor : newVal);
const setColor = (newVal, silent) => {
pickrObj.current?.setColor((_.isUndefined(newVal) || newVal == '') ? pickrOptions.defaultColor : newVal, silent);
};
const destroyPickr = () => {
@ -95,9 +97,9 @@ export function withColorPicker(Component) {
}
});
}).on('clear', () => {
onChange?.('');
onChangeRef.current?.('');
}).on('change', (color) => {
onChange?.(color.toHEXA().toString());
onChangeRef.current?.(color.toHEXA().toString());
}).on('show', (color, instance) => {
const { palette } = instance.getRoot().palette;
palette.focus();
@ -106,10 +108,10 @@ export function withColorPicker(Component) {
button.focus();
}).on('save', (color, instance) => {
if(color) {
color.toHEXA().toString() != fullHexColor(value) && onSave?.(color.toHEXA().toString());
color.toHEXA().toString() != fullHexColor(value) && onSaveRef.current?.(color.toHEXA().toString());
instance?.hide();
} else {
onSave?.('');
onSaveRef.current?.('');
}
});
@ -126,10 +128,10 @@ export function withColorPicker(Component) {
}, [...Object.values(pickrOptions)]);
useEffect(() => {
if (pickrObj.current && !pickrOptions.allowSave) {
setColor(value);
if (pickrObj.current) {
setColor(value, true);
}
}, [value, pickrOptions.allowSave]);
}, [value]);
return <Component ref={eleRef} {...props}/>;
};