Max min values

src/client/app/components/meters/CreateMeterModalComponent.tsx

@@ -29,6 +29,7 @@ import { useTranslate } from '../../redux/componentHooks';
 import TimeZoneSelect from '../TimeZoneSelect';
 import TooltipHelpComponent from '../TooltipHelpComponent';
 import TooltipMarkerComponent from '../TooltipMarkerComponent';
+import { selectUnitDataById } from '../../redux/api/unitsApi';
 
 interface CreateMeterModalProps {
 	onCreateMeter?: (meterIdentifier: string) => void; // Define the type of the callback function
@@ -55,6 +56,7 @@ export default function CreateMeterModalComponent(props: CreateMeterModalProps):
 	const [meterDetails, setMeterDetails] = useState(defaultValues);
 	const unitIsSelected = meterDetails.unitId !== -999;
 	const defaultGaphicUnitIsSelected = meterDetails.defaultGraphicUnit !== -999;
+	const unitsDataById = useAppSelector(selectUnitDataById);
 
 	const { compatibleGraphicUnits, incompatibleGraphicUnits, compatibleUnits } = useAppSelector(state =>
 		// Type assertion due to conflicting GPS Property
@@ -92,6 +94,21 @@ export default function CreateMeterModalComponent(props: CreateMeterModalProps):
 	const handleTimeZoneChange = (timeZone: string) => {
 		setMeterDetails({ ...meterDetails, ['timeZone']: timeZone });
 	};
+
+	const handleUnitChange = (e: React.ChangeEvent<HTMLInputElement>) => {
+		const selectedUnitId = Number(e.target.value);
+		const selectedUnit = unitsDataById[selectedUnitId];
+
+		if (selectedUnit) {
+			setMeterDetails(details => ({
+				...details,
+				unitId: selectedUnitId,
+				minVal: selectedUnit.minVal,
+				maxVal: selectedUnit.maxVal
+			}));
+		}
+	};
+
 	// Reset the state to default values
 	const resetState = () => {
 		setMeterDetails(defaultValues);
@@ -245,9 +262,7 @@ export default function CreateMeterModalComponent(props: CreateMeterModalProps):
 							</Label>
 							<Input id='unitId' name='unitId' type='select'
 								value={meterDetails.unitId}
-								onChange={e => {
-									handleNumberChange(e);
-								}}
+								onChange={handleUnitChange}
 								invalid={!unitIsSelected}>
 								<option value={-999} key={-999} hidden disabled>
 									{translate('select.unit')}
@@ -544,25 +559,25 @@ export default function CreateMeterModalComponent(props: CreateMeterModalProps):
 					<Row xs='1' lg='2'>
 						{/* minVal input */}
 						<Col><FormGroup>
-							<Label for='minVal'>{translate('meter.minVal')}</Label>
+							<Label for='minVal'>{translate('minVal')}</Label>
 							<Input id='minVal' name='minVal' type='number'
 								onChange={e => handleNumberChange(e)}
 								min={MIN_VAL}
 								max={meterDetails.maxVal}
-								defaultValue={meterDetails.minVal}
+								value={meterDetails.minVal}
 								invalid={meterDetails?.minVal < MIN_VAL || meterDetails?.minVal > meterDetails?.maxVal} />
 							<FormFeedback>
 								<FormattedMessage id="error.bounds" values={{ min: MIN_VAL, max: meterDetails.maxVal }} />
 							</FormFeedback>
 						</FormGroup></Col>
 						{/* maxVal input */}
 						<Col><FormGroup>
-							<Label for='maxVal'>{translate('meter.maxVal')}</Label>
+							<Label for='maxVal'>{translate('maxVal')}</Label>
 							<Input id='maxVal' name='maxVal' type='number'
 								onChange={e => handleNumberChange(e)}
 								min={meterDetails.minVal}
 								max={MAX_VAL}
-								defaultValue={meterDetails.maxVal}
+								value={meterDetails.maxVal}
 								invalid={meterDetails?.maxVal > MAX_VAL || meterDetails?.minVal > meterDetails?.maxVal} />
 							<FormFeedback>
 								<FormattedMessage id="error.bounds" values={{ min: meterDetails.minVal, max: MAX_VAL }} />

src/client/app/components/meters/EditMeterModalComponent.tsx

@@ -67,6 +67,17 @@ export default function EditMeterModalComponent(props: EditMeterModalComponentPr
 
 	const [validMeter, setValidMeter] = useState(isValidMeter(localMeterEdits));
 
+	useEffect(() => {
+		const selectedUnit = unitDataById[localMeterEdits.unitId];
+		if (selectedUnit) {
+			setLocalMeterEdits(edits => ({
+				...edits,
+				minVal: selectedUnit.minVal,
+				maxVal: selectedUnit.maxVal
+			}));
+		}
+	}, [localMeterEdits.unitId, unitDataById]);
+
 	useEffect(() => { setValidMeter(isValidMeter(localMeterEdits)); }, [localMeterEdits]);
 	/* End State */
 
@@ -76,6 +87,19 @@ export default function EditMeterModalComponent(props: EditMeterModalComponentPr
 		}
 	}, [localMeterEdits.cumulative]);
 
+	const handleUnitChange = (e: React.ChangeEvent<HTMLInputElement>) => {
+		const selectedUnitId = Number(e.target.value);
+		const selectedUnit = unitDataById[selectedUnitId];
+		if (selectedUnit) {
+			setLocalMeterEdits({
+				...localMeterEdits,
+				unitId: selectedUnitId,
+				minVal: selectedUnit.minVal,
+				maxVal: selectedUnit.maxVal
+			});
+		}
+	};
+
 	// Save changes
 	// Currently using the old functionality which is to compare inherited prop values to state values
 	// If there is a difference between props and state, then a change was made
@@ -279,7 +303,7 @@ export default function EditMeterModalComponent(props: EditMeterModalComponentPr
 								name='unitId'
 								type='select'
 								value={localMeterEdits.unitId}
-								onChange={e => handleNumberChange(e)}>
+								onChange={handleUnitChange}>
 								{Array.from(compatibleUnits).map(unit => {
 									return (<option value={unit.id} key={unit.id}>{unit.identifier}</option>);
 								})}
@@ -599,7 +623,7 @@ export default function EditMeterModalComponent(props: EditMeterModalComponentPr
 					<Row xs='1' lg='2'>
 						{/* minVal input */}
 						<Col><FormGroup>
-							<Label for='minVal'>{translate('meter.minVal')}</Label>
+							<Label for='minVal'>{translate('minVal')}</Label>
 							<Input
 								id='minVal'
 								name='minVal'
@@ -615,7 +639,7 @@ export default function EditMeterModalComponent(props: EditMeterModalComponentPr
 						</FormGroup></Col>
 						{/* maxVal input */}
 						<Col><FormGroup>
-							<Label for='maxVal'>{translate('meter.maxVal')}</Label>
+							<Label for='maxVal'>{translate('maxVal')}</Label>
 							<Input
 								id='maxVal'
 								name='maxVal'

src/client/app/components/unit/CreateUnitModalComponent.tsx

@@ -15,6 +15,7 @@ import { tooltipBaseStyle } from '../../styles/modalStyle';
 import { unitsApi } from '../../redux/api/unitsApi';
 import { useTranslate } from '../../redux/componentHooks';
 import { showSuccessNotification, showErrorNotification } from '../../utils/notifications';
+import { MAX_VAL,  MIN_VAL } from '../../redux/selectors/adminSelectors';
 
 /**
  * Defines the create unit modal form
@@ -38,7 +39,9 @@ export default function CreateUnitModalComponent() {
 		// The client code makes the id for the selected unit and default graphic unit be -99
 		// so it can tell it is not yet assigned and do the correct logic for that case.
 		// The units API expects these values to be undefined on call so that the database can assign their values.
-		id: -99
+		id: -99,
+		minVal: MIN_VAL,
+		maxVal: MAX_VAL
 	};
 
 	/* State */
@@ -267,6 +270,34 @@ export default function CreateUnitModalComponent() {
 							</FormFeedback>
 						</FormGroup></Col>
 					</Row>
+					<Row xs='1' lg='2'>
+						{/* minVal input */}
+						<Col><FormGroup>
+							<Label for='minVal'>{translate('minVal')}</Label>
+							<Input id='minVal' name='minVal' type='number'
+								onChange={e => handleNumberChange(e)}
+								min={MIN_VAL}
+								max={state.maxVal}
+								defaultValue={state.minVal}
+								invalid={state?.minVal < MIN_VAL || state?.minVal > state?.maxVal} />
+							<FormFeedback>
+								<FormattedMessage id="error.bounds" values={{ min: MIN_VAL, max: state.maxVal }} />
+							</FormFeedback>
+						</FormGroup></Col>
+						{/* maxVal input */}
+						<Col><FormGroup>
+							<Label for='maxVal'>{translate('maxVal')}</Label>
+							<Input id='maxVal' name='maxVal' type='number'
+								onChange={e => handleNumberChange(e)}
+								min={state.minVal}
+								max={MAX_VAL}
+								defaultValue={state.maxVal}
+								invalid={state?.maxVal > MAX_VAL || state?.minVal > state?.maxVal} />
+							<FormFeedback>
+								<FormattedMessage id="error.bounds" values={{ min: state.minVal, max: MAX_VAL }} />
+							</FormFeedback>
+						</FormGroup></Col>
+					</Row>
 					{/* Note input */}
 					<FormGroup>
 						<Label for='note'>{translate('note')}</Label>

src/client/app/components/unit/EditUnitModalComponent.tsx

@@ -21,6 +21,7 @@ import { conversionArrow } from '../../utils/conversionArrow';
 import { showErrorNotification, showSuccessNotification } from '../../utils/notifications';
 import ConfirmActionModalComponent from '../ConfirmActionModalComponent';
 import TooltipMarkerComponent from '../TooltipMarkerComponent';
+import { MAX_VAL,  MIN_VAL } from '../../redux/selectors/adminSelectors';
 
 interface EditUnitModalComponentProps {
 	show: boolean;
@@ -193,7 +194,9 @@ export default function EditUnitModalComponent(props: EditUnitModalComponentProp
 				|| props.unit.preferredDisplay != state.preferredDisplay
 				|| props.unit.secInRate != state.secInRate
 				|| props.unit.suffix != state.suffix
-				|| props.unit.note != state.note;
+				|| props.unit.note != state.note
+				|| props.unit.minVal != state.minVal
+				|| props.unit.maxVal != state.maxVal;
 		} else {
 			// Tell user that not going to update due to input issues.
 			showErrorNotification(`${translate('unit.input.error')}`);
@@ -418,6 +421,36 @@ export default function EditUnitModalComponent(props: EditUnitModalComponentProp
 							</FormFeedback>
 						</FormGroup></Col>
 					</Row>
+					<Row xs='1' lg='2'>
+						{/* minVal input */}
+						<Col><FormGroup>
+							<Label for='minVal'>{translate('minVal')}</Label>
+							<Input id='minVal' name='minVal' type='number'
+								onChange={e => handleNumberChange(e)}
+								min={MIN_VAL}
+								max={state.maxVal}
+								defaultValue={state.minVal}
+								required value={state.minVal}
+								invalid={state?.minVal < MIN_VAL || state?.minVal > state?.maxVal} />
+							<FormFeedback>
+								<FormattedMessage id="error.bounds" values={{ min: MIN_VAL, max: state.maxVal }} />
+							</FormFeedback>
+						</FormGroup></Col>
+						{/* maxVal input */}
+						<Col><FormGroup>
+							<Label for='maxVal'>{translate('maxVal')}</Label>
+							<Input id='maxVal' name='maxVal' type='number'
+								onChange={e => handleNumberChange(e)}
+								min={state.minVal}
+								max={MAX_VAL}
+								defaultValue={state.maxVal}
+								required value={state.maxVal}
+								invalid={state?.maxVal > MAX_VAL || state?.minVal > state?.maxVal} />
+							<FormFeedback>
+								<FormattedMessage id="error.bounds" values={{ min: state.minVal, max: MAX_VAL }} />
+							</FormFeedback>
+						</FormGroup></Col>
+					</Row>
 					{/* Note input */}
 					<FormGroup>
 						<Label for='note'>{translate('unit')}</Label>

src/client/app/translations/data.ts

@@ -339,8 +339,8 @@ const LocaleTranslationData = {
 		"meter.enabled": "Updates:",
 		"meter.endOnlyTime": "Only End Times:",
 		"meter.endTimeStamp": "End Time Stamp:",
-		"meter.minVal": "Minimum Reading Value Check",
-		"meter.maxVal": "Maximum Reading Value Check",
+		"minVal": "Minimum Reading Value Check",
+		"maxVal": "Maximum Reading Value Check",
 		"meter.minDate": "Minimum Reading Date Check",
 		"meter.maxDate": "Maximum Reading Date Check",
 		"meter.maxError": "Maximum Number of Errors Check",
@@ -860,8 +860,8 @@ const LocaleTranslationData = {
 		"meter.enabled": "Mises à Jour du Mèters",
 		"meter.endOnlyTime": "End Only Time:\u{26A1}",
 		"meter.endTimeStamp": "End Time Stamp:\u{26A1}",
-		"meter.minVal": "Minimum Reading Value Check\u{26A1}",
-		"meter.maxVal": "Maximum Reading Value Check\u{26A1}",
+		"minVal": "Minimum Reading Value Check\u{26A1}",
+		"maxVal": "Maximum Reading Value Check\u{26A1}",
 		"meter.minDate": "Minimum Reading Date Check\u{26A1}",
 		"meter.maxDate": "Maximum Reading Date Check\u{26A1}",
 		"meter.maxError": "Maximum Number of Errors Check\u{26A1}",
@@ -1382,8 +1382,8 @@ const LocaleTranslationData = {
 		"meter.enabled": "Medidor activado",
 		"meter.endOnlyTime": "Solo tiempos finales.",
 		"meter.endTimeStamp": "Marca de tiempo al final:",
-		"meter.minVal": "Revisión del valor mínimo de lectura",
-		"meter.maxVal": "Revisión del valor máximo de lectura",
+		"minVal": "Revisión del valor mínimo de lectura",
+		"maxVal": "Revisión del valor máximo de lectura",
 		"meter.minDate": "Revisión de la fecha mínima de lectura",
 		"meter.maxDate": "Revisión de la fecha máxima de lectura",
 		"meter.maxError": "Revisión del número máximo de errores",

src/client/app/types/redux/units.ts

@@ -31,20 +31,22 @@ export interface UnitData {
 	displayable: DisplayableType;
 	preferredDisplay: boolean;
 	note: string;
+	maxVal: number;
+	minVal: number;
 }
 
-export interface UnitEditData {
-	id: number;
-	name: string;
-	identifier: string;
-	unitRepresent: string;
-	secInRate: number;
-	typeOfUnit: UnitType;
-	suffix: string;
-	displayable: DisplayableType;
-	preferredDisplay: boolean;
-	note: string;
-}
+// export interface UnitEditData {
+// 	id: number;
+// 	name: string;
+// 	identifier: string;
+// 	unitRepresent: string;
+// 	secInRate: number;
+// 	typeOfUnit: UnitType;
+// 	suffix: string;
+// 	displayable: DisplayableType;
+// 	preferredDisplay: boolean;
+// 	note: string;
+// }
 
 export interface UnitDataById extends Record<number, UnitData> { }
 

src/client/app/utils/input.ts

@@ -82,7 +82,9 @@ export const NoUnit: UnitData = {
 	suffix: '',
 	displayable: DisplayableType.none,
 	preferredDisplay: false,
-	note: ''
+	note: '',
+	minVal: -Infinity,
+	maxVal: Infinity
 };
 
 /**

src/server/migrations/1.0.0-2.0.0/index.js

@@ -20,5 +20,6 @@ module.exports = {
         // It should not matter but first rename cik and then do units.
         await db.none(sqlFile('../migrations/1.0.0-2.0.0/sql/cik/alter_cik_table.sql'));
         await db.none(sqlFile('../migrations/1.0.0-2.0.0/sql/units/alter_units_table.sql'));
+        await db.none(sqlFile('../migrations/1.0.0-2.0.0/sql/units/alter_units_table_add_columns.sql'));
     }
 };

src/server/migrations/1.0.0-2.0.0/sql/units/alter_units_table_add_columns.sql

@@ -0,0 +1,8 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+ALTER TABLE units
+    ADD COLUMN IF NOT EXISTS min_val FLOAT NOT NULL DEFAULT -9007199254740991 CHECK (min_val::FLOAT >= -9007199254740991),
+    ADD COLUMN IF NOT EXISTS max_val FLOAT NOT NULL DEFAULT 9007199254740991 CHECK (max_val::FLOAT <= 9007199254740991)
+;

src/server/models/Unit.js

@@ -19,7 +19,7 @@ class Unit {
 	 * @param {*} preferredDisplay True if this unit is always displayed. If not, the user needs to ask to see (for future enhancement).
 	 * @param {*} note Note about this unit.
 	 */
-	constructor(id, name, identifier = name, unitRepresent, secInRate = 3600, typeOfUnit, suffix = '', displayable, preferredDisplay, note) {
+	constructor(id, name, identifier = name, unitRepresent, secInRate = 3600, typeOfUnit, suffix = '', displayable, preferredDisplay, note, minVal, maxVal) {
 		this.id = id;
 		this.name = name;
 		this.identifier = identifier;
@@ -30,6 +30,8 @@ class Unit {
 		this.displayable = displayable;
 		this.preferredDisplay = preferredDisplay;
 		this.note = note;
+		this.minVal = minVal;
+		this.maxVal = maxVal;
 	}
 
 	/**
@@ -39,7 +41,7 @@ class Unit {
 	 */
 	static mapRow(row) {
 		return new Unit(row.id, row.name, row.identifier, row.unit_represent, row.sec_in_rate,
-			row.type_of_unit, row.suffix, row.displayable, row.preferred_display, row.note);
+			row.type_of_unit, row.suffix, row.displayable, row.preferred_display, row.note, row.min_val, row.max_val);
 	}
 
 	/**