diff --git a/src/components/AddJob/AddJob.jsx b/src/components/AddJob/AddJob.jsx
index a5ee6c3..c29254c 100644
--- a/src/components/AddJob/AddJob.jsx
+++ b/src/components/AddJob/AddJob.jsx
@@ -1,45 +1,21 @@
-import { Field, Form, Formik } from "formik";
-import React, { useEffect, useState } from "react";
-import { useDispatch, useSelector } from "react-redux";
-import * as Yup from "yup";
-import usersService from "../../services/UsersService";
-import { tableReload } from "../../store/TableReloads";
-import InputCom from "../Helpers/Inputs/InputCom";
-import LoadingSpinner from "../Spinners/LoadingSpinner";
+import {
+  validationSchema as VS,
+  getWalletDetail,
+  useDispatch,
+  useSelector,
+  usersService,
+  initialValues as IV,
+  initialReqState,
+  useState,
+  tableReload,
+  Formik,
+  InputCom,
+  Field,
+  Form,
+  LoadingSpinner,
+} from "./settings";
 
-const validationSchema = Yup.object().shape({
-  country: Yup.string()
-    .min(1, "Minimum 3 characters")
-    .max(25, "Maximum 25 characters")
-    .required("Currency is required"),
-  price: Yup.string()
-    .typeError("Invalid number")
-    .min(1, "Price must be greater than 0")
-    .test("no-e", "Invalid number", (value) => {
-      if (value && /\d+e/.test(value)) {
-        return false;
-      }
-      return true;
-    })
-    .required("Price is required"),
-  title: Yup.string()
-    .min(5, "Minimum 5 characters")
-    .max(149, "Maximum 149 characters")
-    .required("Title is required"),
-  description: Yup.string()
-    .min(5, "Minimum 5 characters")
-    .max(299, "Maximum 299 characters")
-    .required("Description is required"),
-  job_detail: Yup.string()
-    .min(3, "Minimum 3 characters")
-    .max(499, "Maximum 499 characters")
-    .required("Details is required"),
-  timeline_days: Yup.number()
-    .typeError("you must specify a number")
-    .min(1, "Price must be greater than 0")
-    .required("Timeline is required"),
-  category: Yup.array().min(1, "Select at least one checkbox"),
-});
+const validationSchema = VS;
 
 function AddJob({ popUpHandler, categories }) {
   const ApiCall = new usersService();
@@ -48,44 +24,13 @@ function AddJob({ popUpHandler, categories }) {
 
   let dispatch = useDispatch();
 
-  const getWalletDetail = (countryParams) => {
-    // A FUNCTION TO GET USER BALANCE BASED ON COUNTRY SELECTED
-    const walletChecker = walletDetails?.data.find(
-      (item) => item.country === countryParams
-    );
-    return walletChecker
-      ? {
-          description: walletChecker.description,
-          country: walletChecker.country,
-        }
-      : "";
-  };
-
-  const walletAmount = getWalletDetail(userDetails.country); // GETTING USER BALANCE BASED ON COUNTRY SELECTED
-
-  let initialValues = {
-    // initial values for formik
-    country: walletAmount?.description,
-    price: "",
-    title: "",
-    description: "",
-    job_detail: "",
-    timeline_days: "",
-    category: [],
-  };
-
-  let [requestStatus, setRequestStatus] = useState({
-    loading: false,
-    status: false,
-    message: "",
-  }); // Holds state when submit button is pressed
-
-  // const getWalletDetail = (country) => { // A FUNCTION TO GET USER BALANCE BASED ON COUNTRY SELECTED
-  //   const walletChecker = walletDetails?.data.find(
-  //     (item) => item.country === country
-  //   );
-  //   return walletChecker ? walletChecker.amount : 0;
-  // };
+  const getWalletDetails = getWalletDetail(
+    userDetails.component,
+    walletDetails
+  );
+  const walletAmount = getWalletDetails; // GETTING USER BALANCE BASED ON COUNTRY SELECTED
+  const initialValues = { ...IV, country: walletAmount?.description };
+  const [requestStatus, setRequestStatus] = useState(initialReqState); // Holds state when submit button is pressed
 
   const handleAddJob = async (values, helpers) => {
     const reqData = {
@@ -98,21 +43,6 @@ function AddJob({ popUpHandler, categories }) {
       category: values.category?.join("@"),
     };
 
-    // const walletAmount = getWalletDetail(reqData.country); // GETTING USER BALANCE BASED ON COUNTRY SELECTED
-
-    // if (reqData.price > walletAmount) {
-    //   setRequestStatus({
-    //     loading: false,
-    //     status: false,
-    //     message: "Insufficient Balance",
-    //   });
-
-    //   setTimeout(() => {
-    //     setRequestStatus({ loading: false, status: false, message: "" });
-    //   }, 1500);
-    //   return;
-    // }
-
     setRequestStatus({ loading: true, status: false, message: "" });
 
     try {
@@ -150,6 +80,14 @@ function AddJob({ popUpHandler, categories }) {
     }
   };
 
+  // Check if the user is using iOS
+  const isIOS = /MacIntel|MacPPC/.test(navigator.platform) && !window.MSStream;
+
+  // Check if the user is using Windows
+  const isWindows = /Windows/.test(navigator.userAgent);
+
+  // console.log(isIOS, isWindows, navigator);
+
   return (
     <div className="add-job p-5 w-full bg-white dark:bg-dark-white dark:text-white rounded-md flex flex-col justify-between">
       <Formik
@@ -249,7 +187,7 @@ function AddJob({ popUpHandler, categories }) {
                     <div className="sm:w-[60%] w-full">
                       <label
                         htmlFor="Job Delivery Details"
-                        className='className="input-label text-[#181c32] dark:text-white text-[13.975px] leading-[20.9625px] font-semibold flex items-center gap-1'
+                        className='input-label text-[#181c32] dark:text-white text-[13.975px] leading-[20.9625px] font-semibold flex items-center gap-1'
                       >
                         Job Delivery Details
                         {props.errors.job_detail &&
@@ -276,18 +214,19 @@ function AddJob({ popUpHandler, categories }) {
                         htmlFor="Job Categories"
                         className="input-label text-[#181c32] dark:text-white text-[13.975px] leading-[20.9625px] font-semibold flex item-center gap-1"
                       >
-                        Categories
+                        Categories ({`multiple categories - ${isIOS ? "⌘" : isWindows ? "Ctrl+" : ""}`})
                         {props.errors.category && props.touched.category && (
                           <span className="text-[12px] text-red-500">
                             {props.errors.category}
                           </span>
                         )}
+
                       </label>
                       <select
                         id="category"
                         name="category"
                         value={props.values.category}
-                        className={`input-field p-2 mt-3 rounded-md placeholder:text-base text-dark-gray dark:text-white w-full h-[5.4rem] bg-slate-100 dark:bg-[#11131F] focus:ring-0 focus:outline-none border`}
+                        className={`input-field p-2 mt-1 rounded-md placeholder:text-base text-dark-gray dark:text-white w-full h-[4.7rem] bg-slate-100 dark:bg-[#11131F] focus:ring-0 focus:outline-none border`}
                         onChange={props.handleChange}
                         onBlur={props.handleBlur}
                         multiple
@@ -402,7 +341,6 @@ function AddJob({ popUpHandler, categories }) {
                       <button
                         type="submit"
                         className="w-[152px] h-[46px] flex justify-center items-center btn-gradient text-base rounded-full text-white"
-                        // className='w-20 h-11 flex justify-center items-center btn-gradient text-base rounded-full text-white'
                       >
                         Add Job
                       </button>
diff --git a/src/components/AddJob/settings.js b/src/components/AddJob/settings.js
new file mode 100644
index 0000000..3c784ae
--- /dev/null
+++ b/src/components/AddJob/settings.js
@@ -0,0 +1,100 @@
+import { Field, Form, Formik } from "formik";
+import { useEffect, useState } from "react";
+import { useDispatch, useSelector } from "react-redux";
+import * as Yup from "yup";
+import usersService from "../../services/UsersService";
+import { tableReload } from "../../store/TableReloads";
+import InputCom from "../Helpers/Inputs/InputCom";
+import LoadingSpinner from "../Spinners/LoadingSpinner";
+
+// Initialize state for request values
+const initialReqState = {
+  loading: false,
+  status: false,
+  message: "",
+};
+
+// For form initial values
+const initialValues = {
+  // initial values for formik
+  country: "",
+  price: "",
+  title: "",
+  description: "",
+  job_detail: "",
+  timeline_days: "",
+  category: [],
+};
+
+// const getWalletDetail = (country) => { // A FUNCTION TO GET USER BALANCE BASED ON COUNTRY SELECTED
+//   const walletChecker = walletDetails?.data.find(
+//     (item) => item.country === country
+//   );
+//   return walletChecker ? walletChecker.amount : 0;
+// };
+
+// To get the validation schema
+const validationSchema = Yup.object().shape({
+  country: Yup.string()
+    .min(1, "Minimum 3 characters")
+    .max(25, "Maximum 25 characters")
+    .required("Currency is required"),
+  price: Yup.string()
+    .typeError("Invalid number")
+    .min(1, "Price must be greater than 0")
+    .test("no-e", "Invalid number", (value) => {
+      if (value && /\d+e/.test(value)) {
+        return false;
+      }
+      return true;
+    })
+    .required("Price is required"),
+  title: Yup.string()
+    .min(5, "Minimum 5 characters")
+    .max(149, "Maximum 149 characters")
+    .required("Title is required"),
+  description: Yup.string()
+    .min(5, "Minimum 5 characters")
+    .max(299, "Maximum 299 characters")
+    .required("Description is required"),
+  job_detail: Yup.string()
+    .min(3, "Minimum 3 characters")
+    .max(499, "Maximum 499 characters")
+    .required("Details is required"),
+  timeline_days: Yup.number()
+    .typeError("you must specify a number")
+    .min(1, "Price must be greater than 0")
+    .required("Timeline is required"),
+  category: Yup.array().min(1, "Select category"),
+});
+
+const getWalletDetail = (countryParams, walletDetails) => {
+  // A FUNCTION TO GET USER BALANCE BASED ON COUNTRY SELECTED
+  const walletChecker = walletDetails?.data.find(
+    (item) => item.country === countryParams
+  );
+  return walletChecker
+    ? {
+        description: walletChecker.description,
+        country: walletChecker.country,
+      }
+    : "";
+};
+
+export {
+  Field,
+  Form,
+  Formik,
+  useState,
+  useEffect,
+  useDispatch,
+  useSelector,
+  usersService,
+  InputCom,
+  LoadingSpinner,
+  initialReqState,
+  initialValues,
+  validationSchema,
+  getWalletDetail,
+  tableReload
+};
diff --git a/src/components/jobPopout/EditJobPopout.jsx b/src/components/jobPopout/EditJobPopout.jsx
index 658ab51..a06d995 100644
--- a/src/components/jobPopout/EditJobPopout.jsx
+++ b/src/components/jobPopout/EditJobPopout.jsx
@@ -52,6 +52,8 @@ const EditJobPopOut = ({
 }) => {
   const dispatch = useDispatch();
   const { userDetails } = useSelector((state) => state.userDetails);
+  const { walletDetails } = useSelector((state) => state.walletDetails);
+
   
   const uploadedImage = `${userDetails.session_image_server}${localStorage.getItem('session_token')}/job/${details?.job_uid}`
 
@@ -172,6 +174,12 @@ const EditJobPopOut = ({
     }
   };
 
+    // Check if the user is using iOS
+    const isIOS = /MacIntel|MacPPC/.test(navigator.platform) && !window.MSStream;
+
+    // Check if the user is using Windows
+    const isWindows = /Windows/.test(navigator.userAgent);
+
   return (
     <ModalCom action={onClose} situation={situation} className="edit-popup">
       <div className="logout-modal-wrapper lg:w-[600px] h-full lg:h-auto bg-white dark:bg-dark-white lg:rounded-2xl">
@@ -313,38 +321,53 @@ const EditJobPopOut = ({
                       </div>
 
                       <div className="sm:w-[35%] w-full">
-                        <div
-                          htmlFor="Job Categories"
-                          className='className="input-label text-[#181c32] dark:text-white text-[13.975px] leading-[20.9625px] font-semibold block"'
-                          id="checked-group"
-                        >
-                          Categories
-                        </div>
-                        <div
-                          className="sm:flex-col flex flex-wrap px-3 mt-3"
-                          role="group"
-                          aria-labelledby="checked-group"
-                        >
-                          {categories && Object.entries(categories)?.map(([key, value]) => (
-                            <label
-                              key={key}
-                              className="flex gap-1 w-full items-center"
-                            >
-                              <Field
-                                type="checkbox"
-                                name="category"
-                                value={key}
-                              />
-                              <span className="text-[13.975px]">{value}</span>
-                            </label>
-                          ))}
-                          <span className="h-5 text-sm italic text-[#cf3917]">
-                            {props.errors.category &&
-                              props.touched.category &&
-                              "please select a category"}
+                      <label
+                        htmlFor="Job Categories"
+                        className="input-label text-[#181c32] dark:text-white text-[13.975px] leading-[20.9625px] font-semibold flex item-center gap-1"
+                      >
+                        Categories ({`multiple categories - ${isIOS ? "⌘" : isWindows ? "Ctrl+" : ""}`})
+                        {props.errors.category && props.touched.category && (
+                          <span className="text-[12px] text-red-500">
+                            {props.errors.category}
                           </span>
-                        </div>
-                      </div>
+                        )}
+
+                      </label>
+                      <select
+                        id="category"
+                        name="category"
+                        value={props.values.category}
+                        className={`input-field p-2 mt-1 rounded-md placeholder:text-base text-dark-gray dark:text-white w-full h-[4.7rem] bg-slate-100 dark:bg-[#11131F] focus:ring-0 focus:outline-none border`}
+                        onChange={props.handleChange}
+                        onBlur={props.handleBlur}
+                        multiple
+                      >
+                        {walletDetails?.loading ? (
+                          <option className="text-slate-500 text-lg" value="">
+                            Loading...
+                          </option>
+                        ) : walletDetails.data.length ? (
+                          <>
+                            {/* <option className="text-slate-500 text-lg" value="">
+                              Select a Category
+                            </option> */}
+                            {Object?.entries(categories).map(([key, value]) => (
+                              <option
+                                key={key}
+                                className="text-slate-500 "
+                                value={key}
+                              >
+                                {value}
+                              </option>
+                            ))}
+                          </>
+                        ) : (
+                          <option className="text-slate-500 text-lg" value="">
+                            No Options Found! Try Again
+                          </option>
+                        )}
+                      </select>
+                    </div>
                     </div>
                     <div className="w-full flex items-center gap-2 mb-2">
                       {/* FOR TASK IMAGE */}