|
|
@ -8,131 +8,130 @@ import { useState } from "react"; |
|
|
import { useTranslation } from "react-i18next"; |
|
|
import { useTranslation } from "react-i18next"; |
|
|
|
|
|
|
|
|
export const Bluetooth = () => { |
|
|
export const Bluetooth = () => { |
|
|
const { config, setWorkingConfig } = useDevice(); |
|
|
const { config, setWorkingConfig } = useDevice(); |
|
|
const { |
|
|
const { |
|
|
hasErrors, |
|
|
hasErrors, |
|
|
getErrorMessage, |
|
|
getErrorMessage, |
|
|
hasFieldError, |
|
|
hasFieldError, |
|
|
addError, |
|
|
addError, |
|
|
removeError, |
|
|
removeError, |
|
|
clearErrors, |
|
|
clearErrors, |
|
|
} = useAppStore(); |
|
|
} = useAppStore(); |
|
|
const { t } = useTranslation("deviceConfig"); |
|
|
const { t } = useTranslation("deviceConfig"); |
|
|
|
|
|
|
|
|
const [bluetoothPin, setBluetoothPin] = useState( |
|
|
const [bluetoothPin, setBluetoothPin] = useState( |
|
|
config?.bluetooth?.fixedPin.toString() ?? "", |
|
|
config?.bluetooth?.fixedPin.toString() ?? "", |
|
|
); |
|
|
); |
|
|
|
|
|
|
|
|
const validateBluetoothPin = (pin: string) => { |
|
|
const validateBluetoothPin = (pin: string) => { |
|
|
// if empty show error they need a pin set
|
|
|
// if empty show error they need a pin set
|
|
|
if (pin === "") { |
|
|
if (pin === "") { |
|
|
return addError("fixedPin", t("bluetooth.validation.pinRequired")); |
|
|
return addError("fixedPin", t("bluetooth.validation.pinRequired")); |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
// clear any existing errors
|
|
|
// clear any existing errors
|
|
|
clearErrors(); |
|
|
clearErrors(); |
|
|
|
|
|
|
|
|
// if it starts with 0 show error
|
|
|
// if it starts with 0 show error
|
|
|
if (pin[0] === "0") { |
|
|
if (pin[0] === "0") { |
|
|
return addError( |
|
|
return addError( |
|
|
"fixedPin", |
|
|
"fixedPin", |
|
|
t("bluetooth.validation.pinCannotStartWithZero"), |
|
|
t("bluetooth.validation.pinCannotStartWithZero"), |
|
|
); |
|
|
); |
|
|
} |
|
|
} |
|
|
// if it's not 6 digits show error
|
|
|
// if it's not 6 digits show error
|
|
|
if (pin.length < 6) { |
|
|
if (pin.length < 6) { |
|
|
return addError("fixedPin", t("bluetooth.validation.pinMustBeSixDigits")); |
|
|
return addError("fixedPin", t("bluetooth.validation.pinMustBeSixDigits")); |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
removeError("fixedPin"); |
|
|
removeError("fixedPin"); |
|
|
}; |
|
|
}; |
|
|
|
|
|
|
|
|
const bluetoothPinChangeEvent = (e: React.ChangeEvent<HTMLInputElement>) => { |
|
|
const bluetoothPinChangeEvent = (e: React.ChangeEvent<HTMLInputElement>) => { |
|
|
const numericValue = e.target.value.replace(/\D/g, "").slice(0, 6); |
|
|
const numericValue = e.target.value.replace(/\D/g, "").slice(0, 6); |
|
|
setBluetoothPin(numericValue); |
|
|
setBluetoothPin(numericValue); |
|
|
validateBluetoothPin(numericValue); |
|
|
validateBluetoothPin(numericValue); |
|
|
}; |
|
|
}; |
|
|
|
|
|
|
|
|
const onSubmit = (data: BluetoothValidation) => { |
|
|
const onSubmit = (data: BluetoothValidation) => { |
|
|
if (hasErrors()) { |
|
|
if (hasErrors()) { |
|
|
return; |
|
|
return; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
setWorkingConfig( |
|
|
setWorkingConfig( |
|
|
create(Protobuf.Config.ConfigSchema, { |
|
|
create(Protobuf.Config.ConfigSchema, { |
|
|
payloadVariant: { |
|
|
payloadVariant: { |
|
|
case: "bluetooth", |
|
|
case: "bluetooth", |
|
|
value: data, |
|
|
value: data, |
|
|
}, |
|
|
}, |
|
|
}), |
|
|
}), |
|
|
); |
|
|
); |
|
|
}; |
|
|
}; |
|
|
|
|
|
|
|
|
return ( |
|
|
return ( |
|
|
<DynamicForm<BluetoothValidation> |
|
|
<DynamicForm<BluetoothValidation> |
|
|
onSubmit={onSubmit} |
|
|
onSubmit={onSubmit} |
|
|
defaultValues={config.bluetooth} |
|
|
defaultValues={config.bluetooth} |
|
|
fieldGroups={[ |
|
|
fieldGroups={[ |
|
|
{ |
|
|
{ |
|
|
label: t("bluetooth.title"), |
|
|
label: t("bluetooth.title"), |
|
|
description: t("bluetooth.description"), |
|
|
description: t("bluetooth.description"), |
|
|
notes: t("bluetooth.note"), |
|
|
notes: t("bluetooth.note"), |
|
|
fields: [ |
|
|
fields: [ |
|
|
{ |
|
|
{ |
|
|
type: "toggle", |
|
|
type: "toggle", |
|
|
name: "enabled", |
|
|
name: "enabled", |
|
|
label: t("bluetooth.enabled.label"), |
|
|
label: t("bluetooth.enabled.label"), |
|
|
description: t("bluetooth.enabled.description"), |
|
|
description: t("bluetooth.enabled.description"), |
|
|
}, |
|
|
}, |
|
|
{ |
|
|
{ |
|
|
type: "select", |
|
|
type: "select", |
|
|
name: "mode", |
|
|
name: "mode", |
|
|
label: t("bluetooth.pairingMode.label"), |
|
|
label: t("bluetooth.pairingMode.label"), |
|
|
description: t("bluetooth.pairingMode.description"), |
|
|
description: t("bluetooth.pairingMode.description"), |
|
|
selectChange: (e) => { |
|
|
selectChange: (e) => { |
|
|
if (e !== "1") { |
|
|
if (e !== "1") { |
|
|
setBluetoothPin(""); |
|
|
setBluetoothPin(""); |
|
|
removeError("fixedPin"); |
|
|
removeError("fixedPin"); |
|
|
} |
|
|
} |
|
|
}, |
|
|
}, |
|
|
disabledBy: [ |
|
|
disabledBy: [ |
|
|
{ |
|
|
{ |
|
|
fieldName: "enabled", |
|
|
fieldName: "enabled", |
|
|
}, |
|
|
}, |
|
|
], |
|
|
], |
|
|
properties: { |
|
|
properties: { |
|
|
enumValue: Protobuf.Config.Config_BluetoothConfig_PairingMode, |
|
|
enumValue: Protobuf.Config.Config_BluetoothConfig_PairingMode, |
|
|
formatEnumName: true, |
|
|
formatEnumName: true, |
|
|
}, |
|
|
}, |
|
|
}, |
|
|
}, |
|
|
{ |
|
|
{ |
|
|
type: "number", |
|
|
type: "number", |
|
|
name: "fixedPin", |
|
|
name: "fixedPin", |
|
|
label: t("bluetooth.pin.label"), |
|
|
label: t("bluetooth.pin.label"), |
|
|
description: t("bluetooth.pin.description"), |
|
|
description: t("bluetooth.pin.description"), |
|
|
validationText: hasFieldError("fixedPin") |
|
|
validationText: hasFieldError("fixedPin") |
|
|
? getErrorMessage("fixedPin") |
|
|
? getErrorMessage("fixedPin") |
|
|
: "", |
|
|
: "", |
|
|
inputChange: bluetoothPinChangeEvent, |
|
|
inputChange: bluetoothPinChangeEvent, |
|
|
disabledBy: [ |
|
|
disabledBy: [ |
|
|
{ |
|
|
{ |
|
|
fieldName: "mode", |
|
|
fieldName: "mode", |
|
|
selector: |
|
|
selector: Protobuf.Config.Config_BluetoothConfig_PairingMode |
|
|
Protobuf.Config.Config_BluetoothConfig_PairingMode |
|
|
.FIXED_PIN, |
|
|
.FIXED_PIN, |
|
|
invert: true, |
|
|
invert: true, |
|
|
}, |
|
|
}, |
|
|
{ |
|
|
{ |
|
|
fieldName: "enabled", |
|
|
fieldName: "enabled", |
|
|
}, |
|
|
}, |
|
|
], |
|
|
], |
|
|
properties: { |
|
|
properties: { |
|
|
value: bluetoothPin, |
|
|
value: bluetoothPin, |
|
|
}, |
|
|
}, |
|
|
}, |
|
|
}, |
|
|
], |
|
|
], |
|
|
}, |
|
|
}, |
|
|
]} |
|
|
]} |
|
|
/> |
|
|
/> |
|
|
); |
|
|
); |
|
|
|
|
|
}; |
|
|
}; |
|
|
|