Add deleting user functionality

CS3219-AY2324S1 · Nov 3, 2023 · 2ae11e1 · 2ae11e1
1 parent 88dd694
commit 2ae11e1
Show file tree

Hide file tree

Showing 9 changed files with 81 additions and 16 deletions.
diff --git a/backend/collab-backend/Dockerfile b/backend/collab-backend/Dockerfile
@@ -3,6 +3,6 @@ WORKDIR /usr/src/app
 COPY package*.json ./
 RUN npm install
 COPY . .
-ENV FRONTEND_HOST=https://peerprep.jonoans.com
+# ENV FRONTEND_HOST=https://peerprep.jonoans.com
 EXPOSE 9000
 CMD [ "node", "index.js" ]
diff --git a/backend/communication-backend/Dockerfile b/backend/communication-backend/Dockerfile
@@ -3,6 +3,6 @@ WORKDIR /usr/src/app
 COPY package*.json ./
 RUN npm install
 COPY . .
-ENV FRONTEND_HOST=https://peerprep.jonoans.com
+# ENV FRONTEND_HOST=https://peerprep.jonoans.com
 EXPOSE 9001
 CMD [ "node", "index.js" ]
diff --git a/backend/matching_backend/Dockerfile b/backend/matching_backend/Dockerfile
@@ -3,8 +3,8 @@ WORKDIR /src/app
 COPY package*.json ./
 RUN npm install
 COPY . .
-ENV USER_HOST=http://peerprep-g53-fe-2022344057.ap-southeast-1.elb.amazonaws.com/api/users
-ENV FRONTEND_HOST=https://peerprep.jonoans.com
-ENV COLLAB_HOST=http://peerprep-g53-fe-2022344057.ap-southeast-1.elb.amazonaws.com
+# ENV USER_HOST=http://peerprep-g53-fe-2022344057.ap-southeast-1.elb.amazonaws.com/api/users
+# ENV FRONTEND_HOST=https://peerprep.jonoans.com
+# ENV COLLAB_HOST=http://peerprep-g53-fe-2022344057.ap-southeast-1.elb.amazonaws.com
 EXPOSE 3001
 CMD ["npm", "start"]
diff --git a/backend/question-backend/Dockerfile b/backend/question-backend/Dockerfile
@@ -3,6 +3,6 @@ WORKDIR /src/app
 COPY package*.json ./
 RUN npm install
 COPY . .
-ENV USER_HOST=http://peerprep-g53-fe-2022344057.ap-southeast-1.elb.amazonaws.com/api/users
+# ENV USER_HOST=http://peerprep-g53-fe-2022344057.ap-southeast-1.elb.amazonaws.com/api/users
 EXPOSE 8000
 CMD ["node", "index.js"]
diff --git a/backend/user_profile_backend/Dockerfile b/backend/user_profile_backend/Dockerfile
@@ -3,6 +3,6 @@ WORKDIR /src/app
 COPY package*.json ./
 RUN npm install
 COPY . .
-ENV USER_HOST=http://peerprep-g53-fe-2022344057.ap-southeast-1.elb.amazonaws.com/api/users
+# ENV USER_HOST=http://peerprep-g53-fe-2022344057.ap-southeast-1.elb.amazonaws.com/api/users
 EXPOSE 4000
 CMD ["node", "index.js"]
