diff --git a/src/fireedge/src/client/apps/provision/_app.js b/src/fireedge/src/client/apps/provision/_app.js index 13efb59827..2b900a1c45 100644 --- a/src/fireedge/src/client/apps/provision/_app.js +++ b/src/fireedge/src/client/apps/provision/_app.js @@ -28,15 +28,13 @@ import { _APPS } from 'client/constants' const APP_NAME = _APPS.provision.name const ProvisionApp = () => { - const { jwt } = useAuth() + const { jwt, firstRender } = useAuth() const { getAuthUser, logout } = useAuthApi() const provisionTemplate = useProvisionTemplate() const { getProvisionsTemplates } = useProvisionApi() const { changeTitle } = useGeneralApi() - const [firstRender, setFirstRender] = React.useState(() => !!jwt) - React.useEffect(() => { (async () => { try { @@ -44,19 +42,17 @@ const ProvisionApp = () => { getAuthUser() !provisionTemplate?.length && await getProvisionsTemplates() } - - firstRender && setFirstRender(false) } catch { logout() } })() - }, [firstRender, jwt]) + }, [jwt]) React.useEffect(() => { changeTitle(APP_NAME) }, []) - if (firstRender) { + if (jwt && firstRender) { return } diff --git a/src/fireedge/src/client/components/FormControl/SelectController.js b/src/fireedge/src/client/components/FormControl/SelectController.js index 2abbcdd94e..35397c47a5 100644 --- a/src/fireedge/src/client/components/FormControl/SelectController.js +++ b/src/fireedge/src/client/components/FormControl/SelectController.js @@ -41,7 +41,9 @@ const SelectController = memo( /> ) }, - (prevProps, nextProps) => prevProps.error === nextProps.error + (prevProps, nextProps) => + prevProps.error === nextProps.error && + prevProps.values.length === nextProps.values.length ) SelectController.propTypes = { diff --git a/src/fireedge/src/client/containers/Login/schema.js b/src/fireedge/src/client/containers/Login/schema.js index aa99a1eda5..edc4499fbf 100644 --- a/src/fireedge/src/client/containers/Login/schema.js +++ b/src/fireedge/src/client/containers/Login/schema.js @@ -77,21 +77,21 @@ export const GROUP = { values: () => { const { user, groups } = useAuth() + const sortedGroupsById = groups?.sort((a, b) => a.ID - b.ID) + + const formatGroups = sortedGroupsById.map(({ ID, NAME }) => { + const markAsPrimary = user?.GID === ID ? ( + + ) : null + + return { + text: <>{`${ID} - ${String(NAME)}`}{markAsPrimary}, + value: String(ID) + } + }) + return [{ text: T.ShowAll, value: FILTER_POOL.ALL_RESOURCES }] - .concat([...groups] - .sort((a, b) => a.ID - b.ID) - .map(({ ID, NAME }) => ({ - text: ( - <> - {`${ID} - ${String(NAME)}`} - {user?.GID === ID && ( - - )} - - ), - value: String(ID) - })) - ) + .concat(formatGroups) }, validation: yup .string() diff --git a/src/fireedge/src/client/containers/Login/styles.js b/src/fireedge/src/client/containers/Login/styles.js index cd6f1c7fa2..497917c2b6 100644 --- a/src/fireedge/src/client/containers/Login/styles.js +++ b/src/fireedge/src/client/containers/Login/styles.js @@ -1,62 +1,55 @@ import { makeStyles } from '@material-ui/core' -export default makeStyles(theme => -// const getColor = theme.palette.type === 'light' ? darken : lighten; -// const getBackgroundColor = theme.palette.type === 'light' ? lighten : darken; -// color: getColor(theme.palette.error.main, 0.6), -// backgroundColor: getBackgroundColor(theme.palette.error.main, 0.9) - - ({ - root: { - display: 'flex', - flexDirection: 'column', - justifyContent: 'center', - height: '100vh' - }, - progress: { - height: 4, - width: '100%', - [theme.breakpoints.only('xs')]: { - top: 0, - position: 'fixed' - } - }, - paper: { - overflow: 'hidden', - padding: theme.spacing(2), - minHeight: 440, - [theme.breakpoints.up('xs')]: { - display: 'flex', - flexDirection: 'column' - }, - [theme.breakpoints.only('xs')]: { - border: 'none', - height: 'calc(100vh - 4px)', - backgroundColor: 'transparent' - } - }, - wrapperForm: { - padding: theme.spacing(), - display: 'flex', - overflow: 'hidden' - }, - form: { - width: '100%', - flexShrink: 0, - display: 'flex', - flexDirection: 'column', - [theme.breakpoints.up('xs')]: { - justifyContent: 'center' - } - }, - loading: { - opacity: 0.7 - }, - helper: { - animation: '1s ease-out 0s 1' - }, - submit: { - margin: theme.spacing(3, 0, 2) +export default makeStyles(theme => ({ + root: { + display: 'flex', + flexDirection: 'column', + justifyContent: 'center', + height: '100vh' + }, + progress: { + height: 4, + width: '100%', + [theme.breakpoints.only('xs')]: { + top: 0, + position: 'fixed' } - }) -) + }, + paper: { + overflow: 'hidden', + padding: theme.spacing(2), + minHeight: 440, + [theme.breakpoints.up('xs')]: { + display: 'flex', + flexDirection: 'column' + }, + [theme.breakpoints.only('xs')]: { + border: 'none', + height: 'calc(100vh - 4px)', + backgroundColor: 'transparent' + } + }, + wrapperForm: { + padding: theme.spacing(), + display: 'flex', + overflow: 'hidden' + }, + form: { + width: '100%', + flexShrink: 0, + display: 'flex', + flexDirection: 'column', + [theme.breakpoints.up('xs')]: { + justifyContent: 'center' + } + }, + loading: { + opacity: 0.7 + }, + helper: { + animation: '1s ease-out 0s 1' + }, + submit: { + margin: theme.spacing(3, 0, 2) + } +})) diff --git a/src/fireedge/src/client/features/Auth/slice.js b/src/fireedge/src/client/features/Auth/slice.js index 2730163d75..7664827f00 100644 --- a/src/fireedge/src/client/features/Auth/slice.js +++ b/src/fireedge/src/client/features/Auth/slice.js @@ -4,7 +4,7 @@ import { login, getUser, logout, changeFilter, changeGroup } from 'client/featur import { JWT_NAME, FILTER_POOL, DEFAULT_SCHEME, DEFAULT_LANGUAGE } from 'client/constants' import { isBackend } from 'client/utils' -const initial = () => ({ +const initial = initialProps => ({ jwt: !isBackend() ? window.localStorage.getItem(JWT_NAME) ?? window.sessionStorage.getItem(JWT_NAME) ?? @@ -19,18 +19,16 @@ const initial = () => ({ disableAnimations: 'NO' }, isLoginInProgress: false, - isLoading: false + isLoading: false, + ...initialProps }) const { actions, reducer } = createSlice({ name: 'auth', - initialState: initial(), + initialState: initial({ firstRender: true }), extraReducers: builder => { builder - .addCase( - logout, - (_, { error }) => ({ ...initial(), error }) - ) + .addCase(logout, (_, { error }) => ({ ...initial(), error })) .addMatcher( ({ type }) => { return [ @@ -48,7 +46,7 @@ const { actions, reducer } = createSlice({ ) .addMatcher( ({ type }) => type.startsWith('auth/') && type.endsWith('/fulfilled'), - state => ({ ...state, isLoading: false }) + state => ({ ...state, isLoading: false, firstRender: false }) ) .addMatcher( ({ type }) => type.startsWith('auth/') && type.endsWith('/rejected'), @@ -57,6 +55,7 @@ const { actions, reducer } = createSlice({ ...payload, isLoginInProgress: false, isLoading: false, + firstRender: false, jwt: null }) )