Merge pull request #4 from DaRichardX/dev

Added 'use client' on files with onClick, reverted modal-8 back

Author: DaRichardX

src/components/dashboard/capstone/overview/confirmation-prompt.js

@@ -1,3 +1,5 @@
+'use client';
+
 import React from "react";
 import Avatar from "@mui/material/Avatar";
 import Box from "@mui/material/Box";

src/components/widgets/modals/modal-8.js

@@ -1,63 +1,33 @@
-import React from "react";
-import Avatar from "@mui/material/Avatar";
-import Box from "@mui/material/Box";
-import Button from "@mui/material/Button";
-import Container from "@mui/material/Container";
-import Paper from "@mui/material/Paper";
-import Stack from "@mui/material/Stack";
-import Typography from "@mui/material/Typography";
-import { Warning as WarningIcon } from "@phosphor-icons/react/dist/ssr/Warning";
+import * as React from 'react';
+import Avatar from '@mui/material/Avatar';
+import Box from '@mui/material/Box';
+import Button from '@mui/material/Button';
+import Container from '@mui/material/Container';
+import Paper from '@mui/material/Paper';
+import Stack from '@mui/material/Stack';
+import Typography from '@mui/material/Typography';
+import { Warning as WarningIcon } from '@phosphor-icons/react/dist/ssr/Warning';
 
-export function Modal8({ setModal, deactivateRegistrationBtn }) {
+export function Modal8() {
   return (
-    <Box
-      sx={{
-        position: "fixed",
-        top: "50%",
-        left: "50%",
-        transform: "translate(-50%, -50%)",
-        zIndex: 9999,
-      }}
-    >
+    <Box sx={{ bgcolor: 'var(--mui-palette-background-level1)', p: 3 }}>
       <Container maxWidth="sm">
-        <Paper
-          sx={{
-            border: "1px solid var(--mui-palette-divider)",
-          }}
-        >
-          <Stack direction="row" spacing={2} sx={{ display: "flex", p: 3 }}>
-            <Avatar
-              sx={{
-                bgcolor: "var(--mui-palette-error-50)",
-                color: "var(--mui-palette-error-main)",
-              }}
-            >
+        <Paper sx={{ border: '1px solid var(--mui-palette-divider)', boxShadow: 'var(--mui-shadows-16)' }}>
+          <Stack direction="row" spacing={2} sx={{ display: 'flex', p: 3 }}>
+            <Avatar sx={{ bgcolor: 'var(--mui-palette-error-50)', color: 'var(--mui-palette-error-main)' }}>
               <WarningIcon fontSize="var(--Icon-fontSize)" />
             </Avatar>
             <Stack spacing={3}>
               <Stack spacing={1}>
-                <Typography variant="h5">Deactivate Submissions?</Typography>
+                <Typography variant="h5">Deactivate account</Typography>
                 <Typography color="text.secondary" variant="body2">
-                  Are you sure you want to deactivate all submissions? This
+                  Are you sure you want to deactivate your account? All of your data will be permanently removed. This
                   action cannot be undone.
                 </Typography>
               </Stack>
-              <Stack
-                direction="row"
-                spacing={2}
-                sx={{ justifyContent: "flex-end" }}
-              >
-                <Button color="secondary" onClick={() => setModal(false)}>
-                  Cancel
-                </Button>
-                <Button
-                  color="error"
-                  variant="contained"
-                  onClick={() => {
-                    deactivateRegistrationBtn();
-                    setModal(false);
-                  }}
-                >
+              <Stack direction="row" spacing={2} sx={{ justifyContent: 'flex-end' }}>
+                <Button color="secondary">Cancel</Button>
+                <Button color="error" variant="contained">
                   Deactivate
                 </Button>
               </Stack>
@@ -67,4 +37,4 @@ export function Modal8({ setModal, deactivateRegistrationBtn }) {
       </Container>
     </Box>
   );
-}
+}

src/components/widgets/modals/modal-9.js

@@ -1,4 +1,4 @@
-'use client'; //TODO: FIX THIS SHIT
+'use client'; //TODO: FIX THIS 
 
 import * as React from "react";
 import Avatar from "@mui/material/Avatar";