diff --git a/backend/user_profile_backend/controller/deleteUser.js b/backend/user_profile_backend/controller/deleteUser.js
@@ -2,7 +2,7 @@ const pool = require('../database/db.js')
 
 const deleteUserByUserID = (request, response) => {
     console.log(request.body);
-    const id = request.body.user_id;
+    const id = request.body.user_data.user_id;
     console.log(id);
 
     pool.query('DELETE FROM users WHERE user_id = $1', [id], (error, results) => {

diff --git a/backend/user_profile_backend/middleware/validateUser.js b/backend/user_profile_backend/middleware/validateUser.js
@@ -6,7 +6,7 @@ const USER_HOST = process.env.USER_HOST ? process.env.USER_HOST : "http://localh
 async function validateUser (request, response, next) {
     const token = request.headers.authorization
     let user_id
-
+    console.log(token)
     try {
         user_id = verifyJsonWebToken(token).user_data.user_id
         if (!user_id) {

diff --git a/frontend/Dockerfile b/frontend/Dockerfile
@@ -4,12 +4,12 @@ COPY package*.json ./
 RUN npm install
 COPY . .
 
-ENV REACT_APP_USER_HOST=https://peerprep.jonoans.com/api/users
-ENV REACT_APP_QUESTION_HOST=https://peerprep.jonoans.com/api/questions
-ENV REACT_APP_MATCHING_HOST=https://peerprep.jonoans.com:8443
-ENV REACT_APP_COLLAB_HOST=https://peerprep.jonoans.com
-ENV REACT_APP_COMMUNICATION_HOST=https://peerprep.jonoans.com:2096
-ENV REACT_APP_CATEGORIES_HOST=https://peerprep.jonoans.com/api/categories
+# ENV REACT_APP_USER_HOST=https://peerprep.jonoans.com/api/users
+# ENV REACT_APP_QUESTION_HOST=https://peerprep.jonoans.com/api/questions
+# ENV REACT_APP_MATCHING_HOST=https://peerprep.jonoans.com:8443
+# ENV REACT_APP_COLLAB_HOST=https://peerprep.jonoans.com
+# ENV REACT_APP_COMMUNICATION_HOST=https://peerprep.jonoans.com:2096
+# ENV REACT_APP_CATEGORIES_HOST=https://peerprep.jonoans.com/api/categories
 
 RUN npm run build
 RUN npm i -g serve

diff --git a/frontend/src/pages/UserProfile.js b/frontend/src/pages/UserProfile.js
@@ -6,7 +6,7 @@ import Box from '@mui/material/Box'
 import Toolbar from '@mui/material/Toolbar'
 import Typography from '@mui/material/Typography'
 import { createTheme, ThemeProvider } from '@mui/material/styles'
-import { Container, Paper } from '@mui/material'
+import { Container, Paper, Modal} from '@mui/material'
 import axios from 'axios'
 import useCookie from '../components/useCookie'
 import Button from '@mui/material/Button'
@@ -18,6 +18,19 @@ const defaultTheme = createTheme({
     mode: 'dark',
   },
 })
+
+const modal_style = {
+  position: "absolute",
+  top: "50%",
+  left: "50%",
+  transform: "translate(-50%, -50%)",
+  width: 400,
+  bgcolor: "background.paper",
+  border: "2px solid #000",
+  boxShadow: 24,
+  p: 4,
+};
+
 const USER_HOST = process.env.REACT_APP_USER_HOST ? process.env.REACT_APP_USER_HOST : "http://localhost:4000/api/users"
 export default function UserProfile () {
   const [user, setUser] = useState({})
@@ -26,6 +39,7 @@ export default function UserProfile () {
 
   const [isEditingUserName, setIsEditingUserName] = useState(false)
   const [editedUsername, setEditedUsername] = useState(user.username)
+  const [showModal, setShowModal] = useState(false)
 
   const [isEditingEmail, setIsEditingEmail] = useState(false)
 
@@ -155,6 +169,10 @@ export default function UserProfile () {
     }
   }
 
+  const handleCloseModal = () => {
+    setShowModal(false)
+  }
+
 
   const handleBlurBio = (event) => {
     setIsEditingBio(false)
@@ -214,6 +232,32 @@ export default function UserProfile () {
       })
   }
 
+  const handleUnregister = () => {
+    setShowModal(true)
+  }
+
+  const handleConfirmUnregister = () => {
+    axios.delete(`${USER_HOST}/deleteUser`, {
+      headers: {
+        'Content-Type': 'application/json',
+        'Authorization': getAuthCookie()
+      },
+    })
+      .then((response) => {
+        alert('User deleted successfully.')
+        console.log(response.data)
+        window.location.href = '/'
+      })
+      .catch((error) => {
+        console.error('Error:', error)
+        alert('Error deleting user.')
+      })
+  }
+
+  const handleCancelUnregister = () => {
+    setShowModal(false)
+  }
+
 
   return (
     <ThemeProvider theme={defaultTheme}>
@@ -300,9 +344,30 @@ export default function UserProfile () {
               </Typography>
             </div>
 
+            <Button color='error' onClick={handleUnregister}>Unregister</Button>
+
           </Paper>
         </Container>
       </Box>
+
+      <Modal
+        open={showModal}
+        onClose={handleCloseModal}
+        aria-labelledby="modal-modal-title"
+        aria-describedby="modal-modal-description"
+      >
+        <Box sx={modal_style}>
+          <Typography id="modal-modal-title" variant="h6" component="h2">
+            WARNING
+          </Typography>
+          <Typography id="modal-modal-description" sx={{ mt: 2 }}>
+            Are you sure that you want to delete your profile? This action is irreversible.
+          </Typography>
+          <Button onClick={handleConfirmUnregister}>Yes</Button>
+          <Button onClick={handleCancelUnregister}>Cancel</Button>
+        </Box>
+      </Modal>
+
     </ThemeProvider >
   )
 }