ITQC/pydase
9
0
Fork 0
mirror of https://github.com/tiqi-group/pydase.git synced 2026-02-20 16:58:44 +01:00
Code Issues Packages Projects Releases Wiki Activity

moves displayName and id to GenericComponent and pass them as props

Browse Source
This commit is contained in:
Mose Müller
2024-02-21 09:50:04 +01:00
parent 2f2544b978
commit 2d98ba51f4
12 changed files with 148 additions and 168 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
frontend/src/components/SliderComponent.tsx
View File

@@ -1,10 +1,8 @@
import React, { useContext, useEffect, useRef, useState } from 'react';
import { WebSettingsContext } from '../WebSettings';
import React, { useEffect, useRef, useState } from 'react';
import { InputGroup, Form, Row, Col, Collapse, ToggleButton } from 'react-bootstrap';
import { DocStringComponent } from './DocStringComponent';
import { Slider } from '@mui/material';
import { NumberComponent, NumberObject } from './NumberComponent';
import { getIdFromFullAccessPath } from '../utils/stringUtils';
import { LevelName } from './NotificationsComponent';
type SliderComponentProps = {
@@ -24,6 +22,8 @@ type SliderComponentProps = {
prefix?: string,
callback?: (ack: unknown) => void
) => void;
displayName: string;
id: string;
};
export const SliderComponent = React.memo((props: SliderComponentProps) => {
@@ -39,35 +39,30 @@ export const SliderComponent = React.memo((props: SliderComponentProps) => {
docString,
isInstantUpdate,
addNotification,
changeCallback = () => {}
changeCallback = () => {},
displayName,
id
} = props;
const fullAccessPath = [parentPath, name].filter((element) => element).join('.');
const id = getIdFromFullAccessPath(fullAccessPath);
const webSettings = useContext(WebSettingsContext);
let displayName = name;
if (webSettings[fullAccessPath] && webSettings[fullAccessPath].displayName) {
displayName = webSettings[fullAccessPath].displayName;
}
useEffect(() => {
renderCount.current++;
});
useEffect(() => {
addNotification(`${parentPath}.${name} changed to ${value}.`);
addNotification(`${fullAccessPath} changed to ${value.value}.`);
}, [props.value]);
useEffect(() => {
addNotification(`${parentPath}.${name}.min changed to ${min}.`);
addNotification(`${fullAccessPath}.min changed to ${min.value}.`);
}, [props.min]);
useEffect(() => {
addNotification(`${parentPath}.${name}.max changed to ${max}.`);
addNotification(`${fullAccessPath}.max changed to ${max.value}.`);
}, [props.max]);
useEffect(() => {
addNotification(`${parentPath}.${name}.stepSize changed to ${stepSize}.`);
addNotification(`${fullAccessPath}.stepSize changed to ${stepSize.value}.`);
}, [props.stepSize]);
const handleOnChange = (event, newNumber: number | number[]) => {
@@ -145,8 +140,9 @@ export const SliderComponent = React.memo((props: SliderComponentProps) => {
type="float"
value={valueMagnitude}
unit={valueUnit}
showName={false}
addNotification={() => null}
addNotification={() => {}}
changeCallback={(value) => changeCallback(value, name + '.value')}
id={id + '-value'}
/>
</Col>
<Col xs="auto">