diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index 6ac8141..69c50a9 100644
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -1,42 +1,17 @@
import * as React from "react";
-import { connect } from "react-redux";
-import {
- Redirect,
- Route,
- RouteComponentProps,
- Switch,
- withRouter,
-} from "react-router";
+import { Route, RouteComponentProps, Switch, withRouter } from "react-router";
import { AuthScreen } from "~Auth/AuthScreen";
+import { requireAuth } from "~Auth/AuthWrapper";
import { Home } from "~Home/Home";
-import { Landing } from "~Landing/Landing";
-import { IAppState } from "~redux/reducers";
-interface IAppComponentProps extends RouteComponentProps {
- loggedIn: boolean;
-}
-
-export function AppComponent(props: IAppComponentProps) {
- const { loggedIn } = props;
- return loggedIn ? (
+export function AppComponent(props: RouteComponentProps) {
+ return (
,
,
- ,
- ,
-
- ) : (
-
-
-
-
- } />
+ ,
);
}
-function mapStateToProps(state: IAppState) {
- return { loggedIn: state.auth.jwt !== null };
-}
-
-export const App = withRouter(connect(mapStateToProps)(AppComponent));
+export const App = withRouter(AppComponent);
diff --git a/frontend/src/Auth/AuthWrapper.tsx b/frontend/src/Auth/AuthWrapper.tsx
new file mode 100644
index 0000000..e66ec58
--- /dev/null
+++ b/frontend/src/Auth/AuthWrapper.tsx
@@ -0,0 +1,39 @@
+import * as React from "react";
+import { connect } from "react-redux";
+import { Redirect } from "react-router";
+import { webRoot } from "~env";
+import { IAppState } from "~redux/reducers";
+
+interface IAuthWrapperComponentProps {
+ loggedIn: boolean;
+}
+
+export const AuthWrapperComponent: React.FunctionComponent = (
+ props,
+) => {
+ if (!props.children) {
+ return ;
+ }
+ if (props.loggedIn) {
+ return {props.children}
;
+ } else {
+ return ;
+ }
+};
+
+function mapStateToProps(state: IAppState): IAuthWrapperComponentProps {
+ return { loggedIn: state.auth.jwt !== null };
+}
+
+export const AuthWrapper = connect(mapStateToProps)(AuthWrapperComponent);
+
+export function requireAuth(Component: React.ComponentType): () => JSX.Element {
+ const wrapped = () => {
+ return (
+
+
+
+ );
+ };
+ return wrapped;
+}