diff --git a/src/components/1-atoms/Autocomplete.jsx b/src/components/1-atoms/Autocomplete.jsx
index 063b3fe..fbece12 100644
--- a/src/components/1-atoms/Autocomplete.jsx
+++ b/src/components/1-atoms/Autocomplete.jsx
@@ -28,7 +28,8 @@ const Autocomplete = (props) => {
isMultiple = false,
ignoreReset = false,
label,
- fullWidth,
+ fixedWidth = false,
+ ...rest
} = props;
const matchMultipleOptions = useCallback(
@@ -66,17 +67,7 @@ const Autocomplete = (props) => {
);
const classes = useStyles({
- labelLength:
- inputValue.length +
- (isMultiple
- ? selectedOption.reduce(
- (accLength, currentValue) =>
- accLength + currentValue.label.length,
- 0
- )
- : 0),
- selectedOptions: isMultiple ? value.length : 0,
- fullWidth: fullWidth,
+ inputLength: fixedWidth ? undefined : inputValue.length,
});
const [updateFlag, setUpdateFlag] = useState(false);
@@ -184,6 +175,7 @@ const Autocomplete = (props) => {
style={{ width: 'fit-content' }}
/>
)}
+ {...rest}
/>
);
};
@@ -204,7 +196,7 @@ Autocomplete.propTypes = {
error: PropTypes.bool,
ignoreReset: PropTypes.bool,
label: PropTypes.string,
- fullWidth: PropTypes.bool,
+ fixedWidth: PropTypes.bool,
};
export default Autocomplete;
diff --git a/src/components/1-atoms/AutocompleteStyles.js b/src/components/1-atoms/AutocompleteStyles.js
index a01e6ef..91114e9 100644
--- a/src/components/1-atoms/AutocompleteStyles.js
+++ b/src/components/1-atoms/AutocompleteStyles.js
@@ -7,16 +7,13 @@
import makeStyles from '@mui/styles/makeStyles';
-const FONT_SIZE = '0.875em';
+const FONT_SIZE = 0.875; // em
const MINIMUM_WIDTH = '150px';
export const useStyles = makeStyles((theme) => ({
- inputWidth: ({ labelLength, selectedOptions, fullWidth }) => {
- return {
- width: fullWidth
- ? '100%'
- : `max(${MINIMUM_WIDTH},calc(${FONT_SIZE} * ${labelLength} + 80px * ${selectedOptions} + ${
- selectedOptions !== 0 ? 1 : 0
- } * 50px))`,
- };
- },
+ inputWidth: ({ inputLength }) => ({
+ minWidth: MINIMUM_WIDTH,
+ width: inputLength
+ ? `calc(${inputLength} * ${FONT_SIZE} * 16px)`
+ : 'auto',
+ }),
}));
diff --git a/src/components/1-atoms/buttons/index.jsx b/src/components/1-atoms/buttons/index.jsx
index 3c66f26..aeb99bb 100644
--- a/src/components/1-atoms/buttons/index.jsx
+++ b/src/components/1-atoms/buttons/index.jsx
@@ -17,6 +17,7 @@ import LoopIcon from '@mui/icons-material/Loop';
import RestartAltIcon from '@mui/icons-material/RestartAlt';
import DoneIcon from '@mui/icons-material/Done';
import DoneAllIcon from '@mui/icons-material/DoneAll';
+import SaveAsIcon from '@mui/icons-material/SaveAs';
export const AddIconButton = (props) => (
} {...props} />
@@ -55,3 +56,6 @@ export const ApplyOneButton = (props) => (
export const ApplyAllButton = (props) => (
} {...props} />
);
+export const EditButton = (props) => (
+ } {...props} />
+);
diff --git a/src/components/2-molecules/AttachDialog.jsx b/src/components/2-molecules/AttachDialog.jsx
index 1f67290..4ab8f08 100644
--- a/src/components/2-molecules/AttachDialog.jsx
+++ b/src/components/2-molecules/AttachDialog.jsx
@@ -67,6 +67,7 @@ const AttachDialog = (props) => {
}))}
value={networkId}
onChange={setNetworkId}
+ fixedWidth
/>
@@ -97,6 +98,7 @@ const AttachDialog = (props) => {
-
+
{`${familyLabel} :`}
-
+
+
-
-
- {`${watchedElementLabel} :`}
-
-
-
-
-
- {properties.length > 0 && (
-
-
- {`${propertiesLabel} :`}
-
-
- )}
- {properties.map((property) => {
- const modelProperty = getAutomatonProperty(
- family,
- property.name
- );
- return (
-
-
-
- {`${property.name} :`}
-
-
- 0
- )
- }
- value={property.value}
- onChange={onChangeProperty(property.name)}
- options={modelProperty?.values}
- type={
- modelProperty?.type === 'number'
- ? 'number'
- : undefined
- }
- error={property.value === ''}
- ignoreReset={
- !(
- modelProperty?.values &&
- modelProperty?.values?.length > 0
- )
- }
- />
-
-
- );
- })}
+
+ ({
},
}),
label: {
- textAlign: 'right',
+ textAlign: 'left',
marginTop: '12px',
'& .MuiTypography-root': {
fontWeight: 'bold',
},
},
- value: {
- margin: '8px',
- '& .MuiFormControl-root .MuiInput-root': {
- minHeight: '2em',
- '& .MuiSelect-root': {
- paddingTop: 0,
- paddingBottom: 0,
- },
- },
+ select: {
+ textAlign: 'right',
},
- select: {},
}));
diff --git a/src/components/3-organisms/Filter.jsx b/src/components/3-organisms/Filter.jsx
index b84378d..04d8f2d 100644
--- a/src/components/3-organisms/Filter.jsx
+++ b/src/components/3-organisms/Filter.jsx
@@ -12,10 +12,10 @@ import * as _ from 'lodash';
import { CopyButton, DeleteButton } from '../1-atoms/buttons';
import Select from '../1-atoms/Select';
import { getOperandsOptions } from '../../utils/optionsBuilders';
-import { PropertyType } from '../../constants/equipmentDefinition';
import { multipleOperands } from '../../constants/operands';
import { useStyles } from './FilterStyle';
import Autocomplete from '../1-atoms/Autocomplete';
+import { PropertyType } from '../../constants/equipmentType';
const COPY_FILTER_LABEL = 'Copy filter';
const DELETE_FILTER_LABEL = 'Delete filter';
@@ -125,8 +125,14 @@ const Filter = (props) => {
-
-
+
+
{
const {
@@ -57,8 +58,8 @@ const Rule = (props) => {
const filterLabel = 'Where';
const addFilterLabel = 'Add filter';
const addFilterGroupLabel = 'Add filter group';
- const deleteRuleLabel = 'Delete rule';
- const copyRuleLabel = 'Copy Rule';
+ const deleteRuleLabel = 'Delete model';
+ const copyRuleLabel = 'Copy model';
const useBasicModeLabel = 'Use simple filters mode';
const useAdvancedModeLabel = 'Use advanced filters mode';
const unusedFiltersLabel = 'You have unused filter(s)';
@@ -79,7 +80,7 @@ const Rule = (props) => {