diff --git a/package.json b/package.json index 7c34763f..72860a83 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "app-map-db", - "version": "2.1.17", + "version": "2.1.18", "private": true, "homepage": "https://mindapps.org", "enableLogRocket": true, diff --git a/src/components/application/GenericDialog/Login/index.js b/src/components/application/GenericDialog/Login/index.js index 12b818d0..efbee713 100644 --- a/src/components/application/GenericDialog/Login/index.js +++ b/src/components/application/GenericDialog/Login/index.js @@ -47,7 +47,6 @@ export default function LoginDialog({ id = title }) { alert('Successfully updated password.'); Auth.signIn(email, newPassword) .then(user => { - console.log('Login success!', user); setUser(user); setState(prev => ({ ...prev, open: false, loading: false, errors: {} })); }) @@ -79,7 +78,6 @@ export default function LoginDialog({ id = title }) { } else { Auth.signIn(email, password) .then(user => { - console.log('Login success!', user); setUser(user); setState(prev => ({ ...prev, open: false, loading: false, errors: {} })); }) diff --git a/src/components/application/GenericDialog/LoginV2/index.js b/src/components/application/GenericDialog/LoginV2/index.js index dc7d02f6..ab39376c 100644 --- a/src/components/application/GenericDialog/LoginV2/index.js +++ b/src/components/application/GenericDialog/LoginV2/index.js @@ -60,7 +60,6 @@ function Content({ fields, values, mapField, fullWidth, setValues, ...props }) { alert('Successfully updated password.'); Auth.signIn(email, newPassword) .then(user => { - console.log('Login success!', user); setUser(user); setState(prev => ({ ...prev, open: false, loading: false, errors: {} })); }) @@ -92,7 +91,6 @@ function Content({ fields, values, mapField, fullWidth, setValues, ...props }) { } else { Auth.signIn(email, password) .then(user => { - console.log('Login success!', user); setUser(user); setState(prev => ({ ...prev, open: false, loading: false, errors: {} })); }) diff --git a/src/components/application/GenericDialog/Register/index.js b/src/components/application/GenericDialog/Register/index.js index 9f6b8411..168a4963 100644 --- a/src/components/application/GenericDialog/Register/index.js +++ b/src/components/application/GenericDialog/Register/index.js @@ -4,7 +4,7 @@ import { copyToLower, isEmpty as isValEmpty } from '../../../../helpers'; import { useDialogState } from '../useDialogState'; import { Auth } from 'aws-amplify'; import DialogButton from '../DialogButton'; -import { useSetUser } from '../../../layout/store'; +import { useLayout, useSetUser } from '../../../layout/store'; const passwordValidator = require('password-validator'); export const title = 'Sign Up'; @@ -70,7 +70,7 @@ const EnterConfirmationCode = ({ value = false, onChange }) => { export default function RegisterDialog({ id = title }) { const [dialogState, setState] = useDialogState(id); const { confirm, errors } = dialogState; - const dialogStateStr = JSON.stringify(dialogState); + const dialogStateStr = JSON.stringify(dialogState); const setUser = useSetUser(); @@ -106,7 +106,6 @@ export default function RegisterDialog({ id = title }) { setState(prev => ({ ...prev, open: false, loading: false, confirm: false })); Auth.signIn(email, password) .then(user => { - console.log('Login success!'); setUser(user); }) .catch(err => { @@ -124,10 +123,10 @@ export default function RegisterDialog({ id = title }) { [setUser, dialogStateStr, setState, errors] ); - const handleSubmit = React.useCallback(({ confirm, ...other }, setValues) => (confirm ? handleConfirm(other, setValues) : handleAdd(other, setValues)), [ - handleConfirm, - handleAdd - ]); + const handleSubmit = React.useCallback( + ({ confirm, ...other }, setValues) => (confirm ? handleConfirm(other, setValues) : handleAdd(other, setValues)), + [handleConfirm, handleAdd] + ); return ( ({ ...prev, open: false, loading: false, confirm: false })); Auth.signIn(email, password) .then(user => { - console.log('Login success!'); setUser(user); }) .catch(err => { diff --git a/src/components/layout/AppRouter.tsx b/src/components/layout/AppRouter.tsx index b33f384e..83585c2c 100644 --- a/src/components/layout/AppRouter.tsx +++ b/src/components/layout/AppRouter.tsx @@ -1,10 +1,10 @@ -import * as React from 'react'; import Routes from './routes'; import { ConnectedRouter } from 'connected-react-router'; import { AppState } from '../../store'; import { connect } from 'react-redux'; import Layout from './Layout'; import useLogRocketUser from './useLogRocketUser'; +import VersionSelector from './VersionSelector'; export interface AppRouterProps { history?: any; @@ -16,9 +16,11 @@ function AppRouter(props: AppRouterProps) { return ( // @ts-ignore - - - + + + + + ); } diff --git a/src/components/layout/ApplicationBar.tsx b/src/components/layout/ApplicationBar.tsx index 7ff48327..86f291d9 100644 --- a/src/components/layout/ApplicationBar.tsx +++ b/src/components/layout/ApplicationBar.tsx @@ -144,9 +144,18 @@ export default function ApplicationBar({ trigger }) { const version = useSelector((s: any) => s.layout.version); const [, setLayout] = useLayout(); - const handleChangeVersion = React.useCallback(() => { - setLayout({ version: version === 'lite' ? 'full' : 'lite' }); - }, [version, setLayout]); + const handleChangeVersion = React.useCallback( + ({ version: newVersion }) => + () => { + if (!signedIn && newVersion !== 'lite') { + // User is not signed in and trying to switch to pro version, show the login dialog + setLoginState(prev => ({ ...prev, open: true })); + } else { + setLayout({ version: newVersion }); + } + }, + [setLayout, signedIn, setLoginState] + ); return ( <> @@ -180,7 +189,7 @@ export default function ApplicationBar({ trigger }) { } }} color={version === 'lite' ? 'primary' : 'secondary'} - onClick={handleChangeVersion} + onClick={handleChangeVersion({ version: 'lite' })} > Lite Version @@ -191,7 +200,7 @@ export default function ApplicationBar({ trigger }) { } }} color={version !== 'lite' ? 'primary' : 'secondary'} - onClick={handleChangeVersion} + onClick={handleChangeVersion({ version: 'full' })} > Pro Version diff --git a/src/components/layout/Layout.tsx b/src/components/layout/Layout.tsx index e402d5d9..aa03acb9 100644 --- a/src/components/layout/Layout.tsx +++ b/src/components/layout/Layout.tsx @@ -60,7 +60,7 @@ export default function Layout({ children }) { const componentsOnPage = [appBarHeight, footerHeight]; const minHeight = height - appBarHeight - footerHeight - 1; var contentHeight = height - componentsOnPage.reduce((t, c) => t + c, 0); - + var [scrollElement, setScrollElement] = React.useState(null); const { pathname } = useLocation(); diff --git a/src/components/layout/VersionSelector.tsx b/src/components/layout/VersionSelector.tsx new file mode 100644 index 00000000..6c5a3afe --- /dev/null +++ b/src/components/layout/VersionSelector.tsx @@ -0,0 +1,20 @@ +import * as React from 'react'; +import { AppState } from '../../store'; +import { useSelector } from 'react-redux'; +import { useLayout } from './store'; +import { isEmpty } from '../../helpers'; + +const VersionSelector = ({ children }) => { + const userId = useSelector((s: AppState) => s?.layout?.user?.username); + const [, setLayout] = useLayout(); + + React.useEffect(() => { + // Auto select user when user is authenticated or logged out + const version = isEmpty(userId) ? 'lite' : 'full'; + console.log(`Auto-selecting version...`, { version, userId }); + setLayout({ version }); + }, [userId, setLayout]); + return children; +}; + +export default VersionSelector; diff --git a/src/components/layout/store.ts b/src/components/layout/store.ts index 34e0f797..baed1edd 100644 --- a/src/components/layout/store.ts +++ b/src/components/layout/store.ts @@ -19,6 +19,7 @@ export interface State { step?: number | null; tourCompleted?: boolean; version: 'lite' | 'full'; + user: any; } const defaultState = {