Merge pull request #36 from Jittojoyes98/develop

fix: preview buttons

src/Dashboard/Dashboard.jsx

@@ -8,6 +8,7 @@ import CreateButton from "../_ui/CreateButton/CreateButton";
 import dropDownSvg from "../../assets/empty.svg";
 import { CircularProgressLoader } from "../_ui/Loader/CircularProgress";
 import { addToLocalStorage, getDataFromLocalStorage } from "../_helpers/utils";
+import DashboardStats from "./DashboardStats";
 
 const Dashboard = () => {
   const { currentUser, setCurrentUser, signOut } = useAuthContext();
@@ -50,7 +51,7 @@ const Dashboard = () => {
     <div className="dashboard-wrapper">
       <div className="dashboard-main">
         <div className="left-dashboard-wrapper">
-          <p>Workspaces and Responses</p>
+          <DashboardStats />
         </div>
         <div className="right-dashboard-wrapper">
           <div className="right-dashboard">

src/Dashboard/DashboardCard.jsx

@@ -56,16 +56,18 @@ const DashboardCard = ({ formData }) => {
             <img src={dropDownSvg} alt="select" />
           </Box>
           <Menu
-            id="basic-menu"
+            id="form-action-menu"
             anchorEl={anchorEl}
             open={open}
             onClose={handleClose}
             MenuListProps={{
               "aria-labelledby": "basic-button",
             }}
           >
-            <MenuItem onClick={handleClose}>Profile</MenuItem>
-            <MenuItem onClick={handleClose}>My account</MenuItem>
+            <MenuItem onClick={handleClose}>
+              <Link to={`/${formData.id}/results`}>Results</Link>
+            </MenuItem>
+            <MenuItem onClick={handleClose}>Rename</MenuItem>
             <MenuItem onClick={handleDelete}>Delete</MenuItem>
           </Menu>
         </Box>

src/Dashboard/DashboardStats.jsx

@@ -0,0 +1,12 @@
+import Box from "@mui/material/Box";
+import React from "react";
+
+const DashboardStats = () => {
+  return (
+    <Box>
+      <p>Workspaces and Responses</p>
+    </Box>
+  );
+};
+
+export default DashboardStats;

src/Editor/SortableItems.jsx

@@ -39,13 +39,18 @@ const SortableItems = ({ id, selectedItem, item }) => {
   const open = Boolean(anchorEl);
 
   const handleClick = (event) => {
+    console.log(event.currentTarget.id);
+    // if (event) {
+    //   event.stopPropagation();
+    // }
     setAnchorEl(event.currentTarget);
   };
   const handleDelete = () => {
     setAnchorEl(null);
     deleteForms(formData.id);
   };
-  const handleClose = () => {
+  const handleClose = (event) => {
+    // event.stopPropagation();
     setAnchorEl(null);
   };
 

src/LoginPage/index.jsx

@@ -87,7 +87,6 @@ const LoginPage = () => {
     },
     validationSchema: loginSchema,
     onSubmit: (values) => {
-      console.log(values);
       handleForm(values.email, values.password);
     },
   });
@@ -115,7 +114,7 @@ const LoginPage = () => {
       <div className="auth-form-wrapper">
         {/* add a wrapper div here */}
         <span className="centre-div">
-          <a href="/">
+          <a href="/" className="large-text-light">
             {/* image will be used here now just the Name */}
             Dropform
           </a>

src/_layout/Header.jsx

@@ -136,12 +136,12 @@ const Header = ({ layout }) => {
           </div>
           <div>options</div>
           <div className="auth-content">
-            <div>
+            <div className="centre-div ">
               <div>
-                <Button>Preview</Button>
+                <Button className="secondary-button">Preview</Button>
               </div>
               <div>
-                <Button>Publish</Button>
+                <Button className="secondary-button">Publish</Button>
               </div>
             </div>
 

src/_styles/dashboard.scss

@@ -40,6 +40,7 @@
   }
   .left-dashboard-wrapper {
     width: 256px;
+    padding: 0px 20px;
     flex-shrink: 0;
   }
   .right-dashboard-wrapper {

src/_styles/theme.scss

@@ -84,6 +84,28 @@ img {
   height: 100%;
 }
 
+#form-action-menu {
+  .MuiPaper-root {
+    box-shadow: rgba(0, 0, 0, 0.08) 0px 2px 4px,
+      rgba(0, 0, 0, 0.06) 0px 2px 12px;
+    border-radius: 8px;
+    color: $body-text-color;
+  }
+  .MuiMenuItem-root {
+    font-size: 14px;
+    font-family: $font-family;
+  }
+  .MuiMenuItem-root:first-child {
+    background-color: $white-color;
+  }
+  .MuiMenuItem-root:last-child {
+    color: $delete-color;
+  }
+  .MuiMenuItem-root:hover {
+    background-color: rgb(240, 240, 240);
+  }
+}
+
 // Main styles and reusable classes
 .main {
   height: 100%;