brandxtech/frontend
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge branch 'staging_environment' into hybrid_inventory_control

Browse source
This commit is contained in:
csawatzky 2025-05-16 09:24:23 -06:00
commit 3b8a47e760
63 changed files with 4307 additions and 983 deletions
Download patch file Download diff file Expand all files Collapse all files

116
src/bin/BinSVGV2.tsx
View file

@ -1,5 +1,6 @@
import { Box, Theme, ToggleButton, ToggleButtonGroup, darken } from "@mui/material";
import { makeStyles, withStyles } from "@mui/styles";
import ButtonGroup from "common/ButtonGroup";
import { ExtractMoisture } from "grain";
import { GrainCable } from "models/GrainCable";
import { describeMeasurement } from "pbHelpers/MeasurementDescriber";
@ -212,54 +213,54 @@ export default function BinSVGV2(props: Props) {
const [extraDetails, setExtraDetails] = useState<"temps" | "hums">("temps");
const [nodeWarning, setNodeWarning] = useState(false);
const StyledToggleButtonGroup = withStyles(theme => ({
grouped: {
margin: theme.spacing(-0.5),
border: "none",
padding: theme.spacing(1),
"&:not(:first-child):not(:last-child)": {
borderRadius: 24,
marginRight: theme.spacing(0.5),
marginLeft: theme.spacing(0.5)
},
"&:first-child": {
borderRadius: 24,
marginLeft: theme.spacing(0.25)
},
"&:last-child": {
borderRadius: 24,
marginRight: theme.spacing(0.25)
}
},
root: {
backgroundColor: darken(
theme.palette.background.paper,
getThemeType() === "light" ? 0.05 : 0.25
),
borderRadius: 24,
content: "border-box"
}
}))(ToggleButtonGroup);
// const StyledToggleButtonGroup = withStyles(theme => ({
// grouped: {
// margin: theme.spacing(-0.5),
// border: "none",
// padding: theme.spacing(1),
// "&:not(:first-child):not(:last-child)": {
// borderRadius: 24,
// marginRight: theme.spacing(0.5),
// marginLeft: theme.spacing(0.5)
// },
// "&:first-child": {
// borderRadius: 24,
// marginLeft: theme.spacing(0.25)
// },
// "&:last-child": {
// borderRadius: 24,
// marginRight: theme.spacing(0.25)
// }
// },
// root: {
// backgroundColor: darken(
// theme.palette.background.paper,
// getThemeType() === "light" ? 0.05 : 0.25
// ),
// borderRadius: 24,
// content: "border-box"
// }
// }))(ToggleButtonGroup);
const StyledToggle = withStyles({
root: {
backgroundColor: "transparent",
overflow: "visible",
content: "content-box",
"&$selected": {
backgroundColor: "gold",
color: "black",
borderRadius: 24,
fontWeight: "bold"
},
"&$selected:hover": {
backgroundColor: "rgb(255, 255, 0)",
color: "black",
borderRadius: 24
}
},
selected: {}
})(ToggleButton);
// const StyledToggle = withStyles({
// root: {
// backgroundColor: "transparent",
// overflow: "visible",
// content: "content-box",
// "&$selected": {
// backgroundColor: "gold",
// color: "black",
// borderRadius: 24,
// fontWeight: "bold"
// },
// "&$selected:hover": {
// backgroundColor: "rgb(255, 255, 0)",
// color: "black",
// borderRadius: 24
// }
// },
// selected: {}
// })(ToggleButton);
const gradients = () => {
const burning = "#8a1f0d";
@ -832,7 +833,6 @@ export default function BinSVGV2(props: Props) {
cableGrainEndY = cableGrainStartY;
}
if (cableEstimate && cables.length > 0 && cableGrainPathPoints.length === cables.length) {
console.log("calc cable path");
let cablePath = cableGrainEstimate(
cableGrainPathPoints,
spacingX,
@ -1048,10 +1048,26 @@ export default function BinSVGV2(props: Props) {
<React.Fragment>
{showTempHum && (
<Box
display="flex"
alignContent="center"
justifyContent="center"
textAlign="center"
//visibility={showTempHum ? "visible" : "hidden"}
className={!isFullScreen ? classes.smallToggle : classes.fullToggle}>
<StyledToggleButtonGroup
<ButtonGroup
buttons={[
{
title: isFullScreen ? "Temperature" : "Temp",
function: () => setExtraDetails("temps")
},
{
title: grainType ? (isFullScreen ? "Moisture" : "EMC") : isFullScreen ? "Humidity" : "Hum",
function: () => setExtraDetails("hums")
}
]}
toggle
/>
{/* <StyledToggleButtonGroup
value={extraDetails}
exclusive
size="small"
@ -1068,7 +1084,7 @@ export default function BinSVGV2(props: Props) {
aria-label="Node Humidity">
{grainType ? (isFullScreen ? "Moisture" : "EMC") : isFullScreen ? "Humidity" : "Hum"}
</StyledToggle>
</StyledToggleButtonGroup>
</StyledToggleButtonGroup> */}
</Box>
)}
<Box

2
src/bin/BinStorageConditions.tsx
View file

@ -401,7 +401,7 @@ export default function BinStorageConditions(props: Props) {
alignContent="center"
alignItems="center"
justifyContent="space-between">
<Grid size={{ xs: 6 }}>
<Grid size={{ xs: 8 }}>
<Box display="flex" alignContent="center" alignItems="center">
<TemperatureIcon />
<Typography noWrap style={{ fontWeight: 650 }}>

136
src/bin/BinVisualizerV2.tsx
View file

@ -71,6 +71,7 @@ import { ExtractMoisture } from "grain";
import SearchSelect, { Option } from "common/SearchSelect";
import Edit from "@mui/icons-material/Edit";
import { makeStyles, styled } from "@mui/styles";
import ButtonGroup from "common/ButtonGroup";
const useStyles = makeStyles((theme: Theme) => {
return ({
@ -280,54 +281,54 @@ export default function BinVisualizer(props: Props) {
const [storageDate, setStorageDate] = useState(moment().format("YYYY-MM-DD"));
const [storageTime, setStorageTime] = useState(moment().format("HH:mm"));
const StyledToggle = styled(ToggleButton)(({ theme }: { theme: Theme }) => ({
root: {
backgroundColor: "transparent",
overflow: "visible",
content: "content-box",
"&$selected": {
backgroundColor: "gold",
color: "black",
borderRadius: 24,
fontWeight: "bold"
},
"&$selected:hover": {
backgroundColor: "rgb(255, 255, 0)",
color: "black",
borderRadius: 24
}
},
selected: {}
}));
// const StyledToggle = styled(ToggleButton)(({ theme }: { theme: Theme }) => ({
// root: {
// backgroundColor: "transparent",
// overflow: "visible",
// content: "content-box",
// "&$selected": {
// backgroundColor: "gold",
// color: "black",
// borderRadius: 24,
// fontWeight: "bold"
// },
// "&$selected:hover": {
// backgroundColor: "rgb(255, 255, 0)",
// color: "black",
// borderRadius: 24
// }
// },
// selected: {}
// }));
const StyledToggleButtonGroup = styled(ToggleButtonGroup)(({ theme }: { theme: Theme }) => ({
grouped: {
margin: theme.spacing(-0.5),
border: "none",
padding: theme.spacing(1),
"&:not(:first-child):not(:last-child)": {
borderRadius: 24,
marginRight: theme.spacing(0.5),
marginLeft: theme.spacing(0.5)
},
"&:first-child": {
borderRadius: 24,
marginLeft: theme.spacing(0.25)
},
"&:last-child": {
borderRadius: 24,
marginRight: theme.spacing(0.25)
}
},
root: {
backgroundColor: darken(
theme.palette.background.paper,
getThemeType() === "light" ? 0.05 : 0.25
),
borderRadius: 24,
content: "border-box"
}
}));
// const StyledToggleButtonGroup = styled(ToggleButtonGroup)(({ theme }: { theme: Theme }) => ({
// grouped: {
// margin: theme.spacing(-0.5),
// border: "none",
// padding: theme.spacing(1),
// "&:not(:first-child):not(:last-child)": {
// borderRadius: 24,
// marginRight: theme.spacing(0.5),
// marginLeft: theme.spacing(0.5)
// },
// "&:first-child": {
// borderRadius: 24,
// marginLeft: theme.spacing(0.25)
// },
// "&:last-child": {
// borderRadius: 24,
// marginRight: theme.spacing(0.25)
// }
// },
// root: {
// backgroundColor: darken(
// theme.palette.background.paper,
// getThemeType() === "light" ? 0.05 : 0.25
// ),
// borderRadius: 24,
// content: "border-box"
// }
// }));
useEffect(() => {
setModeTime(moment(bin.status.lastModeChange));
@ -1705,6 +1706,18 @@ export default function BinVisualizer(props: Props) {
);
};
const determineToggle = (binMode: pond.BinMode) => {
switch (binMode) {
case pond.BinMode.BIN_MODE_STORAGE:
return [0]
case pond.BinMode.BIN_MODE_COOLDOWN:
return [1]
case pond.BinMode.BIN_MODE_DRYING:
case pond.BinMode.BIN_MODE_HYDRATING:
return [2]
}
}
const binMode = () => {
const mode = bin.settings.mode;
return (
@ -1720,7 +1733,31 @@ export default function BinVisualizer(props: Props) {
<Typography variant="subtitle1" style={{ fontWeight: 800 }}>
Bin Mode
</Typography>
<StyledToggleButtonGroup
<ButtonGroup
buttons={[
{
title: "Storage",
function: () => {
setModeStorage()
}
},
{
title: "Cooldown",
function: () => {
setModeCooldown()
}
},
{
title: bin.settings.inventory && bin.settings.inventory?.initialMoisture < bin.settings.inventory?.targetMoisture ? "Hydrating" : "Drying",
function: () => {
setShowInputMoisture(true)
}
}
]}
toggledButtons={determineToggle(mode)}
toggle
/>
{/* <StyledToggleButtonGroup
id="tour-bin-mode"
value={mode}
exclusive
@ -1754,7 +1791,7 @@ export default function BinVisualizer(props: Props) {
Drying
</StyledToggle>
)}
</StyledToggleButtonGroup>
</StyledToggleButtonGroup> */}
</Box>
);
};
@ -2067,6 +2104,7 @@ export default function BinVisualizer(props: Props) {
devices={devices}
refreshCallback={success => {
setShowInputMoisture(false);
setNewPreset(0)
if (success) updateBin();
}}
parentPreset={newPreset}

1
src/bin/BinYards.tsx
View file

@ -130,6 +130,7 @@ const useStyles = makeStyles((theme: Theme) => {
borderTopLeftRadius: "6px",
borderTopRightRadius: "6px",
background: theme.palette.background.default,
fontWeight: 1000,
transform: "0.3s ease-in-out",
// "linear-gradient(rgba(150, 150, 150, 0.3),"
// + theme.palette.background.default + " 80%)"

23
src/bin/BinyardDisplay.tsx
View file

@ -123,10 +123,11 @@ export default function BinyardDisplay(props: Props) {
});
const loadBins = useCallback(() => {
setBinsLoading(true);
if (yardKey === "") return
//load the bins based on the yard key
setBinsLoading(true);
binAPI
.listBinsAndData(maxBins, 0, "asc", "name", undefined, as, undefined, [yardKey], ["binyard"])
.listBinsAndData(maxBins, 0, "asc", "name", undefined, undefined, undefined, [yardKey], ["binyard"])
.then(resp => {
let yardBins: Bin[] = [];
let grainBins: Bin[] = [];
@ -315,17 +316,10 @@ export default function BinyardDisplay(props: Props) {
<Grid size={12}>
<BinsList
gridView
valDisplay="average"
bins={grainBins}
duplicateBin={duplicateBin}
title={"Grain Bins"}
// because this only triggers in scroll view it is no longer necessary as we dont do the scroll here
// loadMore={newTranslation => {
// //only triggered in the scroll view so this will never trigger in grid view
// if (yardBins.length < binTotal) {
// loadMoreBins(contentFilter);
// setScrollTranslations({ ...scrollTranslations, bins: newTranslation });
// }
// }}
/>
</Grid>
</React.Fragment>
@ -338,16 +332,10 @@ export default function BinyardDisplay(props: Props) {
<Grid size={12}>
<BinsList
gridView
valDisplay="average"
bins={fertBins}
duplicateBin={duplicateBin}
title={"Fertilizer Bins"}
// loadMore={newTranslation => {
// //only triggered in the scroll view so this will never trigger in grid view
// if (yardBins.length < binTotal) {
// loadMoreBins(contentFilter);
// setScrollTranslations({ ...scrollTranslations, fertilizer: newTranslation });
// }
// }}
/>
</Grid>
</React.Fragment>
@ -360,6 +348,7 @@ export default function BinyardDisplay(props: Props) {
<Grid size={12}>
<BinsList
gridView
valDisplay="average"
bins={emptyBins}
duplicateBin={duplicateBin}
title={"Empty Bins"}