admin/bodyshop
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

BOD-2 More cleanup after fixing JWT tokens.

Browse Source
This commit is contained in:
Patrick Fic
2020-03-24 18:59:56 -07:00
parent 1c4a5d5b63
commit 1409ef058c
11 changed files with 38 additions and 359 deletions
Download Patch File Download Diff File Expand all files Collapse all files

116
client/src/App/App.container.jsx
View File

@@ -6,26 +6,17 @@ import { split } from "apollo-link";
import { setContext } from "apollo-link-context";
import { HttpLink } from "apollo-link-http";
import apolloLogger from "apollo-link-logger";
import { RetryLink } from "apollo-link-retry";
import { WebSocketLink } from "apollo-link-ws";
import { getMainDefinition } from "apollo-utilities";
import React, { Component } from "react";
import GlobalLoadingBar from "../components/global-loading-bar/global-loading-bar.component";
import SpinnerComponent from "../components/loading-spinner/loading-spinner.component";
import { auth } from "../firebase/firebase.utils";
import errorLink from "../graphql/apollo-error-handling";
import App from "./App";
import { RetryLink } from "apollo-link-retry";
import { auth } from "../firebase/firebase.utils";
export default class AppContainer extends Component {
// constructor() {
// super();
// }
state = {
client: null,
loaded: false
};
async componentDidMount() {
constructor() {
super();
const httpLink = new HttpLink({
uri: process.env.REACT_APP_GRAPHQL_ENDPOINT
});
@@ -34,36 +25,25 @@ export default class AppContainer extends Component {
uri: process.env.REACT_APP_GRAPHQL_ENDPOINT_WS,
options: {
//lazy: true,
reconnect: true,
connectionParams: () => {
const token = localStorage.getItem("token");
if (token) {
return {
headers: {
authorization: token ? `Bearer ${token}` : ""
}
};
}
}
reconnect: true
// connectionParams: () => {
// const token = localStorage.getItem("token");
// if (token) {
// return {
// headers: {
// authorization: token ? `Bearer ${token}` : ""
// }
// };
// }
// }
}
});
// const wsLink = new WebSocketLink({
// uri: websocketUrl,
// options: {
// reconnect: true
// },
// webSocketImpl: ws
// });
const subscriptionMiddleware = {
applyMiddleware: async (options, next) => {
options.authToken = await auth.currentUser.getIdToken(true);
next();
}
};
// add the middleware to the web socket link via the Subscription Transport client
wsLink.subscriptionClient.use([subscriptionMiddleware]);
const link = split(
@@ -87,28 +67,7 @@ export default class AppContainer extends Component {
httpLink
);
// const authLink = setContext((_, { headers }) => {
// const token = localStorage.getItem("token");
// console.log("In the auth link");
// //Check to see if the token has expired. If it has, then
// if (token) {
// return {
// headers: {
// ...headers,
// authorization: token ? `Bearer ${token}` : ""
// }
// };
// } else {
// return { headers };
// }
// });
const authLink = setContext((_, { headers }) => {
// return AsyncTokenLookup()
// .then((userToken) => {
// token = userToken;
// return { token };
// })
return auth.currentUser.getIdToken().then(token => {
if (token) {
return {
@@ -123,35 +82,6 @@ export default class AppContainer extends Component {
});
});
// const authLink = new ApolloLink((operation, forward) => {
// console.log("The new auth link");
// const token = localStorage.getItem("token");
// auth.currentUser.
// auth.currentUser.getIdToken().then(t => {
// console.log("token", token);
// if (token) {
// operation.setContext({
// headers: {
// Authorization: `Bearer ${token}`
// }
// });
// operation.setContext({
// headers: {
// Authorization: `Bearer ${token}`
// }
// });
// return forward(operation);
// }
// });
// return forward(operation);
// });
const middlewares = [];
if (process.env.NODE_ENV === "development") {
middlewares.push(apolloLogger);
}
const retryLink = new RetryLink({
delay: {
initial: 300,
@@ -164,27 +94,25 @@ export default class AppContainer extends Component {
}
});
const middlewares = [];
if (process.env.NODE_ENV === "development") {
middlewares.push(apolloLogger);
}
middlewares.push(retryLink.concat(errorLink.concat(authLink.concat(link))));
const cache = new InMemoryCache();
const client = new ApolloClient({
link: ApolloLink.from(middlewares),
cache,
connectToDevTools: true
});
this.setState({
client,
loaded: true
});
this.state = { client };
}
render() {
const { client, loaded } = this.state;
if (!loaded) {
return <SpinnerComponent message='Connecting to Bodyshop.app Database' />;
}
const { client } = this.state;
return (
<ApolloProvider client={client}>

28
client/src/App/App.css
View File

@@ -1,27 +1 @@
@import "~antd/dist/antd.css";
/* .ant-layout-header {
position: absolute;
top: 0px;
left: 0px;
height: 5vh;
right: 0px;
overflow: hidden;
}
.ant-layout-content {
position: absolute;
top: 5vh;
bottom: 3vh;
left: 0px;
right: 0px;
overflow: auto;
}
.ant-layout-footer {
position: absolute;
bottom: 0px;
height: 3vh;
left: 0px;
right: 0px;
overflow: hidden;
} */
@import "~antd/dist/antd.css";

4
client/src/App/App.js
View File

@@ -38,7 +38,7 @@ export default connect(
const { t } = useTranslation();
if (currentUser && currentUser.language)
i18next.changeLanguage(currentUser.language, (err, t) => {
i18next.changeLanguage(currentUser.language, err => {
if (err)
return console.log("Error encountered when changing languages.", err);
});
@@ -51,7 +51,7 @@ export default connect(
<div>
<Switch>
<ErrorBoundary>
<Suspense fallback={<LoadingSpinner message='In Suspense.' />}>
<Suspense fallback={<LoadingSpinner message='App.Js Suspense' />}>
<Route exact path='/' component={LandingPage} />
<Route exact path='/unauthorized' component={Unauthorized} />

2
client/src/components/job-detail-cards/job-detail-cards.documents.component.jsx
View File

@@ -18,7 +18,7 @@ export default function JobDetailCardsDocumentsComponent({ loading, data }) {
<CardTemplate
loading={loading}
title={t("jobs.labels.cards.documents")}
extraLink={`/manage/jobs/${data.id}#documents`}
extraLink={`/manage/jobs/${data.id}?documents`}
>
{data.documents.length > 0 ? (
<Carousel autoplay>

32
client/src/firebase/firebase.utils.js
View File

@@ -6,40 +6,8 @@ import "firebase/database";
const config = JSON.parse(process.env.REACT_APP_FIREBASE_CONFIG);
firebase.initializeApp(config);
export const createUserProfileDocument = async (userAuth, additionalData) => {
//Needs to be redone to write to GQL database.
console.log("userAuth from firebase Utils", userAuth);
if (!userAuth) return;
const userRef = firestore.doc(`users/${userAuth.uid}`);
const snapShot = await userRef.get();
if (!snapShot.exists) {
const { displayName, email } = userAuth;
const createdAt = new Date();
try {
await userRef.set({
displayName,
email,
createdAt,
...additionalData
});
} catch (error) {
console.log("error creating user", error.message);
}
}
return userRef;
};
export const auth = firebase.auth();
export const firestore = firebase.firestore();
const provider = new firebase.auth.GoogleAuthProvider();
provider.setCustomParameters({ prompt: "select_account" });
export default firebase;
export const getCurrentUser = () => {

35
client/src/graphql/apollo-error-handling.js
View File

@@ -1,5 +1,4 @@
import { onError } from "apollo-link-error";
import { auth } from "../firebase/firebase.utils";
//https://stackoverflow.com/questions/57163454/refreshing-a-token-with-apollo-client-firebase-auth
const errorLink = onError(
@@ -11,40 +10,6 @@ const errorLink = onError(
)
);
if (networkError) console.log(`[Network error]: ${networkError}`);
let expired = false;
if (graphQLErrors) {
if (graphQLErrors[0].message.includes("JWTExpired")) {
expired = true;
}
}
if (networkError) {
if (networkError.message.includes("JWTExpired")) {
expired = true;
}
}
if (expired) {
//User access token has expired
console.log("Old Token", window.localStorage.getItem("token"));
// Let's refresh token through async request
auth.currentUser.getIdToken(true).then(token => {
if (token) {
console.log("Got the new token.", token);
window.localStorage.setItem("token", token);
const oldHeaders = operation.getContext().headers;
operation.setContext({
headers: {
...oldHeaders,
authorization: token ? `Bearer ${token}` : ""
}
});
console.log(operation.getContext());
return forward(operation);
}
});
}
}
);

25
client/src/pages/manage/manage.page.container.jsx
View File

@@ -1,43 +1,26 @@
import { useQuery } from "@apollo/react-hooks";
import { notification } from "antd";
import React, { useEffect } from "react";
import { useTranslation } from "react-i18next";
import { connect } from "react-redux";
import { createStructuredSelector } from "reselect";
import LoadingSpinner from "../../components/loading-spinner/loading-spinner.component";
import AlertComponent from "../../components/alert/alert.component";
import { QUERY_BODYSHOP } from "../../graphql/bodyshop.queries";
import { setBodyshop } from "../../redux/user/user.actions";
import { selectBodyshop } from "../../redux/user/user.selectors";
import ManagePage from "./manage.page.component";
const mapStateToProps = createStructuredSelector({
bodyshop: selectBodyshop
});
const mapDispatchToProps = dispatch => ({
setBodyshop: bs => dispatch(setBodyshop(bs))
});
function ManagePageContainer({ match, setBodyshop, bodyshop }) {
function ManagePageContainer({ match, setBodyshop }) {
const { error, data } = useQuery(QUERY_BODYSHOP, {
fetchPolicy: "network-only"
});
const { t } = useTranslation();
if (error) {
notification["error"]({ message: t("bodyshop.errors.loading") });
}
useEffect(() => {
if (data) setBodyshop(data.bodyshops[0]);
}, [data, setBodyshop]);
if (!bodyshop)
return <LoadingSpinner message={t("general.labels.loadingshop")} />;
if (error) return <AlertComponent message={error.message} type='error' />;
return <ManagePage match={match} />;
}
export default connect(
mapStateToProps,
mapDispatchToProps
)(ManagePageContainer);
export default connect(null, mapDispatchToProps)(ManagePageContainer);

89
client/src/redux/messaging/messaging.sagas.js
View File

@@ -1,90 +1,5 @@
import {
all
// call, put, takeLatest
} from "redux-saga/effects";
//import { auth, getCurrentUser } from "../../firebase/firebase.utils";
// import { toggleChatVisible } from "./messaging.actions";
// import MessagingActionTypes from "./messaging.types";
// export function* getSnapshotFromUserAuth(userAuth) {
// try {
// const userRef = yield call(createUserProfileDocument, userAuth);
// //const userSnapshot = yield userRef.get();
// } catch (error) {
// yield put(signInFailure(error));
// }
// }
// export function* signInWithEmail({ payload: { email, password } }) {
// try {
// const { user } = yield auth.signInWithEmailAndPassword(email, password);
// yield put(
// signInSuccess({
// uid: user.uid,
// email: user.email,
// displayName: user.displayName,
// authorized: true
// })
// );
// } catch (error) {
// yield put(signInFailure(error));
// }
// }
// //This is the listener fo rthe call, and when it finds it, it triggers somethign else.
// export function* onEmailSignInStart() {
// yield takeLatest(UserActionTypes.EMAIL_SIGN_IN_START, signInWithEmail);
// }
// export function* isUserAuthenticated() {
// try {
// const user = yield getCurrentUser();
// if (!user) {
// yield put(unauthorizedUser());
// return;
// }
// let token = yield user.getIdToken();
// localStorage.setItem("token", token);
// window.sessionStorage.setItem(`lastTokenRefreshTime`, new Date());
// yield put(
// signInSuccess({
// uid: user.uid,
// email: user.email,
// displayName: user.displayName,
// authorized: true
// })
// );
// } catch (error) {
// yield put(signInFailure(error));
// }
// }
// export function* onCheckUserSession() {
// yield takeLatest(UserActionTypes.CHECK_USER_SESSION, isUserAuthenticated);
// }
// export function* signOutStart() {
// try {
// yield auth.signOut();
// yield put(signOutSuccess());
// localStorage.removeItem("token");
// } catch (error) {
// yield put(signOutFailure(error.message));
// }
// }
// export function* onSignOutStart() {
// yield takeLatest(UserActionTypes.SIGN_OUT_START, signOutStart);
// }
import { all } from "redux-saga/effects";
export function* messagingSagas() {
yield all([
// call(onGoogleSignInStart),
// call(onEmailSignInStart),
// call(onCheckUserSession),
// call(onSignOutStart)
// call(onEmailSignUpStart),
// call(onEmailSignUpSuccess)
]);
yield all([]);
}

2
client/src/utils/private-route.js
View File

@@ -8,7 +8,7 @@ export default ({ component: Component, isAuthorized, ...rest }) => {
isAuthorized === true ? (
<Component {...props} />
) : (
<Redirect to="/unauthorized" />
<Redirect to='/login' />
)
}
/>