From 2c65742538615c9c5ff71d18567b22ba3d2d62f9 Mon Sep 17 00:00:00 2001
From: tamalCodes <tamalcodes@gmail.com>
Date: Sat, 19 Oct 2024 22:32:07 +0530
Subject: [PATCH 1/3] fix: signup for clubs flow

---
 package-lock.json                             |   4 +-
 package.json                                  |   1 +
 .../profileCompletion/ProfileCompletion.jsx   | 158 +++++-------------
 src/pages/dashboard/Dashboard.jsx             |  35 ++--
 src/redux/slice/userSlice.js                  |   2 +-
 src/static/Constants.js                       |   4 +
 src/utils/getProfileFields.js                 |  51 ++----
 7 files changed, 74 insertions(+), 181 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index d628bd92..68cfbbb8 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -34,6 +34,7 @@
         "dotenv": "^16.3.1",
         "framer-motion": "^11.0.3",
         "js-cookie": "^3.0.5",
+        "lodash": "^4.17.21",
         "react": "^18.2.0",
         "react-calendar": "^4.8.0",
         "react-dom": "^18.2.0",
@@ -13776,7 +13777,8 @@
     },
     "node_modules/lodash": {
       "version": "4.17.21",
-      "license": "MIT"
+      "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
+      "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg=="
     },
     "node_modules/lodash.camelcase": {
       "version": "4.3.0",
diff --git a/package.json b/package.json
index 36e922cb..94304f07 100644
--- a/package.json
+++ b/package.json
@@ -48,6 +48,7 @@
     "dotenv": "^16.3.1",
     "framer-motion": "^11.0.3",
     "js-cookie": "^3.0.5",
+    "lodash": "^4.17.21",
     "react": "^18.2.0",
     "react-calendar": "^4.8.0",
     "react-dom": "^18.2.0",
diff --git a/src/components/shared/profileCompletion/ProfileCompletion.jsx b/src/components/shared/profileCompletion/ProfileCompletion.jsx
index 79274ca7..1b37f0aa 100644
--- a/src/components/shared/profileCompletion/ProfileCompletion.jsx
+++ b/src/components/shared/profileCompletion/ProfileCompletion.jsx
@@ -1,142 +1,60 @@
 /* eslint-disable no-unused-vars */
-import { useEffect, useState } from "react";
+import { useState } from "react";
 import { useSelector } from "react-redux";
 
 import getProfileFields from "../../../utils/getProfileFields";
-import Button from "../buttons/globalbutton/Button";
 import "./ProfileCompletion.scss";
 
-const ProfileCompletion = ({ editProfile }) => {
-  const [part, setPart] = useState(editProfile ? 2 : 1);
-  const [currentStep, setcurrentStep] = useState(2);
-  const [currentIndex, setcurrentIndex] = useState(0);
-  const [formData, setFormData] = useState({});
-  const [errors, setErrors] = useState({});
+const ProfileCompletion = () => {
+  const [credentials, setCredentials] = useState({});
   const user = useSelector((state) => state.user);
 
-  useEffect(() => {
-    if (editProfile) {
-      setFormData(user);
-    }
-  }, [editProfile]);
-
-  const fields = getProfileFields(user, editProfile);
-
-  const totalfields = fields.length;
-
-  const handleIncrementStep = () => {
-    if (currentStep + 2 <= totalfields) {
-      setcurrentIndex(currentIndex + 2);
-      setcurrentStep(currentStep + 2);
-    }
-  };
-
-  const handleDecrementStep = () => {
-    if (currentStep - 2 >= 2) {
-      setcurrentIndex(currentIndex - 2);
-      setcurrentStep(currentStep - 2);
-    }
-  };
+  const fields = getProfileFields(user);
 
   const handleChange = (e) => {
-    setFormData({ ...formData, [e.target.name]: e.target.value });
-    setErrors({ ...errors, [e.target.name]: undefined });
-  };
-
-  const handleSubmit = async (e) => {
-    e.preventDefault();
-
-    //  formData is an object
-    // lenght of an object
-
-    // const response = await UpdateUser(formData);
-    // if (response?.status !== 200) {
-    //   showErrorToast(response?.data?.message);
-    // } else {
-    //   dispatch(updateUserData(formData));
-    //   setFormData({});
-    //   setShowProfileModal(false);
-    //   seteditProfile(false);
-    //   showSuccessToast(response?.data?.message);
-    //   mutate(clubEndpoints.details(user?.userName));
-    // }
+    setCredentials({
+      ...credentials,
+      [e.target.name]: e.target.value,
+    });
   };
 
   return (
     <div className="profilecompletion_overlay">
       <div className="profilecompletion_modal">
         <div className="profilecompletion_header">
-          {part === 1 ? (
-            <h1> Choose Account Type </h1>
-          ) : (
-            <h1> {editProfile ? "Edit Profile" : `We're almost done`} </h1>
-          )}
+          <h1> We&apos;re almost done </h1>
 
-          {part === 1 ? (
-            <p>Your Account Type is permanent and cannot be changed later.</p>
-          ) : !editProfile ? (
-            <p>
-              Please complete your profile to enjoy the full benefits of the
-              platform.
-            </p>
-          ) : null}
+          <p>
+            Please complete your profile to enjoy the full benefits of the
+            platform.
+          </p>
         </div>
 
-        {/* <form>
-          {fields.slice(currentIndex, currentIndex + 2).map((elId) => {
-            const formElement = ProfileElements.find(
-              (element) => element.id === elId,
-            );
-
-            return (
-              <div className="profilecompletion_element" key={formElement.id}>
-                <label>{formElement?.label}</label>
-                {formElement?.id === "description" ? (
-                  <textarea
-                    type={formElement?.type}
-                    name={formElement?.id}
-                    value={formData[formElement?.id] || ""}
-                    onChange={handleChange}
-                    className="auth_input"
-                    placeholder={formElement?.placeholder}
-                  />
-                ) : (
-                  <input
-                    type={formElement?.type}
-                    name={formElement?.id}
-                    value={formData[formElement?.id] || ""}
-                    onChange={handleChange}
-                    className="auth_input"
-                    placeholder={formElement?.placeholder}
-                  />
-                )}
-              </div>
-            );
-          })}
-        </form> */}
-
-        <div className="profilecompletion_btndiv">
-          <Button
-            variant="solid"
-            disabled={currentStep === 2}
-            onClickfunction={handleDecrementStep}
-          >
-            Previous
-          </Button>
-          {currentStep == totalfields ? (
-            <Button
-              variant="solid"
-              onClickfunction={handleSubmit}
-              disabled={Object.keys(formData).length === 0}
-            >
-              Finish
-            </Button>
-          ) : (
-            <Button variant="solid" onClickfunction={handleIncrementStep}>
-              Next
-            </Button>
-          )}
-        </div>
+        <form>
+          {fields.map((field) => (
+            <div className="profilecompletion_element" key={field}>
+              <label>{field}</label>
+              {field === "description" ? (
+                <textarea
+                  name={field}
+                  value={credentials[field] || ""}
+                  onChange={handleChange}
+                  className="auth_input"
+                  placeholder={`Enter your ${field}`}
+                />
+              ) : (
+                <input
+                  type="text" // Assuming the default type for other fields is text
+                  name={field}
+                  value={credentials[field] || ""}
+                  onChange={handleChange}
+                  className="auth_input"
+                  placeholder={`Enter your ${field}`}
+                />
+              )}
+            </div>
+          ))}
+        </form>
       </div>
     </div>
   );
diff --git a/src/pages/dashboard/Dashboard.jsx b/src/pages/dashboard/Dashboard.jsx
index bc1d3f72..1ae8a33f 100644
--- a/src/pages/dashboard/Dashboard.jsx
+++ b/src/pages/dashboard/Dashboard.jsx
@@ -1,6 +1,5 @@
 import { useQuery } from "@tanstack/react-query";
-import Cookies from "js-cookie";
-import React, { useCallback, useEffect, useState } from "react";
+import { useCallback, useState } from "react";
 import { AiOutlineSave } from "react-icons/ai";
 import { FiEdit3 } from "react-icons/fi";
 import { MdOutlineEdit } from "react-icons/md";
@@ -15,13 +14,10 @@ import { eventEndpoints } from "../../integrations/ApiEndpoints";
 import { fetchDashboard } from "../../service/MilanApi";
 import { defaults } from "../../static/Constants";
 import fetcher from "../../utils/Fetcher";
-import { checkMissingFields } from "../../utils/checkMissingFields";
 import convertToBase64 from "../../utils/convertToBase64";
 import "./Dashboard.scss";
 
 const Dashboard = () => {
-  const [showProfileModal, setShowProfileModal] = useState(false);
-  const [editProfile, seteditProfile] = useState(false);
   const [isExpanded, setIsExpanded] = useState(false);
   const [coverImage, setCoverImage] = useState("");
   const [logo, setLogo] = useState("");
@@ -52,20 +48,15 @@ const Dashboard = () => {
 
   const { data: events } = useSWR(eventEndpoints.all, fetcher);
 
-  useEffect(() => {
-    if (!Cookies.get("skipProfileCompletion") && checkMissingFields(data)) {
-      setShowProfileModal(true);
-    }
-  }, []);
-
   const handleUpdateProfile = () => {
-    if (logo !== "" || coverImage !== "") {
-      setShowProfileModal(!showProfileModal);
-      seteditProfile(true);
-    } else {
-      setShowProfileModal(!showProfileModal);
-      seteditProfile(true);
-    }
+    // if (logo !== "" || coverImage !== "") {
+    //   setShowProfileModal(!showProfileModal);
+    //   seteditProfile(true);
+    // } else {
+    //   setShowProfileModal(!showProfileModal);
+    //   seteditProfile(true);
+    // }
+    console.log("Update Profile");
   };
 
   const handleCreateDashboardImage = useCallback(async (e) => {
@@ -86,13 +77,7 @@ const Dashboard = () => {
     <>
       <Navbar />
 
-      {showProfileModal && (
-        <ProfileCompletion
-          setShowProfileModal={setShowProfileModal}
-          editProfile={editProfile}
-          seteditProfile={seteditProfile}
-        />
-      )}
+      <ProfileCompletion />
 
       <div className="dashboard_container">
         <div className="dashboard_parent">
diff --git a/src/redux/slice/userSlice.js b/src/redux/slice/userSlice.js
index 03fd846b..704d5953 100644
--- a/src/redux/slice/userSlice.js
+++ b/src/redux/slice/userSlice.js
@@ -1,6 +1,6 @@
 import { createSlice } from "@reduxjs/toolkit";
 
-const initialState = { isLoggedIn: false, user: {} };
+const initialState = { isLoggedIn: false };
 
 const userSlice = createSlice({
   name: "user",
diff --git a/src/static/Constants.js b/src/static/Constants.js
index bf1ad872..36009614 100644
--- a/src/static/Constants.js
+++ b/src/static/Constants.js
@@ -8,3 +8,7 @@ export const authTypeOptions = [
   { value: "individual", label: "Individual" },
   { value: "club", label: "Organization" },
 ];
+
+export const brandingFields = ["tagLine", "description"];
+export const addressFields = ["city", "state", "address", "country", "pincode"];
+export const mandatoryFields = ["name", "username"];
diff --git a/src/utils/getProfileFields.js b/src/utils/getProfileFields.js
index 12f1e304..151c1e84 100644
--- a/src/utils/getProfileFields.js
+++ b/src/utils/getProfileFields.js
@@ -1,48 +1,31 @@
+import {
+  addressFields,
+  brandingFields,
+  mandatoryFields,
+} from "@/static/Constants";
+
 function getMissingElements(info) {
   const missing = [];
 
   if (info?.userType === "club") {
-    if (!info.name) missing.push("name");
-    if (!info.tagLine) missing.push("tagLine");
-  } else {
-    if (!info.firstName) missing.push("firstName");
-    if (!info.lastName) missing.push("lastName");
+    brandingFields.forEach((field) => {
+      if (info[field] === undefined) {
+        missing.push(field);
+      }
+    });
   }
 
-  if (!info.description) missing.push("description");
-  if (!info.city) missing.push("city");
-  if (!info.state) missing.push("state");
-  if (!info.address) missing.push("address");
-  if (!info.country) missing.push("country");
-  if (!info.pincode) missing.push("pincode");
-
   return missing;
 }
 
 function getEditableFields(info) {
   return info?.userType === "club"
-    ? [
-        "name",
-        "tagLine",
-        "description",
-        "city",
-        "state",
-        "address",
-        "country",
-        "pincode",
-      ]
-    : [
-        "firstName",
-        "lastName",
-        "description",
-        "city",
-        "state",
-        "address",
-        "country",
-        "pincode",
-      ];
+    ? [...mandatoryFields, ...brandingFields, ...addressFields]
+    : [...mandatoryFields, ...addressFields];
 }
 
-export default function getProfileFields(info, isEdit) {
-  return isEdit ? getEditableFields(info) : getMissingElements(info);
+export default function getProfileFields(info) {
+  return info?.userType === "club" && (info?.tagLine === "" || !info?.tagLine)
+    ? getMissingElements(info)
+    : getEditableFields(info);
 }

From 98ce64224ed900d98348672574f4468c57ee6d9f Mon Sep 17 00:00:00 2001
From: tamalCodes <tamalcodes@gmail.com>
Date: Sat, 19 Oct 2024 23:07:32 +0530
Subject: [PATCH 2/3] fix: profile completion modal

---
 .../shared/buttons/globalbutton/Button.jsx    |  1 -
 .../profileCompletion/ProfileCompletion.jsx   | 51 ++++++++++++++++---
 .../profileCompletion/ProfileCompletion.scss  | 20 ++------
 src/pages/dashboard/Dashboard.jsx             | 13 ++---
 src/redux/slice/userSlice.js                  |  1 +
 src/service/MilanApi.js                       |  7 +--
 6 files changed, 55 insertions(+), 38 deletions(-)

diff --git a/src/components/shared/buttons/globalbutton/Button.jsx b/src/components/shared/buttons/globalbutton/Button.jsx
index 70b1632d..d16d9e3e 100644
--- a/src/components/shared/buttons/globalbutton/Button.jsx
+++ b/src/components/shared/buttons/globalbutton/Button.jsx
@@ -1,5 +1,4 @@
 /* eslint-disable react/no-unknown-property */
-import React from "react";
 import { Link } from "react-router-dom";
 import { ClipLoader } from "react-spinners";
 import styles from "./Button.module.css";
diff --git a/src/components/shared/profileCompletion/ProfileCompletion.jsx b/src/components/shared/profileCompletion/ProfileCompletion.jsx
index 1b37f0aa..be287fca 100644
--- a/src/components/shared/profileCompletion/ProfileCompletion.jsx
+++ b/src/components/shared/profileCompletion/ProfileCompletion.jsx
@@ -1,15 +1,21 @@
 /* eslint-disable no-unused-vars */
 import { useState } from "react";
-import { useSelector } from "react-redux";
+import { useDispatch, useSelector } from "react-redux";
 
+import { selectUser, updateUserData } from "@redux/slice/userSlice";
+import { UpdateUser } from "@service/MilanApi";
+import { useMutation } from "@tanstack/react-query";
+import { showErrorToast, showSuccessToast } from "@utils/Toasts";
+import _ from "lodash";
+import { Button } from "..";
 import getProfileFields from "../../../utils/getProfileFields";
 import "./ProfileCompletion.scss";
 
 const ProfileCompletion = () => {
   const [credentials, setCredentials] = useState({});
-  const user = useSelector((state) => state.user);
-
+  const user = useSelector(selectUser);
   const fields = getProfileFields(user);
+  const dispatch = useDispatch();
 
   const handleChange = (e) => {
     setCredentials({
@@ -18,6 +24,17 @@ const ProfileCompletion = () => {
     });
   };
 
+  const { mutate: handleUpdateDetails } = useMutation({
+    mutationFn: UpdateUser,
+    onSuccess: (data) => {
+      dispatch(updateUserData(credentials));
+      showSuccessToast(data?.message);
+    },
+    onError: (error) => {
+      showErrorToast(error?.message);
+    },
+  });
+
   return (
     <div className="profilecompletion_overlay">
       <div className="profilecompletion_modal">
@@ -25,15 +42,20 @@ const ProfileCompletion = () => {
           <h1> We&apos;re almost done </h1>
 
           <p>
-            Please complete your profile to enjoy the full benefits of the
-            platform.
+            To make your Organization visible to others, please complete your
+            profile.
           </p>
         </div>
 
-        <form>
+        <form
+          onSubmit={(e) => {
+            e.preventDefault();
+            handleUpdateDetails({ credentials: credentials });
+          }}
+        >
           {fields.map((field) => (
             <div className="profilecompletion_element" key={field}>
-              <label>{field}</label>
+              <label>{_.startCase(field)}</label>
               {field === "description" ? (
                 <textarea
                   name={field}
@@ -44,7 +66,7 @@ const ProfileCompletion = () => {
                 />
               ) : (
                 <input
-                  type="text" // Assuming the default type for other fields is text
+                  type="text"
                   name={field}
                   value={credentials[field] || ""}
                   onChange={handleChange}
@@ -54,6 +76,19 @@ const ProfileCompletion = () => {
               )}
             </div>
           ))}
+
+          <div className="profilecompletion_btndiv">
+            <Button
+              type="submit"
+              disabled={
+                Object.keys(credentials)?.length < 2 ||
+                credentials?.description === "" ||
+                credentials?.tagLine === ""
+              }
+            >
+              Submit
+            </Button>
+          </div>
         </form>
       </div>
     </div>
diff --git a/src/components/shared/profileCompletion/ProfileCompletion.scss b/src/components/shared/profileCompletion/ProfileCompletion.scss
index 425584da..027ec9ac 100644
--- a/src/components/shared/profileCompletion/ProfileCompletion.scss
+++ b/src/components/shared/profileCompletion/ProfileCompletion.scss
@@ -37,6 +37,7 @@
         font-weight: 700;
         color: var(--secondary);
         font-family: var(--outfit);
+        margin-bottom: 0;
 
         @media screen and (max-width: 500px) {
           font-size: 1.5rem;
@@ -44,7 +45,7 @@
       }
 
       p {
-        font-size: 1.1rem;
+        font-size: 15px;
         font-weight: 400;
         color: black;
         font-family: var(--outfit);
@@ -63,9 +64,9 @@
         flex-direction: column;
         position: relative;
         width: 100%;
+        font-family: var(--outfit);
 
         label {
-          font-family: var(--outfit);
           font-size: 17px;
           font-weight: 400;
           margin-bottom: 3px;
@@ -85,7 +86,6 @@
           font-size: 16px;
           color: red;
           margin-top: 5px;
-          font-family: var(--outfit);
         }
 
         input,
@@ -136,7 +136,6 @@
         padding: 0.5rem 1rem;
         font-size: 1rem;
         font-weight: 500;
-
         border-radius: 5px;
 
         transition: all 0.3s ease;
@@ -145,16 +144,3 @@
     }
   }
 }
-
-.crossButton {
-  padding: 0;
-  margin: 0;
-  position: absolute;
-  right: 12px;
-  top: 7px;
-  font-size: 27px;
-  border: 0;
-  box-shadow: none;
-  color: var(--secondary);
-  cursor: pointer;
-}
diff --git a/src/pages/dashboard/Dashboard.jsx b/src/pages/dashboard/Dashboard.jsx
index 1ae8a33f..ede7b20f 100644
--- a/src/pages/dashboard/Dashboard.jsx
+++ b/src/pages/dashboard/Dashboard.jsx
@@ -1,8 +1,10 @@
+import { selectUser } from "@redux/slice/userSlice";
 import { useQuery } from "@tanstack/react-query";
 import { useCallback, useState } from "react";
 import { AiOutlineSave } from "react-icons/ai";
 import { FiEdit3 } from "react-icons/fi";
 import { MdOutlineEdit } from "react-icons/md";
+import { useSelector } from "react-redux";
 import "swiper/css";
 import "swiper/css/autoplay";
 import "swiper/css/navigation";
@@ -21,7 +23,7 @@ const Dashboard = () => {
   const [isExpanded, setIsExpanded] = useState(false);
   const [coverImage, setCoverImage] = useState("");
   const [logo, setLogo] = useState("");
-
+  const user = useSelector(selectUser);
   const { data } = useQuery({
     queryKey: ["dashboardData"],
     queryFn: fetchDashboard,
@@ -49,13 +51,6 @@ const Dashboard = () => {
   const { data: events } = useSWR(eventEndpoints.all, fetcher);
 
   const handleUpdateProfile = () => {
-    // if (logo !== "" || coverImage !== "") {
-    //   setShowProfileModal(!showProfileModal);
-    //   seteditProfile(true);
-    // } else {
-    //   setShowProfileModal(!showProfileModal);
-    //   seteditProfile(true);
-    // }
     console.log("Update Profile");
   };
 
@@ -77,7 +72,7 @@ const Dashboard = () => {
     <>
       <Navbar />
 
-      <ProfileCompletion />
+      {user?.userType === "club" && !user?.tagLine && <ProfileCompletion />}
 
       <div className="dashboard_container">
         <div className="dashboard_parent">
diff --git a/src/redux/slice/userSlice.js b/src/redux/slice/userSlice.js
index 704d5953..57f9f495 100644
--- a/src/redux/slice/userSlice.js
+++ b/src/redux/slice/userSlice.js
@@ -27,6 +27,7 @@ const userSlice = createSlice({
 });
 
 export const selectIsLoggedIn = (state) => state.user.isLoggedIn;
+export const selectUser = (state) => state.user;
 
 export const { updateUserData, resetUserData, toggleUserLogin } =
   userSlice.actions;
diff --git a/src/service/MilanApi.js b/src/service/MilanApi.js
index e798dbdb..814fcb5b 100644
--- a/src/service/MilanApi.js
+++ b/src/service/MilanApi.js
@@ -62,12 +62,13 @@ export const ReportProblem = async (credentials) => {
 };
 
 // UPDATE USER
-export const UpdateUser = async (credentials) => {
+export const UpdateUser = async ({ credentials }) => {
   try {
-    const user = await Axios.post(userEndpoints.update, credentials, {
+    const response = await Axios.post(userEndpoints.update, credentials, {
       withCredentials: true,
     });
-    return user;
+
+    return response?.data;
   } catch (error) {
     return error.response;
   }

From ab6d19b4edc3d35353f133c0f9a9313d3ca7e3b3 Mon Sep 17 00:00:00 2001
From: tamalCodes <tamalcodes@gmail.com>
Date: Sun, 20 Oct 2024 21:02:32 +0530
Subject: [PATCH 3/3] fix: login UI fixes

---
 src/pages/auth/SignUp.jsx         | 32 ++++++++++++++++++++++++++++++-
 src/pages/auth/index.scss         | 12 ++++++++++++
 src/pages/dashboard/Dashboard.jsx | 12 ++++++------
 3 files changed, 49 insertions(+), 7 deletions(-)

diff --git a/src/pages/auth/SignUp.jsx b/src/pages/auth/SignUp.jsx
index e06a6ffb..1d075260 100644
--- a/src/pages/auth/SignUp.jsx
+++ b/src/pages/auth/SignUp.jsx
@@ -6,6 +6,7 @@ import { FaEye } from "react-icons/fa";
 import { FaEyeSlash } from "react-icons/fa6";
 import { FcGoogle } from "react-icons/fc";
 import { Link } from "react-router-dom";
+import Select from "react-select";
 import rightabstract from "../../assets/pictures/authpages/authbanner.png";
 import { Button } from "../../components/shared";
 import { useAuth } from "../../hooks/useAuth";
@@ -60,7 +61,36 @@ const SignUp = () => {
                   <div className="auth_dropdown"></div>
                 </div>
 
-                <div className="auth_element">
+                <div className="auth_element auth_element_mobileOnly">
+                  <label className="auth_label">
+                    Account Type
+                    <span>*</span>
+                  </label>
+
+                  <Select
+                    options={authTypeOptions}
+                    styles={{
+                      container: (baseStyles) => ({
+                        ...baseStyles,
+                        fontFamily: "Outfit, sans-serif",
+                        fontSize: "15px !important",
+                      }),
+                    }}
+                    onChange={(e) => {
+                      setCredentials((prev) => {
+                        return {
+                          ...prev,
+                          userType: e,
+                          email: "",
+                          password: "",
+                          name: "",
+                        };
+                      });
+                    }}
+                    defaultValue={authTypeOptions[1]}
+                  />
+                </div>
+                <div className="auth_element ">
                   <label className="auth_label">
                     {credentials.userType.value === "individual"
                       ? "Full Name"
diff --git a/src/pages/auth/index.scss b/src/pages/auth/index.scss
index 7335079a..0335ef9e 100644
--- a/src/pages/auth/index.scss
+++ b/src/pages/auth/index.scss
@@ -292,7 +292,15 @@
   display: none;
 }
 
+.auth_element_mobileOnly {
+  display: none !important;
+}
+
 @media screen and (max-width: 450px) {
+  .auth_element_mobileOnly {
+    display: flex !important;
+  }
+
   .signup_parent {
     display: flex;
     flex-direction: column;
@@ -358,3 +366,7 @@
   right: 15px;
   top: 40px;
 }
+
+.css-13cymwt-control {
+  font-family: var(--outfit) !important;
+}
diff --git a/src/pages/dashboard/Dashboard.jsx b/src/pages/dashboard/Dashboard.jsx
index ede7b20f..2763ec4d 100644
--- a/src/pages/dashboard/Dashboard.jsx
+++ b/src/pages/dashboard/Dashboard.jsx
@@ -82,22 +82,22 @@ const Dashboard = () => {
               className="coverimage"
               alt=""
             />
-            <input
+            {/* <input
               type="file"
               id="coverimage-input"
               className="coverimage_input"
               name="coverImage"
               onChange={handleCreateDashboardImage}
-            />
+            /> */}
 
-            <label htmlFor="coverimage-input">
+            {/* <label htmlFor="coverimage-input">
               <MdOutlineEdit className="edit_icon" />
-            </label>
+            </label> */}
 
             <div className="details">
               <div className="logo_div">
                 <img src={logo || defaults.logo} alt="" className="logo" />
-                <input
+                {/* <input
                   type="file"
                   id="logo-input"
                   className="coverimage_input"
@@ -106,7 +106,7 @@ const Dashboard = () => {
                 />
                 <label htmlFor="logo-input">
                   <MdOutlineEdit className="edit_icon logo_edit_icon" />
-                </label>{" "}
+                </label>{" "} */}
               </div>
 
               <div className="header">