diff --git a/package-lock.json b/package-lock.json index baf369d..65ae1cc 100644 --- a/package-lock.json +++ b/package-lock.json @@ -43,6 +43,7 @@ "notistack": "^3.0.1", "openweathermap-ts": "^1.2.10", "protobuf-ts": "git+https://gitlab+deploy-token-50627:hv8mB4WkyvtjBpJKU1rN@gitlab.com/brandx/protobuf-ts.git#master", + "query-string": "^9.2.1", "react": "^18.3.1", "react-beautiful-dnd": "^13.1.1", "react-color": "^2.19.3", @@ -6374,10 +6375,11 @@ } }, "node_modules/@typescript-eslint/typescript-estree/node_modules/brace-expansion": { - "version": "2.0.1", - "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.1.tgz", - "integrity": "sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==", + "version": "2.0.2", + "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.2.tgz", + "integrity": "sha512-Jt0vHyM+jmUBqojB7E1NIYadt0vI0Qxjxd2TErW94wDz+E2LAm5vKMXXwg6ZZBTHPuUlDgQHKXvjGBdfcF1ZDQ==", "dev": true, + "license": "MIT", "dependencies": { "balanced-match": "^1.0.0" } @@ -6900,10 +6902,11 @@ } }, "node_modules/brace-expansion": { - "version": "1.1.11", - "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz", - "integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==", + "version": "1.1.12", + "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.12.tgz", + "integrity": "sha512-9T9UjW3r0UW5c1Q7GTwllptXwhvYmEzFhzMfZ9H7FQWt+uZePjZPjBP/W1ZEyZ1twGWom5/56TF4lPcqjnDHcg==", "dev": true, + "license": "MIT", "dependencies": { "balanced-match": "^1.0.0", "concat-map": "0.0.1" @@ -7616,6 +7619,15 @@ "resolved": "https://registry.npmjs.org/decimal.js-light/-/decimal.js-light-2.5.1.tgz", "integrity": "sha512-qIMFpTMZmny+MMIitAB6D7iVPEorVw6YQRWkvarTkT4tBeSLLiHzcwj6q0MmYSFCiVpiqPJTJEYIrpcPzVEIvg==" }, + "node_modules/decode-uri-component": { + "version": "0.4.1", + "resolved": "https://registry.npmjs.org/decode-uri-component/-/decode-uri-component-0.4.1.tgz", + "integrity": "sha512-+8VxcR21HhTy8nOt6jf20w0c9CADrw1O8d+VZ/YzzCt4bJ3uBjw+D1q2osAB8RnpwwaeYBxy0HyKQxD5JBMuuQ==", + "license": "MIT", + "engines": { + "node": ">=14.16" + } + }, "node_modules/decompress-response": { "version": "6.0.0", "resolved": "https://registry.npmjs.org/decompress-response/-/decompress-response-6.0.0.tgz", @@ -8370,10 +8382,11 @@ } }, "node_modules/filelist/node_modules/brace-expansion": { - "version": "2.0.1", - "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.1.tgz", - "integrity": "sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==", + "version": "2.0.2", + "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.2.tgz", + "integrity": "sha512-Jt0vHyM+jmUBqojB7E1NIYadt0vI0Qxjxd2TErW94wDz+E2LAm5vKMXXwg6ZZBTHPuUlDgQHKXvjGBdfcF1ZDQ==", "dev": true, + "license": "MIT", "dependencies": { "balanced-match": "^1.0.0" } @@ -8402,6 +8415,18 @@ "node": ">=8" } }, + "node_modules/filter-obj": { + "version": "5.1.0", + "resolved": "https://registry.npmjs.org/filter-obj/-/filter-obj-5.1.0.tgz", + "integrity": "sha512-qWeTREPoT7I0bifpPUXtxkZJ1XJzxWtfoWWkdVGqa+eCr3SHW/Ocp89o8vLvbUuQnadybJpjOKu4V+RwO6sGng==", + "license": "MIT", + "engines": { + "node": ">=14.16" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, "node_modules/find-root": { "version": "1.1.0", "resolved": "https://registry.npmjs.org/find-root/-/find-root-1.1.0.tgz", @@ -10923,6 +10948,23 @@ "node": ">=6" } }, + "node_modules/query-string": { + "version": "9.2.1", + "resolved": "https://registry.npmjs.org/query-string/-/query-string-9.2.1.tgz", + "integrity": "sha512-3jTGGLRzlhu/1ws2zlr4Q+GVMLCQTLFOj8CMX5x44cdZG9FQE07x2mQhaNxaKVPNmIDu0mvJ/cEwtY7Pim7hqA==", + "license": "MIT", + "dependencies": { + "decode-uri-component": "^0.4.1", + "filter-obj": "^5.1.0", + "split-on-first": "^3.0.0" + }, + "engines": { + "node": ">=18" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, "node_modules/queue": { "version": "6.0.2", "resolved": "https://registry.npmjs.org/queue/-/queue-6.0.2.tgz", @@ -12300,6 +12342,18 @@ "resolved": "https://registry.npmjs.org/splaytree-ts/-/splaytree-ts-1.0.2.tgz", "integrity": "sha512-0kGecIZNIReCSiznK3uheYB8sbstLjCZLiwcQwbmLhgHJj2gz6OnSPkVzJQCMnmEz1BQ4gPK59ylhBoEWOhGNA==" }, + "node_modules/split-on-first": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/split-on-first/-/split-on-first-3.0.0.tgz", + "integrity": "sha512-qxQJTx2ryR0Dw0ITYyekNQWpz6f8dGd7vffGNflQQ3Iqj9NJ6qiZ7ELpZsJ/QBhIVAiDfXdag3+Gp8RvWa62AA==", + "license": "MIT", + "engines": { + "node": ">=12" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, "node_modules/split-string": { "version": "3.1.0", "resolved": "https://registry.npmjs.org/split-string/-/split-string-3.1.0.tgz", diff --git a/package.json b/package.json index d297090..ee5b194 100644 --- a/package.json +++ b/package.json @@ -55,6 +55,7 @@ "notistack": "^3.0.1", "openweathermap-ts": "^1.2.10", "protobuf-ts": "git+https://gitlab+deploy-token-50627:hv8mB4WkyvtjBpJKU1rN@gitlab.com/brandx/protobuf-ts.git#master", + "query-string": "^9.2.1", "react": "^18.3.1", "react-beautiful-dnd": "^13.1.1", "react-color": "^2.19.3", diff --git a/src/navigation/Router.tsx b/src/navigation/Router.tsx index 9ef6d2c..29362ad 100644 --- a/src/navigation/Router.tsx +++ b/src/navigation/Router.tsx @@ -53,7 +53,7 @@ export const appendToUrl = (appendage: number | string) => { export default function Router() { - const { isAuthenticated, loginWithRedirect, isLoading } = useAuth0(); + const { /*isAuthenticated, loginWithRedirect,*/ isLoading } = useAuth0(); const whiteLabel = getWhitelabel(); const [{ user }] = useGlobalState(); @@ -283,12 +283,12 @@ export default function Router() { }; if (isLoading) return null; - if (!isAuthenticated) { - loginWithRedirect() - return ( - null - ) - } + // if (!isAuthenticated) { + // loginWithRedirect() + // return ( + // null + // ) + // } function ErrorFallback({ error }: { error: Error }) { return
Something went wrong: {error.stack}
; @@ -302,6 +302,7 @@ export default function Router() { {/* Redirects */} } /> + {/* } /> */} {/* } /> */} {/* } /> */} } /> diff --git a/src/navigation/SideNavigator.tsx b/src/navigation/SideNavigator.tsx index 591aa27..38a10cb 100644 --- a/src/navigation/SideNavigator.tsx +++ b/src/navigation/SideNavigator.tsx @@ -436,7 +436,7 @@ export default function SideNavigator(props: Props) { } - {isAg || isStreamline && + {(isAg || isStreamline) && } - } + } ) } diff --git a/src/pages/Login.tsx b/src/pages/Login.tsx new file mode 100644 index 0000000..3dc7d2f --- /dev/null +++ b/src/pages/Login.tsx @@ -0,0 +1,53 @@ +import { RedirectLoginOptions, useAuth0 } from "@auth0/auth0-react"; +// import { useAuth } from "hooks"; +import queryString from "query-string"; +import { useEffect } from "react"; +import { useLocation } from "react-router"; +// import Loading from "./Loading"; +import LoadingScreen from "app/LoadingScreen"; + +// interface Props { +// prevPath?: string; +// } + +export default function Login() { + // const { prevPath } = props; + const location = useLocation(); + const { loginWithRedirect } = useAuth0(); + + // const setRouteBeforeLogin = useCallback((): Promise => { + // return new Promise(function(resolve) { + // localStorage.setItem("routeBeforeLogin", prevPath ? prevPath : "/"); + // return resolve("success"); + // }); + // }, [prevPath]); + + useEffect(() => { + const options: RedirectLoginOptions = { + authorizationParams: {} // Initialize here + }; + + if (location && location.search) { + let parsed = queryString.parse(location.search); + + if (parsed.signup === "true") { + // if (options.authorizationParams) options.authorizationParams.screen_hint = "signup"; // 'signup' tells Auth0 to show the signup tab + options.authorizationParams!.screen_hint = "signup"; // 'signup' tells Auth0 to show the signup tab + options.authorizationParams!.prompt = "login"; + } + + if (parsed.email && parsed.email !== "") { + // if (options.authorizationParams) options.authorizationParams.login_hint = parsed.email.toString(); // prefill email + options.authorizationParams!.login_hint = parsed.email.toString(); // prefill email + } + } + + // setRouteBeforeLogin().finally(() => { + console.log(options.authorizationParams) + loginWithRedirect(options); + // }); + }, [location, loginWithRedirect]); + + // return ; + return ; +} diff --git a/src/pages/PageContainer.tsx b/src/pages/PageContainer.tsx index 0c78ed6..524fbbf 100644 --- a/src/pages/PageContainer.tsx +++ b/src/pages/PageContainer.tsx @@ -1,7 +1,7 @@ import { Container, SxProps, Theme } from "@mui/material"; import { makeStyles } from "@mui/styles"; import classNames from "classnames"; -import { useMobile } from "hooks"; +// import { useMobile } from "hooks"; import { PropsWithChildren } from "react"; const useStyles = makeStyles((theme: Theme) => ({ @@ -44,11 +44,11 @@ interface Props extends PropsWithChildren{ export const PageContainer: React.FunctionComponent = (props: Props) => { const classes = useStyles(); - const isMobile = useMobile(); + // const isMobile = useMobile(); const { children, fullViewport, isCenterCenter, sx } = props; // let fullViewport = false // let isCenterCenter = false - const spacing = props.spacing; + const spacing = props.spacing ? props.spacing : 2; return ( { setToken: React.Dispatch> + prevPath?: string } export default function AuthWrapper(props: Props) { - const { children, setToken } = props; - const { isLoading, loginWithRedirect, isAuthenticated, getAccessTokenSilently } = useAuth0(); - - useEffect(() => { - if (!isAuthenticated && !isLoading) { - loginWithRedirect(); - } - }, [isAuthenticated, loginWithRedirect, isLoading]); + const { children, setToken } = props; + const { isLoading, loginWithRedirect, isAuthenticated, getAccessTokenSilently } = useAuth0(); - useEffect(() => { - if (isAuthenticated) getAccessTokenSilently().then(t => { - if (t.length < 1) { - loginWithRedirect() - } - setToken(t) - }).catch(() => { - // No token, go back to login - loginWithRedirect() - }) - }, [setToken, isAuthenticated]) - return children; + useEffect(() => { + const url = new URL(window.location.href); + + const isManualLoginPage = url.pathname.includes("/login"); + + if (isManualLoginPage) { + const options: RedirectLoginOptions = { + authorizationParams: {} // Initialize here + }; + + let parsed = queryString.parse(url.search); + if (parsed.signup === "true") { + options.authorizationParams!.screen_hint = "signup"; + options.authorizationParams!.prompt = "login"; + } + + if (parsed.email && parsed.email !== "") { + options.authorizationParams!.login_hint = parsed.email.toString(); // prefill email + } + + loginWithRedirect(options) + + } else if (!isAuthenticated && !isLoading) { + loginWithRedirect(); + } + }, [isAuthenticated, loginWithRedirect, isLoading]); + + useEffect(() => { + if (isAuthenticated) getAccessTokenSilently().then(t => { + if (t.length < 1) { + loginWithRedirect() + } + setToken(t) + }).catch(() => { + // No token, go back to login + loginWithRedirect() + }) + }, [setToken, isAuthenticated]) + + return children; } \ No newline at end of file diff --git a/src/teams/TeamActions.tsx b/src/teams/TeamActions.tsx index 63b335e..f12f9dc 100644 --- a/src/teams/TeamActions.tsx +++ b/src/teams/TeamActions.tsx @@ -146,6 +146,7 @@ export default function TeamActions(props: Props) { permissions={permissions} isDialogOpen={openState.share} closeDialogCallback={() => setOpenState({ ...openState, share: false })} + useImitation={false} /> ({ accessIcon: { @@ -76,7 +75,7 @@ const useStyles = makeStyles((theme: Theme) => ({ export default function UserMenu() { - const { toggleMode } = useThemeMode() + // const { toggleMode } = useThemeMode() const [{ user, team, as }, dispatch] = useGlobalState(); const { loginWithRedirect } = useAuth0(); const classes = useStyles(); @@ -163,10 +162,6 @@ export default function UserMenu() { )} - - {}} className={classes.rightIcon} aria-label="Toggle Theme"> - - ); }; diff --git a/src/user/UserSettings.tsx b/src/user/UserSettings.tsx index 32beec2..ec86924 100644 --- a/src/user/UserSettings.tsx +++ b/src/user/UserSettings.tsx @@ -10,10 +10,10 @@ import { Textsms as TextIcon, Contrast, } 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 UserAvatar from "./UserAvatar"; -import { useGlobalState, useUserAPI } from "providers"; +import { useGlobalState, useSnackbar, useUserAPI } from "providers"; import { useEffect, useState } from "react"; import { makeStyles } from "@mui/styles"; import { blue } from "@mui/material/colors"; @@ -26,8 +26,11 @@ import moment from "moment"; import { IconPicker } from "common/IconPicker"; import { MuiTelInput } from "mui-tel-input"; 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 { IsAdaptiveAgriculture } from "services/whiteLabel"; +import { setDistanceUnit, setGrainUnit, setPressureUnit, setTemperatureUnit } from "utils"; const useStyles = makeStyles((theme: Theme) => { return ({ @@ -71,14 +74,16 @@ export default function UserSettings(props: Props) { const [sharing, setSharing] = useState(false) const userAPI = useUserAPI(); const classes = useStyles() + const { success } = useSnackbar(); const [isLoading, setIsLoading] = useState(false); const [user, setUser] = useState(globalState.user); const [profileExpanded, setProfileExpanded] = useState(false); const [avatarExpanded, setAvatarExpanded] = useState(false); const [notificationsExpanded, setNotificationsExpanded] = useState(false); + const [unitsExpanded, setUnitsExpanded] = useState(false); const [avatarUrl, setAvatarUrl] = useState(""); - const [themeValue, setThemeValue] = useState<"light" | "dark" | "system">(themeMode.mode) + // const [themeValue, setThemeValue] = useState<"light" | "dark" | "system">(themeMode.mode) useEffect(() => { function changeIcon(icon: string | undefined) { @@ -99,11 +104,11 @@ export default function UserSettings(props: Props) { .updateUser(user.id(), user.protobuf()) .then(() => { dispatch({ key: "user", value: user }); - // success("User settings successfully updated!"); - // setTemperatureUnit(user.settings.temperatureUnit); - // setPressureUnit(user.settings.pressureUnit); - // setDistanceUnit(user.settings.distanceUnit); - // setGrainUnit(user.settings.grainUnit); + success("User settings successfully updated!"); + setTemperatureUnit(user.settings.temperatureUnit); + setPressureUnit(user.settings.pressureUnit); + setDistanceUnit(user.settings.distanceUnit); + setGrainUnit(user.settings.grainUnit); }) .catch((error: any) => { error("Error occurred while updating your profile"); @@ -362,6 +367,160 @@ export default function UserSettings(props: Props) { 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 ( + + + changePressureUnit(event.target.value)} + margin="normal" + variant="outlined" + InputLabelProps={{ shrink: true }}> + + Kilopascals (kPa) + + + Inches of Water (iwg) + + + + + changeTemperatureUnit(event.target.value)} + margin="normal" + variant="outlined" + InputLabelProps={{ shrink: true }}> + Celsius (°C) + + Fahrenheit (°F) + + + + + changeDistanceUnit(event.target.value)} + margin="normal" + variant="outlined" + InputLabelProps={{ shrink: true }}> + Meters (m) + Feet (ft) + + + {IsAdaptiveAgriculture() && ( + + changeGrainUnit(event.target.value)} + margin="normal" + variant="outlined" + InputLabelProps={{ shrink: true }}> + Bushels (bu) + Tonnes (mT) + + + )} + + ); + }; + const themeToggle = () => { return ( - {/* + - setUnitsExpanded(!unitsExpanded)}> + setUnitsExpanded(!unitsExpanded)}> {unitsExpanded ? : } - + @@ -472,7 +631,7 @@ export default function UserSettings(props: Props) { - + {/* setMapsExpanded(!mapsExpanded)}>