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

Merge branch 'staging_environment' of gitlab.com:brandx/bxt-app into staging_environment

Browse source
This commit is contained in:
Carter 2026-02-23 14:45:27 -06:00
commit 2413cc36d1
28 changed files with 652 additions and 227 deletions
Download patch file Download diff file Expand all files Collapse all files

7
src/bin/BinVisualizerV2.tsx
View file

@ -1434,6 +1434,7 @@ export default function BinVisualizer(props: Props) {
const controls = () => {
if (bin.settings.inventory?.empty === true) return null;
const canEdit = permissions ? permissions.includes(pond.Permission.PERMISSION_WRITE) : false;
return (
<Box
height={1}
@ -1447,12 +1448,13 @@ export default function BinVisualizer(props: Props) {
<React.Fragment>
<Box display="flex" height={isMobile ? 35 : 40} marginBottom={1}>
<IconButton
disabled={!canEdit}
onClick={() => {
setGrainUpdate(true);
}}
style={{
margin: "auto",
backgroundColor: "gold",
backgroundColor: canEdit ? "gold" : "grey",
color: "black",
height: "100%",
width: isMobile ? 35 : 40
@ -1468,6 +1470,7 @@ export default function BinVisualizer(props: Props) {
alignContent="flex-end">
{fillPercentage !== null && (
<Slider
disabled={!canEdit}
orientation="vertical"
value={fillPercentage}
classes={{
@ -1477,7 +1480,7 @@ export default function BinVisualizer(props: Props) {
// thumb: isMobile ? classes.mobileSliderThumb : classes.sliderThumb,
valueLabel: classes.sliderValLabel,
}}
style={{ height: "100%", color: sliderColour }}
style={{ height: "100%", color: canEdit ? sliderColour : "gray" }}
min={0}
max={100}
valueLabelDisplay="auto"

2
src/charts/BinUtilizationChart.tsx
View file

@ -29,7 +29,7 @@ export default function BinUtilizationChart(props: Props) {
const theme = useTheme();
const grainColour = customColour ? customColour : GrainColour(grain);
return (
<Box height={1} width={1}>
<Box height={200} width={200}>
<CardActionArea
onClick={onClick}
style={{ height: "100%", borderRadius: theme.shape.borderRadius }}>

75
src/charts/SingleSetAreaChart.tsx
View file

@ -1,9 +1,10 @@
import { useTheme } from "@mui/material";
import moment from "moment";
import React, { useEffect, useState } from "react";
import React, { useEffect, useMemo, useState } from "react";
import {
Area,
AreaChart,
Legend,
ReferenceArea,
ReferenceLine,
ResponsiveContainer,
@ -13,25 +14,38 @@ import {
YAxis
} from "recharts";
import MaterialChartTooltip from "./MaterialChartTooltip";
import { blue, orange } from "@mui/material/colors";
import { Payload } from "recharts/types/component/DefaultLegendContent";
export interface SSAreaDataPoint {
timestamp: number;
value: number;
}
export interface ColourData {
colour: string,
label: string
}
interface Props {
data: SSAreaDataPoint[];
tooltipLabel: string
tooltipUnit?: string
yAxisLabel: string
maxRef?: number;
minRef?: number;
newXDomain?: number[] | string[];
multiGraphZoom?: (domain: number[] | string[]) => void;
colourAboveZero?: ColourData
colourBelowZero?: ColourData
}
export default function SingleSetAreaChart(props: Props) {
const { data, maxRef, minRef, newXDomain, multiGraphZoom } = props;
const { data, maxRef, minRef, newXDomain, multiGraphZoom, yAxisLabel, colourAboveZero, colourBelowZero, tooltipLabel, tooltipUnit } = props;
const [xDomain, setXDomain] = useState<string[] | number[]>(["dataMin", "dataMax"]);
const [refLeft, setRefLeft] = useState<number | undefined>();
const [refRight, setRefRight] = useState<number | undefined>();
const [legendPayload, setLegendPayload] = useState<Payload[]>([])
const theme = useTheme();
const now = moment();
@ -41,6 +55,40 @@ export default function SingleSetAreaChart(props: Props) {
}
}, [newXDomain]);
useEffect(() => {
let legend: Payload[] = []
if(colourAboveZero){
legend.push({
value: colourAboveZero.label,
color: colourAboveZero.colour,
id: colourAboveZero.label,
type: "square"
})
}
if(colourBelowZero){
legend.push({
value: colourBelowZero.label,
color: colourBelowZero.colour,
id: colourBelowZero.label,
type: "square"
})
}
setLegendPayload(legend)
}, [colourAboveZero, colourBelowZero])
const gradientOffset = useMemo(() => {
if (!data.length) return 0;
const values = data.map(p => p.value);
const max = Math.max(...values);
const min = Math.min(...values);
if (max <= 0) return 0;
if (min >= 0) return 1;
return max / (max - min);
}, [data]);
const zoom = () => {
let newDomain: number[] | string[] = ["dataMin", "dataMax"];
if (refLeft && refRight && refLeft !== refRight) {
@ -75,12 +123,16 @@ export default function SingleSetAreaChart(props: Props) {
setRefRight(undefined);
zoom();
}}>
<Legend
verticalAlign="top"
payload={legendPayload}
/>
<Tooltip
animationEasing="ease-out"
cursor={{ fill: theme.palette.text.primary, opacity: "0.15" }}
labelFormatter={timestamp => moment(timestamp).format("lll")}
content={(props: TooltipProps<any, any>) => (
<MaterialChartTooltip {...props} valueFormatter={value => `${value}`} />
<MaterialChartTooltip {...props} valueFormatter={value => `${value}` + (tooltipUnit ? tooltipUnit : "")} />
)}
/>
<XAxis
@ -102,13 +154,26 @@ export default function SingleSetAreaChart(props: Props) {
type="number"
domain={["auto", "auto"]}
label={{
value: "Mass Flow (kg/s)",
value: yAxisLabel,
position: "insideLeft",
angle: -90,
fill: theme.palette.text.primary
}}
/>
<Area dataKey={"value"} strokeWidth={3} />
<defs>
{colourAboveZero && colourBelowZero &&
<linearGradient id="solidColour" x1="0" y1="0" x2="0" y2="1">
<stop offset={gradientOffset} stopColor={colourAboveZero.colour} stopOpacity="75%" />
<stop offset={gradientOffset} stopColor={colourBelowZero.colour} stopOpacity="75%" />
</linearGradient>
}
</defs>
<Area dataKey={"value"} strokeWidth={3}
type="monotone"
name={tooltipLabel}
stroke={(colourAboveZero && colourBelowZero) && "url(#solidColour)"}
fill={(colourAboveZero && colourBelowZero) && "url(#solidColour)"}
/>
<ReferenceLine
ifOverflow="extendDomain"
y={maxRef}

11
src/common/FileUploads/FileSelector.tsx
View file

@ -9,7 +9,7 @@ import {
Typography
} from "@mui/material";
import { useFileControllerAPI, useGlobalState } from "providers";
import { useState } from "react";
import { useEffect, useState } from "react";
import ErrorIcon from "@mui/icons-material/Error";
import CheckCircleOutlineIcon from "@mui/icons-material/CheckCircleOutline";
import { getThemeType } from "theme";
@ -25,6 +25,7 @@ interface Props {
uniqueID?: string;
keys?: string[];
types?: string[];
hasFilePermission: boolean;
}
const useStyles = makeStyles((theme: Theme) => {
@ -53,8 +54,8 @@ const useStyles = makeStyles((theme: Theme) => {
});
export default function FileSelector(props: Props) {
const { uploadEnd, uploadStart, uniqueID, toAttach, keys, types } = props;
const [{ userTeamPermissions }] = useGlobalState();
const { uploadEnd, uploadStart, uniqueID, toAttach, keys, types, hasFilePermission } = props;
// const [{ userTeamPermissions }] = useGlobalState();
const [fileList, setFileList] = useState<FileList | undefined>();
const classes = useStyles();
const fileAPI = useFileControllerAPI();
@ -142,7 +143,7 @@ export default function FileSelector(props: Props) {
disabled={
uploading ||
(!uploadFailed && fileID !== "") ||
!userTeamPermissions.includes(pond.Permission.PERMISSION_FILE_MANAGEMENT)
!hasFilePermission
}
multiple={false}
name={uniqueID || "fileInput"}
@ -163,7 +164,7 @@ export default function FileSelector(props: Props) {
<label
htmlFor={uniqueID || "fileInput"}
className={
userTeamPermissions.includes(pond.Permission.PERMISSION_FILE_MANAGEMENT)
hasFilePermission
? classes.fileSelect
: classes.fileDisabled
}>

5
src/common/FileUploads/FileUploader.tsx
View file

@ -10,19 +10,22 @@ interface Props {
uploadEnd: (fileID?: string, fileName?: string) => void;
keys?: string[];
types?: string[];
hasFilePermission: boolean
}
export default function FileUploader(props: Props) {
const { uploadStart, uploadEnd, startingSelectorCount, toAttach, keys, types } = props;
const { uploadStart, uploadEnd, startingSelectorCount, toAttach, keys, types, hasFilePermission } = props;
const [numSelectors, setNumSelectors] = useState(startingSelectorCount || 1);
const [selectors, setSelectors] = useState<JSX.Element[]>([]);
useEffect(() => {
let currentSelectors: JSX.Element[] = [];
for (let i = 0; i < numSelectors; i++) {
currentSelectors.push(
<Box key={i} margin={2}>
<FileSelector
hasFilePermission={hasFilePermission}
toAttach={toAttach}
keys={keys}
types={types}

2
src/contract/contractSettings.tsx
View file

@ -402,7 +402,7 @@ export default function ContractSettings(props: Props) {
borderRadius: 5,
margin: 20
}}>
Note: When delivering grain on contract from a field or a bin the Grain Types must match
Note: When delivering grain on contract from a field or a bin the Grain Types must match, if it is a custom type the names must match.
</Typography>
</Box>
<Grid

22
src/field/FieldList.tsx
View file

@ -6,26 +6,17 @@ import {
Button,
Grid2,
IconButton,
Paper,
Stack,
Tab,
Table,
TableBody,
TableCell,
TableContainer,
TableHead,
TableRow,
Tabs,
Typography
} from "@mui/material";
import React, { useCallback, useEffect, useState } from "react";
import { useMobile, useSnackbar, useUserAPI } from "hooks";
import { useMobile, useSnackbar } from "hooks";
import { useGlobalState, useFieldAPI, useJohnDeereProxyAPI, useCNHiProxyAPI } from "providers";
//import HarvestTable from "harvestPlan/HarvestTable";
import { Field, fieldScope, teamScope } from "models";
import { Field } from "models";
import GrainDescriber from "grain/GrainDescriber";
import { pond } from "protobuf-ts/pond";
import HarvestSettings from "harvestPlan/HarvestSettings";
import ResponsiveTable, { Column } from "common/ResponsiveTable";
import FieldMinimap from "./Fieldminimap";
import FieldActions from "./FieldActions";
@ -36,12 +27,6 @@ import ShareAllFields from "./ShareAllFields";
import EventBlocker from "common/EventBlocker";
import { useNavigate } from "react-router-dom";
interface TabPanelProps {
children?: React.ReactNode;
index: any;
value: any;
}
export default function FieldList() {
const [{ as }] = useGlobalState();
const isMobile = useMobile();
@ -50,7 +35,6 @@ export default function FieldList() {
const cnhAPI = useCNHiProxyAPI();
const { openSnack } = useSnackbar();
const [tabValue, setTabValue] = React.useState(0);
const [openHarvestSettings, setOpenHarvestSettings] = useState(false);
// const [fieldForPlan, setFieldForPlan] = useState(Field.create());
const [fields, setFields] = useState<Field[]>([]);
const [total, setTotal] = useState(0)
@ -235,7 +219,7 @@ const columns: Column<Field>[] = [
<Typography textAlign="center">{row.grainName()}</Typography>
<Typography textAlign="center">{row.acres()} Acres</Typography>
</Stack>
<Button variant="contained" color="primary">Go</Button>
<Button variant="contained" color="primary" fullWidth onClick={() => goTo(row)}>Go</Button>
</Grid2>
</Grid2>
</AccordionDetails>

152
src/gate/GateDeltaTempGraph.tsx Normal file
View file

@ -0,0 +1,152 @@
import { Box, Card, CardHeader, Grid2, Typography } from "@mui/material"
import { blue, orange } from "@mui/material/colors"
import SingleSetAreaChart, { SSAreaDataPoint } from "charts/SingleSetAreaChart"
import { useComponentAPI } from "hooks"
import { cloneDeep } from "lodash"
import { Component } from "models"
import { UnitMeasurement } from "models/UnitMeasurement"
import moment from "moment"
import { Moment } from "moment"
import { pond } from "protobuf-ts/pond"
import { quack } from "protobuf-ts/quack"
import { useGlobalState } from "providers"
import { useEffect, useState } from "react"
import { getTemperatureUnit } from "utils"
interface Props {
//the key for the temperature chain, this may be overhauled to only be a single node in the future for the outlet and the 'inlet' would be the ambient
deviceID: number
tempComponent: Component
ambient?: Component
start: Moment;
end: Moment;
}
export default function GateDeltaTempGraph(props: Props){
const {
tempComponent,
ambient,
deviceID,
start,
end
} = props
const [data, setData] = useState<SSAreaDataPoint[]>([])
const [{user}] = useGlobalState()
const componentAPI = useComponentAPI();
const [recent, setRecent] = useState<SSAreaDataPoint>()
const warmingColour = orange["500"]
const coolingColour = blue["500"]
/**
* the use effect will use the temp component passed in get the measurements, then use the first node and the last node to determine the difference,
* if there is only one node, or only one node is reading due to errors, then it will use that as both the inlet and outlet so the delta will be 0,
*
* //NOT IMPLEMENTED YET//
* if an ambient is passed in it will use the readings from the ambient as the inlet and the temp component as the outlet
*/
useEffect(()=>{
//get the measurements for the temp component
componentAPI.listUnitMeasurements(
deviceID,
tempComponent.key(),
start.toISOString(),
end.toISOString(),
500,
0,
"timestamp",
).then(resp => {
if(resp.data.measurements){
let tempCompMeasurements = resp.data.measurements.map(um => UnitMeasurement.any(um, user));
//if there is an ambient component, then treat the temp component like a single sensor and not a chain, and use the ambient measurements as the inlet
if(ambient){
//TODO: this is just an idea of how to handle a possible path for the overhaul of gates, if that is the route we take then this needs to be coded
}else{//else no ambient is passed in treat the temp component like a chain
let deltas: SSAreaDataPoint[] = []
tempCompMeasurements.forEach(um => {
if (um.type === quack.MeasurementType.MEASUREMENT_TYPE_TEMPERATURE){
um.values.forEach((nodes, index) => {
if (nodes.values && nodes.values.length > 0 && um.timestamps[index]){
//use the first node as the inlet
let inletNode = nodes.values[0]
//use the second node as the outlet, if there is an error or there is only one node then it will be used as both and the delta will be 0
let outletNode = nodes.values[nodes.values.length -1]
let newDelta: SSAreaDataPoint = {
value: Math.round((outletNode - inletNode)*100)/100,
timestamp: moment(um.timestamps[index]).valueOf(),
}
deltas.push(newDelta)
}
})
}
})
setData(deltas)
//use the components status to set the recent to show in the header of the card
let recent: SSAreaDataPoint | undefined
if(tempComponent.status.measurement){
tempComponent.status.measurement.forEach(um => {
if(um.type === quack.MeasurementType.MEASUREMENT_TYPE_TEMPERATURE){
let clone = cloneDeep(um)
let m = UnitMeasurement.create(clone, user)
if(m.values.length > 0){
let lastReading = m.values[m.values.length - 1]
if (lastReading.values.length > 0){
recent = {
value: lastReading.values[lastReading.values.length -1] - lastReading.values[0],
timestamp: moment(m.timestamps[m.values.length - 1]).valueOf()
}
}
}
}
})
}
setRecent(recent)
}
}
})
},[tempComponent, ambient, deviceID, start, end])
return (
<Card raised style={{ padding: 10, marginBottom: 15, marginTop: 15 }}>
<CardHeader
title={<Typography style={{ fontSize: 25, fontWeight: 650 }}>Delta Temp</Typography>}
subheader={
recent ?
(
<Grid2 container>
<Grid2 size={12}>
<span>
{"Delta Temp: "}
<span style={{ color: recent.value > 0 ? warmingColour : coolingColour, fontWeight: 500 }}>
{recent.value.toFixed(2) + (getTemperatureUnit() === pond.TemperatureUnit.TEMPERATURE_UNIT_FAHRENHEIT ? " °F" : " °C")}
</span>
<br />
</span>
</Grid2>
<Grid2 size={12}>
<Typography color="textSecondary" variant={"caption"}>
{moment(recent.timestamp).fromNow()}
</Typography>
</Grid2>
</Grid2>
)
: (
<Typography variant="body1" color="textPrimary">
No Data
</Typography>
)
}
/>
<SingleSetAreaChart
data={data}
tooltipLabel="Delta Temp"
tooltipUnit={getTemperatureUnit() === pond.TemperatureUnit.TEMPERATURE_UNIT_FAHRENHEIT ? " °F" : " °C"}
yAxisLabel={"Delta T" + (getTemperatureUnit() === pond.TemperatureUnit.TEMPERATURE_UNIT_FAHRENHEIT ? " °F" : " °C")}
colourAboveZero={{colour: warmingColour, label: "Heating"}}
colourBelowZero={{colour: coolingColour, label: "Cooling"}}/>
</Card>
)
}

48
src/gate/GateDevice.tsx
View file

@ -44,21 +44,33 @@ export default function GateDevice(props: Props) {
const [tempKey, setTempKey] = useState("");
const [pressureKey, setPressureKey] = useState("");
const [ambientKey, setAmbientKey] = useState("");
const [greenLightKey, setGreenLightKey] = useState("");
const [redLightKey, setRedLightKey] = useState("");
const { openSnack } = useSnackbar();
const [{ user }] = useGlobalState();
const [interactionDialog, setInteractionDialog] = useState(false);
const [densityTemp, setDensityTemp] = useState(0);
const isMobile = useMobile();
const [pcaState, setPCAState] = useState(false);
const [pcaFanOn, setPCAFanOn] = useState(false);
// const [pcaState, setPCAState] = useState(false);
// const [pcaFanOn, setPCAFanOn] = useState(false);
const [detail, setDetail] = useState<"sensors" | "analytics">("analytics");
const [lastAmbient, setLastAmbient] = useState(0);
const [lastTemps, setLastTemps] = useState({ t1: 0, t2: 0 });
const [lastPressures, setLastPressures] = useState({ p1: 0, p2: 0 });
useEffect(() => {
//addresses of controller LEDs on a V1 device
let redAddr = "3-1-512";
let greenAddr = "3-1-1024";
if (comprehensiveDevice.device) {
setDevice(Device.any(comprehensiveDevice.device));
//check if the device is a MiPCA V2 device since the lEDs will have different addresses
let dev = Device.create(comprehensiveDevice.device);
if (dev.settings.product === pond.DeviceProduct.DEVICE_PRODUCT_MIPCA_V2) {
redAddr = "3-1-256";
greenAddr = "3-1-512";
}
}
if (comprehensiveDevice.components) {
let components: Map<string, Component> = new Map<string, Component>();
@ -87,19 +99,24 @@ export default function GateDevice(props: Props) {
break;
case pond.GateComponentType.GATE_COMPONENT_TYPE_PRESSURE:
setPressureKey(c.key());
if (
c.status.measurement[0] &&
c.status.measurement[0].values[0] &&
c.status.measurement[0].values[0].values[1]
) {
setPCAFanOn(c.status.measurement[0].values[0].values[1] > 996); //apx 4 iwg
}
// if (
// c.status.measurement[0] &&
// c.status.measurement[0].values[0] &&
// c.status.measurement[0].values[0].values[1]
// ) {
// setPCAFanOn(c.status.measurement[0].values[0].values[1] > 996); //apx 4 iwg
// }
break;
default:
// type is unknown, do nothing
break;
}
}
if (c.locationString() === redAddr && c.subType() === 1) {
setRedLightKey(c.key());
} else if (c.locationString() === greenAddr && c.subType() === 1) {
setGreenLightKey(c.key());
}
});
setComponentOptions(components);
}
@ -328,8 +345,8 @@ export default function GateDevice(props: Props) {
ambientSelector={ambientSelector}
tempChainSelector={tempSelector}
pressureChainSelector={pressureSelector}
pcaState={pcaState}
pcaFanState={pcaFanOn}
pcaState={gate.status.pcaState}
// pcaFanState={pcaFanOn}
checkInTime={device.status.lastActive}
/>
<Button
@ -357,11 +374,14 @@ export default function GateDevice(props: Props) {
gate={gate}
display={detail}
compMap={componentOptions}
setPCAState={(state: boolean) => {
setPCAState(state);
}}
// setPCAState={(state: boolean) => {
// setPCAState(state);
// }}
ambient={ambientKey}
pressure={pressureKey}
tempChain={tempKey}
redKey={redLightKey}
greenKey={greenLightKey}
device={device.id()}
/>
</Grid>

26
src/gate/GateFlowGraph.tsx
View file

@ -25,7 +25,7 @@ interface Props {
ambient?: string;
newXDomain?: number[] | string[];
pressureComponent?: string;
setPCAState: (state: boolean) => void;
// setPCAState: (state: boolean) => void;
multiGraphZoom?: (domain: number[] | string[]) => void;
}
@ -55,7 +55,7 @@ export default function GateFlowGraph(props: Props) {
device,
ambient,
pressureComponent,
setPCAState,
// setPCAState,
start,
end,
newXDomain,
@ -131,22 +131,22 @@ export default function GateFlowGraph(props: Props) {
}
});
setRuntime(moment.duration(runtime));
let state = false;
if (
data.length > 1 &&
data[data.length - 1].value > gate.lowerFlow() &&
data[data.length - 1].value < gate.upperFlow()
) {
state = true;
}
setPCAState(state);
// let state = false;
// if (
// data.length > 1 &&
// data[data.length - 1].value > gate.lowerFlow() &&
// data[data.length - 1].value < gate.upperFlow()
// ) {
// state = true;
// }
// setPCAState(state);
}
setFlowData(data);
setLoadingChartData(false);
setRecent(recent);
});
}
}, [gateAPI, gate, ambient, pressureComponent, start, end, device, setPCAState, as]); // eslint-disable-line react-hooks/exhaustive-deps
}, [gateAPI, gate, ambient, pressureComponent, start, end, device, as]); // eslint-disable-line react-hooks/exhaustive-deps
const loadFlowEvents = () => {
if (ambient && pressureComponent) {
@ -209,6 +209,8 @@ export default function GateFlowGraph(props: Props) {
{flowData.length !== 0 ? (
<SingleSetAreaChart
data={flowData}
tooltipLabel="Flow"
yAxisLabel="Mass Flow (kg/s)"
maxRef={gate.upperFlow()}
minRef={gate.lowerFlow()}
newXDomain={newXDomain}

113
src/gate/GateGraphs.tsx
View file

@ -28,15 +28,19 @@ import { avg } from "utils";
import GateFlowGraph from "./GateFlowGraph";
import { makeStyles } from "@mui/styles";
import { cloneDeep } from "lodash";
import GateDeltaTempGraph from "./GateDeltaTempGraph";
interface Props {
gate: Gate;
display: "analytics" | "sensors";
compMap: Map<string, Component>;
device: string | number;
device: number;
pressure: string;
ambient: string;
setPCAState: (state: boolean) => void;
tempChain: string;
redKey: string;
greenKey: string;
// setPCAState: (state: boolean) => void;
}
const useStyles = makeStyles((theme: Theme) => ({
@ -60,7 +64,7 @@ const useStyles = makeStyles((theme: Theme) => ({
);
export default function GateGraphs(props: Props) {
const { gate, display, compMap, device, pressure, ambient, setPCAState } = props;
const { gate, display, compMap, device, pressure, ambient, tempChain, greenKey, redKey } = props;
const [{ as }] = useGlobalState();
const [xDomain, setXDomain] = useState<string[] | number[]>(["dataMin", "dataMax"]);
const [zoomed, setZoomed] = useState(false);
@ -270,44 +274,77 @@ export default function GateGraphs(props: Props) {
);
};
const sensorGraphs = () => {
const graphCard = (component: Component, unitMeasurements: UnitMeasurement[]) => {
return (
<Box>
{Array.from(compMeasurements.values()).map((compMeasurement, i) => {
let c = Component.create();
if (compMeasurement[0]) {
c = compMap.get(compMeasurement[0].componentId) ?? Component.create();
}
if (compMap.get(c.key())) {
return (
<Card raised key={i} style={{ padding: 10, marginBottom: 15 }}>
{graphHeader(c)}
{compMeasurement.map(um => {
if (um.values[0] && um.values[0].values.length > 1) {
return areaGraph(
um,
describeMeasurement(um.type, c.type(), c.subType()),
c.settings.smoothingAverages
);
} else {
return lineGraph(
um,
describeMeasurement(um.type, c.type(), c.subType()),
c.settings.smoothingAverages
);
}
})}
</Card>
<Card raised key={component.key()} style={{ padding: 10, marginBottom: 15 }}>
{graphHeader(component)}
{unitMeasurements.map(um => {
if (um.values[0] && um.values[0].values.length > 1) {
return areaGraph(
um,
describeMeasurement(um.type, component.type(), component.subType()),
component.settings.smoothingAverages
);
} else {
return <Box></Box>;
return lineGraph(
um,
describeMeasurement(um.type, component.type(), component.subType()),
component.settings.smoothingAverages
);
}
})}
</Box>
</Card>
);
};
}
/**
* This function creates the charts for the gate page using the MAIN components on the gate, and delta time, it DOES NOT show any other components that could be on the device
* @returns list of cards for the charts
*/
const sensorGraphs = () => {
const tempComp = compMap.get(tempChain)
let graphs: JSX.Element[] = []
//pressure
let pressureComp = compMap.get(pressure)
let pressureReadings = compMeasurements.get(pressure)
if(pressureComp && pressureReadings){
graphs.push(graphCard(pressureComp, pressureReadings))
}
if(tempComp){
graphs.push(
<GateDeltaTempGraph deviceID={device} start={startDate} end={endDate} tempComponent={tempComp}/>
)
}
//T/H chain
let tempReadings = compMeasurements.get(tempChain)
if(tempComp && tempReadings){
graphs.push(graphCard(tempComp, tempReadings))
}
//ambient
let ambientComp = compMap.get(ambient)
let ambientReadings = compMeasurements.get(ambient)
if (ambientComp && ambientReadings){
graphs.push(graphCard(ambientComp, ambientReadings))
}
//green
let greenComp = compMap.get(greenKey)
let greenReadings = compMeasurements.get(greenKey)
if (greenComp && greenReadings){
graphs.push(graphCard(greenComp, greenReadings))
}
//red
let redComp = compMap.get(redKey)
let redReadings = compMeasurements.get(redKey)
if (redComp && redReadings){
graphs.push(graphCard(redComp, redReadings))
}
return graphs
}
const analyticGraphs = () => {
let tempComp = compMap.get(tempChain)
return (
<Box>
<GateFlowGraph
@ -318,14 +355,18 @@ export default function GateGraphs(props: Props) {
gate={gate}
ambient={ambient}
pressureComponent={pressure}
setPCAState={(state: boolean) => {
setPCAState(state);
}}
// setPCAState={(state: boolean) => {
// setPCAState(state);
// }}
multiGraphZoom={domain => {
setXDomain(domain);
setZoomed(true);
}}
/>
{/* add a new chart here for the delta temp over time */}
{tempComp &&
<GateDeltaTempGraph deviceID={device} start={startDate} end={endDate} tempComponent={tempComp}/>
}
</Box>
);
};

234
src/gate/GateList.tsx
View file

@ -15,6 +15,11 @@ import { CheckCircleOutline, DoNotDisturb, ErrorOutline, HelpOutlineOutlined, Se
import { cloneDeep } from "lodash";
import moment from "moment";
import { pond } from "protobuf-ts/pond";
import { UnitMeasurement } from "models/UnitMeasurement";
import { quack } from "protobuf-ts/quack";
import { getTemperatureUnit } from "utils";
import { teal } from "@mui/material/colors";
import { react } from "@babel/types";
interface Props {
//gates: Gate[];
@ -47,6 +52,7 @@ export default function GateList(props: Props) {
const navigate = useNavigate();
const isMobile = useMobile();
const classes = useStyles();
const [{user}] = useGlobalState()
const [gateDialog, setGateDialog] = useState(false);
const [tablePage, setTablePage] = useState(0)
const [pageSize, setPageSize] = useState(10)
@ -104,6 +110,95 @@ export default function GateList(props: Props) {
}
}
// const lastOutletReading = (reading: pond.UnitMeasurementsForComponent[]) => {
// let outletDisplay = "--"
// let timeSince = "No Reading Yet"
// let color = ""
// reading.forEach(um => {
// let clone = cloneDeep(um)
// let measurement = UnitMeasurement.create(clone, user)
// if(measurement.type === quack.MeasurementType.MEASUREMENT_TYPE_TEMPERATURE || measurement.type === quack.MeasurementType.MEASUREMENT_TYPE_PRESSURE){
// let nodes = measurement.values[measurement.values.length-1].values
// outletDisplay = nodes[nodes.length-1].toFixed(2) + " " + measurement.unit
// timeSince = moment(measurement.timestamps[measurement.timestamps.length-1]).fromNow()
// color = measurement.colour
// }
// })
// if(isMobile){
// return (
// <React.Fragment>
// <Typography color={color}>{outletDisplay}</Typography>
// <Typography>{timeSince}</Typography>
// </React.Fragment>
// )
// }
// return (
// <Box padding={2}>
// <Box display="flex" justifyContent="space-between">
// <Typography>Value:</Typography>
// <Typography color={color}>{outletDisplay}</Typography>
// </Box>
// <Box display="flex" justifyContent="space-between">
// <Typography>Time:</Typography>
// <Typography>{timeSince}</Typography>
// </Box>
// </Box>
// )
// }
// const tempDisplay = (gate: Gate) => {
// let display = "--"
// if(gate.status.pcaState !== pond.PCAState.PCA_STATE_OFF){
// //only display it if the final temp is between -4 and 60 C, is a valid number, and is not exactly 0
// //0 is technically a valid number but the likely hood of the calculation being exactly 0 is negligible
// if (gate.status.finalTemp < 60 && gate.status.finalTemp > -40 && !isNaN(gate.status.finalTemp) && gate.status.finalTemp !== 0){
// display = getTemperatureUnit() === pond.TemperatureUnit.TEMPERATURE_UNIT_FAHRENHEIT ? CtoF(gate.status.finalTemp).toFixed(2) + "°F" : gate.status.finalTemp.toFixed(2) + "°C"
// }
// }
// return (
// <Typography>
// {display}
// </Typography>
// )
// }
const conditionDisplay = (gate: Gate) => {
console.log(gate)
let display = ""
let deltaTemp = 0
if(gate.status.pcaState === pond.PCAState.PCA_STATE_OFF){
display = "Inactive"
} else if (gate.status.pcaState === pond.PCAState.PCA_STATE_UNKNOWN){
display = "--"
} else { //the pca is currently active calulate the delta temp (T2 - T1) provided there are two temps
//loop to find the temp readings
let clone = cloneDeep(gate.status.lastTempReading)
clone.forEach(unitMeasurement => {
let um = UnitMeasurement.create(unitMeasurement, user)
if(um.type === quack.MeasurementType.MEASUREMENT_TYPE_TEMPERATURE){
if(um.values.length > 0){ //as long as there is at least on thing in the measurements
let lastReading = um.values[um.values.length-1] //there should only be one measurement in here but just make sure to get the end of the array
if(lastReading.values.length > 1){ //make sure there are at least two values in the array
console.log(lastReading.values)
deltaTemp = lastReading.values[lastReading.values.length -1] - lastReading.values[0] //subtract the first value from the last value to get the delta
}
}
}
})
display = deltaTemp.toFixed(2) + (getTemperatureUnit() === pond.TemperatureUnit.TEMPERATURE_UNIT_FAHRENHEIT ? "°F" : "°C")
}
return (
<Typography>
{display}
</Typography>
)
}
// const CtoF = (celsius: number) => {
// return Math.round((celsius * (9 / 5) + 32) * 100) / 100;
// };
const desktopCols = (): Column<Gate>[] => {
return [
{
@ -126,69 +221,61 @@ export default function GateList(props: Props) {
</Box>
)
},
{
title: "Duct Type",
render: gate => (
<Box padding={2}>
<Typography>
{gate.settings.ductName}
</Typography>
</Box>
)
},
{
title: "Duct Size(mm)",
render: gate => (
<Box padding={2}>
<Typography>
{gate.ductDiameter()}
</Typography>
</Box>
)
},
{
title: "Duct Length(m)",
render: gate => (
<Box padding={2}>
<Typography>
{gate.settings.ductLength}
</Typography>
</Box>
)
},
{
title: "PCA Unit",
render: gate => (
<Box padding={2}>
<Typography>
{gate.settings.pcaType}
</Typography>
</Box>
)
},
{
title: "PCA Status",
render: gate => (
<Box padding={2}>
render: gate => {
return (<Box padding={2}>
{displayPCAStatus(gate.status.pcaState)}
</Box>
)
</Box>)
}
},
{
title: "Last FLow",
render: gate => (
title: "Delta Temperature",
render: gate => {
return (
<Box padding={2}>
<Box display="flex" justifyContent="space-between">
<Typography>Last Flow:</Typography>
<Typography>{gate.status.lastMassAirflow.toFixed(2)}</Typography>
</Box>
<Box display="flex" justifyContent="space-between">
<Typography>Last Reading:</Typography>
<Typography>{gate.status.lastUpdate !== "" ? moment(gate.status.lastUpdate).fromNow() : "No Reading Yet"}</Typography>
</Box>
{conditionDisplay(gate)}
</Box>
)
}
)}
},
//taking out these columns for now because were not sure if the customer actually wants them
// {
// title: "Estimated Temp",
// render: gate => {
// return (
// <Box padding={2}>
// {tempDisplay(gate)}
// </Box>
// )
// }
// },
// {
// title: "Last FLow",
// render: gate => (
// <Box padding={2}>
// <Box display="flex" justifyContent="space-between">
// <Typography>Flow:</Typography>
// <Typography color={teal[500]}>{gate.status.lastMassAirflow.toFixed(2)} kg/s</Typography>
// </Box>
// <Box display="flex" justifyContent="space-between">
// <Typography>Read:</Typography>
// <Typography>{gate.status.lastUpdate !== "" ? moment(gate.status.lastUpdate).fromNow() : "No Reading Yet"}</Typography>
// </Box>
// </Box>
// )
// },
// {
// title: "Outlet Temperature",
// render: gate => (
// <Box>{lastOutletReading(gate.status.lastTempReading)}</Box>
// )
// },
// {
// title: "Outlet Pressure",
// render: gate => (
// <Box>{lastOutletReading(gate.status.lastPressureReading)}</Box>
// )
// }
]
}
const mobileCols = (): Column<Gate>[] => {
@ -224,33 +311,28 @@ export default function GateList(props: Props) {
<Typography>{terminalMap.get(gate.terminal()) ?? "None"}</Typography>
</Box>
<Box padding={2} display="flex" flexDirection="row" justifyContent="space-between">
<Typography>Duct Type:</Typography>
<Typography>{gate.ductName() !== "" ? gate.ductName() : "None"}</Typography>
<Typography>Delta Temperature:</Typography>
{conditionDisplay(gate)}
</Box>
<Box padding={2} display="flex" flexDirection="row" justifyContent="space-between">
<Typography>Duct Size(mm):</Typography>
<Typography>{gate.ductDiameter()}</Typography>
</Box>
<Box padding={2} display="flex" flexDirection="row" justifyContent="space-between">
<Typography>DuctLength(m):</Typography>
<Typography>{gate.ductLength()}</Typography>
</Box>
<Box padding={2} display="flex" flexDirection="row" justifyContent="space-between">
<Typography>PCA Unit:</Typography>
<Typography>{gate.settings.pcaType !== "" ? gate.settings.pcaType : "None"}</Typography>
{/* taking these out for now because we are not sure if the customer wants them */}
{/* <Box padding={2} display="flex" flexDirection="row" justifyContent="space-between">
<Typography>Estimated Temp:</Typography>
{tempDisplay(gate)}
</Box>
<Box padding={2} display="flex" flexDirection="row" justifyContent="space-between">
<Typography>Last Flow:</Typography>
<Typography>{gate.status.lastMassAirflow}</Typography>
</Box>
<Box padding={2} display="flex" flexDirection="row" justifyContent="space-between">
<Typography>Last Reading:</Typography>
<Typography color={teal[500]}>{gate.status.lastMassAirflow.toFixed(2)} kg/s</Typography>
<Typography>{gate.status.lastUpdate !== "" ? moment(gate.status.lastUpdate).fromNow() : "No PCA reading yet"}</Typography>
</Box>
<Box padding={2} display="flex" flexDirection="row" justifyContent="space-between">
<Typography>Outlet Temp:</Typography>
{lastOutletReading(gate.status.lastTempReading)}
</Box>
<Box padding={2} display="flex" flexDirection="row" justifyContent="space-between">
<Typography>Outlet Pressure:</Typography>
{lastOutletReading(gate.status.lastPressureReading)}
</Box> */}
</Box>
// <Typography variant="body2" color="textSecondary" sx={{ padding: 1 }}>
// </Typography>
)
}

30
src/gate/GateSVG.tsx
View file

@ -48,8 +48,8 @@ interface Props {
ambientSelector: () => JSX.Element;
tempChainSelector: () => JSX.Element;
pressureChainSelector: () => JSX.Element;
pcaState: boolean;
pcaFanState: boolean;
pcaState: pond.PCAState;
// pcaFanState: boolean;
checkInTime: string;
}
@ -63,7 +63,7 @@ export default function GateSVG(props: Props) {
tempChainSelector,
pressureChainSelector,
pcaState,
pcaFanState,
// pcaFanState,
checkInTime
} = props;
const classes = useStyles();
@ -242,16 +242,23 @@ export default function GateSVG(props: Props) {
return temp;
};
const finalTempDisplay = (temp: number) => {
let display = "--"
if(pcaState === pond.PCAState.PCA_STATE_IN_BOUNDS || pcaState === pond.PCAState.PCA_STATE_OUT_BOUNDS){
if(temp < 60 && temp > -40 && !isNaN(temp) && temp !== 0){
display = convertFinalTemp(finalTemp).toFixed(2) + (user.settings.temperatureUnit === pond.TemperatureUnit.TEMPERATURE_UNIT_FAHRENHEIT ? "°F" : "°C")
}
}
return display
}
const renderValues = () => {
let values: JSX.Element[] = [];
//add the final temp display to the array
values.push(
<g key={"finalTemp"} id={"finalTemp"} data-name={"finalTemp"}>
<text fontSize={7} className={classes.fontBase} x={100} y={85}>
{convertFinalTemp(finalTemp).toFixed(2)}
{user.settings.temperatureUnit === pond.TemperatureUnit.TEMPERATURE_UNIT_FAHRENHEIT
? "°F"
: "°C"}
{finalTempDisplay(finalTemp)}
</text>
</g>
);
@ -302,7 +309,8 @@ export default function GateSVG(props: Props) {
const pcaRed = () => {
return (
<g key={"pcaRed"} id={"pcaRed"} data-name={"pcaRed"}>
<circle cx={175} cy={152} r={8} fill={pcaFanState ? (pcaState ? "grey" : "red") : "grey"} />
{/* <circle cx={175} cy={152} r={8} fill={(pcaFanState && pcaState === pond.PCAState.PCA_STATE_OUT_BOUNDS) ? "red" : "grey"} /> */}
<circle cx={175} cy={152} r={8} fill={pcaState === pond.PCAState.PCA_STATE_OUT_BOUNDS ? "red" : "grey"} />
</g>
);
};
@ -314,7 +322,8 @@ export default function GateSVG(props: Props) {
cx={175}
cy={174}
r={8}
fill={pcaFanState ? (pcaState ? "green" : "grey") : "grey"}
//fill={(pcaFanState && pcaState === pond.PCAState.PCA_STATE_IN_BOUNDS) ? "green" : "grey"}
fill={pcaState === pond.PCAState.PCA_STATE_IN_BOUNDS ? "green" : "grey"}
/>
</g>
);
@ -324,7 +333,8 @@ export default function GateSVG(props: Props) {
return (
<g key={"fanStatus"}>
<text x={125} y={180} fontSize={5} className={classes.fontBase}>
PCA Fan: {pcaFanState ? "ON" : "OFF"}
{/* PCA Fan: {pcaFanState ? "ON" : "OFF"} */}
PCA Fan: {pcaState === pond.PCAState.PCA_STATE_OFF ? "OFF" : "ON"}
</text>
</g>
);

23
src/grain/GrainTransaction.tsx
View file

@ -14,8 +14,8 @@ import {
import FileUploader from "common/FileUploads/FileUploader";
import ResponsiveDialog from "common/ResponsiveDialog";
import SearchSelect, { Option } from "common/SearchSelect";
import { useMobile } from "hooks";
import { Bin, Field, Contract, GrainBag } from "models";
import { useMobile, useUserAPI } from "hooks";
import { Bin, Field, Contract, GrainBag, teamScope } from "models";
// import { Contract } from "models/Contract";
// import { GrainBag } from "models/GrainBag";
import moment from "moment";
@ -66,7 +66,7 @@ export default function GrainTransaction(props: Props) {
const binAPI = useBinAPI();
const grainBagAPI = useGrainBagAPI();
const fieldAPI = useFieldAPI();
const [{ as }] = useGlobalState();
const [{ as, user }] = useGlobalState();
const { openSnack } = useSnackbar();
const [grainChangeDialog, setGrainChangeDialog] = useState(false);
const [grainEntry, setGrainEntry] = useState("0");
@ -79,6 +79,8 @@ export default function GrainTransaction(props: Props) {
const [fieldsLoading, setFieldsLoading] = useState(false);
const [uploadingFile, setUploadingFile] = useState(false);
const [imageIDs, setImageIDs] = useState<string[]>([]);
const userAPI = useUserAPI();
const [filePermission, setFilePermission] = useState(false);
const closeDialogs = (confirmed: boolean, newTransaction?: pond.Transaction) => {
close();
@ -91,6 +93,20 @@ export default function GrainTransaction(props: Props) {
}
};
useEffect(()=>{
//if they are viewing as a team make sure they have file permission to the team for the transactions
if(as){
let scope = teamScope(as)
userAPI.getUser(user.id(), scope).then(resp => {
setFilePermission(resp.permissions.includes(pond.Permission.PERMISSION_FILE_MANAGEMENT))
});
}else{
//if they are not viewing as a team and they were able to open this window, they have edit permission to at least the one object they started the change with
//a transaction is a new object that permissions will not exist for yet so just allow them to do it
setFilePermission(true)
}
},[as])
//get the possible destinations/options (grainbags and bins)
useEffect(() => {
if (open) {
@ -527,6 +543,7 @@ export default function GrainTransaction(props: Props) {
<Box marginTop={1}>
{allowAttachmentUploads && (
<FileUploader
hasFilePermission={filePermission}
uploadEnd={fileID => {
if (fileID) {
let ids = imageIDs;

1
src/harvestPlan/HarvestPlanActions.tsx
View file

@ -161,6 +161,7 @@ export default function HarvestPlanActions(props: Props) {
update={updatePlan}
open={openState.settings}
plan={plan.key() !== "" ? plan : undefined}
permissions={permissions}
close={(refresh, updatedPlan) => {
setOpenState({ ...openState, settings: false });
if (refresh) {

12
src/harvestPlan/HarvestPlanDisplay.tsx
View file

@ -58,25 +58,25 @@ export default function HarvestPlanDisplay(props: Props) {
<Grid container direction="column">
<Grid className={classes.dark}>
<Box style={{ display: "flex", justifyContent: "space-between" }}>
<Typography variant="subtitle1">Break Even Yield:</Typography>
<Typography variant="subtitle1">Break Even Yield (acre):</Typography>
<Typography variant="subtitle1">
{(
{plan.bushelPrice() !== 0 ? (
(plan.totalEquipmentCost() + plan.totalMaterialCost()) /
plan.bushelPrice()
).toFixed(2)}{" "}
).toFixed(2) : 0}{" "}
BU
</Typography>
</Box>
</Grid>
<Grid className={classes.light}>
<Box style={{ display: "flex", justifyContent: "space-between" }}>
<Typography variant="subtitle1">Break Even Sales Price</Typography>
<Typography variant="subtitle1">Break Even Sales Price (BU):</Typography>
<Typography variant="subtitle1">
$
{(
{plan.yieldTarget() !== 0 ? (
(plan.totalEquipmentCost() + plan.totalMaterialCost()) /
plan.yieldTarget()
).toFixed(2)}
).toFixed(2) : 0}
</Typography>
</Box>
</Grid>

6
src/harvestPlan/HarvestPlanTable.tsx
View file

@ -11,6 +11,7 @@ import { getThemeType } from "theme"
interface Props {
field: Field
planSelected: (plan: HarvestPlan) => void
}
const useStyles = makeStyles((theme: Theme) => ({
@ -25,7 +26,7 @@ const useStyles = makeStyles((theme: Theme) => ({
}));
export default function HarvestPlanTable(props: Props){
const {field} = props
const {field, planSelected} = props
const harvestAPI = useHarvestPlanAPI()
const [page, setPage] = useState(0)
const [pageSize, setPageSize] = useState(10)
@ -114,6 +115,9 @@ export default function HarvestPlanTable(props: Props){
title={"Harvest Plans"}
resizeable
page={page}
onRowClick={(row) => {
planSelected(row)
}}
pageSize={pageSize}
rows={loadedPlans}
total={total}

29
src/harvestPlan/HarvestSettings.tsx
View file

@ -35,6 +35,7 @@ interface Props {
field: Field;
update?: boolean;
plan?: HarvestPlan;
permissions?: pond.Permission[]
}
const cropOptions = [
@ -160,7 +161,7 @@ const useStyles = makeStyles((theme: Theme) => ({
const steps = ["Pre-Seeding", "Seeding", "Post-Seeding", "Harvest", "Fall"];
export default function HarvestSettings(props: Props) {
const { open, plan, close, field, update } = props;
const { open, plan, close, field, update, permissions } = props;
const [{as}] = useGlobalState()
const [planKey, setPlanKey] = useState<string>();
const [newPlan, setNewPlan] = useState(HarvestPlan.create());
@ -177,6 +178,7 @@ export default function HarvestSettings(props: Props) {
const [variety, setVariety] = useState("");
const [harvestYear, setHarvestYear] = useState(new Date().getFullYear());
const [targetYield, setTargetYield] = useState(0);
const [actualYield, setActualYield] = useState(0);
const [price, setPrice] = useState("");
const [newTaskDialog, setNewTaskDialog] = useState(false);
const [type, setType] = useState("");
@ -184,10 +186,16 @@ export default function HarvestSettings(props: Props) {
const { openSnack } = useSnackbar();
const [deleteOpen, setDeleteOpen] = useState(false);
const loadTasks = useCallback(() => {
if (planKey) {
taskAPI.getMultiTasks([planKey], as).then(resp => {
setPlanTasks(resp.data.tasks.map(t => Task.any(t)));
if(resp.data.tasks){
setPlanTasks(resp.data.tasks.map(t => Task.any(t)));
}else{
setPlanTasks([])
}
});
}
}, [taskAPI, planKey, as]);
@ -197,7 +205,7 @@ export default function HarvestSettings(props: Props) {
}, [loadTasks]);
useEffect(() => {
if (!plan || (plan && plan.permissions.includes(pond.Permission.PERMISSION_WRITE))) {
if (!plan || (permissions && permissions.includes(pond.Permission.PERMISSION_WRITE))) {
setActiveStep(0);
} else {
setActiveStep(1);
@ -358,6 +366,7 @@ export default function HarvestSettings(props: Props) {
tempPlan.settings.grainType = variety;
tempPlan.settings.harvestYear = harvestYear;
tempPlan.settings.yieldTarget = targetYield;
tempPlan.settings.actualYield =
tempPlan.settings.bushelPrice = !isNaN(parseFloat(price))
? Math.round(parseFloat(price) * 100) / 100
: 0;
@ -411,7 +420,7 @@ export default function HarvestSettings(props: Props) {
key={0}
classes={{ root: classes.tab }}
disabled={
!planKey || !(plan && plan.permissions.includes(pond.Permission.PERMISSION_WRITE))
!planKey || !(permissions && permissions.includes(pond.Permission.PERMISSION_WRITE))
}
label={"General"}
aria-label={"general"}
@ -494,6 +503,16 @@ export default function HarvestSettings(props: Props) {
!isNaN(+e.target.value) && setTargetYield(+e.target.value);
}}
/>
<TextField
fullWidth
margin="normal"
type="number"
label="Actual Yield per acre"
value={actualYield}
onChange={e => {
!isNaN(+e.target.value) && setActualYield(+e.target.value);
}}
/>
<TextField
margin="dense"
id="bushPrice"
@ -710,7 +729,7 @@ export default function HarvestSettings(props: Props) {
<TaskSettings
task={taskToEdit}
hasCost
costTitle="Material Cost(acres)"
costTitle="Material Cost(acre)"
secondaryCostTitle="Equipment Cost(acre)"
objectKey={planKey}
type={type}

2
src/maps/mapDrawers/FieldDrawer.tsx
View file

@ -134,7 +134,7 @@ export default function FieldDrawer(props: Props) {
hPlanAPI
.listHarvestPlans(1, 0, "desc", "createDate", field.key(), as)
.then(resp => {
if (resp.data.harvestPlan.length > 0) {
if (resp.data.harvestPlan) {
let plan = resp.data.harvestPlan[0];
setHPlan(HarvestPlan.any(plan));
} else {

22
src/pages/Contracts.tsx
View file

@ -40,16 +40,18 @@ export default function Contracts() {
.then(resp => {
let contracts: Contract[] = [];
let contractPermissions: Map<string, pond.Permission[]> = new Map();
resp.data.contracts.forEach(contract => {
let c = Contract.create(contract);
contracts.push(c);
let p = pond.EvaluatePermissionsResponse.fromObject(
resp.data.contractPermissions[c.key()]
);
contractPermissions.set(c.key(), p.permissions);
});
setContracts(contracts);
setContractPermissions(contractPermissions);
if (resp.data.contracts){
resp.data.contracts.forEach(contract => {
let c = Contract.create(contract);
contracts.push(c);
let p = pond.EvaluatePermissionsResponse.fromObject(
resp.data.contractPermissions[c.key()]
);
contractPermissions.set(c.key(), p.permissions);
});
setContracts(contracts);
setContractPermissions(contractPermissions);
}
setLoading(false);
})
.catch(err => {});

4
src/pages/Field.tsx
View file

@ -227,7 +227,7 @@ export default function FieldPage() {
</Grid2>
<Grid2 size={8}>
<Card raised>
<HarvestPlanTable field={field}/>
<HarvestPlanTable field={field} planSelected={(plan) => {setHPlan(plan)}}/>
</Card>
</Grid2>
</Grid2>
@ -276,7 +276,7 @@ export default function FieldPage() {
</Card>
</Grid2>
<Grid2>
<HarvestPlanTable field={field}/>
<HarvestPlanTable field={field} planSelected={(plan) => {setHPlan(plan)}}/>
</Grid2>
</Grid2>
</TabPanel>

15
src/pages/Gate.tsx
View file

@ -134,7 +134,6 @@ export default function Gate(props: Props) {
gateAPI
.getGatePageData(id, as)
.then(resp => {
//console.log(resp.data);
let p = new Map<number, pond.GateDeviceType>();
Object.keys(resp.data.preferences).forEach(k => {
let prefKey = parseInt(k);
@ -192,7 +191,9 @@ export default function Gate(props: Props) {
const deviceDrawer = () => {
return (
<DeviceLinkDrawer
deviceTags={["omniair", "mipca"]}
//the mipca tag was not working for some reason so just taking the tags out
//and this way we dont have to worry about tagging them when they are provisioned
//deviceTags={["omniair", "mipca", "MiPCA", "Mipca"]}
devicePrefMap={devPrefs}
prefOptions={[
<MenuItem
@ -341,16 +342,14 @@ export default function Gate(props: Props) {
spacing={2}
alignItems="center"
alignContent="center">
<Grid>
<Grid size={12}>
<Box display="flex" justifyContent="center" alignItems="center">
<Link style={{ height: 50, width: 50 }} />
<Typography paddingLeft={2} style={{ fontSize: 25, fontWeight: 650 }}>
Connect Device
</Typography>
</Box>
</Grid>
<Grid>
<Typography style={{ fontSize: 25, fontWeight: 650 }}>
Connect Device
</Typography>
</Grid>
<Grid size={12}>
Click here to add a device to the gate. To add an additional device to a gate
use the "Link Device" icon on the top right side of this page

17
src/pages/PageContainer.tsx
View file

@ -9,9 +9,21 @@ const useStyles = makeStyles((theme: Theme) => ({
width: "100%",
overflowX: "hidden",
overflowY: "auto",
// height: `calc(100vh - 112px)`,
// [theme.breakpoints.up("sm")]: {
// height: `calc(100vh - 64px)`
// }
minHeight: 0,
height: `calc(100vh - 112px)`,
"@supports (height: 100dvh)": {
height: `calc(100dvh - 112px)`
},
[theme.breakpoints.up("sm")]: {
height: `calc(100vh - 64px)`
height: `calc(100vh - 64px)`,
"@supports (height: 100dvh)": {
height: `calc(100dvh - 64px)`
}
}
},
fullViewportContainer: {
@ -19,6 +31,9 @@ const useStyles = makeStyles((theme: Theme) => ({
top: 0,
left: 0,
height: "100vh",
"@supports (height: 100dvh)": {
height: "100dvh"
},
width: "100vw",
backgroundColor: theme.palette.background.default,
zIndex: 2000,

4
src/pbHelpers/ComponentTypes/Airflow.ts
View file

@ -33,13 +33,13 @@ export function Airflow(subtype: number = 0): ComponentTypeExtension {
let measurementTypes = [
{
measurementType: quack.MeasurementType.MEASUREMENT_TYPE_PPM,
measurementType: quack.MeasurementType.MEASUREMENT_TYPE_CFM,
label: cfm.label(),
colour: cfm.colour(),
graphType: cfm.graph()
} as ComponentMeasurement,
{
measurementType: quack.MeasurementType.MEASUREMENT_TYPE_VOLTAGE,
measurementType: quack.MeasurementType.MEASUREMENT_TYPE_SPEED,
label: velocity.label(),
colour: velocity.colour(),
graphType: velocity.graph()

2
src/pbHelpers/MeasurementDescriber.ts
View file

@ -453,7 +453,7 @@ export class MeasurementDescriber {
case quack.MeasurementType.MEASUREMENT_TYPE_SPEED:
let speedUnit = getDistanceUnit()
this.details.label = "Speed";
this.details.unit = speedUnit === pond.DistanceUnit.DISTANCE_UNIT_METERS ? "m/s" : "ft/m";
this.details.unit = speedUnit === pond.DistanceUnit.DISTANCE_UNIT_METERS ? "m/s" : "ft/m"; //yes this is meters per second and feet per minute
this.details.colour = green["500"];
this.details.path = "edgeTriggered.rises";
this.details.max = 500;

3
src/services/whiteLabel.ts
View file

@ -323,7 +323,8 @@ const whitelabels = new Map<string, WhiteLabel>([
["mivent", MIVENT_WHITE_LABEL],
["adaptiveconstruction", ADAPTIVE_CONSTRUCTION_WHITE_LABEL],
["omniair", OMNIAIR_WHITE_LABEL],
["mipca", MIPCA_WHITE_LABEL]
["mipca", MIPCA_WHITE_LABEL],
["mionetech", MIPCA_WHITE_LABEL]
]);
export function getWhitelabel(): WhiteLabel {

10
src/tasks/TaskCard.tsx
View file

@ -20,7 +20,7 @@ import Edit from "@mui/icons-material/Edit";
import DeleteIcon from "@mui/icons-material/Delete";
import { red } from "@mui/material/colors";
import { pond } from "protobuf-ts/pond";
import { taskScope } from "models/Scope";
import { taskScope, teamScope } from "models/Scope";
import EventBlocker from "common/EventBlocker";
interface Props {
@ -58,19 +58,22 @@ export default function TaskCard(props: Props) {
const [day, setDay] = useState(0);
const classes = useStyles();
const [permissions, setPermissions] = useState<pond.Permission[]>([]);
const [{ user }] = useGlobalState();
const [{ user, as }] = useGlobalState();
const userAPI = useUserAPI();
const [menuAnchorEl, setMenuAnchorEl] = useState<Element | null>(null);
const loadPermissions = useCallback(() => {
let scope = taskScope(props.task.key);
if(as){//if viewing as a team use the permissions to the team, and not the task itself
scope = teamScope(as)
}
userAPI
.getUser(user.id(), scope)
.then(resp => {
setPermissions(resp.permissions);
})
.catch(err => {});
}, [props.task, userAPI, user]);
}, [props.task, userAPI, user, as]);
useEffect(() => {
loadPermissions();
@ -176,3 +179,4 @@ export default function TaskCard(props: Props) {
</Card>
);
}