diff --git a/package-lock.json b/package-lock.json index 259e5dd..54b9268 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "wlan-cloud-owprov-ui", - "version": "2.8.0(25)", + "version": "2.8.0(26)", "lockfileVersion": 2, "requires": true, "packages": { "": { "name": "wlan-cloud-owprov-ui", - "version": "2.8.0(25)", + "version": "2.8.0(26)", "license": "ISC", "dependencies": { "@chakra-ui/icons": "^2.0.11", diff --git a/package.json b/package.json index bbb7790..f0d7fe9 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "wlan-cloud-owprov-ui", - "version": "2.8.0(25)", + "version": "2.8.0(26)", "description": "", "main": "index.tsx", "scripts": { diff --git a/src/components/CustomFields/ConfigurationSelectPortsField/Input.tsx b/src/components/CustomFields/ConfigurationSelectPortsField/Input.tsx index 7437cf2..91caa99 100644 --- a/src/components/CustomFields/ConfigurationSelectPortsField/Input.tsx +++ b/src/components/CustomFields/ConfigurationSelectPortsField/Input.tsx @@ -14,20 +14,9 @@ interface Props { isDisabled: boolean; } -export const WAN_OPTIONS = ['WAN1', 'WAN2', 'WAN3', 'WAN4']; const lanOptions = ['LAN1', 'LAN2', 'LAN3', 'LAN4', 'LAN5', 'LAN6', 'LAN7', 'LAN8', 'LAN9', 'LAN10', 'LAN11', 'LAN12']; -const MultiSelectInput = ( - { - value, - onChange, - onBlur, - options, - error, - isError, - isDisabled - }: Props -) => { +const MultiSelectInput: React.FC = ({ value, onChange, onBlur, options, error, isError, isDisabled }) => { const { t } = useTranslation(); const onValueChange = useCallback( @@ -43,13 +32,17 @@ const MultiSelectInput = ( if (v) { let newValue = v; const newestValue = newValue.length === 0 ? '' : newValue[newValue.length - 1]?.value ?? ''; - - if (WAN_OPTIONS.includes(newestValue)) newValue = newValue.filter((val) => val?.value !== 'WAN*'); - else if (newestValue === 'WAN*') newValue = newValue.filter((val) => !WAN_OPTIONS.includes(val?.value ?? '')); + if (newestValue === '*') { + newValue = [{ value: '*', label: t('common.all') }]; + } if (lanOptions.includes(newestValue)) newValue = newValue.filter((val) => val?.value !== 'LAN*'); else if (newestValue === 'LAN*') newValue = newValue.filter((val) => !lanOptions.includes(val?.value ?? '')); - onChange(newValue.map((val) => val?.value ?? '')); + onChange( + newValue.length === 1 + ? newValue.map((val) => val?.value ?? '') + : newValue.map((val) => val?.value ?? '').filter((newV) => newV !== '*'), + ); } }, [], diff --git a/src/components/CustomFields/ConfigurationSelectPortsField/index.tsx b/src/components/CustomFields/ConfigurationSelectPortsField/index.tsx index a637f12..d86128c 100644 --- a/src/components/CustomFields/ConfigurationSelectPortsField/index.tsx +++ b/src/components/CustomFields/ConfigurationSelectPortsField/index.tsx @@ -1,4 +1,5 @@ import React, { useMemo } from 'react'; +import { useTranslation } from 'react-i18next'; import MultiSelectInput from './Input'; import useFastField from 'hooks/useFastField'; @@ -7,11 +8,16 @@ interface Props { name: string; } -const ConfigurationSelectPortsField = ({ name, isDisabled = false }: Props) => { +const ConfigurationSelectPortsField: React.FC = ({ name, isDisabled = false }) => { + const { t } = useTranslation(); const { value, error, isError, onChange, onBlur } = useFastField({ name }); const options = useMemo( () => [ + { + value: '*', + label: t('common.all'), + }, { value: 'WAN*', label: 'WAN*', @@ -20,22 +26,6 @@ const ConfigurationSelectPortsField = ({ name, isDisabled = false }: Props) => { value: 'LAN*', label: 'LAN*', }, - { - value: 'WAN1', - label: 'WAN1', - }, - { - value: 'WAN2', - label: 'WAN2', - }, - { - value: 'WAN3', - label: 'WAN3', - }, - { - value: 'WAN4', - label: 'WAN4', - }, { value: 'LAN1', label: 'LAN1', @@ -90,7 +80,7 @@ const ConfigurationSelectPortsField = ({ name, isDisabled = false }: Props) => { return ( void; } -const SingleInterface = ({ editing, index, remove }: Props) => { +const SingleInterface: React.FC = ({ editing, index, remove }) => { const { t } = useTranslation(); - const { value } = useFastField({ name: `configuration[${index}].ssids` }); + const { value } = useFastField({ name: `configuration[${index}].ssids` }); const removeRadio = () => remove(index); const roleOpts = useMemo( diff --git a/src/pages/ConfigurationPage/ConfigurationCard/ConfigurationSectionsCard/InterfaceSection/index.jsx b/src/pages/ConfigurationPage/ConfigurationCard/ConfigurationSectionsCard/InterfaceSection/index.jsx index 106a017..788bd47 100644 --- a/src/pages/ConfigurationPage/ConfigurationCard/ConfigurationSectionsCard/InterfaceSection/index.jsx +++ b/src/pages/ConfigurationPage/ConfigurationCard/ConfigurationSectionsCard/InterfaceSection/index.jsx @@ -11,7 +11,6 @@ import InterfaceExpertModal from './InterfaceExpertModal'; import Interfaces from './Interfaces'; import { INTERFACES_SCHEMA } from './interfacesConstants'; import DeleteButton from 'components/Buttons/DeleteButton'; -import { WAN_OPTIONS } from 'components/CustomFields/ConfigurationSelectPortsField/Input'; import { ConfigurationSectionShape } from 'constants/propShapes'; const propTypes = { @@ -29,10 +28,7 @@ const warningTests = (values) => { for (const config of values.configuration) { if (config.ethernet?.length > 0) { for (let i = 0; i < config.ethernet[0]['select-ports'].length; i += 1) { - if ( - config.ethernet[0]['select-ports'][i] === 'WAN*' || - WAN_OPTIONS.includes(config.ethernet[0]['select-ports'][i]) - ) { + if (config.ethernet[0]['select-ports'][i] === 'WAN*' || config.ethernet[0]['select-ports'][i] === '*') { foundWan = true; break; }