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

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

Browse source
This commit is contained in:
Carter 2025-04-24 12:00:08 -06:00
commit 860f730d88
22 changed files with 199 additions and 102 deletions
Download patch file Download diff file Expand all files Collapse all files

4
src/app/App.css
View file

@ -39,4 +39,8 @@ html, body, #root {
.MuiPopper-root {
z-index: 1501 !important;
}
.MuiPopover-root {
z-index: 1501 !important;
}

2
src/app/Header.tsx
View file

@ -125,7 +125,7 @@ export default function Header() {
</Toolbar>
</AppBar>
<SideNavigator open={navOpen} onOpen={() => {setNavOpen(true)}} onClose={() => {setNavOpen(false)}} />
{isMobile && <BottomNavigator setNavOpen={() => {setNavOpen(true)}} sideIsOpen={navOpen} />}
{isMobile && <BottomNavigator setNavOpen={isOpen => {setNavOpen(isOpen)}} sideIsOpen={navOpen} />}
</>
)
}

2
src/bin/BinSettings.tsx
View file

@ -2255,7 +2255,7 @@ export default function BinSettings(props: Props) {
}
return (
<DialogActions>
<Grid container justifyContent="space-between" direction="row">
<Grid container justifyContent="space-between" direction="row" width="100%">
<Grid size={{ xs: 5 }}>
{mode === "add" ? (
<Button

3
src/bin/BinVisualizerV2.tsx
View file

@ -153,7 +153,8 @@ const useStyles = makeStyles((theme: Theme) => {
sliderValLabel: {
height: 30,
width: 30,
//top: -15,
left: -5,
top: -20,
background: "transparent"
},
});

12
src/common/DisplayDrawer.tsx
View file

@ -45,9 +45,10 @@ const useStyles = makeStyles((theme: Theme) => ({
paddingBottom: 15,
zIndex: 101
},
appBar: {
titleDisplay: {
position: "static",
borderRadius: 30
borderRadius: 30,
backgroundColor: theme.palette.secondary.main
},
drawerPaper: {
overflowX: "hidden"
@ -91,7 +92,7 @@ export default function DisplayDrawer(props: Props) {
classes={{ paper: classes.drawerPaper }}>
<Box
className={isMobile ? classes.drawerMobile : classes.drawerDesktop}
style={{ width: isMobile ? "100%" : width, height: isMobile ? drawerHeight + "vh" : 0 }}>
style={{ width: isMobile ? "100%" : width }}>
<Box className={classes.header} style={{ width: isMobile ? "100%" : width }}>
<Box display="flex" justifyContent="space-between" alignItems="center">
<Box>
@ -118,10 +119,11 @@ export default function DisplayDrawer(props: Props) {
)}
</Box>
</Box>
<AppBar className={classes.appBar} color="secondary">
<Box className={classes.titleDisplay}>
<Grid
container
direction="row"
justifyContent="space-between"
alignItems="center"
wrap="nowrap">
<Grid>
@ -142,7 +144,7 @@ export default function DisplayDrawer(props: Props) {
</Button>
</Grid>
</Grid>
</AppBar>
</Box>
</Box>
<Box>{drawerBody}</Box>
</Box>

42
src/device/DeviceViewer.tsx
View file

@ -12,7 +12,7 @@ import {
useDeviceAPI,
useInteractionsAPI,
useSnackbar,
//useUsageAPI,
useUsageAPI,
useUserAPI
} from "hooks";
import { cloneDeep } from "lodash";
@ -74,7 +74,7 @@ export default function Device(props: Props) {
const deviceAPI = useDeviceAPI();
const componentAPI = useComponentAPI();
const interactionsAPI = useInteractionsAPI();
//const usageAPI = useUsageAPI();
const usageAPI = useUsageAPI();
const userAPI = useUserAPI();
const [isLoading, setIsLoading] = useState<boolean>(false);
const [device, setDevice] = useState<DeviceModel>(DeviceModel.create());
@ -147,25 +147,25 @@ export default function Device(props: Props) {
error(err);
})
.finally(() => setIsLoading(false));
// usageAPI
// .getUsage(deviceID, moment().subtract(1, "days"))
// .then((res: any) => {
// let usage = res.data;
// if (usage) {
// let rCellularStatus = "active";
// let rCellularUsage = 0;
// let sessions: any[] = [];
// if (usage.sessions) {
// sessions = usage.sessions.filter((session: any) => {
// return moment(session.begin).isAfter(moment().subtract(1, "days"));
// });
// }
// sessions.forEach((session: any) => (rCellularUsage += Number(or(session.bytes, 0))));
// setCellularStatus(rCellularStatus);
// setCellularUsage(rCellularUsage);
// }
// })
// .catch(err => {});
usageAPI
.getUsage(deviceID, moment().subtract(1, "days"))
.then((res: any) => {
let usage = res.data;
if (usage) {
let rCellularStatus = "active";
let rCellularUsage = 0;
let sessions: any[] = [];
if (usage.sessions) {
sessions = usage.sessions.filter((session: any) => {
return moment(session.begin).isAfter(moment().subtract(1, "days"));
});
}
sessions.forEach((session: any) => (rCellularUsage += Number(or(session.bytes, 0))));
setCellularStatus(rCellularStatus);
setCellularUsage(rCellularUsage);
}
})
.catch(err => {});
}, [componentAPI, props.device, deviceID, error, interactionsAPI, /*usageAPI*/, userAPI, user, as]);
useEffect(() => {

3
src/device/DeviceWizard.tsx
View file

@ -210,13 +210,14 @@ export default function DeviceWizard(props: Props) {
};
const setupCard = () => {
const deviceIcon = GetDeviceProductIcon(device)
return (
<Card className={classes.card} raised>
<CardHeader
avatar={
<Avatar
variant="square"
src={GetDeviceProductIcon(device.settings)}
src={deviceIcon}
className={classes.avatarIcon}
alt={"devIcon"}
/>

30
src/grainBag/grainBagVisualizer.tsx
View file

@ -53,29 +53,6 @@ const useStyles = makeStyles((theme: Theme) => {
position: "relative",
width: "auto",
marginRight: theme.spacing(1)
},
sliderRoot: {},
sliderThumb: {
left: 23
},
mobileSliderThumb: {
left: 28
},
sliderTrack: {
height: "100%",
},
sliderRail: {
height: "100%",
},
sliderValLabel: {
// left: -20,
height: 30,
width: 30,
top: -15,
background: "transparent"
},
sliderLabel: {
background: "gold"
}
});
});
@ -279,13 +256,6 @@ export default function GrainBagVisualizer(props: Props) {
<Slider
orientation="vertical"
value={fillLevel}
classes={{
root: classes.sliderRoot,
rail: classes.sliderRail,
track: classes.sliderTrack,
thumb: isMobile ? classes.mobileSliderThumb : classes.sliderThumb,
valueLabel: classes.sliderValLabel,
}}
style={{height: "100%", color: sliderColour }}
min={0}
max={100}

2
src/hooks/index.ts
View file

@ -20,7 +20,7 @@ export {
// useSecurity,
useSnackbar,
// useTagAPI,
// useUsageAPI,
useUsageAPI,
useUserAPI
} from "providers";
export * from "./useDebounce";

1
src/maps/MapBase.tsx
View file

@ -584,6 +584,7 @@ export default function MapBase(props: Props) {
{tools()}
{mapStyleDialog()}
<Map
style={{width: "100%", height: "100%"}}
ref={mapRef}
maxZoom={18}
initialViewState={startingView}

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

@ -230,12 +230,12 @@ export default function FieldDrawer(props: Props) {
{field.fieldName()} Details
</Typography>
</Box>
<Grid container direction="column" alignItems="center">
<Grid container direction="row" className={classes.dark}>
<Grid container direction="column" alignItems="center" width="100%">
<Grid container direction="row" justifyContent="space-between" width="100%" className={classes.dark}>
<Grid>Approximate Area:</Grid>
<Grid>{field.acres()}ac</Grid>
</Grid>
<Grid container direction="row" className={classes.light}>
<Grid container direction="row" justifyContent="space-between" width="100%" className={classes.light}>
<Grid>Grain:</Grid>
<Grid>
{field.grain() === pond.Grain.GRAIN_CUSTOM
@ -243,11 +243,11 @@ export default function FieldDrawer(props: Props) {
: GrainDescriber(field.crop()).name}
</Grid>
</Grid>
<Grid container direction="row" className={classes.dark}>
<Grid container direction="row" justifyContent="space-between" width="100%" className={classes.dark}>
<Grid>Grain Variant:</Grid>
<Grid>{field.settings.grainSubtype}</Grid>
</Grid>
<Grid container direction="row" className={classes.light}>
<Grid container direction="row" justifyContent="space-between" width="100%" className={classes.light}>
<Grid>Land Location:</Grid>
<Grid>{field.landLoc()}</Grid>
</Grid>

2
src/pages/AviationMap.tsx
View file

@ -6,7 +6,7 @@ export default function AviationMap() {
const location = useLocation();
return (
<PageContainer>
<PageContainer padding={-1}>
{location.state !== undefined &&
location.state !== null &&
location.state.long !== undefined &&

9
src/pages/Bin.tsx
View file

@ -43,7 +43,6 @@ import BindaptIcon from "products/Bindapt/BindaptIcon";
import Close from "@mui/icons-material/Close";
import Chat from "chat/Chat";
import TasksIcon from "products/Construction/TasksIcon";
// import TaskViewer from "tasks/TaskViewer";
import FieldsIcon from "products/AgIcons/FieldsIcon";
import BinComponentTypes from "bin/BinComponentTypes";
import { Plenum } from "models/Plenum";
@ -66,6 +65,7 @@ import BinConditioningCard from "bin/BinConditioningCard";
import { makeStyles, styled } from "@mui/styles";
import { useNavigate, useParams } from "react-router-dom";
import { Controller } from "models/Controller";
import TaskViewer from "tasks/TaskViewer";
interface TabPanelProps {
children?: React.ReactNode;
@ -547,10 +547,11 @@ export default function Bin(props: Props) {
};
const tasks = () => {
console.log(showTasks())
if (showTasks()) {
return (
<React.Fragment>
{/* <TaskViewer drawerView objectKey={binID} loadKeys={[binID]} /> */}
<TaskViewer drawerView objectKey={binID} loadKeys={[binID]} />
</React.Fragment>
);
}
@ -1144,11 +1145,11 @@ export default function Bin(props: Props) {
anchor="right"
classes={{ paper: classes.drawerPaper }}
onClose={() => setTaskDrawer(false)}>
<Box paddingTop={10}>
<Box>
<IconButton style={{ width: 50 }} onClick={() => setTaskDrawer(false)}>
<Close />
</IconButton>
{/* <TaskViewer drawerView objectKey={binID} loadKeys={[binID]} /> */}
<TaskViewer drawerView objectKey={binID} loadKeys={[binID]} />
</Box>
</Drawer>
)}

2
src/pages/ConstructionSiteMap.tsx
View file

@ -6,7 +6,7 @@ export default function ConstructionSiteMap() {
const location = useLocation();
return (
<PageContainer>
<PageContainer padding={-1}>
{location.state !== undefined &&
location.state !== null &&
location.state.long !== undefined &&

15
src/pages/Device.tsx
View file

@ -20,6 +20,7 @@ import { sameComponentID, sortComponents } from "pbHelpers/Component";
import { isController } from "pbHelpers/ComponentType";
import { or } from "utils";
import ComponentDiagnostics from "component/ComponentDiagnostics";
import DeviceWizard from "device/DeviceWizard";
export default function DevicePage() {
const deviceAPI = useDeviceAPI()
@ -358,16 +359,16 @@ export default function DevicePage() {
</li>
<Divider component="li" />
<ListItem>
<Grid container direction="row" spacing={2}>
<Grid container direction="row" spacing={2} width={"100%"}>
{isMobile ? (
<>
<Grid size={{ xs: 12 }}>
{/* <DeviceWizard
<DeviceWizard
device={device}
//permissions={permissions}
components={Array.from(components.values())}
refreshCallback={load}
/> */}
refreshCallback={loadDevice}
/>
</Grid>
{diagnosticComponents.map(comp => (
<Grid size={{ xs: 12 }} key={comp.key()}>
@ -382,12 +383,12 @@ export default function DevicePage() {
) : (
<>
<Grid size={{ xs: 6, sm: 6, lg: 4, xl: 3 }} >
{/* <DeviceWizard
<DeviceWizard
device={device}
//permissions={permissions}
components={Array.from(components.values())}
refreshCallback={load}
/> */}
refreshCallback={loadDevice}
/>
</Grid>
<Grid size={{ xs: 6, sm: 6, lg: 8, xl: 9 }} >
<Grid container direction="row" spacing={2}>

2
src/pages/FieldMap.tsx
View file

@ -5,7 +5,7 @@ import { useLocation } from "react-router";
export default function FieldMap() {
const location = useLocation();
return (
<PageContainer>
<PageContainer padding={-1}>
{location.state !== undefined &&
location.state !== null &&
location.state.long !== undefined &&

6
src/pages/Gate.tsx
View file

@ -87,7 +87,7 @@ export default function Gate(props: Props) {
//const match = useRouteMatch<MatchParams>();
//const gateID = props.gateID ?? match.params.gateID;
const { gateKey } = props
const gateID = gateKey ?? useParams<{ gateID: string }>()?.gateID ?? "";
const gateID = gateKey ?? useParams<{ gateKey: string }>()?.gateKey ?? "";
const classes = useStyles();
const gateAPI = useGateAPI();
const userAPI = useUserAPI();
@ -115,13 +115,17 @@ export default function Gate(props: Props) {
};
useEffect(() => {
console.log(gateID)
let key = gateID;
let kind = "gate";
if (as) {
key = as;
kind = "team";
}
console.log(key)
console.log(kind)
userAPI.getUser(user.id(), { key: key, kind: kind } as Scope).then(resp => {
console.log(resp)
setPermissions(resp.permissions);
});
}, [as, gateID, userAPI, user]);

2
src/providers/index.ts
View file

@ -30,7 +30,7 @@ export {
useTeamAPI,
useImagekitAPI,
useTaskAPI, //TODO: update api with resolve, reject
// useUsageAPI,
useUsageAPI,//TODO: update api with resolve, reject
useUserAPI,
// useStripeAPI,
useDataDogProxyAPI,

8
src/providers/pond/pond.tsx
View file

@ -32,6 +32,7 @@ import PreferenceProvider, {usePreferenceAPI} from "./preferenceAPI";
import TaskProvider, { useTaskAPI } from "./taskAPI";
import DataDogProvider, { useDataDogProxyAPI } from "./datadogProxyAPI";
import ContractProvider, { useContractAPI } from "./contractAPI";
import UsageProvider, { useUsageAPI } from "./usageAPI";
// import NoteProvider from "providers/noteAPI";
export const pondURL = (partial: string, demo: boolean = false): string => {
@ -80,7 +81,9 @@ export default function PondProvider(props: PropsWithChildren<any>) {
<TaskProvider>
<DataDogProvider>
<ContractProvider>
{children}
<UsageProvider>
{children}
</UsageProvider>
</ContractProvider>
</DataDogProvider>
</TaskProvider>
@ -147,5 +150,6 @@ export {
usePreferenceAPI,
useTaskAPI,
useDataDogProxyAPI,
useContractAPI
useContractAPI,
useUsageAPI
};

99
src/providers/pond/usageAPI.tsx Normal file
View file

@ -0,0 +1,99 @@
import { useHTTP } from "hooks";
import moment from "moment";
import { useGlobalState } from "providers";
import { createContext, PropsWithChildren, useContext } from "react";
import { pondURL } from "./pond";
export interface IUsageAPIContext {
getUsage: (
deviceID: number | string,
startDate?: any,
demo?: boolean,
keys?: string[],
types?: string[]
) => Promise<any>;
getUsages: (deviceIDs: number[], startDate?: any) => Promise<any>;
listUsages: (startDate?: any) => Promise<any>;
}
export const UsageAPIContext = createContext<IUsageAPIContext>({} as IUsageAPIContext);
function usageQuery(deviceIDs?: number[], startDate?: any): string {
let query = "";
let symbol: "?" | "&" = "?";
if (deviceIDs && deviceIDs.length > 0) {
query = query.concat(symbol + "ids=" + deviceIDs.join(","));
symbol = "&";
}
if (startDate) {
let start = moment(startDate).toISOString();
query = query.concat(symbol + "start=" + start);
symbol = "&";
}
return query;
}
interface Props {}
export default function UsageProvider(props: PropsWithChildren<Props>) {
const { children } = props;
const { get } = useHTTP();
const [{ as }] = useGlobalState();
const getUsage = (
deviceID: number | string,
startDate?: any,
demo: boolean = false,
keys?: string[],
types?: string[]
) => {
if (as && !(types && types.length > 0 && types[0] === "team"))
return get(
pondURL(
"/devices/" +
deviceID +
"/usage" +
usageQuery(undefined, startDate) +
"&as=" +
as +
(keys ? "&keys=" + keys.toString() : "") +
(types ? "&types=" + types.toString() : ""),
demo
)
);
return get(
pondURL(
"/devices/" +
deviceID +
"/usage" +
usageQuery(undefined, startDate) +
(keys ? "&keys=" + keys.toString() : "") +
(types ? "&types=" + types.toString() : ""),
demo
)
);
};
const getUsages = (deviceIDs: number[], startDate?: any) => {
if (as) return get(pondURL("/usage/devices" + usageQuery(deviceIDs, startDate) + "&as=" + as));
return get(pondURL("/usage/devices" + usageQuery(deviceIDs, startDate)));
};
const listUsages = (startDate?: any) => {
if (as) return get(pondURL("/usage" + usageQuery(undefined, startDate) + "&as=" + as));
return get(pondURL("/usage" + usageQuery(undefined, startDate)));
};
return (
<UsageAPIContext.Provider
value={{
getUsage,
getUsages,
listUsages
}}>
{children}
</UsageAPIContext.Provider>
);
}
export const useUsageAPI = () => useContext(UsageAPIContext);

5
src/tasks/TaskSettings.tsx
View file

@ -19,6 +19,7 @@ import { useSnackbar, useUserAPI } from "hooks";
import { useEffect } from "react";
import { Task, teamScope, User } from "models";
import ColourPicker from "common/ColourPicker";
import ResponsiveDialog from "common/ResponsiveDialog";
interface Props {
open: boolean;
@ -159,7 +160,7 @@ export default function TaskSettings(props: Props) {
};
return (
<Dialog open={props.open} onClose={closeDialog}>
<ResponsiveDialog open={props.open} onClose={closeDialog}>
<DialogTitle id="form-dialog-title">New Task</DialogTitle>
<DialogContent>
<TextField
@ -346,6 +347,6 @@ export default function TaskSettings(props: Props) {
</Button>
)}
</DialogActions>
</Dialog>
</ResponsiveDialog>
);
}

40
src/teams/ObjectTeams.tsx
View file

@ -40,6 +40,7 @@ import { blue, red } from "@mui/material/colors";
import { useNavigate } from "react-router-dom";
import { makeStyles } from "@mui/styles";
import { Share, RemoveCircle as RemoveUserIcon } from "@mui/icons-material";
import CancelSubmit from "common/CancelSubmit";
const useStyles = makeStyles((theme: Theme) => {
const avatarBG = theme.palette.secondary["700" as keyof PaletteColor];
@ -547,22 +548,29 @@ export default function ObjectTeams(props: Props) {
const actions = () => {
return (
<Grid container direction="row" justifyContent="space-between">
<Grid size={{ xs: 4 }}></Grid>
<Grid size={{ xs: 8 }} container justifyContent="flex-end">
{!cardMode && (
<Button onClick={close} color="primary">
Cancel
</Button>
)}
{canManageUsers && (
<Button onClick={submit} color="primary" disabled={objectUsersUnchanged()}>
{cardMode ? "Update" : "Submit"}
</Button>
)}
</Grid>
</Grid>
);
<CancelSubmit
onCancel={close}
onSubmit={submit}
submitText={cardMode ? "Update" : "Submit"}
/>
)
// return (
// <Grid container direction="row" justifyContent="space-between">
// <Grid size={{ xs: 4 }}></Grid>
// <Grid size={{ xs: 8 }} container justifyContent="flex-end">
// {!cardMode && (
// <Button onClick={close} color="primary">
// Cancel
// </Button>
// )}
// {canManageUsers && (
// <Button onClick={submit} color="primary" disabled={objectUsersUnchanged()}>
// {cardMode ? "Update" : "Submit"}
// </Button>
// )}
// </Grid>
// </Grid>
// );
};
const dialogs = () => {