Client

.env

@@ -0,0 +1,2 @@
+SALT_ROUNDS=12
+APP_SECRET=supersecretkey

app.js

@@ -2,6 +2,8 @@ const app = require('express')()
 const bodyParser = require('body-parser')
 const cors = require('cors')
 const logger = require('morgan')
+const path = require('path')
+
 
 const AppRouter = require('./routes/AppRouter')
 
@@ -14,4 +16,13 @@ app.use(bodyParser.urlencoded({ extended: true }))
 
 app.get('/', (req, res) => res.json({ message: 'Server Works' }))
 app.use('/api', AppRouter)
+
+if (process.env.NODE_ENV === 'production') {
+  app.use(express.static(path.join(__dirname, 'client/build')))
+  app.get('*', (req, res) => {
+    res.sendFile(path.join(`${__dirname}/client/build/index.html`))
+  })
+}
+
+
 app.listen(PORT, () => console.log(`Server Started On Port: ${PORT}`))

client/src/App.js

@@ -1,5 +1,4 @@
 import './styles/App.css'
-import './styles/RazaAbout.css'
 import './styles/JinHome.css'
 import './styles/Sam.css'
 import React, { useState, useEffect } from 'react'
@@ -70,7 +69,7 @@ function App() {
           <Route exact path='/about' component={About}/>
           {
             games.map(game => (
-              <Route key={game.id} path={`/game/details/${game.id}`} component={() => <GameDetails game={game} user={user} />} />
+              <Route key={game.id} path={`/game/details/${game.id}`} component={() => <GameDetails game={game} user={user} authenticated={authenticated}/>} />
             ))
           }
           </Switch>

client/src/components/ReviewCard.jsx

@@ -2,7 +2,7 @@ import React from 'react'
 import swal from '@sweetalert/with-react'
 import {DeleteReview } from '../services/ReviewServices'
 
-const ReviewCard = ({review}) => {
+const ReviewCard = ({review, user}) => {
 
   const handleDeleteReview = async () => {
     await DeleteReview(review.id)
@@ -12,12 +12,12 @@ const ReviewCard = ({review}) => {
 
   return (
     <div className='review-card'>
-      <p><h4>Reviewer:</h4>{review.User.name}</p>
-      <p>{review.content}</p>
+      <h4>{review.User.name}:</h4>
+      <p>  {review.content}</p>
 
-      {(review.User.id === review.user_id) && <section className='hover-review'>
+      {(review.User.id === review.user_id) && 
         <button className='delete-review' onClick={handleDeleteReview}>Delete Review</button>
-      </section>}
+      }
     </div>
   )
 }

client/src/pages/GameDetails.js

@@ -5,7 +5,7 @@ import ReviewCard from "../components/ReviewCard";
 import SubmitReviewForm from "../components/SubmitReviewForm";
 import swal from '@sweetalert/with-react'
 
-const GameDetails = ({game, user}) => {
+const GameDetails = ({game, user, authenticated}) => {
   const [cart, setCart] = useState({})
   const [gameReviews, setGameReviews] = useState([])
   const [reviewButton, toggleReviewButton] = useState(false)
@@ -35,7 +35,7 @@ const GameDetails = ({game, user}) => {
   }
 
   const reviewsExist = (
-    <h2>Reviews:</h2>
+    <h2 className='review-h2'>Reviews:</h2>
   )
   useEffect(() => {
     if (user) findCart()
@@ -54,7 +54,8 @@ const GameDetails = ({game, user}) => {
           <p>Platform: {game.platform}</p>
           <p>Description: {game.description}</p>
           <button className='add-cart' onClick={handleAddCart} >Add to Cart</button>
-          <button className='show-review-form' onClick={showReviewForm}>Review game</button>
+          <br/>
+          {(user && authenticated) && <button className='show-review-form' onClick={showReviewForm}>Review game</button>}
           {reviewButton && <SubmitReviewForm user={user} game={game}/> }
         </section>
       </section>

client/src/services/api.js

@@ -1,6 +1,9 @@
 import Axios from 'axios'
 
-export const BASE_URL = 'http://localhost:3001/api'
+export const BASE_URL = process.env.NODE_ENV === 'production'
+  ? `${window.location.origin}/api`
+  : 'http://localhost:3001/api'
+
 const Client = Axios.create({ baseURL: BASE_URL })
 
 // Intercepts every request axios makes