Merge branch 'AFP-36-GradleToMaven-userFrontdend-Backend' into 'master'

Afp 36 gradle to maven user frontdend backend

See merge request !3

ecom-service/src/main/java/com/nisum/ecomservice/controller/UsersController.java

 package com.nisum.ecomservice.controller;
 
+//import com.google.api.client.googleapis.auth.oauth2.GoogleIdTokenVerifier;
+//import com.google.api.client.http.javanet.NetHttpTransport;
+//import com.google.api.client.json.gson.GsonFactory;
 import com.nisum.ecomservice.model.User;
-import com.nisum.ecomservice.repository.UserRepository;
+import com.nisum.ecomservice.model.UserRequestBody;
 import com.nisum.ecomservice.service.UserService;
 import org.springframework.beans.factory.annotation.Autowired;
+import org.springframework.beans.factory.annotation.Value;
+import org.springframework.http.ResponseEntity;
 import org.springframework.web.bind.annotation.*;
 import reactor.core.publisher.Flux;
+import reactor.core.publisher.Mono;
+
+import java.util.Collections;
 
 @RestController
 @RequestMapping("/api/users")
@@ -14,8 +22,18 @@ public class UsersController {
     @Autowired
     private UserService userService;
 
-    @Autowired
-    private UserRepository userRepository;
+//    @Value("${google.client_id}")
+//    private String CLIENT_ID;
+
+//    NetHttpTransport transport = new NetHttpTransport();
+//    GsonFactory jsonFactory = new GsonFactory().getDefaultInstance();
+//
+//    GoogleIdTokenVerifier verifier = new GoogleIdTokenVerifier.Builder(transport, jsonFactory)
+//            // Specify the CLIENT_ID of the app that accesses the backend:
+//            .setAudience(Collections.singletonList(CLIENT_ID))
+//            // Or, if multiple clients access the backend:
+//            //.setAudience(Arrays.asList(CLIENT_ID_1, CLIENT_ID_2, CLIENT_ID_3))
+//            .build();
 
     @GetMapping()
     private Flux<User> getUsers(){
@@ -25,4 +43,47 @@ public class UsersController {
         return userService.getUsers();
     }
 
+    @PostMapping()
+    public ResponseEntity<Mono<User>> createUser(@RequestBody UserRequestBody requestBody) {
+
+//        GoogleIdToken idToken = verifier.verify(idTokenString);
+//        if (idToken != null) {
+//            Payload payload = idToken.getPayload();
+//            String userId = payload.getSubject();
+////          System.out.println("User ID: " + userId);
+//            // Get profile information from payload
+//            String email = payload.getEmail();
+//            boolean emailVerified = Boolean.valueOf(payload.getEmailVerified());
+//            String lastName = (String) payload.get("family_name");
+//            String firstName = (String) payload.get("given_name");
+//
+//            User newUser = null;
+//            newUser.setUserId(userId);
+//            newUser.setEmail(email);
+//            newUser.setFirstName(firstName);
+//            newUser.setLastName(lastName);
+//            newUser.setAccessToken(accessTokenString);
+//
+//            return ResponseEntity.ok(userService.getUserbyEmail(email).switchIfEmpty(userService.createUser(newUser)));
+//        } else {
+//            return new ResponseEntity<>(HttpStatus.BAD_REQUEST);
+//        }
+
+        String idTokenString = requestBody.getIdToken();
+
+        User newUser = new User(requestBody.getUserId(), requestBody.getEmail(), requestBody.getFirstName(), requestBody.getLastName(), requestBody.getAccessToken());
+
+        Mono<Boolean> response = userService.verifyToken(idTokenString);
+
+        Mono<User> newUserMono = response.flatMap(res-> {
+            if(res){
+                return userService.createUser(newUser);
+            }else{
+                return Mono.empty();
+            }
+        });
+
+        return ResponseEntity.ok(newUserMono);
+    }
 }
+

ecom-service/src/main/java/com/nisum/ecomservice/model/UserRequestBody.java

+package com.nisum.ecomservice.model;
+
+import lombok.AllArgsConstructor;
+import lombok.Getter;
+import lombok.Setter;
+
+@Getter
+@Setter
+@AllArgsConstructor
+public class UserRequestBody {
+    String idToken;
+    String userId;
+    String email;
+    String firstName;
+    String lastName;
+    String accessToken;
+}

ecom-service/src/main/java/com/nisum/ecomservice/repository/UserRepository.java

 package com.nisum.ecomservice.repository;
 
 import com.nisum.ecomservice.model.User;
+import org.springframework.data.mongodb.repository.Query;
 import org.springframework.data.mongodb.repository.ReactiveMongoRepository;
 import org.springframework.stereotype.Repository;
+import reactor.core.publisher.Mono;
 
 public interface UserRepository extends ReactiveMongoRepository<User, String> {
+    @Query("SELECT u from User u where u.email= $email")
+    Mono<User> findUserbyEmail(String email);
 }

ecom-service/src/main/java/com/nisum/ecomservice/service/UserService.java

@@ -3,18 +3,45 @@ package com.nisum.ecomservice.service;
 import com.nisum.ecomservice.model.User;
 import com.nisum.ecomservice.repository.UserRepository;
 import org.springframework.beans.factory.annotation.Autowired;
+import org.springframework.http.ResponseEntity;
 import org.springframework.stereotype.Service;
+import org.springframework.web.reactive.function.client.WebClient;
 import reactor.core.publisher.Flux;
+import reactor.core.publisher.Mono;
 
 @Service
 public class UserService {
 
+    private WebClient webClient;
+
     @Autowired
     private UserRepository userRepository;
 
-
     public Flux<User> getUsers() {
         return userRepository.findAll();
     }
+
+    public Mono<User> createUser(User user) {
+        return userRepository.save(user);
+    }
+
+    public Mono<User> getUserbyEmail(String email){
+        return userRepository.findUserbyEmail(email);
+    }
+
+    public Mono<Boolean> verifyToken(String token){
+        return WebClient
+                .builder()
+                .build()
+                .get()
+                .uri("https://www.googleapis.com/oauth2/v3/tokeninfo?id_token={token}", token)
+                .exchangeToMono(clientResponse -> {
+                    if(clientResponse.statusCode().is2xxSuccessful()){
+                        return Mono.just(Boolean.TRUE);
+                    }else {
+                        return Mono.just(Boolean.FALSE);
+                    }
+                });
+    }
 }
 

ecom-web/.env

+REACT_APP_GOOGLE_CLIENT_ID=925243198137-vco98nrjenavrk0n00dvloblpe205vst
+REACT_APP_GOOGLE_SERCRET=hnQt949bODSsvriMfi2lDKdm
\ No newline at end of file

ecom-web/package.json

@@ -8,9 +8,12 @@
     "@testing-library/user-event": "^12.1.10",
     "animate.css": "^4.1.1",
     "axios": "^0.21.1",
+    "bootstrap": "^5.0.0",
     "jquery": "^3.6.0",
     "react": "^17.0.2",
+    "react-bootstrap": "^1.5.2",
     "react-dom": "^17.0.2",
+    "react-google-login": "^5.2.2",
     "react-modal": "^3.13.1",
     "react-redux": "^7.2.4",
     "react-router-dom": "^5.2.0",

ecom-web/src/actions/session_actions.js

+// import {postUser} from '../util/session-api-util'
+
+export const SET_CURRENT_USER = "SET_CURRENT_USER"
+export const LOGOUT_USER = "LOGOUT_USER"
+
+export const setCurrentUser = () => {
+    return {type: SET_CURRENT_USER}
+}
+
+export const logoutUser = () => {
+    return {type: LOGOUT_USER}
+}
+
+// export const login = (user) => dispatch => {
+//     return postUser(user).then((response)=>
+//         dispatch(setCurrentUser(response))
+//     )
+// }
+
+export const login = () => {
+    return (dispatch) => {
+        return dispatch(setCurrentUser());
+    };
+};
+
+export const logOut = () => {
+    return (dispatch) => {
+        return dispatch(logoutUser());
+    };
+};
\ No newline at end of file

ecom-web/src/components/Header/header-container.js

+import { connect } from 'react-redux';
+import Header from './header';
+
+const mSTP = state => ({
+
+});
+
+const mDTP = dispatch => ({
+
+});
+
+export default connect(mSTP, mDTP)(Header);
\ No newline at end of file

ecom-web/src/components/Header/header.js

+import React, { Component } from 'react'
+import Nav from 'react-bootstrap/Nav'
+import Navbar from 'react-bootstrap/Navbar'
+import NavDropdown from 'react-bootstrap/NavDropdown'
+import Session from '../session/session-container'
+
+export default class Header extends Component {
+    constructor(props) {
+    super(props)
+    this.state = {}
+    }
+
+    render() {
+        return (
+            <div>
+                <Navbar collapseOnSelect expand="lg" bg="primary" variant="dark">
+                    <Navbar.Brand href="#home">Ascend Ecommerce</Navbar.Brand>
+                    <Navbar.Toggle aria-controls="responsive-navbar-nav" />
+                    <Navbar.Collapse id="responsive-navbar-nav">
+                        <Nav >
+                            <Navbar.Text>
+                                Hello Guest!
+                            </Navbar.Text>
+                        </Nav>
+                        <Nav className="ms-auto">
+                            <Session />
+                            <Nav.Link>
+                                Cart
+                            </Nav.Link>
+                        </Nav>
+                    </Navbar.Collapse>
+                </Navbar>
+            </div>
+        )
+    }
+}
+

ecom-web/src/components/product-market/product-market.jsx

@@ -4,6 +4,7 @@ import '../../resources/stylesheets/product-market.css';
 import '../../resources/stylesheets/reset.css';
 
 
+
 export default class ProductMarket extends Component {
   constructor(props) {
     super(props)

ecom-web/src/components/root.js

@@ -6,10 +6,12 @@ import ProductMarketContainer from './product-market/product-market-container';
 import ShoppingCartContainer from './shopping-cart/shopping-cart-container';
 import CheckoutContianer from './checkout/checkout-container';
 import OrderHistoryContainer from './order-history/order-history';
+import Header from './Header/header-container'
 
 const Root = ({ store }) => (
   <Provider store={ store }>
     <BrowserRouter>
+      <Header />
       <Switch>
         <Route
           exact path="/"

ecom-web/src/components/session/session-container.jsx

 import { connect } from 'react-redux';
 import Session from './session';
+import {login, logOut} from '../../actions/session_actions'
 
 const mSTP = state => ({
-
+    currentUser: state.user
 });
 
 const mDTP = dispatch => ({
-  
+    login: () => dispatch(login()),
+    logOut: () => dispatch(logOut())
 });
 
 export default connect(mSTP, mDTP)(Session);
\ No newline at end of file

ecom-web/src/components/session/session.jsx

 import React, { Component } from 'react'
+import { GoogleLogin, GoogleLogout } from 'react-google-login';
+
+const clientId = `${process.env.REACT_APP_GOOGLE_CLIENT_ID}.apps.googleusercontent.com`;
 
 export default class Session extends Component {
     constructor(props) {
         super(props)
-        this.state = {}
+        this.loginSuccess = this.loginSuccess.bind(this)
+        this.loginFailed = this.loginFailed.bind(this)
+        this.logOutSuccess = this.logOutSuccess.bind(this)
+    }
+
+    loginSuccess = (response) => {
+        console.log('Login Success: currentUser:', response);
+        this.props.login()
+    }
+
+    loginFailed = (response) => {
+        console.log('Login failed: res:', response);
+    }
+
+    logOutSuccess = (response) => {
+        console.log('Logout made successfully');
+        this.props.logOut()
     }
     
     render() {
         return (
             <div>
-                This is the Session component
+                {this.props.currentUser === null ? 
+                    <GoogleLogin
+                        clientId={clientId}
+                        buttonText="Login"
+                        onSuccess={this.loginSuccess}
+                        onFailure={this.loginFailed}
+                        cookiePolicy={'single_host_origin'}
+                /> :  <GoogleLogout
+                        clientId={clientId}
+                        buttonText="Logout"
+                        onLogoutSuccess={this.logOutSuccess}
+                    ></GoogleLogout>
+                }
             </div>
         )
     }

ecom-web/src/index.js

 import React from 'react';
 import ReactDOM from 'react-dom';
-import configureStore from './store/store';
+import configureStore from './store/store'
+import 'bootstrap/dist/css/bootstrap.css'
 import Root from './components/root';
 import Modal from 'react-modal';
 

ecom-web/src/reducers/root_reducer.js

 import { combineReducers } from 'redux';
 import productsReducer from './products_reducer';
+import userReducer from './user_reducer'
 
 const rootReducer = combineReducers({
-    market: productsReducer
+    market: productsReducer,
+    user: userReducer,
 });
 
 export default rootReducer;
\ No newline at end of file

ecom-web/src/reducers/user_reducer.js

+import {SET_CURRENT_USER, LOGOUT_USER} from '../actions/session_actions'
+
+const initialState = {currentUser: null}
+const userReducer = (state = initialState, action) => {
+    Object.freeze(state);
+    let newState = Object.assign({}, state);
+    switch (action.type) {
+        case SET_CURRENT_USER:
+            return newState.currentUser = { emailAddress: 'fakeEmail@123'};
+        
+        case LOGOUT_USER:
+            return newState.currentUser = null;
+        
+        default:
+            return state;
+    }
+}
+
+export default userReducer;

ecom-web/src/util/session-api-util.js

+import axios from 'axios';
+
+// export const postUser = (user) => {
+//     return currentUser
+// }
+
+// export const postLogOutUser = (user) => {
+//     return axios.post("/api/user", user)
+// }
+