Skip to content

Commit

Permalink
Merge pull request #423 from isomerpages/develop
Browse files Browse the repository at this point in the history 
Merge to production - 20 April 2021
  • Loading branch information
@alexanderleegs
alexanderleegs authored Apr 20, 2021
2 parents 487997d + ca1727d commit a16d726
Show file tree
Hide file tree
Showing 86 changed files with 38,838 additions and 16,304 deletions.
3 changes: 2 additions & 1 deletion .env-example
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
export REACT_APP_CLIENT_ID=''
export REACT_APP_BACKEND_URL=''
export REACT_APP_SENTRY_ENV=''
export REACT_APP_SENTRY_DSN=''
export REACT_APP_SENTRY_DSN=''
export REACT_APP_ENV='LOCAL_DEV'
45,233 changes: 32,361 additions & 12,872 deletions package-lock.json
View file

Large diffs are not rendered by default.

7 changes: 4 additions & 3 deletions package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,6 @@
"html-react-parser": "^1.1.1",
"immutability-helper": "^3.0.1",
"js-base64": "^2.5.1",
"js-yaml": "^3.13.1",
"lodash": "^4.17.15",
"marked": "^0.7.0",
"node-sass": "^4.13.1",
Expand All @@ -27,16 +26,18 @@
"react-color": "^2.17.3",
"react-dom": "^16.10.2",
"react-input-mask": "^2.0.4",
"react-query": "^3.9.8",
"react-router-dom": "^5.1.2",
"react-scripts": "3.4.0",
"react-scripts": "^3.4.4",
"react-select": "^3.1.0",
"react-simplemde-editor": "^4.1.0",
"react-toastify": "^6.1.0",
"react-toggle-button": "^2.2.0",
"sgds-govtech": "^1.3.16",
"slugify": "^1.3.6",
"toml": "^3.0.0",
"uuid": "^3.3.3"
"uuid": "^3.3.3",
"yaml": "^1.10.2"
},
"scripts": {
"start": "source .env.development.local && react-scripts start",
Expand Down
38 changes: 38 additions & 0 deletions public/publishModal.svg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
119 changes: 63 additions & 56 deletions src/App.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@ import {
} from 'react-router-dom';
import axios from 'axios';
import * as Sentry from "@sentry/react";
import { QueryClient, QueryClientProvider } from 'react-query';
import { ToastContainer } from 'react-toastify';
import 'react-toastify/dist/ReactToastify.css';

Expand All @@ -15,6 +16,7 @@ import AuthCallback from './layouts/AuthCallback'
import Home from './layouts/Home';
import Sites from './layouts/Sites';
import Workspace from './layouts/Workspace';
import Folders from './layouts/Folders';
import EditPage from './layouts/EditPage';
import CategoryPages from './layouts/CategoryPages';
import Images from './layouts/Images';
Expand All @@ -24,8 +26,7 @@ import EditFile from './layouts/EditFile';
import EditHomepage from './layouts/EditHomepage';
import EditContactUs from './layouts/EditContactUs';
import Resources from './layouts/Resources';
import Menus from './layouts/Menus';
import EditNav from './layouts/EditNav';
import EditNavBar from './layouts/EditNavBar'
import Settings from './layouts/Settings';
import NotFoundPage from './components/NotFoundPage'
import ProtectedRoute from './components/ProtectedRoute'
Expand All @@ -34,18 +35,17 @@ import FallbackComponent from './components/FallbackComponent'
// Styles
import elementStyles from './styles/isomer-cms/Elements.module.scss';

// Utils
import { defaultSiteColors } from './utils/siteColorUtils';

// Import contexts
const { LoginContext } = require('./contexts/LoginContext')
const { LoginContext } = require('./contexts/LoginContext');

// axios settings
axios.defaults.withCredentials = true

// Constants
const { REACT_APP_BACKEND_URL: BACKEND_URL } = process.env
const LOCAL_STORAGE_AUTH_STATE = 'isomercms_auth'
const LOCAL_STORAGE_SITE_COLORS = 'isomercms_colors'
const userIdKey = "userId"

const ToastCloseButton = ({ closeToast }) => (
<span style={{
Expand All @@ -59,6 +59,9 @@ const ToastCloseButton = ({ closeToast }) => (
</span>
);

// react-query client
const queryClient = new QueryClient();

function App() {
// Keep track of whether user is logged in
const [isLoggedIn, setIsLoggedIn] = useState(() => {
Expand All @@ -67,15 +70,14 @@ function App() {
return false
})
const [shouldBlockNavigation, setShouldBlockNavigation] = useState(false)
const [siteColors, setSiteColors] = useState({})

axios.interceptors.response.use(
function (response) {
return response
},
async function (error) {
if (error.response && error.response.status === 401) {
if (isLoggedIn) {
if (isLoggedIn && !shouldBlockNavigation) {
setShouldBlockNavigation(true)
console.log('User token has expired or does not exist')
}
Expand All @@ -88,81 +90,86 @@ function App() {
)

const setLogin = () => {
setIsLoggedIn(true)
if (!isLoggedIn) setIsLoggedIn(true)
localStorage.setItem(LOCAL_STORAGE_AUTH_STATE, true)
}

const setLogoutState = () => {
localStorage.removeItem(LOCAL_STORAGE_AUTH_STATE)
setIsLoggedIn(false)
setShouldBlockNavigation(false)
if (isLoggedIn && shouldBlockNavigation) {
setIsLoggedIn(false)
setShouldBlockNavigation(false)
}
}

useEffect(() => {
if (shouldBlockNavigation) {
localStorage.removeItem(LOCAL_STORAGE_SITE_COLORS)
}, [])

useEffect(() => {
if (isLoggedIn && shouldBlockNavigation) {
alert('Warning: your token has expired. Isomer will log you out now.')
const logout = async () => {
console.log('Logging out...')
localStorage.removeItem(userIdKey)
await axios.get(`${BACKEND_URL}/auth/logout`)
setLogoutState()
}
logout()
}
}, [shouldBlockNavigation])

useEffect(() => {
if (!isLoggedIn) {
setShouldBlockNavigation(false)
}
}, [isLoggedIn])

const ProtectedRouteWithProps = (props) => {
return (
<Sentry.ErrorBoundary fallback={FallbackComponent}>
<ProtectedRoute {...props} isLoggedIn={isLoggedIn} siteColors={siteColors} setSiteColors={setSiteColors} />
<ProtectedRoute {...props} />
</Sentry.ErrorBoundary>
)
}

return (
<Router basename={process.env.PUBLIC_URL}>
<ToastContainer hideProgressBar={true} position='top-center' closeButton={ToastCloseButton} className={elementStyles.toastContainer}/>
<div>
{/*
A <Switch> looks through all its children <Route>
elements and renders the first one whose path
matches the current URL. Use a <Switch> any time
you have multiple routes, but you want only one
of them to render at a time
*/}
<LoginContext.Provider value={setLogoutState}>
<Switch>
<ProtectedRouteWithProps exact path='/auth' component={AuthCallback} setLogin={setLogin} />
<ProtectedRouteWithProps exact path="/" component={Home} />
<ProtectedRouteWithProps path="/sites/:siteName/collections/:collectionName/:fileName" component={EditPage} isCollectionPage={true} isResourcePage={false} />
<ProtectedRouteWithProps path="/sites/:siteName/collections/:collectionName" component={CategoryPages} isResource={false}/>
<ProtectedRouteWithProps path="/sites/:siteName/files/:fileName" component={EditFile} />
<ProtectedRouteWithProps path="/sites/:siteName/files" component={Files} />
<ProtectedRouteWithProps path="/sites/:siteName/images/:fileName" component={EditImage} />
<ProtectedRouteWithProps path="/sites/:siteName/images" component={Images} />
<ProtectedRouteWithProps path="/sites/:siteName/pages/:fileName" component={EditPage} isCollectionPage={false} isResourcePage={false} />
<ProtectedRouteWithProps path="/sites/:siteName/workspace" component={Workspace} />
<ProtectedRouteWithProps path="/sites/:siteName/homepage" component={EditHomepage} />
<ProtectedRouteWithProps path="/sites/:siteName/contact-us" component={EditContactUs} />
<ProtectedRouteWithProps path="/sites/:siteName/resources/:resourceName/:fileName" component={EditPage} isCollectionPage={false} isResourcePage={true} />
<ProtectedRouteWithProps path="/sites/:siteName/resources/:collectionName" component={CategoryPages} isResource={true}/>
<ProtectedRouteWithProps path="/sites/:siteName/resources" component={Resources} />
<ProtectedRouteWithProps path="/sites/:siteName/menus/main-menu" component={EditNav} />
<ProtectedRouteWithProps path="/sites/:siteName/menus" component={Menus} />
<ProtectedRouteWithProps path="/sites/:siteName/settings" component={Settings} />
<ProtectedRouteWithProps exact path="/sites" component={Sites} />
<ProtectedRouteWithProps path="/" component={NotFoundPage}/>
<Route>
<Redirect to={ isLoggedIn ? '/sites' : '/' } />
</Route>
</Switch>
</LoginContext.Provider>
</div>
<QueryClientProvider client={queryClient}>
<ToastContainer hideProgressBar={true} position='top-center' closeButton={ToastCloseButton} className={elementStyles.toastContainer}/>
<div>
{/*
A <Switch> looks through all its children <Route>
elements and renders the first one whose path
matches the current URL. Use a <Switch> any time
you have multiple routes, but you want only one
of them to render at a time
*/}
<LoginContext.Provider value={{isLoggedIn, setLogin, setLogoutState}}>
<Switch>
<ProtectedRouteWithProps exact path='/auth' component={AuthCallback} />
<ProtectedRouteWithProps exact path="/" component={Home} />
<ProtectedRouteWithProps exact path="/sites/:siteName/folder/:folderName/subfolder/:subfolderName/:fileName" component={EditPage} isCollectionPage={true} isResourcePage={false} />
<ProtectedRouteWithProps exact path="/sites/:siteName/folder/:folderName/:fileName" component={EditPage} isCollectionPage={true} isResourcePage={false} />
<ProtectedRouteWithProps exact path="/sites/:siteName/folder/:folderName" component={Folders} />
<ProtectedRouteWithProps exact path="/sites/:siteName/folder/:folderName/subfolder/:subfolderName" component={Folders} />
<ProtectedRouteWithProps exact path="/sites/:siteName/navbar" component={EditNavBar} />
<ProtectedRouteWithProps path="/sites/:siteName/files/:fileName" component={EditFile} />
<ProtectedRouteWithProps path="/sites/:siteName/files" component={Files} />
<ProtectedRouteWithProps path="/sites/:siteName/images/:fileName" component={EditImage} />
<ProtectedRouteWithProps path="/sites/:siteName/images" component={Images} />
<ProtectedRouteWithProps path="/sites/:siteName/pages/:fileName" component={EditPage} isCollectionPage={false} isResourcePage={false} />
<ProtectedRouteWithProps path="/sites/:siteName/workspace" component={Workspace} />
<ProtectedRouteWithProps path="/sites/:siteName/homepage" component={EditHomepage} />
<ProtectedRouteWithProps path="/sites/:siteName/contact-us" component={EditContactUs} />
<ProtectedRouteWithProps path="/sites/:siteName/resources/:resourceName/:fileName" component={EditPage} isCollectionPage={false} isResourcePage={true} />
<ProtectedRouteWithProps path="/sites/:siteName/resources/:collectionName" component={CategoryPages} isResource={true}/>
<ProtectedRouteWithProps path="/sites/:siteName/resources" component={Resources} />
<ProtectedRouteWithProps path="/sites/:siteName/navbar" component={EditNavBar} />
<ProtectedRouteWithProps path="/sites/:siteName/settings" component={Settings} />
<ProtectedRouteWithProps exact path="/sites" component={Sites} />
<ProtectedRouteWithProps path="/" component={NotFoundPage}/>
<Route>
<Redirect to={ isLoggedIn ? '/sites' : '/' } />
</Route>
</Switch>
</LoginContext.Provider>
</div>
</QueryClientProvider>
</Router>
);
}
Expand Down
Loading

0 comments on commit a16d726

Please sign in to comment.