ITQC/pydase
24
0
Fork 0
mirror of https://github.com/tiqi-group/pydase.git synced 2025-04-19 16:10:01 +02:00
Code Issues Packages Projects Releases Wiki Activity

fix: "instant update" feature

Browse Source 
- Components do update to values received from backend even if instant
  update is not selected.
This commit is contained in:
Mose Müller 2023-08-02 12:06:22 +02:00
parent 4ff07aa587
commit 7a89168d14
2 changed files with 16 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
frontend/src/components/NumberComponent.tsx
View File

@ -109,16 +109,6 @@ export const NumberComponent = React.memo((props: NumberComponentProps) => {
useEffect(() => {
renderCount.current++;
// Parse the input string to a number for comparison
const numericInputString =
props.type === 'int' ? parseInt(inputString) : parseFloat(inputString);
// Update inputString only when value is different from numericInputString
// preventing the removal of trailing decimals or zeros after the decimal.
if (isInstantUpdate && props.value !== numericInputString) {
setInputString(props.value.toString());
}
// Set the cursor position after the component re-renders
const inputElement = document.getElementsByName(
parent_path.concat(name)
@ -128,6 +118,16 @@ export const NumberComponent = React.memo((props: NumberComponentProps) => {
}
});
useEffect(() => {
// Parse the input string to a number for comparison
const numericInputString =
props.type === 'int' ? parseInt(inputString) : parseFloat(inputString);
// Only update the inputString if it's different from the prop value
if (props.value !== numericInputString) {
setInputString(props.value.toString());
}
}, [props.value]);
const handleNumericKey = (key: string, value: string, selectionStart: number) => {
// Check if a number key or a decimal point key is pressed
if (key === '.' && (value.includes('.') || props.type === 'int')) {

8
frontend/src/components/StringComponent.tsx
View File

@ -21,10 +21,14 @@ export const StringComponent = React.memo((props: StringComponentProps) => {
const { name, parent_path, readOnly, docString, isInstantUpdate } = props;
useEffect(() => {
renderCount.current++;
if (isInstantUpdate && props.value !== inputString) {
}, [isInstantUpdate, inputString, renderCount]);
useEffect(() => {
// Only update the inputString if it's different from the prop value
if (props.value !== inputString) {
setInputString(props.value);
}
}, [isInstantUpdate, props.value, inputString, renderCount]);
}, [props.value]);
const handleChange = (event) => {
setInputString(event.target.value);