added preferred units back to the user settings menu
This commit is contained in:
parent
d3314a1ab9
commit
a43ff1a8ad
2 changed files with 165 additions and 10 deletions
|
|
@ -16,8 +16,6 @@ export default function AuthWrapper(props: Props) {
|
||||||
const url = new URL(window.location.href);
|
const url = new URL(window.location.href);
|
||||||
|
|
||||||
const isManualLoginPage = url.pathname.includes("/login");
|
const isManualLoginPage = url.pathname.includes("/login");
|
||||||
console.log(url.pathname)
|
|
||||||
console.log(isManualLoginPage)
|
|
||||||
|
|
||||||
if (isManualLoginPage) {
|
if (isManualLoginPage) {
|
||||||
const options: RedirectLoginOptions = {
|
const options: RedirectLoginOptions = {
|
||||||
|
|
@ -33,7 +31,7 @@ export default function AuthWrapper(props: Props) {
|
||||||
if (parsed.email && parsed.email !== "") {
|
if (parsed.email && parsed.email !== "") {
|
||||||
options.authorizationParams!.login_hint = parsed.email.toString(); // prefill email
|
options.authorizationParams!.login_hint = parsed.email.toString(); // prefill email
|
||||||
}
|
}
|
||||||
console.log(options.authorizationParams)
|
|
||||||
loginWithRedirect(options)
|
loginWithRedirect(options)
|
||||||
|
|
||||||
} else if (!isAuthenticated && !isLoading) {
|
} else if (!isAuthenticated && !isLoading) {
|
||||||
|
|
|
||||||
|
|
@ -10,7 +10,7 @@ import {
|
||||||
Textsms as TextIcon,
|
Textsms as TextIcon,
|
||||||
Contrast,
|
Contrast,
|
||||||
} from "@mui/icons-material";
|
} from "@mui/icons-material";
|
||||||
import { AppBar, Box, Button, Checkbox, CircularProgress, Collapse, Divider, FormControl, FormControlLabel, FormGroup, FormHelperText, FormLabel, Grid2, IconButton, List, ListItem, ListItemButton, ListItemIcon, ListItemText, Radio, RadioGroup, TextField, Theme, ToggleButton, ToggleButtonGroup, Toolbar, Tooltip, Typography } from "@mui/material";
|
import { AppBar, Box, Button, Checkbox, CircularProgress, Collapse, Divider, FormControl, FormControlLabel, FormGroup, FormHelperText, FormLabel, Grid2, IconButton, List, ListItem, ListItemButton, ListItemIcon, ListItemText, MenuItem, Radio, RadioGroup, TextField, Theme, ToggleButton, ToggleButtonGroup, Toolbar, Tooltip, Typography } from "@mui/material";
|
||||||
import ResponsiveDialog from "common/ResponsiveDialog";
|
import ResponsiveDialog from "common/ResponsiveDialog";
|
||||||
import UserAvatar from "./UserAvatar";
|
import UserAvatar from "./UserAvatar";
|
||||||
import { useGlobalState, useUserAPI } from "providers";
|
import { useGlobalState, useUserAPI } from "providers";
|
||||||
|
|
@ -26,8 +26,10 @@ import moment from "moment";
|
||||||
import { IconPicker } from "common/IconPicker";
|
import { IconPicker } from "common/IconPicker";
|
||||||
import { MuiTelInput } from "mui-tel-input";
|
import { MuiTelInput } from "mui-tel-input";
|
||||||
import { useThemeMode } from "theme/AppThemeProvider";
|
import { useThemeMode } from "theme/AppThemeProvider";
|
||||||
import ContractsIcon from "products/CommonIcons/contractIcon";
|
// import ContractsIcon from "products/CommonIcons/contractIcon";
|
||||||
|
import UnitsIcon from "@mui/icons-material/Category";
|
||||||
import { setThemeType } from "theme";
|
import { setThemeType } from "theme";
|
||||||
|
import { IsAdaptiveAgriculture } from "services/whiteLabel";
|
||||||
|
|
||||||
const useStyles = makeStyles((theme: Theme) => {
|
const useStyles = makeStyles((theme: Theme) => {
|
||||||
return ({
|
return ({
|
||||||
|
|
@ -77,8 +79,9 @@ export default function UserSettings(props: Props) {
|
||||||
const [profileExpanded, setProfileExpanded] = useState<boolean>(false);
|
const [profileExpanded, setProfileExpanded] = useState<boolean>(false);
|
||||||
const [avatarExpanded, setAvatarExpanded] = useState<boolean>(false);
|
const [avatarExpanded, setAvatarExpanded] = useState<boolean>(false);
|
||||||
const [notificationsExpanded, setNotificationsExpanded] = useState<boolean>(false);
|
const [notificationsExpanded, setNotificationsExpanded] = useState<boolean>(false);
|
||||||
|
const [unitsExpanded, setUnitsExpanded] = useState<boolean>(false);
|
||||||
const [avatarUrl, setAvatarUrl] = useState<string>("");
|
const [avatarUrl, setAvatarUrl] = useState<string>("");
|
||||||
const [themeValue, setThemeValue] = useState<"light" | "dark" | "system">(themeMode.mode)
|
// const [themeValue, setThemeValue] = useState<"light" | "dark" | "system">(themeMode.mode)
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
function changeIcon(icon: string | undefined) {
|
function changeIcon(icon: string | undefined) {
|
||||||
|
|
@ -362,6 +365,160 @@ export default function UserSettings(props: Props) {
|
||||||
setThemeType(theme)
|
setThemeType(theme)
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const changePressureUnit = (value: any) => {
|
||||||
|
let updatedUser = User.clone(user);
|
||||||
|
let pressureUnit: pond.PressureUnit;
|
||||||
|
switch (value) {
|
||||||
|
case 1:
|
||||||
|
pressureUnit = pond.PressureUnit.PRESSURE_UNIT_KILOPASCALS;
|
||||||
|
break;
|
||||||
|
case 2:
|
||||||
|
pressureUnit = pond.PressureUnit.PRESSURE_UNIT_INCHES_OF_WATER;
|
||||||
|
break;
|
||||||
|
default:
|
||||||
|
pressureUnit = pond.PressureUnit.PRESSURE_UNIT_UNKNOWN;
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
updatedUser.settings.pressureUnit = pressureUnit;
|
||||||
|
setUser(updatedUser);
|
||||||
|
};
|
||||||
|
|
||||||
|
const changeTemperatureUnit = (value: any) => {
|
||||||
|
let updatedUser = User.clone(user);
|
||||||
|
let temperatureUnit: pond.TemperatureUnit;
|
||||||
|
switch (value) {
|
||||||
|
case 1:
|
||||||
|
temperatureUnit = pond.TemperatureUnit.TEMPERATURE_UNIT_CELSIUS;
|
||||||
|
break;
|
||||||
|
case 2:
|
||||||
|
temperatureUnit = pond.TemperatureUnit.TEMPERATURE_UNIT_FAHRENHEIT;
|
||||||
|
break;
|
||||||
|
default:
|
||||||
|
temperatureUnit = pond.TemperatureUnit.TEMPERATURE_UNIT_UNKNOWN;
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
updatedUser.settings.temperatureUnit = temperatureUnit;
|
||||||
|
setUser(updatedUser);
|
||||||
|
};
|
||||||
|
|
||||||
|
const changeDistanceUnit = (value: any) => {
|
||||||
|
let updatedUser = User.clone(user);
|
||||||
|
let distanceUnit: pond.DistanceUnit;
|
||||||
|
switch (value) {
|
||||||
|
case 1:
|
||||||
|
distanceUnit = pond.DistanceUnit.DISTANCE_UNIT_FEET;
|
||||||
|
break;
|
||||||
|
case 2:
|
||||||
|
distanceUnit = pond.DistanceUnit.DISTANCE_UNIT_METERS;
|
||||||
|
break;
|
||||||
|
default:
|
||||||
|
distanceUnit = pond.DistanceUnit.DISTANCE_UNIT_UNKNOWN;
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
updatedUser.settings.distanceUnit = distanceUnit;
|
||||||
|
setUser(updatedUser);
|
||||||
|
};
|
||||||
|
|
||||||
|
const changeGrainUnit = (value: any) => {
|
||||||
|
let updatedUser = User.clone(user);
|
||||||
|
let grainUnit: pond.GrainUnit;
|
||||||
|
switch (value) {
|
||||||
|
case 1:
|
||||||
|
grainUnit = pond.GrainUnit.GRAIN_UNIT_BUSHELS;
|
||||||
|
break;
|
||||||
|
case 2:
|
||||||
|
grainUnit = pond.GrainUnit.GRAIN_UNIT_WEIGHT;
|
||||||
|
break;
|
||||||
|
default:
|
||||||
|
grainUnit = pond.GrainUnit.GRAIN_UNIT_UNKNOWN;
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
updatedUser.settings.grainUnit = grainUnit;
|
||||||
|
setUser(updatedUser);
|
||||||
|
};
|
||||||
|
|
||||||
|
const unitPreferences = () => {
|
||||||
|
const { pressureUnit, temperatureUnit, distanceUnit, grainUnit } = user.settings;
|
||||||
|
return (
|
||||||
|
<Grid2 container>
|
||||||
|
<Grid2 size={{ xs: 12 }}>
|
||||||
|
<TextField
|
||||||
|
select
|
||||||
|
fullWidth
|
||||||
|
id="pressureUnit"
|
||||||
|
name="pressureUnit"
|
||||||
|
label="Pressure Unit"
|
||||||
|
value={pressureUnit ? pressureUnit : pond.PressureUnit.PRESSURE_UNIT_INCHES_OF_WATER}
|
||||||
|
onChange={event => changePressureUnit(event.target.value)}
|
||||||
|
margin="normal"
|
||||||
|
variant="outlined"
|
||||||
|
InputLabelProps={{ shrink: true }}>
|
||||||
|
<MenuItem value={pond.PressureUnit.PRESSURE_UNIT_KILOPASCALS}>
|
||||||
|
Kilopascals (kPa)
|
||||||
|
</MenuItem>
|
||||||
|
<MenuItem value={pond.PressureUnit.PRESSURE_UNIT_INCHES_OF_WATER}>
|
||||||
|
Inches of Water (iwg)
|
||||||
|
</MenuItem>
|
||||||
|
</TextField>
|
||||||
|
</Grid2>
|
||||||
|
<Grid2 size={{ xs: 12 }}>
|
||||||
|
<TextField
|
||||||
|
select
|
||||||
|
fullWidth
|
||||||
|
id="temperatureUnit"
|
||||||
|
name="temperatureUnit"
|
||||||
|
label="Temperature Unit"
|
||||||
|
value={
|
||||||
|
temperatureUnit ? temperatureUnit : pond.TemperatureUnit.TEMPERATURE_UNIT_CELSIUS
|
||||||
|
}
|
||||||
|
onChange={event => changeTemperatureUnit(event.target.value)}
|
||||||
|
margin="normal"
|
||||||
|
variant="outlined"
|
||||||
|
InputLabelProps={{ shrink: true }}>
|
||||||
|
<MenuItem value={pond.TemperatureUnit.TEMPERATURE_UNIT_CELSIUS}>Celsius (°C)</MenuItem>
|
||||||
|
<MenuItem value={pond.TemperatureUnit.TEMPERATURE_UNIT_FAHRENHEIT}>
|
||||||
|
Fahrenheit (°F)
|
||||||
|
</MenuItem>
|
||||||
|
</TextField>
|
||||||
|
</Grid2>
|
||||||
|
<Grid2 size={{ xs: 12 }}>
|
||||||
|
<TextField
|
||||||
|
select
|
||||||
|
fullWidth
|
||||||
|
id="distanceUnit"
|
||||||
|
name="distanceUnit"
|
||||||
|
label="Distance Unit"
|
||||||
|
value={distanceUnit ? distanceUnit : pond.DistanceUnit.DISTANCE_UNIT_METERS}
|
||||||
|
onChange={event => changeDistanceUnit(event.target.value)}
|
||||||
|
margin="normal"
|
||||||
|
variant="outlined"
|
||||||
|
InputLabelProps={{ shrink: true }}>
|
||||||
|
<MenuItem value={pond.DistanceUnit.DISTANCE_UNIT_METERS}>Meters (m)</MenuItem>
|
||||||
|
<MenuItem value={pond.DistanceUnit.DISTANCE_UNIT_FEET}>Feet (ft)</MenuItem>
|
||||||
|
</TextField>
|
||||||
|
</Grid2>
|
||||||
|
{IsAdaptiveAgriculture() && (
|
||||||
|
<Grid2 size={{ xs: 12 }}>
|
||||||
|
<TextField
|
||||||
|
select
|
||||||
|
fullWidth
|
||||||
|
id="grainUnit"
|
||||||
|
name="grainUnit"
|
||||||
|
label="Grain Unit"
|
||||||
|
value={grainUnit ? grainUnit : pond.GrainUnit.GRAIN_UNIT_BUSHELS}
|
||||||
|
onChange={event => changeGrainUnit(event.target.value)}
|
||||||
|
margin="normal"
|
||||||
|
variant="outlined"
|
||||||
|
InputLabelProps={{ shrink: true }}>
|
||||||
|
<MenuItem value={pond.GrainUnit.GRAIN_UNIT_BUSHELS}>Bushels (bu)</MenuItem>
|
||||||
|
<MenuItem value={pond.GrainUnit.GRAIN_UNIT_WEIGHT}>Tonnes (mT)</MenuItem>
|
||||||
|
</TextField>
|
||||||
|
</Grid2>
|
||||||
|
)}
|
||||||
|
</Grid2>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
const themeToggle = () => {
|
const themeToggle = () => {
|
||||||
return (
|
return (
|
||||||
<ToggleButtonGroup
|
<ToggleButtonGroup
|
||||||
|
|
@ -453,15 +610,15 @@ export default function UserSettings(props: Props) {
|
||||||
</List>
|
</List>
|
||||||
</Collapse>
|
</Collapse>
|
||||||
|
|
||||||
{/* <Divider />
|
<Divider />
|
||||||
|
|
||||||
<ListItem button onClick={() => setUnitsExpanded(!unitsExpanded)}>
|
<ListItemButton onClick={() => setUnitsExpanded(!unitsExpanded)}>
|
||||||
<ListItemIcon>
|
<ListItemIcon>
|
||||||
<UnitsIcon />
|
<UnitsIcon />
|
||||||
</ListItemIcon>
|
</ListItemIcon>
|
||||||
<ListItemText primary="Preferred Units" />
|
<ListItemText primary="Preferred Units" />
|
||||||
{unitsExpanded ? <ExpandLess /> : <ExpandMore />}
|
{unitsExpanded ? <ExpandLess /> : <ExpandMore />}
|
||||||
</ListItem>
|
</ListItemButton>
|
||||||
<Collapse in={unitsExpanded} timeout="auto" unmountOnExit>
|
<Collapse in={unitsExpanded} timeout="auto" unmountOnExit>
|
||||||
<List component="div">
|
<List component="div">
|
||||||
<ListItem>
|
<ListItem>
|
||||||
|
|
@ -472,7 +629,7 @@ export default function UserSettings(props: Props) {
|
||||||
</List>
|
</List>
|
||||||
</Collapse>
|
</Collapse>
|
||||||
|
|
||||||
<Divider />
|
{/* <Divider />
|
||||||
|
|
||||||
<ListItem button onClick={() => setMapsExpanded(!mapsExpanded)}>
|
<ListItem button onClick={() => setMapsExpanded(!mapsExpanded)}>
|
||||||
<ListItemIcon>
|
<ListItemIcon>
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue