diff --git a/.vscode/launch.json b/.vscode/launch.json index 2f0376a0d..675e19b5c 100644 --- a/.vscode/launch.json +++ b/.vscode/launch.json @@ -7,6 +7,7 @@ "request": "launch", "url": "http://localhost:3000", "webRoot": "${workspaceRoot}/src" + } ] } \ No newline at end of file diff --git a/client/src/App/App.container.jsx b/client/src/App/App.container.jsx index d800afd0f..b48fba907 100644 --- a/client/src/App/App.container.jsx +++ b/client/src/App/App.container.jsx @@ -9,7 +9,7 @@ import { HttpLink } from "apollo-link-http"; import ApolloClient from "apollo-client"; import { InMemoryCache } from "apollo-cache-inmemory"; -import Spin from '../components/loading-spinner/loading-spinner.component' +import Spin from "../components/loading-spinner/loading-spinner.component"; const UPSERT_USER = gql` mutation upsert_user($authEmail: String!, $authToken: String!) { @@ -24,6 +24,12 @@ const UPSERT_USER = gql` } `; +const SET_CURRENT_USER = gql` + mutation SetCurrentUser($user: User!) { + setCurrentUser(user: $user) @client + } +`; + const client = new ApolloClient({ link: new HttpLink({ uri: process.env.REACT_APP_GRAPHQL_ENDPOINT @@ -44,8 +50,8 @@ export default function Auth() { mutation: UPSERT_USER, variables: { authEmail: user.email, authToken: user.uid } }) - .then(r => console.log(r)) - .catch(error => console.log("ERROR!!!!", error)); + .then(r => console.log("Successful Upsert", r)) + .catch(error => console.log("Upsert error!!!!", error)); const token = await user.getIdToken(); const idTokenResult = await user.getIdTokenResult(); diff --git a/client/src/App/App.js b/client/src/App/App.js index d4f645759..fe3fdfe30 100644 --- a/client/src/App/App.js +++ b/client/src/App/App.js @@ -6,13 +6,14 @@ import ApolloClient from "apollo-client"; import { InMemoryCache } from "apollo-cache-inmemory"; import { resolvers, typeDefs } from "../graphql/resolvers"; import initialState from "../graphql/initial-state"; +import { gql } from "apollo-boost"; //Styling imports import "./App.css"; //Component Imports -import SignIn from "../components/landing-components/sign-in/sign-in.component"; -import LandingPage from "../pages/landing/landing.component"; -import Manage from "../pages/manage/manage.component"; +import SignIn from "../components/sign-in-form/sign-in-form.component"; +import LandingPage from "../pages/landing/landing.page"; +import Manage from "../pages/manage/manage.page"; import PrivateRoute from "../utils/private-route"; @@ -31,8 +32,17 @@ export default function App({ authState }) { resolvers, typeDefs }); + + //Init local state. client.writeData({ - data: { ...initialState, authState } + data: { + ...initialState, + currentUser: { + __typename: null, + email: authState.user.email, + displayName: authState.user.displayName + } + } }); return ( diff --git a/client/src/components/header/header.container.jsx b/client/src/components/header/header.container.jsx index 15ea85aa1..dac8e0608 100644 --- a/client/src/components/header/header.container.jsx +++ b/client/src/components/header/header.container.jsx @@ -5,6 +5,7 @@ import { Alert } from "antd"; import Header from "./header.component"; import Spin from "../loading-spinner/loading-spinner.component"; +// import Skeleton from "../loading-skeleton/loading-skeleton.component"; import { GET_SELECTED_NAV_ITEM, diff --git a/client/src/components/loading-skeleton/loading-skeleton.component.jsx b/client/src/components/loading-skeleton/loading-skeleton.component.jsx new file mode 100644 index 000000000..ce9a731ac --- /dev/null +++ b/client/src/components/loading-skeleton/loading-skeleton.component.jsx @@ -0,0 +1,10 @@ +import React from 'react' +import './loading-skeleton.styles.scss' + +import { Skeleton } from "antd"; + +export default function LoadingSkeleton() { + return ( + + ) +} diff --git a/client/src/components/loading-skeleton/loading-skeleton.styles.scss b/client/src/components/loading-skeleton/loading-skeleton.styles.scss new file mode 100644 index 000000000..209fab023 --- /dev/null +++ b/client/src/components/loading-skeleton/loading-skeleton.styles.scss @@ -0,0 +1,3 @@ +.loading-skeleton { + text-align: center; +} diff --git a/client/src/components/loading-spinner/loading-spinner.component.jsx b/client/src/components/loading-spinner/loading-spinner.component.jsx index 03b0b89ee..94c35d8b0 100644 --- a/client/src/components/loading-spinner/loading-spinner.component.jsx +++ b/client/src/components/loading-spinner/loading-spinner.component.jsx @@ -3,5 +3,5 @@ import { Spin } from "antd"; import "./loading-spinner.styles.scss"; export default function LoadingSpinner() { - return ; + return ; } diff --git a/client/src/components/loading-spinner/loading-spinner.styles.scss b/client/src/components/loading-spinner/loading-spinner.styles.scss index 220a92cc1..d057f91ad 100644 --- a/client/src/components/loading-spinner/loading-spinner.styles.scss +++ b/client/src/components/loading-spinner/loading-spinner.styles.scss @@ -1,3 +1,3 @@ -.spinner { +.loading-spinner { text-align: center; } diff --git a/client/src/components/landing-components/sign-in/sign-in.component.jsx b/client/src/components/sign-in-form/sign-in-form.component.jsx similarity index 92% rename from client/src/components/landing-components/sign-in/sign-in.component.jsx rename to client/src/components/sign-in-form/sign-in-form.component.jsx index 9269fadac..18bda3f60 100644 --- a/client/src/components/landing-components/sign-in/sign-in.component.jsx +++ b/client/src/components/sign-in-form/sign-in-form.component.jsx @@ -1,8 +1,8 @@ import React from "react"; -import { auth } from "../../../firebase/firebase.utils"; +import { auth } from "../../firebase/firebase.utils"; import { Form, Icon, Input, Button, Alert } from "antd"; -class SignIn extends React.Component { +class SignInForm extends React.Component { constructor() { super(); this.state = { @@ -74,4 +74,4 @@ class SignIn extends React.Component { ); } } -export default Form.create({ name: "sign_in" })(SignIn); +export default Form.create({ name: "sign_in" })(SignInForm); diff --git a/client/src/graphql/initial-state.js b/client/src/graphql/initial-state.js index 23b6fb4d8..539ae1a62 100644 --- a/client/src/graphql/initial-state.js +++ b/client/src/graphql/initial-state.js @@ -1,5 +1,5 @@ export default { - authState: null, + selectedNavItem: "Home", recentItems: [] }; diff --git a/client/src/graphql/metadata.queries.js b/client/src/graphql/metadata.queries.js index 940210b5b..703ec91ad 100644 --- a/client/src/graphql/metadata.queries.js +++ b/client/src/graphql/metadata.queries.js @@ -20,3 +20,15 @@ export const GET_SELECTED_NAV_ITEM = gql` selectedNavItem @client } `; + +export const GET_CURRENT_USER = gql` + query GetCurrentUser { + currentUser @client + } +`; + +// export const SET_CURRENT_USER = gql` +// mutation SetCurrentUser($user User!){ +// setCurrentUser(currentUser: $user) +// } +// `; diff --git a/client/src/graphql/resolvers.js b/client/src/graphql/resolvers.js index dc71be9c1..d961016d1 100644 --- a/client/src/graphql/resolvers.js +++ b/client/src/graphql/resolvers.js @@ -4,6 +4,12 @@ export const typeDefs = gql` extend type Mutation { SetCurrentUser(user: User!): User! } + + type User { + displayName: String!, + email: String!, + photoUrl: String! + } `; const GET_CURRENT_USER = gql` diff --git a/client/src/pages/landing/landing.component.jsx b/client/src/pages/landing/landing.page.jsx similarity index 99% rename from client/src/pages/landing/landing.component.jsx rename to client/src/pages/landing/landing.page.jsx index 957d31277..f1daa4282 100644 --- a/client/src/pages/landing/landing.component.jsx +++ b/client/src/pages/landing/landing.page.jsx @@ -13,3 +13,4 @@ export default function LandingPage() { ); } + diff --git a/client/src/pages/manage/manage.component.jsx b/client/src/pages/manage/manage.page.jsx similarity index 100% rename from client/src/pages/manage/manage.component.jsx rename to client/src/pages/manage/manage.page.jsx diff --git a/client/src/pages/sign-in/sign-in.page.jsx b/client/src/pages/sign-in/sign-in.page.jsx new file mode 100644 index 000000000..0dc7c27dd --- /dev/null +++ b/client/src/pages/sign-in/sign-in.page.jsx @@ -0,0 +1,13 @@ +import React from "react"; +import signInComponent from "../../components/sign-in-form/sign-in-form.component"; + +import { Redirect } from "react-router-dom"; + + +export default function SignInPage() { + return ( +
+ +
+ ); +}