Button Centralized

2023-05-16 17:48:28 +01:00
286 changed files with 18261 additions and 19580 deletions
@@ -9,16 +9,15 @@ REACT_APP_APPSITE="https://myfitapp.mermsemr.com"
 # REACT_APP_AUX_ENDPOINT="http://10.20.30.32:9083/svs/user"
 # REACT_APP_USERS_ENDPOINT="http://10.20.30.32:9083/svs/user"
-#REACT_APP_AUX_ENDPOINT="https://apigate.lotus.g1.wrenchboard.com/svs/user"
+REACT_APP_AUX_ENDPOINT="https://apigate.lotus.g1.wrenchboard.com/svs/user"
-#REACT_APP_USERS_ENDPOINT="https://apigate.lotus.g1.wrenchboard.com/svs/user"
+REACT_APP_USERS_ENDPOINT="https://apigate.lotus.g1.wrenchboard.com/svs/user"
-REACT_APP_AUX_ENDPOINT="https://apigate.lotus.g1.wrenchboard.com/en/wrench/api/v1"
+#REACT_APP_AUX_ENDPOINT="https://apigate.lotus.g1.wrenchboard.com/en/wrench/api/v1"
-REACT_APP_USERS_ENDPOINT="https://apigate.lotus.g1.wrenchboard.com/en/wrench/api/v1"
+#REACT_APP_USERS_ENDPOINT="https://apigate.lotus.g1.wrenchboard.com/en/wrench/api/v1"
 #"https://devapi.mermsemr.com/en/desktop/api/v2/myfituser"
-REACT_APP_SESSION_EXPIRE_MINUTES=600000
+REACT_APP_SESSION_EXPIRE_MINUTES=300000
 REACT_APP_SESSION_EXPIRE_MINUTES_FAMILY=600000
 REACT_APP_SESSION_EXPIRE_CHECKER=60000
 REACT_APP_LOGIN_ERROR_TIMEOUT=7000
@@ -35,41 +34,5 @@ REACT_APP_ITEM_PER_PAGE=5
 # Empty Listings
 REACT_APP_ZERO_STATE=0
 #REACT_APP_GOOGLE_CLIENT_ID_RET=234407841224-k5g7f67p908hqtegiokmjqt8qqf3hi2i.apps.googleusercontent.com
 REACT_APP_GOOGLE_CLIENT_ID=817021856543-ad9nsjgdpsu2s2jrl63j3ihrv7lbf6ma.apps.googleusercontent.com
 REACT_APP_GOOGLE_CLIENT_SECRET=aozK_2G8UjaCmLgPPkv9abIm
 REACT_APP_GOOGLE_CLIENT_SCOPE="https://www.googleapis.com/auth/plus.login https://www.googleapis.com/auth/userinfo.email https://www.googleapis.com/auth/userinfo.profile"
 REACT_APP_GOOGLE_REDIRECT_URL=http://localhost:9082/login/auth/
 #Real Account
 REACT_APP_FACEBOOK_CLIENT_ID2=390204307987009
 REACT_APP_FACEBOOK_CLIENT_SECRET2=19f778e312f2ab96d147bacb612910c2
 #developenet Account
 REACT_APP_FACEBOOK_CLIENT_ID=677857427521030
 REACT_APP_FACEBOOK_CLIENT_SECRET=4801375f22072d8a75f64483fdd89829
 #my Account
 REACT_APP_FACEBOOK_CLIENT_ID3=1598725580610908
 REACT_APP_FACEBOOK_CLIENT_SCOPE="email,public_profile"
 REACT_APP_FACEBOOK_REDIRECT_URL="http://localhost:9082/login/auth/flogin"
 REACT_APP_APPLE_CLIENT_ID='com.wrenchboard.users.client'
 REACT_APP_APPLE_REDIRECT_URL='http://localhost:9082/login/auth/apple'
 # /* 'client_id' => */ 'com.wrenchboard.users.client',
 # /* 'client_secret' => */ 'eyJ0eXAiOiJKV1QiLCJhbGciOiJFUzI1NiIsImtpZCI6Ilc1V1RXQzlEVEoifQ.eyJpc3MiOiJKUjM2M0ZFWThSIiwiaWF0IjoxNjU0MDgzODQxLCJleHAiOjE2NTkyNjc4NDEsImF1ZCI6Imh0dHBzOi8vYXBwbGVpZC5hcHBsZS5jb20iLCJzdWIiOiJjb20ud3JlbmNoYm9hcmQudXNlcnMuY2xpZW50In0.TIPMwjS2MgSysqEuw3yu1nrOcrH-6omzerDhx0CadjWn2yCO8wZhQiAlhIFs7F-WPektIJ6h-2BT62yGrILiTA',
 # /* 'redirect_uri' => */ site_url('login/auth/apple')
 REACT_APP_MAX_FILE_SIZE=1000000
 REACT_APP_TOTAL_NUM_FILE=4
 REACT_APP_LOGOUT_TEXT="Sign Out"
 #apigate.lotus.g1.wrenchboard.com:76.209.103.227
 #apigate.orion.g1.wrenchboard.com:76.209.103.227
@@ -9,16 +9,15 @@ REACT_APP_APPSITE="https://myfitapp.mermsemr.com"
 # REACT_APP_AUX_ENDPOINT="http://10.20.30.32:9083/svs/user"
 # REACT_APP_USERS_ENDPOINT="http://10.20.30.32:9083/svs/user"
-# REACT_APP_AUX_ENDPOINT="https://apigate.lotus.g1.wrenchboard.com/svs/user"
+REACT_APP_AUX_ENDPOINT="https://apigate.lotus.g1.wrenchboard.com/svs/user"
-# REACT_APP_USERS_ENDPOINT="https://apigate.lotus.g1.wrenchboard.com/svs/user"
+REACT_APP_USERS_ENDPOINT="https://apigate.lotus.g1.wrenchboard.com/svs/user"
-REACT_APP_AUX_ENDPOINT="https://apigate.lotus.g1.wrenchboard.com/en/wrench/api/v1"
+#REACT_APP_AUX_ENDPOINT="https://apigate.lotus.g1.wrenchboard.com/en/wrench/api/v1"
-REACT_APP_USERS_ENDPOINT="https://apigate.lotus.g1.wrenchboard.com/en/wrench/api/v1"
+#REACT_APP_USERS_ENDPOINT="https://apigate.lotus.g1.wrenchboard.com/en/wrench/api/v1"
 #"https://devapi.mermsemr.com/en/desktop/api/v2/myfituser"
-REACT_APP_SESSION_EXPIRE_MINUTES=600000
+REACT_APP_SESSION_EXPIRE_MINUTES=300000
 REACT_APP_SESSION_EXPIRE_MINUTES_FAMILY=600000
 REACT_APP_SESSION_EXPIRE_CHECKER=60000
 REACT_APP_LOGIN_ERROR_TIMEOUT=7000
@@ -34,13 +33,3 @@ REACT_APP_ITEM_PER_PAGE=5
 #apigate.lotus.g1.wrenchboard.com:76.209.103.227
 #apigate.orion.g1.wrenchboard.com:76.209.103.227
 REACT_APP_GOOGLE_CLIENT_ID=817021856543-ad9nsjgdpsu2s2jrl63j3ihrv7lbf6ma.apps.googleusercontent.com
 REACT_APP_GOOGLE_CLIENT_SECRET=aozK_2G8UjaCmLgPPkv9abIm
 REACT_APP_GOOGLE_CLIENT_SCOPE="https://www.googleapis.com/auth/plus.login https://www.googleapis.com/auth/userinfo.email https://www.googleapis.com/auth/userinfo.profile"
 REACT_APP_GOOGLE_REDIRECT_URL=http://localhost:9082/login/auth/
 REACT_APP_MAX_FILE_SIZE=1000000
 REACT_APP_TOTAL_NUM_FILE=4
 REACT_APP_LOGOUT_TEXT="Sign Out"
@@ -9,16 +9,15 @@ REACT_APP_APPSITE="https://myfitapp.mermsemr.com"
 # REACT_APP_AUX_ENDPOINT="http://10.20.30.32:9083/svs/user"
 # REACT_APP_USERS_ENDPOINT="http://10.20.30.32:9083/svs/user"
-#REACT_APP_AUX_ENDPOINT="https://apigate.orion.g1.wrenchboard.com/svs/user"
+REACT_APP_AUX_ENDPOINT="https://apigate.orion.g1.wrenchboard.com/svs/user"
-#REACT_APP_USERS_ENDPOINT="https://apigate.orion.g1.wrenchboard.com/svs/user"
+REACT_APP_USERS_ENDPOINT="https://apigate.orion.g1.wrenchboard.com/svs/user"
-REACT_APP_AUX_ENDPOINT="https://apigate.orion.g1.wrenchboard.com/en/wrench/api/v1"
+#REACT_APP_AUX_ENDPOINT="https://apigate.orion.g1.wrenchboard.com/en/wrench/api/v1"
-REACT_APP_USERS_ENDPOINT="https://apigate.orion.g1.wrenchboard.com/en/wrench/api/v1"
+#REACT_APP_USERS_ENDPOINT="https://apigate.orion.g1.wrenchboard.com/en/wrench/api/v1"
 #"https://devapi.mermsemr.com/en/desktop/api/v2/myfituser"
-REACT_APP_SESSION_EXPIRE_MINUTES=600000
+REACT_APP_SESSION_EXPIRE_MINUTES=300000
 REACT_APP_SESSION_EXPIRE_MINUTES_FAMILY=600000
 REACT_APP_SESSION_EXPIRE_CHECKER=60000
 REACT_APP_LOGIN_ERROR_TIMEOUT=7000
@@ -34,20 +33,3 @@ REACT_APP_ITEM_PER_PAGE=5
 #apigate.orion.g1.wrenchboard.com:76.209.103.227
 #apigate.orion.g1.wrenchboard.com:76.209.103.227
 REACT_APP_GOOGLE_CLIENT_ID=817021856543-ad9nsjgdpsu2s2jrl63j3ihrv7lbf6ma.apps.googleusercontent.com
 REACT_APP_GOOGLE_CLIENT_SECRET=aozK_2G8UjaCmLgPPkv9abIm
 REACT_APP_GOOGLE_CLIENT_SCOPE="https://www.googleapis.com/auth/plus.login https://www.googleapis.com/auth/userinfo.email https://www.googleapis.com/auth/userinfo.profile"
 REACT_APP_GOOGLE_REDIRECT_URL=https://users.wrenchboard.com/login/auth/
 REACT_APP_FACEBOOK_CLIENT_ID2=390204307987009
 REACT_APP_FACEBOOK_CLIENT_SECRET2=19f778e312f2ab96d147bacb612910c2
 REACT_APP_FACEBOOK_CLIENT_SCOPE="email,public_profile"
 REACT_APP_FACEBOOK_REDIRECT_URL="https://users.wrenchboard.com/login/auth/flogin"
 DISABLE_ESLINT_PLUGIN=true
 REACT_APP_MAX_FILE_SIZE=1000000
 REACT_APP_TOTAL_NUM_FILE=4
 REACT_APP_LOGOUT_TEXT="Sign Out"
@@ -14,20 +14,17 @@
    "chartjs": "^0.3.24",
    "cors": "^2.8.5",
    "faker": "^6.6.6",
    "flutterwave-react-v3": "^1.3.0",
    "formik": "^2.2.9",
    "react": "^18.2.0",
    "react-apple-login": "^1.1.6",
    "react-chartjs-2": "^4.1.0",
    "react-countup": "^6.2.0",
    "react-dom": "^18.2.0",
    "react-qr-code": "^2.0.11",
    "react-redux": "^8.0.5",
    "react-router-dom": "^6.0.2",
    "react-scripts": "5.0.1",
    "react-slick": "^0.29.0",
    "react-to-print": "^2.14.12",
    "react-toastify": "^9.0.1",
    "flutterwave-react-v3": "^1.3.0",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "react-redux": "^8.0.5",
    "react-scripts": "5.0.1",
    "redux": "^4.2.0",
    "slick-carousel": "^1.8.1",
    "web-vitals": "^1.0.1",
@@ -37,18 +37,6 @@ import StartJob from "./components/MyJobs/StartJob";
 import AddJobPage from "./views/AddJobPage";
 import MyPendingJobsPage from "./views/MyPendingJobsPage";
 import ManageActiveJobs from "./views/ManageActiveJobs";
 import FamilyManagePage from "./views/FamilyManagePage";
 import MyCouponPage from "./views/MyCouponPage";
 import AuthRedirect from "./views/AuthRedirect";
 import MyPastDueJobsPage from "./views/MyPastDueJobsPage";
 import BlogPage from "./views/BlogPage";
 import MyReviewDueJobsPage from "./views/MyReviewDueJobsPage";
 import OffersInterestPage from "./views/OffersInterestPage";
 import ManageInterestOfferPage from './views/ManageInterestOfferPage'
 import MyWaitingJobsPage from "./views/MyWaitingJobsPage";
 import FamilyMarketPage from "./views/FamilyMarketPage";
 import FacebookRedirect from "./views/FacebookRedirect";
 import AppleRedirectPage from "./views/AppleRedirectPage";
 export default function Routers() {
  return (
@@ -57,9 +45,6 @@ export default function Routers() {
        {/* guest routes */}
        <Route exact path="/login" element={<LoginPage />} />
        <Route exact path="/signup" element={<SignupPage />} />
        <Route exact path="/login/auth" element={<AuthRedirect />} />
        <Route exact path="/login/auth/flogin" element={<FacebookRedirect />} />
        <Route exact path="/login/auth/apple" element={<AppleRedirectPage />} />
        <Route
          exact
          path="/forgot-password"
@@ -88,29 +73,18 @@ export default function Routers() {
          <Route exact path="/calendar" element={<CalendarPage />} />
          <Route exact path="/resources" element={<ResourcePage />} />
          <Route exact path="/my-wallet/*" element={<MyWalletPage />} />
          <Route exact path="/my-coupon" element={<MyCouponPage />} />
          <Route exact path="/notification" element={<Notification />} />
          <Route exact path="/market-place" element={<MarketPlacePage />} />
          <Route exact path="/market" element={<MarketPlacePage />} />
          <Route exact path="/familymarket" element={<FamilyMarketPage />} />
          <Route exact path="/notification" element={<Notification />} />
          <Route exact path="/mytask" element={<MyTaskPage />} />
          <Route exact path="/myjobs" element={<MyJobsPage />} />
-          {/* <Route exact path="/add-job" element={<AddJobPage />} /> */}
+          <Route exact path="/add-job" element={<AddJobPage />} />
          <Route exact path="/my-active-jobs"  element={<MyActiveJobsPage />} />
          <Route exact path="/my-pastdue-jobs"  element={<MyPastDueJobsPage />} />
          <Route exact path="/my-pending-jobs"  element={<MyPendingJobsPage />} />
          <Route exact path="/pend-interest"  element={<MyWaitingJobsPage />} />
          <Route exact path="/my-review-jobs"  element={<MyReviewDueJobsPage />} />
          <Route exact path="/acc-family"  element={<FamilyAccPage />} />
          <Route exact path="/manage-family"  element={<FamilyManagePage />} />
          <Route exact path="/start-job"  element={<StartJob />} />
          <Route exact path="/manage-active-job"  element={<ManageActiveJobs />} />
          <Route exact path="/blog-page"  element={<BlogPage />} />
          <Route exact path="/offer-interest"  element={<OffersInterestPage />} />
          <Route exact path="/manage-offer"  element={<ManageInterestOfferPage />} />
          <Route
            exact
            path="/my-collection/collection-item"
@@ -1,9 +0,0 @@
 <svg width="905" height="575" viewBox="0 0 905 575" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
 <rect width="905" height="575" fill="url(#pattern0)"/>
 <defs>
 <pattern id="pattern0" patternContentUnits="objectBoundingBox" width="1" height="1">
 <use xlink:href="#image0_201_3" transform="matrix(0.00849979 0 0 0.0131639 -0.0662984 -0.354783)"/>
 </pattern>
 <image id="image0_201_3" width="130" height="130" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAIIAAACCCAMAAAC93eDPAAAApVBMVEX///82OzgAAAAuMi81OjdVXVfqpQCzs7NCSUSwsbAaIBslKyjk5OQuNDAhJiLZ2tpJT0opNTkvNzloVy31rAC1hRtPV1HNzc34+PgaLztBQUHLkg9UVFTw8PDGxsaioqKampp/f39sbGyIiIgaGho9Qj5MTExeXl5fUi+9vb03Nzd2dnYjIyORkZFjZWMNFQ9CQTWYcyLAjBSsfx12XytSSjEQEBBeBsYmAAAEiklEQVR4nO3a7XaqOBQG4BjoQXRraKc1GUoSPgQaETszZ473f2kTqm0VsKLLYs80b3+UhQgPOwlBESETExMTExMTExMTExMTk/9HQDk9xHUdcgiwmk7HPWQ0Gj0HrQiaWvagh9iWztSiTQH3rD4AW4I19nmDUI77EWwJ1ihpENJeWuGdYE0afXHSN2EMdUI/fXGHMK0Piv6rcJhg39VyadpRwt3g6Y+9PNl3/RLsvx7va3kcXLYOxwh/Ptz/qOX+79t+CY91wY8fD4ZgCIbwvQn/NAT3P/sl3P3bENz/uuwkcXSaun162M/PX5ctQofJ+u62lgtPlL/HLYshGIIhfDGC3chZ65ur7c6EYSN2+/r0wPYvn4/ttH19B4Lt3TRSGexZc316YP3LgZrrZ9sqTK5PsK7fEMcJn90d7eOEz84XIEyuT7CuTrCvT5hcn2BdnWBfnbAj+CaEtyvizrXROpfQOu0fAwyGnucN9X89XeiltPrebnIuwU5nO+n2dbmdbqfH1B6+Le02w4mEvYnX60J4PW61/fukb51PGO4SulWheRehMecTTu8LbTc+NzMvPZ9wctrupW505+yR0NYOelR41yVUgq5VaLnjOvmy0GyIStC5L6RH0okwbBN4g06ExpubFe00JPbKMNsIOl4XWofT6YTB4HU/3mDWLjjpc8RevE4APSF4VSFmQ31VTl8AqdWZcInuuEFUHWczLdgDuw7o637BnjSP/AHh8o9KPwR8fhXslsrXCfUHxpd8bH7k9LdpPDZHyajL+y6XUdQggD/uUzAeNNoBIWpN+xNMJy0/JNF1mD2Pespz0FKDDcJxe4k6BDAxMTExMTH5kunjZ8cfB+Gr53sTluE7YQ0gBSGrBEgEROIcCA0oVnEEkFfbCp44ZUYDAhLjiGAKCiugmASlXAGMa/teEBCLHCCSYZmEofBlqUIcACQ44r4PoJbVZnOk3ghzFPlMujyEbIViH8es4C6LSAKuAP16gaqlAlwomY9DVrCElSjhCVfSAYe6NYLPSq6oCFmohFIhl64kLqYkZEuFogzlqMSZEPo2nr4TijVLQk1YBihYa0IGigMNeZRF+vUcFTiGkiqxTpa45BIWUjIfQs4dh8KiXmGfBZQSqc9EACExsBcCuDHyKXd8hLmu9GY8wvKVADHnKJZIBIis8AoByTnoc4k2Z6hPeYlUKIRUfkXgcxxpQskBqTlhywYh3xB8DkRvByysCE6McghptiGwjYG+EgLMSigkwQHS5xTzAGdQIk2QVUP4q5BlnOVC5PqVqgq+cF+qkCCV64odICCMqEBLvadwW4UYCcj3quC/E1BElS5wjlaLqiFwwHUPAf2ho1jhGCUso2jh8IgFVV9ACSpRxBO2Ig4oShuEgju6ZJrgKraEgEmilrovaHKk/wKUbPsCmb+OCJphEReioDTRG+JAl9tXa7mKiZLSxWtJEpyo+ZwKx8eFwEoPG71XLLKo9Cmtd4aFomrp616gB1Xhrp0sSiQlmSBx4uLqKHK+GRHibUR8mCQ4tsW5mUrcjfD5+QKE/wC0yMO17JCUyAAAAABJRU5ErkJggg=="/>
 </defs>
 </svg>
@@ -1 +0,0 @@
 <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" id="naira"><path fill="#fff" d="M24,5A19,19,0,1,0,43,24,19,19,0,0,0,24,5Zm7,20a1,1,0,0,1,0,2H29v3A1.94,1.94,0,0,1,27.45,32a2,2,0,0,1-2.26-1.08L20,17.05l0,14a1,1,0,0,1-2,0V27H16a1,1,0,0,1,0-2h2V22H16a1,1,0,0,1,0-2h2V17a1.94,1.94,0,0,1,1.55-1.92,2,2,0,0,1,2.26,1.08L27,30,27,16a1,1,0,0,1,2,0v4h2a1,1,0,0,1,0,2H29v3Z" class="color3b3c3d svgShape"></path><path fill="#e3e3e3" d="M24,48A24,24,0,1,1,48,24,24,24,0,0,1,24,48ZM24,2A22,22,0,1,0,46,24,22,22,0,0,0,24,2Z" class="color3b3c3d svgShape"></path></svg>
@@ -1 +0,0 @@
 <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16.933 16.933" id="Coin"><path d="M8.452 281.052a7.487 7.487 0 0 0-7.483 7.482 7.485 7.485 0 0 0 7.483 7.48 7.484 7.484 0 0 0 7.48-7.48 7.486 7.486 0 0 0-7.48-7.482zm0 1.232a6.253 6.253 0 0 1 6.248 6.25 6.25 6.25 0 0 1-6.248 6.248c-3.449 0-6.25-2.8-6.25-6.248a6.254 6.254 0 0 1 6.25-6.25zm0 .53a5.717 5.717 0 0 0-5.721 5.72 5.715 5.715 0 0 0 5.72 5.719 5.713 5.713 0 0 0 5.72-5.719 5.715 5.715 0 0 0-5.72-5.72zm-.004 2.011a.265.265 0 0 1 .267.268v.596H9.74a.265.265 0 1 1 0 .529H8.715v2.05h.17c.856 0 1.551.697 1.551 1.555s-.696 1.555-1.549 1.555h-.172v.596a.265.265 0 1 1-.529 0v-.596H7.161a.265.265 0 1 1 0-.53h1.025v-2.05h-.172a1.552 1.552 0 0 1-1.547-1.555c0-.858.694-1.554 1.547-1.554h.172v-.596a.265.265 0 0 1 .262-.268zm-.434 1.393a1.01 1.01 0 0 0-1.018 1.025 1.01 1.01 0 0 0 1.018 1.026h.172v-2.051zm.701 2.58v2.05h.172c.57 0 1.02-.448 1.02-1.025s-.449-1.025-1.022-1.025z" color="#e3e3e3" font-family="sans-serif" font-weight="400" overflow="visible" transform="translate(0 -280.067)" style="line-height:normal;font-variant-ligatures:normal;font-variant-position:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-alternates:normal;font-feature-settings:normal;text-indent:0;text-align:start;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000;text-transform:none;text-orientation:mixed;shape-padding:0;isolation:auto;mix-blend-mode:normal" fill="#fff" class="color000000 svgShape"></path></svg>
@@ -1,2 +0,0 @@
 <?xml version="1.0" ?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
 <svg fill="#000000" width="800px" height="800px" viewBox="0 0 52 52" data-name="Layer 1" id="Layer_1" xmlns="http://www.w3.org/2000/svg"><path d="M14,16H2a2,2,0,0,1-2-2V2A2,2,0,0,1,2,0H14a2,2,0,0,1,2,2V14A2,2,0,0,1,14,16ZM4,12h8V4H4Z"/><path d="M14,34H2a2,2,0,0,1-2-2V20a2,2,0,0,1,2-2H14a2,2,0,0,1,2,2V32A2,2,0,0,1,14,34ZM4,30h8V22H4Z"/><path d="M14,52H2a2,2,0,0,1-2-2V38a2,2,0,0,1,2-2H14a2,2,0,0,1,2,2V50A2,2,0,0,1,14,52ZM4,48h8V40H4Z"/><path d="M32,16H20a2,2,0,0,1-2-2V2a2,2,0,0,1,2-2H32a2,2,0,0,1,2,2V14A2,2,0,0,1,32,16ZM22,12h8V4H22Z"/><path d="M32,34H20a2,2,0,0,1-2-2V20a2,2,0,0,1,2-2H32a2,2,0,0,1,2,2V32A2,2,0,0,1,32,34ZM22,30h8V22H22Z"/><path d="M32,52H20a2,2,0,0,1-2-2V38a2,2,0,0,1,2-2H32a2,2,0,0,1,2,2V50A2,2,0,0,1,32,52ZM22,48h8V40H22Z"/><path d="M50,16H38a2,2,0,0,1-2-2V2a2,2,0,0,1,2-2H50a2,2,0,0,1,2,2V14A2,2,0,0,1,50,16ZM40,12h8V4H40Z"/><path d="M50,34H38a2,2,0,0,1-2-2V20a2,2,0,0,1,2-2H50a2,2,0,0,1,2,2V32A2,2,0,0,1,50,34ZM40,30h8V22H40Z"/><path d="M50,52H38a2,2,0,0,1-2-2V38a2,2,0,0,1,2-2H50a2,2,0,0,1,2,2V50A2,2,0,0,1,50,52ZM40,48h8V40H40Z"/></svg>
@@ -1 +0,0 @@
 <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" id="delete"><g color="#000"><path fill="#ee4c45" style="line-height:normal;text-indent:0;text-align:start;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000;text-transform:none;block-progression:tb;white-space:normal;isolation:auto;mix-blend-mode:normal;solid-color:#000;solid-opacity:1" d="M12 1028.362c-6.626 0-12 5.374-12 12s5.374 12 12 12 12-5.374 12-12-5.374-12-12-12z" font-family="sans-serif" font-weight="400" overflow="visible" transform="translate(0 -1028.362)"></path><path fill="#fff" style="isolation:auto;mix-blend-mode:normal;solid-color:#000;solid-opacity:1" d="M10.5 1034.362v1h-3v1h9v-1h-3v-1h-3zm-2 3v9h7v-9h-7zm1 1h1v7h-1v-7zm2 0h1v7h-1v-7zm2 0h1v7h-1v-7z" overflow="visible" transform="translate(0 -1028.362)"></path></g></svg>
@@ -1,19 +0,0 @@
 <svg xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 60 60" viewBox="0 0 60 60" id="edit"><path fill="#3B4652" d="M52.9687347,19.3099976l-2.7999878-2.7999878c-0.9099731-0.9100342-2.3899536-0.9100342-3.2999878,0
 		l-1.4129639,1.4129639c0.0185547,0.017395,0.0423584,0.0234985,0.0601196,0.0422974l5.7765503,6.1199341
 		c0.0361328,0.038269,0.0506592,0.0881348,0.0813599,0.1296997l1.5949097-1.5949097
 		C53.8787689,21.7099609,53.8787689,20.2199707,52.9687347,19.3099976z"></path><path fill="#2B79C2" d="M10.8887787,25.5499878H34.998764l7.5900269-7.5900269l1.7599487-1.75V9c0-1.6500244-1.3499756-3-3-3h-32
 		c-1.6599731,0-3,1.3499756-3,3v42c0,1.6499634,1.3400269,3,3,3h32c1.6500244,0,3-1.3500366,3-3V34.0700073l-5.8899536,5.8800049
 		c-0.3099976,0.3199463-0.7000122,0.5599976-1.1199951,0.7099609l-7.2200317,2.5200195
 		c-0.3099976,0.1099854-0.6500244,0.1699829-0.9899902,0.1699829c-0.7800293,0-1.5200195-0.2999878-2.0900269-0.8399658
 		c-0.3399658-0.3400269-0.5799561-0.7400513-0.7299805-1.1600342H10.8887787c-0.5599976,0-1-0.4500122-1-1s0.4400024-1,1-1
 		h15.4199829v-0.0100098l1.7000122-4.8899536H10.8887787c-0.5599976,0-1-0.4500122-1-1c0-0.5500488,0.4400024-1,1-1H28.708786
 		l0.0999756-0.3000488c0.1699829-0.4699707,0.4400024-0.8800049,0.789978-1.1900024l3.4000244-3.4099731H10.8887787
 		c-0.5599976,0-1-0.4500122-1-1S10.3287811,25.5499878,10.8887787,25.5499878z M10.8887787,46.25h24.9099731
 		c0.5599976,0,1,0.4500122,1,1s-0.4400024,1-1,1H10.8887787c-0.5599976,0-1-0.4500122-1-1S10.3287811,46.25,10.8887787,46.25z
 		 M10.8887787,11.75h24.9099731c0.5599976,0,1,0.4500122,1,1s-0.4400024,1-1,1H10.8887787c-0.5599976,0-1-0.4500122-1-1
 		S10.3287811,11.75,10.8887787,11.75z M10.8887787,18.6499634h24.9099731c0.5599976,0,1,0.4500122,1,1c0,0.5500488-0.4400024,1-1,1
 		H10.8887787c-0.5599976,0-1-0.4499512-1-1C9.8887787,19.0999756,10.3287811,18.6499634,10.8887787,18.6499634z"></path><path fill="#3B4652" d="M30.9387665,32.4400024c-0.1099854,0.0999756-0.1900024,0.2299805-0.2399902,0.3699951
 		l-2.5100098,7.2099609c-0.1300049,0.3600464-0.039978,0.7700195,0.2299805,1.0400391
 		c0.2000122,0.1900024,0.4500122,0.289978,0.710022,0.289978c0.1099854,0,0.2199707-0.0200195,0.3300171-0.0599976
 		l7.2099609-2.5100098c0.1400146-0.0499878,0.2700195-0.1300049,0.3800049-0.2399902l12.5599976-12.5599976l-5.9299927-6.2799683
 		L30.9387665,32.4400024z"></path></svg>
@@ -1 +0,0 @@
 <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 66 66" id="Account"><path fill="#4687ba" d="M19 36.5c-5.8 0-10.6 4.7-10.6 10.6S13.1 57.6 19 57.6 29.5 52.9 29.5 47 24.8 36.5 19 36.5zm0 19.6c-5 0-9.1-4.1-9.1-9.1s4.1-9 9.1-9 9 4 9 9-4 9.1-9 9.1z" class="color000100 svgShape"></path><path fill="#4687ba" d="M65.7 49.6l-.9-5.4c-1.2-8-7.4-14.3-15.1-15.9 1.3-1.6 2.7-3.9 3.3-7.1.5-.8 2.1-3.5 1.5-5.3-.1-.3-.3-.6-.6-.9.7-2 2.3-9-4.8-12.6C38-3.9 28.7 4.7 30.8 14.6c-.2.3-.5.6-.6 1.1-.3 1.3.1 3 1.3 4.9.2.8 1.5 5 3.9 7.9-3.2.8-6 2.4-8.4 4.6-1.2-.7-2.5-1.2-3.8-1.6l-.8-3.3h-6.8l-.8 3.3c-1.3.4-2.6.9-3.8 1.6l-2.8-1.8-4.8 4.8L5.1 39c-.7 1.2-1.2 2.5-1.6 3.8l-3.3.8v6.8l3.3.8c.4 1.3.9 2.6 1.6 3.8l-1.8 2.9 4.8 4.8 2.8-1.8c1.2.7 2.5 1.2 3.8 1.6l.8 3.3h6.8l.8-3.3c1.3-.4 2.6-.9 3.8-1.6l2.8 1.8 4.8-4.8-.3-.5H59c2 0 3.8-.9 5.1-2.4 1.3-1.4 1.9-3.4 1.6-5.4zM32.9 20.1l-.1-.2c-1.7-2.8-1.3-4.2-.8-4.5l.5-.3c-1.8-6 1.4-11.4 5.6-12.9C43.4.5 57 4.1 52 15.9c.3.1 1 .3 1 .6.3 1-.9 3.3-1.5 4.3-1.1 5.3-4.3 9.7-9.2 9.8-5.1 0-8.1-5.5-9.4-10.5zm-3.3 40.7L27 59.2c-1.1.7-2.4 1.5-5.1 2.1l-.7 3h-4.4l-.7-3c-2.3-.5-3.4-1.1-5.1-2.1l-2.6 1.6-3.1-3.1 1.6-2.6C5.7 53.2 5.2 52 4.7 50l-3-.7v-4.4l3-.7c.3-1.4.7-2.9 2.1-5.2l-1.6-2.6 3.1-3.1 2.6 1.6c1.1-.7 2.4-1.5 5.1-2.1l.7-3h4.4l.7 3c2.3.5 3.4 1.1 5.1 2.1l2.6-1.6 3.1 3.1-1.5 2.6c1.2 1.9 1.6 3.1 2.1 5.1l3 .7v4.4l-3 .7c-.3 1.2-.6 2.8-2.1 5.1l1.6 2.6-3.1 3.2zM63 54.1c-1 1.2-2.4 1.8-4 1.8H33.4l-.5-.9c.7-1.2 1.2-2.5 1.6-3.8l3.3-.8v-6.8l-3.3-.8c-.4-1.3-.9-2.6-1.6-3.8l1.8-2.8-4-4c1.8-1.1 3.8-1.9 6-2.4 1.7 1.5 3.8 2.4 6.2 2.2 2.7-.2 4.4-1.2 5.7-2.4 7.6 1.1 13.7 7.1 14.9 14.8l.8 5.4c.2 1.6-.3 3.1-1.3 4.3z" class="color000100 svgShape"></path></svg>
@@ -1 +0,0 @@
 <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1792 1792" id="Bank"><path d="m896 78.526 896 358.4v119.466h-119.467q0 24.267-19.133 42-19.133 17.734-45.267 17.734H183.867q-26.134 0-45.267-17.734-19.133-17.733-19.133-42H0V436.926ZM238.933 675.859h238.934v716.8h119.466v-716.8h238.934v716.8h119.466v-716.8h238.934v716.8h119.466v-716.8h238.934v716.8h55.066q26.134 0 45.267 17.733 19.133 17.734 19.133 42v59.734H119.467v-59.734q0-24.266 19.133-42 19.133-17.733 45.267-17.733h55.066v-716.8zm1488.667 896q26.133 0 45.267 17.733 19.133 17.734 19.133 42v119.467H0v-119.467q0-24.266 19.133-42 19.134-17.733 45.267-17.733h1663.2z" fill="#4687ba" class="color000000 svgShape"></path></svg>
@@ -1 +0,0 @@
 <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" id="dashboard"><path fill="none" d="M0 0h24v24H0V0z"></path><path d="M4 13h6c.55 0 1-.45 1-1V4c0-.55-.45-1-1-1H4c-.55 0-1 .45-1 1v8c0 .55.45 1 1 1zm0 8h6c.55 0 1-.45 1-1v-4c0-.55-.45-1-1-1H4c-.55 0-1 .45-1 1v4c0 .55.45 1 1 1zm10 0h6c.55 0 1-.45 1-1v-8c0-.55-.45-1-1-1h-6c-.55 0-1 .45-1 1v8c0 .55.45 1 1 1zM13 4v4c0 .55.45 1 1 1h6c.55 0 1-.45 1-1V4c0-.55-.45-1-1-1h-6c-.55 0-1 .45-1 1z" fill="#4687ba" class="color000000 svgShape"></path></svg>
@@ -1 +0,0 @@
 <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" id="identificationcard"><path fill="#4687ba" d="M0 6v13c0 1.103.897 2 2 2h20c1.103 0 2-.897 2-2V6" class="color2d98d4 svgShape"></path><path fill="#ff6699" d="M22 3H2a2 2 0 0 0-2 2v2h24V5a2 2 0 0 0-2-2z" class="color0377be svgShape"></path><path fill="#e6e7f9" d="M22 3H2C.897 3 0 3.897 0 5v.25c0-1.103.897-2 2-2h20c1.103 0 2 .897 2 2V5c0-1.103-.897-2-2-2z" opacity=".2" class="colorffffff svgShape"></path><path fill="#4687ba" d="M22 20.75H2c-1.103 0-2-.897-2-2V19c0 1.103.897 2 2 2h20c1.103 0 2-.897 2-2v-.25c0 1.103-.897 2-2 2z" opacity=".1" class="color010101 svgShape"></path><path fill="#e6e7f9" d="M13 17h8v1h-8zM13 14h8v1h-8zM13 11h8v1h-8z" class="colorffffff svgShape"></path><circle cx="7" cy="12" r="2" fill="#e6e7f9" class="colorffffff svgShape"></circle><path fill="#e6e7f9" d="M9.987 15.237C9.288 14.9 8.203 14.5 7 14.5s-2.288.4-2.987.737c-.625.3-1.013.9-1.013 1.566V18h8v-1.197c0-.665-.388-1.265-1.013-1.566z" class="colorffffff svgShape"></path><circle cx="17" cy="5" r="1" fill="#ff6699" class="color0a70b9 svgShape"></circle><path fill="#4687ba" d="M17 4.25a.99.99 0 0 1 .975.875C17.98 5.082 18 5.045 18 5a1 1 0 0 0-2 0c0 .044.02.082.025.125A.99.99 0 0 1 17 4.25z" opacity=".1" class="color010101 svgShape"></path><linearGradient id="a" x1="6.973" x2="21.55" y1="1.973" y2="16.55" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#010101" stop-opacity=".1" class="stopColor010101 svgShape"></stop><stop offset="1" stop-color="#010101" stop-opacity="0" class="stopColor010101 svgShape"></stop></linearGradient><path fill="url(#a)" d="M22 21c1.103 0 2-.897 2-2V7H0l14 14h8z"></path><circle cx="7" cy="5" r="1" fill="#ff6699" class="color0a70b9 svgShape"></circle><path fill="#4687ba" d="M7 4.25a.99.99 0 0 1 .975.875C7.98 5.082 8 5.045 8 5a1 1 0 0 0-2 0c0 .044.02.082.025.125A.99.99 0 0 1 7 4.25z" opacity=".1" class="color010101 svgShape"></path><linearGradient id="b" x1="-.708" x2="24.708" y1="6.074" y2="17.925" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#ffffff" stop-opacity=".2" class="stopColorffffff svgShape"></stop><stop offset="1" stop-color="#ffffff" stop-opacity="0" class="stopColorffffff svgShape"></stop></linearGradient><path fill="url(#b)" d="M22 3H2a2 2 0 0 0-2 2v14c0 1.103.897 2 2 2h20c1.103 0 2-.897 2-2V5a2 2 0 0 0-2-2z"></path></svg>
@@ -1,3 +0,0 @@
 <svg xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 128 128" viewBox="0 0 128 128" id="Pin"><path fill="#4687ba" d="M106,13.8L91.7,4.6C86.2,1,78.9,2,74.5,7L41.9,46.9c-9.1,0.4-17.9,3.3-25.4,8.7c-0.7,0.5-0.7,1.6,0.1,2.1
 				l10.2,6.6l0,0L46.4,77l-24,41.4c-1.2,2.1-0.7,4.9,1.4,6.3c2.2,1.6,5.2,1.1,6.7-1.1l28-38.8L78,97.5l0,0l10.2,6.6
 				c0.7,0.5,1.7,0.1,1.9-0.8c1.8-9,0.9-18.3-2.5-26.8l23.1-46C113.6,24.5,111.5,17.4,106,13.8z" class="color2d3e50 svgShape"></path></svg>
@@ -1 +0,0 @@
 <svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 32 32" id="Family"><path d="M26.305 22.723a4.972 4.972 0 0 0-3.176-8.71 9.917 9.917 0 0 0-3.438-2.292 6 6 0 1 0-7.382 0 9.917 9.917 0 0 0-3.438 2.292 4.972 4.972 0 0 0-3.171 8.71A8.005 8.005 0 0 0 1 30a1 1 0 0 0 2 0 6 6 0 0 1 12 0 1 1 0 0 0 2 0 6 6 0 0 1 12 0 1 1 0 0 0 2 0 8.005 8.005 0 0 0-4.695-7.277ZM26 19a3 3 0 1 1-3-3 3 3 0 0 1 3 3ZM12 7a4 4 0 1 1 4 4 4 4 0 0 1-4-4ZM6 19a3 3 0 1 1 3 3 3 3 0 0 1-3-3Zm10 7.136a8.04 8.04 0 0 0-3.695-3.413 4.949 4.949 0 0 0-1.05-8.16 7.984 7.984 0 0 1 9.49 0 4.949 4.949 0 0 0-1.05 8.16A8.04 8.04 0 0 0 16 26.136Z" fill="#4687ba" class="color000000 svgShape"></path></svg>
@@ -1 +0,0 @@
 <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" id="Logout"><path d="M4,12a1,1,0,0,0,1,1h7.59l-2.3,2.29a1,1,0,0,0,0,1.42,1,1,0,0,0,1.42,0l4-4a1,1,0,0,0,.21-.33,1,1,0,0,0,0-.76,1,1,0,0,0-.21-.33l-4-4a1,1,0,1,0-1.42,1.42L12.59,11H5A1,1,0,0,0,4,12ZM17,2H7A3,3,0,0,0,4,5V8A1,1,0,0,0,6,8V5A1,1,0,0,1,7,4H17a1,1,0,0,1,1,1V19a1,1,0,0,1-1,1H7a1,1,0,0,1-1-1V16a1,1,0,0,0-2,0v3a3,3,0,0,0,3,3H17a3,3,0,0,0,3-3V5A3,3,0,0,0,17,2Z" fill="#e07c8a" class="color000000 svgShape"></path></svg>
@@ -1 +0,0 @@
 <svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 512 512" id="FindJobs"><path d="M499.22 437.51 433.68 372a23.19 23.19 0 0 0-26.63-4.41l-22.18-22.18A214.71 214.71 0 0 0 62.78 62.78a214.72 214.72 0 0 0 282.6 322.09l22.18 22.18a23.19 23.19 0 0 0 4.44 26.63l65.54 65.54a43.64 43.64 0 0 0 61.71-61.71ZM341.29 369l-.2.18A199.71 199.71 0 0 1 73.39 73.39a199.71 199.71 0 0 1 295.76 267.67l-.22.26q-6.18 7.5-13.14 14.47T341.29 369Zm15.71 6.26c3.21-2.86 6.36-5.8 9.42-8.86s6-6.21 8.86-9.42l20.29 20.3-18.27 18.27Zm131.61 113.35a28.65 28.65 0 0 1-40.49 0l-65.54-65.54a8.22 8.22 0 0 1 0-11.61l28.88-28.88a8.22 8.22 0 0 1 11.61 0l65.54 65.54a28.65 28.65 0 0 1 0 40.49ZM296.08 161h-31v-11.53A21.13 21.13 0 0 0 244 128.36h-58.8a21.13 21.13 0 0 0-21.11 21.11V161h-31a19.82 19.82 0 0 0-19.81 19.81V281a19.83 19.83 0 0 0 19.81 19.82h163A19.84 19.84 0 0 0 315.9 281V180.81A19.83 19.83 0 0 0 296.08 161Zm-117-11.53a6.12 6.12 0 0 1 6.11-6.11H244a6.12 6.12 0 0 1 6.11 6.11V161h-71ZM300.9 281a4.82 4.82 0 0 1-4.82 4.82h-163a4.82 4.82 0 0 1-4.81-4.82v-63.6l63.8 27.77v4.88a14.52 14.52 0 0 0 14.5 14.5h16a14.52 14.52 0 0 0 14.5-14.5v-4.88l63.83-27.77Zm-93.81-31.45v-15h15v15ZM300.9 201l-64.67 28.14a14.5 14.5 0 0 0-13.64-9.63h-16a14.52 14.52 0 0 0-13.59 9.67L128.29 201v-20.19a4.82 4.82 0 0 1 4.81-4.81h163a4.82 4.82 0 0 1 4.82 4.81Zm36.89-109.61c-67.93-67.93-178.47-67.93-246.4 0a174.23 174.23 0 0 0 246.4 246.4 174.23 174.23 0 0 0 0-246.4Zm-10.6 235.8a159.25 159.25 0 1 1 46.63-112.6 158.76 158.76 0 0 1-46.63 112.6Z" fill="#4687ba" class="color000000 svgShape"></path></svg>
@@ -1 +0,0 @@
 <svg xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd" image-rendering="optimizeQuality" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" viewBox="0 0 9362 9362" id="jobsact"><path d="M8967 8103l-423 0 0 -856 423 0c181,0 329,193 329,428l0 0c0,235 -148,428 -329,428zm-4636 0l4066 0 0 -856 -4066 0 0 856zm-139 0l-738 -327 -268 0c-43,0 -138,-45 -138,-101 0,-56 95,-101 138,-101l268 0 738 -327 0 428 0 428zm-3982 -8103l6388 0 210 0 0 210 0 809 -420 0 0 -600 -5969 0 0 8523 5969 0 0 -551 420 0 0 761 0 210 -210 0 -6388 0 -210 0 0 -210 0 -8942 0 -210 210 0zm6598 6523l0 436 -420 0 0 -436 420 0zm2554 -3158l0 2557c0,175 -143,317 -317,317l-5224 0c-174,0 -317,-142 -317,-317l0 -2557 2486 0 0 491c0,244 199,443 443,443 244,0 443,-199 443,-443l0 -491 2486 0zm-3843 -2062l1827 0c121,0 219,98 219,219l0 626 -340 0 0 -506 -1585 0 0 506 -340 0 0 -626c0,-121 99,-219 219,-219zm-1698 1011l5224 0c174,0 317,143 317,317l0 568 -2650 0 0 657c0,154 -126,279 -279,279l0 0c-154,0 -280,-125 -280,-279l0 -657 -2649 0 0 -568c0,-174 143,-317 317,-317zm2612 1387c74,0 134,60 134,134 0,74 -60,134 -134,134 -74,0 -134,-60 -134,-134 0,-74 60,-134 134,-134zm-4430 -2741l2801 0 0 420 -2801 0 0 -420zm-806 4786l2023 0 0 176c0,87 19,170 52,244l-2075 0 0 -420zm0 -3657l2366 0c-167,80 -292,235 -330,421l-2036 0 0 -421zm0 914l2023 0 0 421 -2023 0 0 -421zm0 914l2023 0 0 421 -2023 0 0 -421zm0 915l2023 0 0 420 -2023 0 0 -420zm0 1828l1371 0 0 421 -1371 0 0 -421z" fill="#4687ba" class="color000000 svgShape"></path></svg>
@@ -1 +0,0 @@
 <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 128 128" id="Profile"><path fill="#ffffff" d="M108 124H20c-8.8 0-16-7.2-16-16V20c0-8.8 7.2-16 16-16h88c8.8 0 16 7.2 16 16v88c0 8.8-7.2 16-16 16z" class="colorffffff svgShape"></path><path fill="#d2d4d6" d="M4 18.1v21.2h120V18.1c0-7.8-6.3-14.1-14.1-14.1H18.1C10.3 4 4 10.3 4 18.1z" class="colord2d5d6 svgShape"></path><circle cx="20.5" cy="21.1" r="7.1" fill="#7bbaec" class="colorec7bb0 svgShape"></circle><circle cx="59.5" cy="21.1" r="7.1" fill="#4687ba" class="color82cfcd svgShape"></circle><path fill="#57636d" d="M59.5 29.1c-4.4 0-8.1-3.6-8.1-8.1 0-4.4 3.6-8.1 8.1-8.1 4.4 0 8.1 3.6 8.1 8.1-.1 4.5-3.7 8.1-8.1 8.1zm0-14.1c-3.3 0-6.1 2.7-6.1 6.1s2.7 6.1 6.1 6.1 6.1-2.7 6.1-6.1-2.8-6.1-6.1-6.1z" class="color6a576d svgShape"></path><circle cx="40" cy="21.1" r="7.1" fill="#7bbdf1" class="colorf1ed7b svgShape"></circle><path fill="#57636d" d="M20.5 29.1c-4.4 0-8.1-3.6-8.1-8.1 0-4.4 3.6-8.1 8.1-8.1 4.4 0 8.1 3.6 8.1 8.1s-3.6 8.1-8.1 8.1zm0-14.1c-3.3 0-6.1 2.7-6.1 6.1s2.7 6.1 6.1 6.1 6.1-2.7 6.1-6.1-2.7-6.1-6.1-6.1zm39 14.1c-4.4 0-8.1-3.6-8.1-8.1 0-4.4 3.6-8.1 8.1-8.1 4.4 0 8.1 3.6 8.1 8.1-.1 4.5-3.7 8.1-8.1 8.1zm0-14.1c-3.3 0-6.1 2.7-6.1 6.1s2.7 6.1 6.1 6.1 6.1-2.7 6.1-6.1-2.8-6.1-6.1-6.1zM40 29.1c-4.4 0-8.1-3.6-8.1-8.1 0-4.4 3.6-8.1 8.1-8.1s8.1 3.6 8.1 8.1-3.7 8.1-8.1 8.1zM40 15c-3.3 0-6.1 2.7-6.1 6.1s2.7 6.1 6.1 6.1 6.1-2.7 6.1-6.1S43.3 15 40 15zM4 38.3h120v2H4zM108 104.3H20c-.6 0-1-.4-1-1s.4-1 1-1h88c.6 0 1 .4 1 1s-.4 1-1 1zm-48-48H20c-.6 0-1-.4-1-1s.4-1 1-1h40c.6 0 1 .4 1 1s-.4 1-1 1zm0 16H20c-.6 0-1-.4-1-1s.4-1 1-1h40c.6 0 1 .4 1 1s-.4 1-1 1zm0 16H20c-.6 0-1-.4-1-1s.4-1 1-1h40c.6 0 1 .4 1 1s-.4 1-1 1z" class="color6a576d svgShape"></path><path fill="#57636d" d="M108 125H20c-9.4 0-17-7.6-17-17V20c0-9.4 7.6-17 17-17h88c9.4 0 17 7.6 17 17v88c0 9.4-7.6 17-17 17zM20 5C11.7 5 5 11.7 5 20v88c0 8.3 6.7 15 15 15h88c8.3 0 15-6.7 15-15V20c0-8.3-6.7-15-15-15H20z" class="color6a576d svgShape"></path><path fill="#ffffff" d="M108.9 28.1H79.6c-3.9 0-7.1-3.2-7.1-7.1 0-3.9 3.2-7.1 7.1-7.1h29.3c3.9 0 7.1 3.2 7.1 7.1 0 4-3.2 7.1-7.1 7.1z" class="colorffffff svgShape"></path><path fill="#57636d" d="M108.9 29.1H79.6c-4.4 0-8.1-3.6-8.1-8.1 0-4.4 3.6-8.1 8.1-8.1h29.3c4.4 0 8.1 3.6 8.1 8.1s-3.6 8.1-8.1 8.1zM79.6 15c-3.3 0-6.1 2.7-6.1 6.1s2.7 6.1 6.1 6.1h29.3c3.3 0 6.1-2.7 6.1-6.1s-2.7-6.1-6.1-6.1H79.6z" class="color6a576d svgShape"></path><path fill="#5587af" d="M76 55.3h32v32H76z" class="coloraf5655 svgShape"></path><path fill="#57636d" d="M104.8 88.3H79.2c-2.3 0-4.2-1.9-4.2-4.2V58.5c0-2.3 1.9-4.2 4.2-4.2h25.6c2.3 0 4.2 1.9 4.2 4.2v25.6c0 2.3-1.9 4.2-4.2 4.2zm-25.6-32c-1.2 0-2.2 1-2.2 2.2v25.6c0 1.2 1 2.2 2.2 2.2h25.6c1.2 0 2.2-1 2.2-2.2V58.5c0-1.2-1-2.2-2.2-2.2H79.2z" class="color6a576d svgShape"></path></svg>
@@ -1,4 +0,0 @@
 <svg xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 128 128" viewBox="0 0 128 128" id="Alert"><path fill="#f34093" d="M122.9,100.2L74.3,15.9c-4.6-7.9-16-7.9-20.6,0L5.1,100.2C0.5,108.1,6.2,118,15.4,118h97.3
 		C121.8,118,127.5,108.1,122.9,100.2z M63.9,101c-3.5-0.1-6.7-3.3-6.6-6.8c0.1-3.5,3.3-6.7,6.8-6.6c3.5,0.1,6.7,3.3,6.6,6.8
 		C70.6,98,67.4,101.1,63.9,101z M71.3,51.8c-0.7,7.8-1.5,15.6-2.3,23.4c-0.5,4.4-3.2,6.1-7.3,4.5c-1-0.4-2-2-2.2-3.2
 		C58.6,70,58,63.4,57.3,56.8c-0.3-2.8-0.5-5.6-0.8-8.5c-0.4-3.3,0.6-4.5,4-4.5c1.1,0,2.3,0,3.4,0C72,43.8,72,43.8,71.3,51.8z" class="color343433 svgShape"></path></svg>
@@ -1 +0,0 @@
 <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" id="Messages"><path fill="#4687ba" d="m447.372 413.112-17.544-52.629c-1-3.002-.674-6.23.775-9.043 13.184-25.615 18.629-55.858 12.925-87.736-8.746-48.868-44.53-89.475-90.943-105.048 11.976 28.924 15.628 61.084 9.645 92.984-12.155 64.837-64.074 116.246-129.191 127.924-8.429 1.512-16.945 2.248-25.396 2.463 19.776 21.336 46.173 36.503 75.619 41.784 31.682 5.682 61.784.393 87.322-12.594 2.802-1.425 6.007-1.742 8.99-.748l52.83 17.61c9.251 3.084 18.052-5.716 14.968-14.967z" class="color173042 svgShape"></path><path fill="#4687ba" d="M177.161 85.744C122.283 95.941 78.306 140.526 68.472 195.47c-5.704 31.878-.259 62.121 12.925 87.736 1.449 2.813 1.775 6.041.776 9.043l-17.545 52.629c-3.083 9.251 5.717 18.051 14.968 14.968l52.83-17.61c2.984-.994 6.19-.677 8.991.748 25.537 12.987 55.638 18.276 87.321 12.594 54.809-9.829 99.281-53.698 109.541-108.428 18.078-96.414-64.733-179.316-161.118-161.406zm34.938 177.536h-68.234c-6.73 0-12.185-5.454-12.185-12.185 0-6.73 5.455-12.185 12.185-12.185h68.234c6.731 0 12.185 5.455 12.185 12.185 0 6.731-5.454 12.185-12.185 12.185zm48.739-48.739H143.864c-6.73 0-12.185-5.454-12.185-12.185 0-6.73 5.455-12.185 12.185-12.185h116.973c6.731 0 12.185 5.455 12.185 12.185.001 6.731-5.453 12.185-12.184 12.185z" class="color173042 svgShape"></path></svg>
@@ -1 +0,0 @@
 <svg xmlns="http://www.w3.org/2000/svg" id="phone" x="0" y="0" version="1.1" viewBox="0 0 29 29" xml:space="preserve"><path d="M5.661 23.339c4.882 4.882 12.796 4.882 17.678 0 4.882-4.882 4.882-12.796 0-17.678s-12.796-4.882-17.678 0C.78 10.543.78 18.457 5.661 23.339zm5.545-16.613l1.86 1.86c.372.372.451.947.193 1.406l-.699 1.241a.781.781 0 0 0 .129.937l4.141 4.141a.781.781 0 0 0 .937.128l1.241-.699a1.173 1.173 0 0 1 1.406.193l1.861 1.861a1.175 1.175 0 0 1 0 1.66l-.881.881a3.135 3.135 0 0 1-3.786.493l-.084-.048a24.54 24.54 0 0 1-8.868-8.681l-.423-.706a3.128 3.128 0 0 1 .469-3.823l.844-.844a1.173 1.173 0 0 1 1.66 0z" fill="#4687ba" class="color000000 svgShape"></path></svg>
@@ -1 +0,0 @@
 <svg xmlns="http://www.w3.org/2000/svg" version="1.2" viewBox="0 0 512 512" id="Sms"><circle cx="256" cy="256" r="256" fill="#4687ba" class="color00aebb svgShape"></circle><path fill="#ffffff" d="M256 129.3c-88.4 0-160 52-160 116.2 0 26.6 12.3 51.1 33 70.7-11.6 26.2-22.6 66.2-22.6 66.2 6.1 3.1 60.9-23.9 78.4-32.8 21.4 7.7 45.6 12.1 71.2 12.1 88.4 0 160-52 160-116.2s-71.6-116.2-160-116.2zm-59.2 148.9c-5.2 3.8-12 5.7-20.4 5.7-8.3 0-15.4-2.1-21.4-6.2-6-4.1-8.8-10.3-8.7-18.5l.1-.3h15c0 4.6 1.3 7.9 4 10.1 2.7 2.2 6.3 3.2 10.9 3.2 4.1 0 7.3-.9 9.5-2.6 2.2-1.7 3.3-4 3.3-6.9 0-3-1-5.3-3.1-7.1-2.1-1.8-5.7-3.5-10.9-5.1-8.9-2.7-15.6-5.8-20.3-9.5-4.6-3.6-6.9-8.6-6.9-14.9 0-6.3 2.6-11.5 7.8-15.5 5.2-4 11.8-6 19.9-6 8.5 0 15.4 2.2 20.6 6.5 5.2 4.3 7.7 10 7.5 16.9l-.1.3h-15c0-3.8-1.2-6.8-3.5-8.9-2.3-2.1-5.6-3.1-9.8-3.1-3.8 0-6.8.9-8.8 2.8-2.1 1.8-3.1 4.2-3.1 7 0 2.6 1.1 4.8 3.4 6.4 2.3 1.7 6.2 3.5 11.7 5.3 8.5 2.4 14.9 5.5 19.4 9.4 4.4 3.9 6.7 9 6.7 15.3-.1 6.7-2.7 11.9-7.8 15.7zm99.3 4.7h-15.5v-52.6l-.3-.1-19.1 52.7h-10.5l-19.1-52.8-.3.1v52.7h-15.5v-77.1h20.3l19.6 56.8h.3l19.8-56.8H296v77.1zm62.1-4.7c-5.2 3.8-12 5.7-20.4 5.7-8.3 0-15.4-2.1-21.4-6.2-5.9-4.1-8.8-10.3-8.7-18.5l.1-.3h15c0 4.6 1.3 7.9 4 10.1 2.7 2.2 6.3 3.2 10.9 3.2 4.1 0 7.3-.9 9.5-2.6 2.2-1.7 3.3-4 3.3-6.9 0-3-1-5.3-3.1-7.1-2.1-1.8-5.7-3.5-10.9-5.1-8.9-2.7-15.7-5.8-20.3-9.5-4.6-3.6-6.9-8.6-6.9-14.9 0-6.3 2.6-11.5 7.8-15.5 5.2-4 11.8-6 19.9-6 8.5 0 15.4 2.2 20.6 6.5 5.2 4.3 7.7 10 7.5 16.9l-.1.3h-15c0-3.8-1.2-6.8-3.5-8.9-2.3-2.1-5.6-3.1-9.8-3.1-3.8 0-6.8.9-8.8 2.8-2.1 1.8-3.1 4.2-3.1 7 0 2.6 1.1 4.8 3.4 6.4 2.3 1.7 6.2 3.5 11.7 5.3 8.5 2.4 14.9 5.5 19.4 9.4 4.4 3.9 6.7 9 6.7 15.3-.1 6.7-2.6 11.9-7.8 15.7z" class="colorffffff svgShape"></path></svg>
@@ -1 +0,0 @@
 <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 30 30" id="Visacard"><g fill="#767fad" class="color303c42 svgShape"><path d="M28 4H2C.897 4 0 4.897 0 6v18c0 1.103.897 2 2 2h26c1.103 0 2-.897 2-2V6c0-1.103-.897-2-2-2zm1 20c0 .551-.449 1-1 1H2c-.551 0-1-.449-1-1V6c0-.551.449-1 1-1h26c.551 0 1 .449 1 1v18z" fill="#5218ed" class="color000000 svgShape"></path><path d="M7.677 14.266a.2.2 0 0 0 .228.053.17.17 0 0 0 .106-.194l-.314-1.368a.121.121 0 0 0-.002-.009c-.113-.39-.47-.449-.729-.459H6.96l-1.768-.002c-.091 0-.17.06-.185.143a.172.172 0 0 0 .121.193c1.078.358 1.96.926 2.55 1.643zM23.535 12.303h-1.15c-.46 0-.724.141-.883.473l-2.383 4.981a.162.162 0 0 0 .014.165c.035.05.094.079.158.079h1.35a.189.189 0 0 0 .176-.112c.165-.404.272-.661.307-.744h.974l1.183.002c.039.151.134.552.173.717.019.08.095.137.184.137h1.177c.057 0 .11-.024.146-.065s.05-.095.038-.146l-1.28-5.351a.185.185 0 0 0-.184-.136zm-1.926 3.675.895-2.138.114.492.39 1.646h-1.4z" fill="#5218ed" class="color000000 svgShape"></path><path d="M11.816 12.38a.193.193 0 0 0-.157-.078h-1.37a.188.188 0 0 0-.175.11L8.511 16.19l-.172-.575a.142.142 0 0 0-.009-.023c-.253-.542-.933-1.39-1.881-2.062-.065-.046-.154-.048-.221-.006s-.097.12-.074.192L7.47 17.87a.187.187 0 0 0 .18.124l1.518-.002a.19.19 0 0 0 .173-.104l2.49-5.344a.162.162 0 0 0-.016-.164zM14.088 12.297h-1.303a.184.184 0 0 0-.186.144l-.989 5.355a.165.165 0 0 0 .042.141c.036.04.088.062.144.062h1.302c.092 0 .17-.061.186-.145l.99-5.354a.164.164 0 0 0-.042-.141.195.195 0 0 0-.144-.062zM17.696 13.452h.05c.51 0 .87.107 1.097.187a.202.202 0 0 0 .16-.011.175.175 0 0 0 .093-.122l.152-.826c.016-.085-.039-.168-.128-.194a4.634 4.634 0 0 0-1.3-.182c-1.607 0-2.735.746-2.744 1.814-.01.79.807 1.231 1.422 1.494.632.269.844.441.841.682-.004.369-.506.536-.97.536a3.676 3.676 0 0 1-1.522-.285.202.202 0 0 0-.163.008.175.175 0 0 0-.095.123l-.161.87a.173.173 0 0 0 .123.193c.444.144 1.064.233 1.66.24h.001c1.705-.001 2.815-.739 2.827-1.88.006-.627-.427-1.1-1.36-1.49-.57-.256-.92-.426-.917-.686 0-.234.32-.47.934-.47z" fill="#5218ed" class="color000000 svgShape"></path></g></svg>
@@ -1,150 +1,106 @@
-import { Field, Form, Formik } from "formik";
+import React, {useState, useEffect} from 'react'
-import React, { useEffect, useState } from "react";
+import { Link, useNavigate } from 'react-router-dom';
-import { useDispatch } from "react-redux";
+import InputCom from '../Helpers/Inputs/InputCom';
 import LoadingSpinner from '../Spinners/LoadingSpinner';
 import usersService from '../../services/UsersService';
 import { Form, Formik } from "formik";
 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";
 const validationSchema = Yup.object().shape({
    country: Yup.string()
      .min(1, "Minimum 3 characters")
      .max(25, "Maximum 25 characters")
      .required("Country is required"),
-  price: Yup.string()
+    price: Yup.number()
-    .typeError("Invalid number")
+    .typeError("you must specify a 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")
+      .min(3, "Minimum 3 characters")
-    .max(149, "Maximum 149 characters")
+      .max(100, "Maximum 25 characters")
      .required("Title is required"),
    description: Yup.string()
-    .min(5, "Minimum 5 characters")
+      .min(3, "Minimum 3 characters")
-    .max(299, "Maximum 299 characters")
+      .max(250, "Maximum 250 characters")
      .required("Description is required"),
    job_detail: Yup.string()
      .min(3, "Minimum 3 characters")
-    .max(1440, "Maximum 1440 characters")
+      .max(250, "Maximum 250 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"),
+    .required("Price is required"),
  category: Yup.array().min(1, "Select at least one checkbox"),
  });
-function AddJob({ popUpHandler, categories }) {
+  let initialValues = { // initial values for formik
-  const ApiCall = new usersService();
+    country: '',
-
+    price: 0,
-  let dispatch = useDispatch();
+    title: '',
-
+    description: '',
-  let [currency, setCurrency] = useState({
+    job_detail: '',
-    loading: true,
+    timeline_days: ''
    status: false,
    data: null,
  }); // To Hold the array of currency getUserCurrency returns
  let initialValues = {
    // initial values for formik
    country: "",
    price: "",
    title: "",
    description: "",
    job_detail: "",
    timeline_days: "",
    category: [],
  };
  let [requestStatus, setRequestStatus] = useState({
    loading: false,
    status: false,
    message: "",
  }); // Holds state when submit button is pressed
  // FUNCTION TO GET Currency
  const getUserCurrency = () => {
    setCurrency((prev) => ({ ...prev, loading: true }));
    ApiCall.getUserWallets()
      .then((res) => {
        if (res.data.internal_return < 0) {
          setCurrency({ loading: false, status: true, data: [] });
          return;
 }
-        setCurrency({
+function AddJob() {
-          loading: false,
+    const ApiCall = new usersService()
-          status: true,
+    const navigate = useNavigate()
-          data: res.data.result_list,
+
-        });
+    let [pageLoading, setPageLoading] = useState(true) // State used for knowing when the page is mounting
    let [country, setCountry] = useState({loading: false, status: false, data:[]}) // To Hold the array of country getUserCountry returns
    let [requestStatus, setRequestStatus] = useState({loading: false, status: false, message:''}) // Holds state when submit button is pressed
    // FUNCTION TO GET COUNTRY
    const getUserCountry = () =>{
        setCountry(prev => ({...prev, loading:true}))
        ApiCall.getSignupCountryData().then(res => {
            if(res.data.internal_return < 1){
                setCountry({loading: false, status: true, data:[]})
                return
            }
            setCountry({loading: false, status: true, data:res.data.signup_country})
        }).catch(err => {
            setCountry({loading: false, status: false, data:[]})
        })
-      .catch((err) => {
+    }
        setCurrency({ loading: false, status: false, data: [] });
      });
  };
    // FUNCTION TO HANDLE ADD JOB FORM
    const handleAddJob = (values, helpers) => {
-    let reqData = {
+        setRequestStatus({loading: true, status: false, message:''})
-      country: values?.country,
+        ApiCall.jobManagerCreateJob(values).then(res => {
      price: Number(values.price) * 100,
      title: values?.title,
      description: values?.description,
      job_detail: values?.job_detail,
      timeline_days: values?.timeline_days,
      category: values.category?.join("@"),
    };
    setRequestStatus({ loading: true, status: false, message: "" });
    ApiCall.jobManagerCreateJob(reqData)
      .then((res) => {
            if(res.data.internal_return < 1){
-          setRequestStatus({
+                setRequestStatus({loading: false, status: false, message:'Could not complete your request at the moment'})
-            loading: false,
+                return
            status: false,
            message: "Could not complete your request at the moment",
          });
          setTimeout(() => {
            popUpHandler();
          }, 1500);
          return;
            }
-        setRequestStatus({
+            setRequestStatus({loading: false, status: true, message:'Job Added Successfully'})
          loading: false,
          status: true,
          message: "Job Added Successfully",
        });
            setTimeout(()=>{
-          dispatch(tableReload({ type: "JOBTABLE" }));
+                navigate('/myjobs', {replace: true})
-          popUpHandler();
+            },1000)
-        }, 1000);
+
-      })
+        }).catch(err => {
-      .catch((err) => {
+            setRequestStatus({loading: false, status: false, message:'Opps! soemthing went wrong. Try Again'})
-        setRequestStatus({
+        }).finally(()=>{
          loading: false,
          status: false,
          message: "Opps! something went wrong. Try Again",
        });
      })
      .finally(() => {
            setTimeout(()=>{
-          setRequestStatus({ loading: false, status: false, message: "" });
+                setRequestStatus({loading: false, status: false, message:''})
-        }, 5000);
+            }, 5000)
-      });
+        })
-  };
+    }
    useEffect(()=>{
-    getUserCurrency();
+        setPageLoading(false)
-  }, []);
+        getUserCountry()
    },[])
-  return (
+    return pageLoading.loading ? (
        <div className="personal-info-tab w-full flex flex-col justify-between">
          <div className="p-3">
            <LoadingSpinner size="32" color="sky-blue" />
          </div>
        </div>
      ) : (
        <div className="add-job p-5 w-full bg-white rounded-md flex flex-col justify-between">
          <Formik
            initialValues={initialValues}
@@ -154,42 +110,54 @@ function AddJob({ popUpHandler, categories }) {
            {(props) => {
                return (
                <Form>
                    <h1 className='py-2 my-4 text-lg md:text-xl font-bold tracking-wide'>Create New Job</h1>
                    <div className="flex flex-col-reverse sm:flex-row">
                        <div className="fields w-full">
                            {/* inputs starts here */}
-                  <div className="xl:flex xl:space-x-7 mb-[5px]">
+                            {/* country */}
                            <div className="xl:flex xl:space-x-7 mb-6">
                                <div className="field w-full mb-6 xl:mb-0">
                                {/* <InputCom
                                    fieldClass="px-6"
                                    label="Country"
                                    labelClass='tracking-wide'
                                    inputBg = 'bg-slate-100'
                                    type="text"
                                    name="country"
                                    // placeholder="Select Country"
                                    value={props.values.country}
                                    inputHandler={props.handleChange}
                                /> */}
                                <label 
-                        htmlFor="country"
+                                htmlFor='country'
-                        className="input-label text-[#181c32] dark:text-white text-[13.975px] leading-[20.9625px] font-semibold flex item-center gap-1"
+                                className="input-label text-[#181c32] dark:text-white text-[13.975px] leading-[20.9625px] font-semibold block">
-                      >
+                                    Country
                        Currency
                        {props.errors.country && props.touched.country && <span className="text-[12px] text-red-500">{props.errors.country}</span>}
                                </label>
                                <select 
-                        id="country"
+                                    id='country'
-                        name="country"
+                                    name='country'
                                    value={props.values.country}
                                    className={`input-field p-2 mt-3 rounded-md placeholder:text-base text-dark-gray dark:text-white w-full h-10 bg-slate-100 dark:bg-[#11131F] focus:ring-0 focus:outline-none`}
                                    onChange={props.handleChange}
                                    onBlur={props.handleBlur}
                                >
-                        {currency.loading ? (
+                                    {country.loading ? (
                                        <option className="text-slate-500 text-lg" value="">
                                        Loading...
                                        </option>
-                        ) : currency.data.length ? (
+                                    ) : country.data.length ? (
                                        <>
                                        <option className="text-slate-500 text-lg" value="">
-                              Select a currency
+                                            Select...
                                        </option>
-                            {currency.data?.map((item, index) => (
+                                        {country.data.map((item, index) => (
                                            <option
                                            key={index}
                                            className="text-slate-500 text-lg"
-                                value={item?.country}
+                                            value={item[0]}
                                            >
-                                {item?.description}
+                                            {item[1]}
                                            </option>
                                        ))}
                                        </>
@@ -199,149 +167,131 @@ function AddJob({ popUpHandler, categories }) {
                                        </option>
                                    )}
                                </select>
                                {props.errors.country && props.touched.country && (
                                    <p className="text-sm text-red-500">
                                    {props.errors.country}
                                    </p>
                                )}
                                </div>
                                {/* Price */}
                                <div className="field w-full">
                                <InputCom
-                        fieldClass="px-6 text-right"
+                                    fieldClass="px-6"
                                    label="Price"
-                        labelClass="tracking-wide"
+                                    labelClass='tracking-wide'
-                        inputBg="bg-slate-100"
+                                    inputBg = 'bg-slate-100'
                                    type="number"
                                    name="price"
-                        placeholder="0"
+                                    fieldClass='text-right'
                                    // placeholder="Please Enter Amount"
                                    value={props.values.price}
                                    inputHandler={props.handleChange}
                                    blurHandler={props.handleBlur}
                        error={props.errors.price && props.touched.price && props.errors.price}
                                />
                                {props.errors.price && props.touched.price && (
                                    <p className="text-sm text-red-500">
                                    {props.errors.price}
                                    </p>
                                )}
                                </div>
                            </div>
                            {/* Title  */}
-                  <div className="field w-full mb-[5px]">
+
                            <div className="field w-full mb-6">
                                <InputCom
                                fieldClass="px-6"
                                label="Title"
-                      labelClass="tracking-wide"
+                                labelClass='tracking-wide'
-                      inputBg="bg-slate-100"
+                                inputBg = 'bg-slate-100'
                                type="text"
                                name="title"
                                // placeholder="Enter Job Title"
                                value={props.values.title}
                                inputHandler={props.handleChange}
                                blurHandler={props.handleBlur}
                      error={props.errors.title && props.touched.title && props.errors.title}
                                />
                                {props.errors.title && props.touched.title && (
                                <p className="text-sm text-red-500">
                                    {props.errors.title}
                                </p>
                                )}
                            </div>
                            {/* Description  */}
-                  <div className="field w-full mb-[5px]">
+                            <div className="field w-full mb-6">
                                <InputCom
                                fieldClass="px-6"
                                label="Description"
-                      labelClass="tracking-wide"
+                                labelClass='tracking-wide'
-                      inputBg="bg-slate-100"
+                                inputBg = 'bg-slate-100'
                                type="text"
                                name="description"
                                // placeholder="Enter a description"
                                value={props.values.description}
                                inputHandler={props.handleChange}
                                blurHandler={props.handleBlur}
                      error={props.errors.description && props.touched.description && props.errors.description}
                                />
                                {props.errors.description && props.touched.description && (
                                <p className="text-sm text-red-500">
                                    {props.errors.description}
                                </p>
                                )}
                            </div>
                             {/* Details */}
-                  <div className="field flex flex-col sm:flex-row w-full mb-[5px] gap-2">
+                             <div className="field w-full mb-6">
-                    <div className="sm:w-[60%] w-full">
+                            {/* <InputCom
                                fieldClass="px-6"
                                label="Job Delivery Details"
                                labelClass='tracking-wide'
                                inputBg = 'bg-slate-100'
                                type="text"
                                name="details"
                                // placeholder="Please Enter Detail Description of Job"
                                value={props.values.details}
                                inputHandler={props.handleChange}
                            /> */}
                            <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='className="input-label text-[#181c32] dark:text-white text-[13.975px] leading-[20.9625px] font-semibold block"'>
                      >
                                Job Delivery Details
                        {props.errors.job_detail && props.touched.job_detail && <span className="text-[12px] text-red-500">{props.errors.job_detail}</span>}
                            </label>
-                      <textarea
+                            <textarea name="details" id="Job Delivery Details" rows="7"
-                        id="Job Delivery Details"
+                                className={`input-field p-6 mt-3 rounded-md placeholder:text-base text-dark-gray dark:text-white w-full h-full bg-slate-100 dark:bg-[#11131F] focus:ring-0 focus:outline-none`}
-                        rows="5"
+                                style={{resize:'none'}}
-                        className={`input-field px-3 py-2 placeholder:text-base text-dark-gray dark:text-white w-full h-[100px] bg-slate-100 dark:bg-[#11131F] focus:ring-0 focus:outline-[#dce4e9] rounded-[10px]`}
+                                name='job_detail'
                        style={{ resize: "none" }}
                        name="job_detail"
                                value={props.values.job_detail}
                                onChange={props.handleChange}
                                onBlur={props.handleBlur}
                            />
                            {props.errors.job_detail && props.touched.job_detail && (
                                <p className="text-sm text-red-500">
                                {props.errors.job_detail}
                                </p>
                            )}
                            </div>
-                    <div className="sm:w-[35%] w-full">
+                            <div className="field w-full mb-6">
-                      <div
+                            <InputCom
-                        htmlFor="Job Categories"
+                                fieldClass="px-6"
-                        className='className="input-label text-[#181c32] dark:text-white text-[13.975px] leading-[20.9625px] font-semibold block"'
+                                label="Timeline"
-                        id="checked-group"
+                                labelClass='tracking-wide'
-                      >
+                                inputBg = 'bg-slate-100'
-                        Categories
+                                type="text"
                      </div>
                      <div
                        className="sm:flex-col flex flex-wrap px-3 mt-3"
                        role="group"
                        aria-labelledby="checked-group"
                      >
                        {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"}
                        </span>
                      </div>
                    </div>
                  </div>
                  <div className="field w-full mb-[5px]">
                    <div className={`flex items-center justify-between mb-2.5`}>
                      <label
                        className="input-label text-[#181c32] dark:text-white text-[13.975px] leading-[20.9625px] font-semibold block"
                        htmlFor="timeline_days"
                      >
                        Timeline
                        <span className="text-green-700 text-sm tracking-wide">
                          - Expected duration of this task
                        </span>
                      </label>
                    </div>
                    <Field
                      component="select"
                                name="timeline_days"
-                      className={`input-field p-2 mt-3 rounded-md placeholder:text-base text-dark-gray dark:text-white w-full h-10 bg-slate-100 dark:bg-[#11131F] focus:ring-0 focus:outline-none ${
+                                spanTag = ' - Expected duration of this task'
-                        props.errors.timeline_days &&
+                                // placeholder="Please Enter Detail Description of Job"
                        props.touched.timeline_days
                          ? "border-[#ff0a0a63] shadow-red-500 border-[0.5px] animate-shake"
                          : "border border-[#f5f8fa] dark:border-[#5e6278]"
                      }`}
                                value={props.values.timeline_days}
-                    >
+                                inputHandler={props.handleChange}
-                      <option value="">Select Duration</option>
+                                blurHandler={props.handleBlur}
-                      {publicArray.map(({ name, duration }, idx) => (
+                            />
-                        <option
+                            {props.errors.timeline_days && props.touched.timeline_days && (
-                          className="text-slate-500 text-lg"
+                                <p className="text-sm text-red-500">
-                          value={duration}
+                                {props.errors.timeline_days}
-                        >
+                                </p>
-                          {name}
+                            )}
                        </option>
                      ))}
                    </Field>
                            </div>
                            {/* inputs ends here */}
                        </div>
@@ -350,38 +300,31 @@ function AddJob({ popUpHandler, categories }) {
                    {/* ERROR DISPLAY AND SUBMIT BUTTON */}
                    <div className="content-footer w-full">
                        {/* error or success display */}
-                {requestStatus.message != "" &&
+                        {requestStatus.message != "" && (
-                  (!requestStatus.status ? (
+                       !requestStatus.status ?
-                    <div
+                        (<div className={`relative p-4 my-4 text-[#912741] bg-[#fcd9e2] border-[#fbc6d3] mb-4 rounded-[0.475rem] text-md font-light leading-[19.5px] text-[13px]`}>
                      className={`relative p-4 my-4 text-[#912741] bg-[#fcd9e2] border-[#fbc6d3] mb-4 rounded-[0.475rem] text-md font-light leading-[19.5px] text-[13px]`}
                    >
                            {requestStatus.message}
-                    </div>
+                        </div>)
-                  ) : (
+                        :
-                    requestStatus.status && (
+                        requestStatus.status &&
-                      <div
+                            (<div className={`relative p-4 my-4 text-green-700 bg-slate-200 border-slate-800 mb-4 rounded-[0.475rem] text-md font-light leading-[19.5px] text-[13px]`}>
                        className={`relative p-4 my-4 text-green-700 bg-slate-200 border-slate-800 mb-4 rounded-[0.475rem] text-md font-light leading-[19.5px] text-[13px]`}
                      >
                                {requestStatus.message}
                            </div>
                            )
-                  ))}
+                        )}
                        {/* End of error or success display */}
-                <div className="w-full h-[70px] border-t border-light-purple dark:border-[#5356fb29]  flex justify-end items-center">
+                        <div className="w-full h-[120px] border-t border-light-purple dark:border-[#5356fb29]  flex justify-end items-center">
                            <div className="flex items-center space-x-4 mr-9">
-                    <button
+                                <Link
-                      type="button"
+                                to="/myjobs"
                                className="text-18 text-light-red tracking-wide "
                                >
-                      <span
+                                <span className="border-b dark:border-[#5356fb29]  border-light-red">
                        className="border-b dark:border-[#5356fb29]  border-light-red"
                        onClick={popUpHandler}
                      >
                                    {" "}
                                    Cancel
                                </span>
-                    </button>
+                                </Link>
                                {requestStatus.loading ? (
                                <LoadingSpinner size="8" color="sky-blue" />
@@ -402,20 +345,7 @@ function AddJob({ popUpHandler, categories }) {
            }}
          </Formik>
        </div>
-  );
+      )
 }
-export default AddJob;
+export default AddJob
 const publicArray = [
  { duration: 1, name: "1 day" },
  { duration: 2, name: "2 days" },
  { duration: 3, name: "3 days" },
  { duration: 4, name: "4 days" },
  { duration: 5, name: "5 days" },
  { duration: 6, name: "6 days" },
  { duration: 7, name: "1 week" },
  { duration: 14, name: "2 weeks" },
  { duration: 21, name: "3 weeks" },
  { duration: 28, name: "4 weeks" },
 ];
@@ -4,12 +4,12 @@ import { Link } from "react-router-dom";
 export default function LoginLayout({ slogan, children }) {
  return (
    <div className={`layout-wrapper login`}>
-      <div className={`main-wrapper login-wrapper w-full h-screen overflow-y-auto p-2 sm:px-20 sm:py-5`}>
+      <div className={`main-wrapper login-wrapper w-full h-screen overflow-y-auto sm:p-20 p-10`}>
        <div className="w-full h-full">
          <div className="flex-1 flex justify-center items-center">
            {children && children}
          </div>
-          <div className="flex-1 flex justify-center items-center px-10 pt-10">
+          <div className="flex-1 flex justify-center items-center p-10">
            <div className="flex items-center">
            <a
                  href="https://www.wrenchboard.com/about-us"
@@ -37,9 +37,9 @@ export default function LoginLayout({ slogan, children }) {
                </a>
            </div>
          </div>
-          <div className="flex-1 flex justify-center items-center px-10 py-1">
+          <div className="flex-1 flex justify-center items-center p-10">
-            <p className="text-black text-[15px] px-2 font-medium flex items-center gap-1">
+            <p className="text-black text-[15px] px-2 font-medium flex items-center">
-              <span className="">&copy; {new Date().getFullYear()} -</span>
+             <span className="text-3xl mt-2 mr-1">©</span>  2023 - {" "}
              <Link to="/" className="text-[#009ef7] ml-1">
                WrenchBoard
              </Link>{" "}
@@ -43,7 +43,7 @@ export default function CollectionTab({ className, products }) {
              <DataIteration
                datas={products}
                startLength={process.env.REACT_APP_ZERO_STATE}
-                endLength={products?.length}
+                endLength={products.length}
              >
                {({ datas }) => (
                  <CollectionCard key={datas.uniqKey} collectionData={datas} />
@@ -42,9 +42,7 @@ export default function CreateSaleSlider({
      {/* heading */}
      <div className="flex justify-between items-center mb-6">
        <div>
-          <h1 className="text-26 font-bold   text-dark-gray dark:text-white">
+          <h1 className="text-26 font-bold   text-dark-gray dark:text-white">Create for Sell</h1>
            Create for Sell
          </h1>
        </div>
        <div className="slider-btns flex space-x-4">
          <button onClick={nextHandler} type="button">
@@ -91,7 +89,7 @@ export default function CreateSaleSlider({
      <div className="trending-products relative w-full">
        <SliderCom selector={trendingSlider} settings={settings}>
          {products &&
-            products?.length > 0 &&
+            products.length > 0 &&
            products.map((item) => (
              <ProductCardStyleTwo
                key={item.id}
@@ -49,9 +49,7 @@ export default function CreatedBidsSlider({
      {/* heading */}
      <div className="flex justify-between items-center mb-6">
        <div>
-          <h1 className="text-26 font-bold   text-dark-gray dark:text-white">
+          <h1 className="text-26 font-bold   text-dark-gray dark:text-white">Create for Bits</h1>
            Create for Bits
          </h1>
        </div>
        <div className="slider-btns flex space-x-4">
          <button onClick={nextHandler} type="button">
@@ -98,7 +96,7 @@ export default function CreatedBidsSlider({
      <div className="trending-products relative w-full">
        <SliderCom selector={trendingSlider} settings={settings}>
          {products &&
-            products?.length > 0 &&
+            products.length > 0 &&
            products.map((item) => (
              <ProductCardStyleOne
                key={item.id}
@@ -43,7 +43,7 @@ export default function OnSaleTab({ className, products }) {
              <DataIteration
                datas={products}
                startLength={process.env.REACT_APP_ZERO_STATE}
-                endLength={products?.length}
+                endLength={products.length}
              >
                {({ datas }) => (
                  <ProductCardStyleTwo key={datas.id} datas={datas} />
@@ -43,7 +43,7 @@ export default function OwnTab({ className, products }) {
              <DataIteration
                datas={products}
                startLength={process.env.REACT_APP_ZERO_STATE}
-                endLength={products?.length}
+                endLength={products.length}
              >
                {({ datas }) => (
                  <ProductCardStyleOne key={datas.id} datas={datas} />
@@ -1,69 +0,0 @@
 import React, { useEffect } from 'react';
 import { useLocation, useNavigate } from 'react-router-dom';
 import usersService from '../../../services/UsersService';
 import {updateUserDetails} from "../../../store/UserDetails";
 import { useDispatch } from "react-redux";
 import AuthLayout from "../AuthLayout";
 function AppleRedirect() {
    const location = useLocation();
    const navigate = useNavigate();
    const userApi = new usersService();
    const dispatch = useDispatch()
    const queryParams = new URLSearchParams(location?.search);
    const codeResponse = queryParams.get("code");
    useEffect(()=>{
      if(!codeResponse){
        navigate('/login', {state: {error: true}})
        return
      }
      console.log(codeResponse);
      setTimeout(()=>{ // remove LATER
        navigate('/login', {state: {error: true}})
      },2000)
      /*
      POST /token HTTP/1.1
      Host: oauth2.googleapis.com
      Content-Type: application/x-www-form-urlencoded
      code=4/P7q7W91a-oMsCeLvIaQm6bTrgtp7&
      client_id=your_client_id&
      client_secret=your_client_secret&
      redirect_uri=https%3A//oauth2.example.com/code&
      grant_type=authorization_code
      */
      var reqData = {
        auth_type: "APPLE",
        code: codeResponse,
        redirect_uri: process.env.REACT_APP_GOOGLE_REDIRECT_URL,
      };
    //   userApi
    //     .authStart(reqData)
    //     .then((res) => {
    //       if (res.status == 200  && res.data.internal_return >= 0 && res.data.member_id && res.data.uid && res.data.session) {
    //         localStorage.setItem("member_id", `${res.data.member_id}`);
    //         localStorage.setItem("uid", `${res.data.uid}`);
    //         localStorage.setItem("session_token", `${res.data.session}`);
    //         dispatch(updateUserDetails({...res.data}));
    //         navigate('/', {replace: true})
    //         return
    //       }
    //       navigate('/login', {state: {error: true}})
    //     })
    //     .catch((error) => {
    //       navigate('/login', {state: {error: true}})
    //       console.log(error);
    //     });
    },[])
  return (
    <AuthLayout>
    <div className='min-h-[70vh]'>Redirecting ... </div>
  </AuthLayout>
  )
 }
 export default AppleRedirect
@@ -1,65 +0,0 @@
 import React, { useEffect } from 'react';
 import { useLocation, useNavigate } from 'react-router-dom';
 import usersService from '../../../services/UsersService';
 import {updateUserDetails} from "../../../store/UserDetails";
 import { useDispatch } from "react-redux";
 import AuthLayout from "../AuthLayout";
 function FbookRedirect() {
    const location = useLocation();
    const navigate = useNavigate();
    const userApi = new usersService();
    const dispatch = useDispatch()
    const queryParams = new URLSearchParams(location?.search);
    const codeResponse = queryParams.get("code");
    useEffect(()=>{
      if(!codeResponse){
        navigate('/login', {state: {error: true}})
        return
      }
      console.log(codeResponse);
      /*
      POST /token HTTP/1.1
      Host: oauth2.googleapis.com
      Content-Type: application/x-www-form-urlencoded
      code=4/P7q7W91a-oMsCeLvIaQm6bTrgtp7&
      client_id=your_client_id&
      client_secret=your_client_secret&
      redirect_uri=https%3A//oauth2.example.com/code&
      grant_type=authorization_code
      */
      var reqData = {
        auth_type: "FACEBOOK",
        code: codeResponse,
        redirect_uri: process.env.REACT_APP_GOOGLE_REDIRECT_URL,
      };
    //   userApi
    //     .authStart(reqData)
    //     .then((res) => {
    //       if (res.status == 200  && res.data.internal_return >= 0 && res.data.member_id && res.data.uid && res.data.session) {
    //         localStorage.setItem("member_id", `${res.data.member_id}`);
    //         localStorage.setItem("uid", `${res.data.uid}`);
    //         localStorage.setItem("session_token", `${res.data.session}`);
    //         dispatch(updateUserDetails({...res.data}));
    //         navigate('/', {replace: true})
    //         return
    //       }
    //       navigate('/login', {state: {error: true}})
    //     })
    //     .catch((error) => {
    //       navigate('/login', {state: {error: true}})
    //       console.log(error);
    //     });
    },[])
  return (
    <AuthLayout>
    <div className='min-h-[70vh]'>Redirecting ... </div>
  </AuthLayout>
  )
 }
 export default FbookRedirect
@@ -1,64 +0,0 @@
 import React, { useEffect } from 'react';
 import { useLocation, useNavigate } from 'react-router-dom';
 import usersService from '../../../services/UsersService';
 import {updateUserDetails} from "../../../store/UserDetails";
 import { useDispatch } from "react-redux";
 import AuthLayout from "../AuthLayout";
 function Redirect() {
    const location = useLocation();
    const navigate = useNavigate();
    const userApi = new usersService();
    const dispatch = useDispatch()
    const queryParams = new URLSearchParams(location?.search);
    const codeResponse = queryParams.get("code");
    useEffect(()=>{
      if(!codeResponse){
        navigate('/login', {state: {error: true}})
        return
      }
      console.log(codeResponse);
      /*
      POST /token HTTP/1.1
      Host: oauth2.googleapis.com
      Content-Type: application/x-www-form-urlencoded
      code=4/P7q7W91a-oMsCeLvIaQm6bTrgtp7&
      client_id=your_client_id&
      client_secret=your_client_secret&
      redirect_uri=https%3A//oauth2.example.com/code&
      grant_type=authorization_code
      */
      var reqData = {
        auth_type: "GOOGLE",
        code: codeResponse,
        redirect_uri: process.env.REACT_APP_GOOGLE_REDIRECT_URL,
      };
      userApi
        .authStart(reqData)
        .then((res) => {
          if (res.status == 200  && res.data.internal_return >= 0 && res.data.member_id && res.data.uid && res.data.session) {
            localStorage.setItem("member_id", `${res.data.member_id}`);
            localStorage.setItem("uid", `${res.data.uid}`);
            localStorage.setItem("session_token", `${res.data.session}`);
            dispatch(updateUserDetails({...res.data}));
            navigate('/', {replace: true})
            return
          }
          navigate('/login', {state: {error: true}})
        })
        .catch((error) => {
          navigate('/login', {state: {error: true}})
          console.log(error);
        });
    },[])
  return (
    <AuthLayout>
    <div className='min-h-[70vh]'>Redirecting ... </div>
  </AuthLayout>
  )
 }
 export default Redirect
@@ -1,6 +1,5 @@
-import React, { useEffect, useLayoutEffect, useState } from "react";
+import React, { useState } from "react";
-import { Link, useLocation, useNavigate } from "react-router-dom";
+import { Link, useNavigate } from "react-router-dom";
 import linkedInLogo from "../../../assets/images/Linkedin.png";
 import appleLogo from "../../../assets/images/apple-black.svg";
 import facebookLogo from "../../../assets/images/facebook-4.svg";
 import googleLogo from "../../../assets/images/google-logo.svg";
@@ -9,39 +8,24 @@ import usersService from "../../../services/UsersService";
 import InputCom from "../../Helpers/Inputs/InputCom";
 import AuthLayout from "../AuthLayout";
 //import { GoogleOAuthProvider } from '@react-oauth/google';
-import { useGoogleLogin } from "@react-oauth/google";
+// import { googleLogout, useGoogleLogin } from '@react-oauth/google';
 import { useDispatch } from "react-redux";
 import { updateUserDetails } from "../../../store/UserDetails";
 export default function Login() {
  const dispatch = useDispatch();
  const { state } = useLocation();
  let [loginType, setLoginType] = useState("");
  const [checked, setValue] = useState(false);
  const [loginLoading, setLoginLoading] = useState(false);
  const [showPassword, setShowPassword] = useState(false);
  //login error state
  const [loginError, setLoginError] = useState(false);
  // for the catch error
  const [msgError, setMsgError] = useState("");
-  // To Show and Hide Password
+  const rememberMe = () => {
-  const togglePasswordVisibility = () => {
+    setValue(!checked);
    setShowPassword(!showPassword);
  };
  //FUNCTION TO DETERMINE/CHANGE LOGIN COMPONENT
  const handleLoginType = ({ target: { name } }) => {
    setLoginType(name);
    let currentDate = new Date();
    let expirationDate = new Date(currentDate.getTime() + 24 * 60 * 60 * 1000);
    // Convert the expiration date to the appropriate format
    let expirationDateString = expirationDate.toUTCString();
    document.cookie = `loginType=${name}; expires=${expirationDateString}; path=/;`;
  };
  // email
@@ -57,158 +41,56 @@ export default function Login() {
  const navigate = useNavigate();
  const userApi = new usersService();
-  // FUNCTION TO HANDLE USER LOGIN
+  const doLogin = async () => {
-  const doLogin = ({ target: { name } }) => {
+    try {
-    setMsgError("");
+      if (email !== "" && password !== "") {
-    setLoginError(false);
+        var postData = {
    setLoginLoading(true);
    let postData; // Post Data for API
    if (!email || !password) {
      setLoginLoading(false);
      setMsgError("Please fill all the fields");
      setTimeout(() => {
        setMsgError("");
      }, Number(process.env.REACT_APP_LOGIN_ERROR_TIMEOUT));
      return;
    }
    if (name == "full") {
      //checks if email is a valid email address
      let regEx = /^[^0-9][a-zA-Z0-9._%+-]+@[a-zA-Z]+(\.[a-zA-Z]+)+$/;
      if (regEx.test(email) == false) {
        setLoginLoading(false);
        setMsgError("Invalid Email");
        return setTimeout(() => {
          setMsgError("");
        }, 3000);
      }
      // Post Data Info for normal Login
      postData = {
          username: email,
          password: password,
          sessionid: "STARTING",
        login_mode: 1100,
        action: 11025,
        };
-    } else if (name == "family") {
+        const loginResult = await userApi.logInUser(postData); // just for a test
-      // Post Data Info for family Login
+        //debugger;
-      postData = {
+        // if (email === "support@mermsemr.com") {
        username: email,
        pin: password,
        sessionid: "20067A92714",
        login_mode: 1105,
        action: 11025,
      };
    } else {
      setLoginLoading(false);
      setMsgError("Invalid Login Type. Consider refreshing the page");
      setTimeout(() => {
        setMsgError("");
      }, Number(process.env.REACT_APP_LOGIN_ERROR_TIMEOUT));
      return;
    }
    userApi
      .logInUser(postData)
      .then((res) => {
        if (
-          res.status != 200 ||
+          loginResult.data.status > 0 &&
-          res.data.internal_return < 0 ||
+          loginResult.data.internal_return == 100 &&
-          !res.data.member_id ||
+          loginResult.data.session != ""
          !res.data.uid ||
          !res.data.session
        ) {
-          // setMsgError("Wrong, email/password");
+          // just for a start
-          setLoginError(true);
+          localStorage.setItem("member_id", `${loginResult.data.member_id}`);
-          setLoginLoading(false);
+          localStorage.setItem("uid", `${loginResult.data.uid}`);
-          return;
+          localStorage.setItem("session_token", `${loginResult.data.session}`);
-        }
+          localStorage.setItem("session", `${loginResult.data.session}`);
-        localStorage.setItem("member_id", `${res.data.member_id}`);
+          setLoginLoading(true);
-        localStorage.setItem("uid", `${res.data.uid}`);
+          // userApi.getUserReminders(); //testing
-        localStorage.setItem("session_token", `${res.data.session}`);
+          dispatch(updateUserDetails(loginResult.data));
        // localStorage.setItem("session", `${res.data.session}`);
        dispatch(updateUserDetails({ ...res.data }));
          setTimeout(() => {
            navigate("/", { replace: true });
            setLoginLoading(false);
          }, 2000);
-      })
+        } else {
-      .catch((error) => {
+          // toast.error("Invalid Credential");
-        setMsgError("Unable to login, try again");
+          setLoginError(true);
-        setLoginLoading(false);
+        }
-      })
+      } else {
-      .finally(() => {
+        setMsgError("Please fill in the fields");
      }
    } catch (error) {
      setMsgError("An error occurred");
    } finally {
      setTimeout(() => {
        setLoginError(false);
-          setMsgError("");
+        setMsgError(null);
          setLoginLoading(false);
      }, Number(process.env.REACT_APP_LOGIN_ERROR_TIMEOUT));
-      });
+    }
  };
  const googleLogin = useGoogleLogin({
    flow: "auth-code",
    ux_mode: "redirect",
    redirect_uri: process.env.REACT_APP_GOOGLE_REDIRECT_URL,
    onSuccess: async (codeResponse) => {
      console.log("GOOGLE LOGIN GOOD --- ", codeResponse);
    },
    onError: (errorResponse) => console.log(errorResponse),
  });
  // In order to update the selected login type whenever the component renders
  // useEffect(() => {
  // Clear the loginType cookie if the user switches to loginfull
  // document.cookie ="loginType=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;";
  // }, []);
  useLayoutEffect(() => {
    // checks the cookie in order to set the login type before components mounts
    // if(document.cookie.includes("loginType=family")){
    //   setLoginType('family')
    // }else if(document.cookie.includes("loginType=full")){
    //   setLoginType('full')
    // }else{
    //   setLoginType('full')
    // }
    function readCookie(cname) {
      // checks the cookie in order to set the login type before components mounts
      let name = cname + "=";
      let decoded_cookie = decodeURIComponent(document.cookie);
      let carr = decoded_cookie.split(";");
      for (let i = 0; i < carr.length; i++) {
        let c = carr[i];
        while (c.charAt(0) == " ") {
          c = c.substring(1);
        }
        if (c.indexOf(name) == 0) {
          return c.substring(name.length, c.length);
        }
      }
      return "full";
    }
    let loginValue = readCookie("loginType");
    setLoginType(loginValue);
    if (state?.error) {
      //check if the login path has an error state indicating any social handle login with error
      setMsgError("Unexpected Error, Please try again soon.");
      setTimeout(() => {
        setMsgError("");
        navigate("/login", { replace: true });
      }, 4000);
    }
  }, []);
  useEffect(() => {
    setMail("");
    setPassword("");
  }, [loginType]);
  return (
    <>
      <AuthLayout slogan="Welcome to WrenchBoard">
        <div className="w-full">
-          <div className="mb-5">
+          <div className="mb-12">
            <Link to="#">
              <img
                src={WrenchBoard}
@@ -217,12 +99,12 @@ export default function Login() {
              />
            </Link>
          </div>
-          <div className="content-wrapper login shadow-md w-full lg:max-w-[530px] mx-auto flex justify-center items-center xl:bg-white dark:bg-dark-white 2xl:w-[828px]  rounded-[0.475rem] sm:p-7 p-5">
+          <div className="content-wrapper login shadow-md w-full lg:max-w-[500px] mx-auto flex justify-center items-center xl:bg-white dark:bg-dark-white 2xl:w-[828px]  rounded-[0.475rem] sm:p-7 p-5">
            <div className="w-full">
              <div className="title-area flex flex-col justify-center items-center relative text-center mb-7">
-                {/* <h1 className="text-[#181c32] font-semibold dark:text-white mb-3 leading-[27.3px] text-[22.75px]">
+                <h1 className="text-[#181c32] font-semibold dark:text-white mb-3 leading-[27.3px] text-[22.75px]">
                  Sign In to WrenchBoard
-                </h1> */}
+                </h1>
                <span className="text-gray-400 font-medium text-[16.25px] leading-[24.375px]">
                  New Here?{" "}
                  <Link
@@ -233,47 +115,13 @@ export default function Login() {
                  </Link>
                </span>
              </div>
-
+              <div className="input-area">
              {/* switch login component */}
              <div className="ml-7 flex justify-start items-center gap-3">
                <button
                  name="full"
                  className={`login-type-btn px-4 py-1 rounded-t-2xl ${
                    loginType == "full"
                      ? "bg-[#4687ba] border-[2px] border-[#4687ba] text-white"
                      : "bg-white text-[#000] border-t-[2px]"
                  }`}
                  onClick={handleLoginType}
                >
                  Sign in
                </button>
                <button
                  name="family"
                  className={`login-type-btn px-4 py-1 rounded-t-2xl ${
                    loginType == "family"
                      ? "bg-[#4687ba] border-[2px] border-[#4687ba] text-white"
                      : "bg-white text-[#000] border-t-[2px]"
                  }`}
                  onClick={handleLoginType}
                >
                  Family Account
                </button>
              </div>
              {/* END  of switch login component */}
              {/* for login component */}
              {
                loginType == "full" ? (
                  //user login component
                  <div className="p-6 input-area login-area border-2 border-[#4687ba] rounded-2xl">
                <div className="input-item mb-5">
                  <InputCom
-                        labelClass="tracking-wider"
+                    fieldClass="px-6"
                        fieldClass="sm:px-6 px-2"
                    value={email}
                    inputHandler={handleEmail}
-                        placeholder="Your Email"
+                    placeholder="support@mermsemr.com"
                    label="Email"
                    name="email"
                    type="email"
@@ -283,16 +131,14 @@ export default function Login() {
                <div className="input-item mb-5">
                  <InputCom
-                        labelClass="tracking-wider"
+                    fieldClass="px-6"
-                        fieldClass="sm:px-6 px-2 tracking-[0.25em] text-2xl"
+                    value={password}
                        value={password.replace(/./g, "●")}
                    inputHandler={handlePassword}
                    placeholder="● ● ● ● ● ●"
                    label="Password"
                    name="password"
-                        type={showPassword ? "text" : "password"}
+                    type="password"
-                        onClick={togglePasswordVisibility}
+                    iconName="password"
                        passIcon={showPassword ? "password" : "password"}
                    forgotPassword
                  />
                </div>
@@ -316,122 +162,29 @@ export default function Login() {
                <div className="signin-area mb-3.5">
                  <div className="flex justify-center">
                    <button
                          name="full"
                      onClick={doLogin}
                      type="button"
                          disabled={loginLoading}
                      className={`btn-login  rounded-[0.475rem] mb-6 text-xl text-white flex justify-center bg-[#4687ba] hover:bg-[#009ef7] transition-all duration-300 items-center text-[15px]`}
                    >
                      {loginLoading ? (
                        <div className="signup btn-loader"></div>
                      ) : (
-                            <>Continue</>
+                        <span>Continue</span>
                      )}
                    </button>
                  </div>
-                      <div className="sm:flex sm:justify-between sm:items-center sm:space-x-2">
+                  <BrandBtn link="#"  imgSrc={googleLogo} brand="Google" />
-                        <BrandBtn
+                  <BrandBtn link="#"   imgSrc={facebookLogo} brand="Facebook" />
-                          link="#"
+                  <BrandBtn link="#"    imgSrc={appleLogo} brand="Apple" />
                          imgSrc={googleLogo}
                          brand="Google"
                          onClick={googleLogin}
                        />
                        <BrandBtn
                          // link={`https://appleid.apple.com/auth/authorize?response_type=code&response_mode=form_post&client_id=${process.env.REACT_APP_APPLE_CLIENT_ID}&redirect_uri=https%3A%2F%2Fwork.wrenchboard.com%2Flogin%2Fauth%2Fapple&state=4b2c4456b7&scope=name+email`}
                          link={`https://appleid.apple.com/auth/authorize?response_type=code&response_mode=form_post&client_id=${process.env.REACT_APP_APPLE_CLIENT_ID}&redirect_uri=${process.env.REACT_APP_APPLE_REDIRECT_URL}&state=4b2c4456b7&scope=name+email`}
                          imgSrc={appleLogo}
                          brand="Apple"
                          isAnchor={true}
                        />
                </div>
-                      <div className="sm:flex sm:justify-between sm:items-center sm:space-x-2">
+                {/* <div className="signup-area flex justify-center">
-                        <BrandBtn
+                <p className="sm:text-lg text-sm text-thin-light-gray font-normal">
-                          link={`https://www.facebook.com/v14.0/dialog/oauth?client_id=${process.env.REACT_APP_FACEBOOK_CLIENT_ID}&redirect_uri=${process.env.REACT_APP_FACEBOOK_REDIRECT_URL}&scope=${process.env.REACT_APP_FACEBOOK_CLIENT_SCOPE}`}
+                  Don't have an account ?
-                          imgSrc={facebookLogo}
+                  <a href="/signup" className="ml-2   text-dark-gray dark:text-white">
-                          brand="Facebook"
+                    Sign up free
-                          isAnchor={true}
+                  </a>
-                        />
+                </p>
-                        <BrandBtn
+              </div> */}
                          // link="https://www.linkedin.com/oauth/v2/authorization?response_type=code&client_id=YOUR_CLIENT_ID&redirect_uri=YOUR_REDIRECT_URI&scope=comma-separated-list-of-scopes&state=YOUR_STATE_VALUE"
                          imgSrc={linkedInLogo}
                          brand="LinkedIn"
                          isAnchor={true}
                        />
                      </div>
                    </div>
                  </div>
                ) : (
                  // END of user login compoenent
                  // family login compoenent
                  <div className="p-6 input-area login-area border-2 border-[#4687ba] rounded-2xl">
                    <div className="input-item mb-5">
                      <InputCom
                        labelClass="tracking-wider"
                        fieldClass="px-6"
                        value={email}
                        inputHandler={handleEmail}
                        placeholder="Account ID"
                        label="Username"
                        name="email"
                        type="email"
                        iconName="family-id"
                      />
                    </div>
                    <div className="input-item mb-5">
                      <InputCom
                        labelClass="tracking-wider"
                        fieldClass="px-6"
                        value={password}
                        inputHandler={handlePassword}
                        placeholder="● ● ● ● ● ●"
                        label="Pin"
                        name="password"
                        type={showPassword ? "text" : "password"}
                        onClick={togglePasswordVisibility}
                        passIcon={showPassword ? "family-pin" : "family-pin"}
                      />
                    </div>
                    {loginError && (
                      <div className="relative p-4 text-[#912741] bg-[#fcd9e2] border-[#fbc6d3] mb-4 rounded-[0.475rem] text-md font-thin leading-[19.5px] text-[13px]">
                        Invalid username or password{" "}
                        {/* <Link to="/#" className="text-[#009ef7]">
                        reset your password
                      </Link>{" "}
                      or{" "}
                      <Link to="/signup" className="text-[#009ef7]">
                        create a new account
                      </Link> */}
                      </div>
                    )}
                    {msgError && (
                      <div className="relative p-4 text-[#912741] bg-[#fcd9e2] border-[#fbc6d3] mb-4 rounded-[0.475rem] text-md font-light leading-[19.5px] text-[13px]">
                        {msgError}
                      </div>
                    )}
                    <div className="signin-area mb-1.5">
                      <div className="flex justify-center">
                        <button
                          name="family"
                          onClick={doLogin}
                          disabled={loginLoading}
                          type="button"
                          className={`btn-login  rounded-[0.475rem] text-xl text-white flex justify-center bg-[#4687ba] hover:bg-[#009ef7] transition-all duration-300 items-center text-[15px]`}
                        >
                          {loginLoading ? (
                            <div className="signup btn-loader"></div>
                          ) : (
                            <>Continue</>
                          )}
                        </button>
                      </div>
                    </div>
                  </div>
                )
                // END of family login compoenent
              }
              {/* END of login component */}
                <div className="pt-5 text-[#181c32] text-center font-semibold text-[13.975px] leading-[20.9625px]">
                  This site is protected by hCaptcha and the our Privacy Policy
                  and Terms of Service apply.
@@ -439,15 +192,17 @@ export default function Login() {
              </div>
            </div>
          </div>
        </div>
      </AuthLayout>
    </>
  );
 }
-const BrandBtn = ({ link, imgSrc, brand, onClick, isAnchor = false }) => {
+const BrandBtn = ({ link, imgSrc, brand }) => {
-  // const doGoogle = async () => {
+
-  //   alert("start google");
+  const doGoogle = async ()=>{
-  // };
+    alert('start google');
  }
  //  onSuccess: (codeResponse) => setUser(codeResponse),
@@ -456,18 +211,19 @@ const BrandBtn = ({ link, imgSrc, brand, onClick, isAnchor = false }) => {
  //   onError: (error) => console.log('Login Failed:', error)
  // });
-  // const doApple = async () => {
+  const doApple = async ()=>{
-  //   alert("start apple");
+    alert('start apple');
-  // };
+  }
  const doFacebook = async ()=>{
    alert('start facebook');
  }
  // const doFacebook = async () => {
  //   alert("start facebook");
  // };
  return (
-    <div className="w-full sm:w-1/2 flex justify-center bottomMargin">
+    <div className="flex justify-center bottomMargin">
      {isAnchor ? (
      <a
-          href={link}
+          // onClick={doGoogle}
          href="#dd"
        className="w-full border border-light-purple dark:border-[#5356fb29]  rounded-[0.475rem] h-[48px] flex justify-center bg-[#FAFAFA] hover:bg-[#eff2f5] hover:text-[#7e8299] transition duration-300 dark:bg-[#11131F]  items-center font-medium cursor-pointer"
      >
        <img className="mr-3 h-6" src={imgSrc} alt="logo-icon(s)" />
@@ -475,18 +231,6 @@ const BrandBtn = ({ link, imgSrc, brand, onClick, isAnchor = false }) => {
          Continue with {brand}
        </span>
      </a>
      ) : (
        <button
          onClick={onClick}
          // href="#dd"
          className="w-full border border-light-purple dark:border-[#5356fb29]  rounded-[0.475rem] h-[48px] flex justify-center bg-[#FAFAFA] hover:bg-[#eff2f5] hover:text-[#7e8299] transition duration-300 dark:bg-[#11131F]  items-center font-medium cursor-pointer"
        >
          <img className="mr-3 h-6" src={imgSrc} alt="logo-icon(s)" />
          <span className="text-lg text-thin-light-gray font-normal text-[15px]">
            Continue with {brand}
          </span>
        </button>
      )}
    </div>
  );
 };
@@ -4,7 +4,6 @@ import facebookLogo from "../../../assets/images/facebook-4.svg";
 import WrenchBoard from "../../../assets/images/wrenchboard.png";
 import usersService from "../../../services/UsersService";
 import InputCom from "../../Helpers/Inputs/InputCom";
 import AuthLayout from "../AuthLayout";
 export default function SignUp() {
  const [signUpLoading, setSignUpLoading] = useState(false);
@@ -65,19 +64,6 @@ export default function SignUp() {
        last_name !== "" &&
        country !== ""
      ) {
        //checks if email is a valid email address
        let regEx = /^[^0-9][a-zA-Z0-9._%+-]+@[a-zA-Z]+(\.[a-zA-Z]+)+$/;
        if (regEx.test(email) == false) {
          setMsgError("Invalid Email");
          return setTimeout(()=>{setMsgError("");},3000)
        }
        //checks if terms and condition is checked
        if (!checked) {
          setMsgError("Terms and condition required");
          return setTimeout(()=>{setMsgError("");},3000)
        }
        setSignUpLoading(true);
        const reqData = {
          country: country,
@@ -94,8 +80,8 @@ export default function SignUp() {
        if (res.status === 200) {
          const { data } = res;
-          if (data && data.acc === "DULPICATE") {
+          if (data.status === -1 && data.acc === "DULPICATE") {
-            setMsgError("Unable to use this username. Please try another username.");
+            setMsgError("This account has been already created");
            setSignUpLoading(false);
          }
          if (data && data.status === "1") {
@@ -122,13 +108,16 @@ export default function SignUp() {
  useEffect(() => {
    getCountryList();
-  }, []);
+  });
  return (
    <>
-      <AuthLayout slogan="Welcome to WrenchBoard">
+      <div className="layout-wrapper login">
        <div className="main-wrapper w-full xl:h-screen h-full xl:py-10 py-12 overflow-y-auto">
          <div className=" h-full">
            <div className="flex-1 flex justify-center items-center">
              <div className="w-full">
-          <div className="mb-5">
+                <div className="mb-12">
                  <Link to="#">
                    <img
                      src={WrenchBoard}
@@ -137,7 +126,7 @@ export default function SignUp() {
                    />
                  </Link>
                </div>
-          <div className="content-wrapper login relative shadow-md w-full lg:max-w-[530px] mx-auto flex justify-center items-center xl:bg-white dark:bg-dark-white 2xl:w-[828px]  rounded-[0.475rem] sm:p-7 p-5 mb-0">
+                <div className="content-wrapper login shadow-md w-full lg:max-w-[600px] mx-auto flex justify-center items-center xl:bg-white dark:bg-dark-white 2xl:w-[828px]  rounded-[0.475rem] sm:p-7 p-5 mb-7">
                  <div>
                    <div className="title-area flex flex-col justify-center items-center relative text-center mb-7">
                      <h1 className="text-[#181c32] font-semibold dark:text-white mb-3 leading-[27.3px] text-[22.75px]">
@@ -153,6 +142,17 @@ export default function SignUp() {
                        </Link>
                      </span>
                    </div>
                    <button
                      type="button"
                      className={`rounded-[0.475rem] w-full mb-6 text-[15px] h-[42px] font-semibold text-[#009ef7] hover:text-white flex justify-center bg-[#f1faff] hover:bg-[#009ef7] transition-all duration-300 items-center py-[0.8875rem] px-[1.8125rem]`}
                    >
                      <img
                        className="mr-3 h-6"
                        src={facebookLogo}
                        alt="logo-icon(s)"
                      />
                      Sign in with Facebook
                    </button>
                    <div className="w-full flex items-center gap-2">
                      <div className="border-b border-[#eff2f5] max-w-[50%] w-full"></div>
                      <span className="text-[#b5b5c3] font-medium text-[0.7rem] w-[2%]">
@@ -205,7 +205,7 @@ export default function SignUp() {
                      </div>
                      <div className="input-item mb-5">
                        <InputCom
-                    fieldClass="sm:px-6 px-2 tracking-[0.25em] text-2xl"
+                          fieldClass="px-6"
                          placeholder="● ● ● ● ● ●"
                          label="Password"
                          name="password"
@@ -214,12 +214,12 @@ export default function SignUp() {
                          passIcon={
                            showPassword ? "show-password" : "hide-password"
                          }
-                    value={formData.password.replace(/./g, "●")}
+                          value={formData.password}
                          inputHandler={handleInputChange}
                        />
                      </div>
                      {msgError && (
-                  <div className="p-4 text-[#912741] bg-[#fcd9e2] border-[#fbc6d3] mb-4 rounded-[0.475rem] text-md font-light leading-[19.5px]">
+                        <div className="relative p-4 text-[#912741] bg-[#fcd9e2] border-[#fbc6d3] mb-4 rounded-[0.475rem] text-md font-light leading-[19.5px]">
                          {msgError}
                        </div>
                      )}
@@ -278,7 +278,46 @@ export default function SignUp() {
                  </div>
                </div>
              </div>
-      </AuthLayout>
+            </div>
            <div className="flex-1 flex justify-center items-center p-10">
              <div className="flex items-center">
                <a
                  href="https://www.wrenchboard.com/about-us"
                  className="text-[#a1a5b7] text-[15px] px-2 font-medium hover:text-[#009ef7]"
                  target="_blank"
                  rel="noreferrer"
                >
                  About
                </a>
                <a
                  href="https://www.wrenchboard.com/service"
                  className="text-[#a1a5b7] text-[15px] px-2 font-medium hover:text-[#009ef7]"
                  target="_blank"
                  rel="noreferrer"
                >
                  Services
                </a>
                <a
                  href="https://www.wrenchboard.com/contact"
                  className="text-[#a1a5b7] text-[15px] px-2 font-medium hover:text-[#009ef7]"
                  target="_blank"
                  rel="noreferrer"
                >
                  Contact Us
                </a>
              </div>
            </div>
            <div className="flex-1 flex justify-center items-center p-10">
              <p className="text-black text-[15px] px-2 font-medium flex items-center">
                <span className="text-3xl mt-2 mr-1">©</span> 2023 -{" "}
                <Link to="/" className="text-[#009ef7] ml-1">
                  WrenchBoard
                </Link>{" "}
              </p>
            </div>
          </div>
        </div>
      </div>
    </>
  );
 }
@@ -304,7 +343,7 @@ const SelectOption = ({
        <select
          name={name}
          id={name}
-          className="input-wrapper border border-[#f5f8fa] dark:border-[#5e6278] w-full rounded-full h-[42px] overflow-hidden relative font-medium leading-6 bg-clip-padding text-[#5e6278] dark:text-gray-100 bg-[#f5f8fa] dark:bg-[#5e6278] text-base focus-visible:border-transparent focus-visible:outline-0 focus-visible:ring-transparent "
+          className="input-wrapper border border-[#f5f8fa]] dark:border-[#5e6278] w-full rounded-[0.475rem] h-[42px] overflow-hidden relative font-medium leading-6 bg-clip-padding text-[#5e6278] dark:text-gray-100 bg-[#f5f8fa] dark:bg-[#5e6278] text-base focus-visible:border-transparent focus-visible:outline-0 focus-visible:ring-transparent "
          onChange={inputHandler}
          value={value}
        >
@@ -43,7 +43,7 @@ export default function CollectionTab({ className, products }) {
              <DataIteration
                datas={products}
                startLength={process.env.REACT_APP_ZERO_STATE}
-                endLength={products?.length}
+                endLength={products.length}
              >
                {({ datas }) => (
                  <CollectionCard key={datas.uniqKey} collectionData={datas} />
@@ -42,9 +42,7 @@ export default function CreateSaleSlider({
      {/* heading */}
      <div className="flex justify-between items-center mb-6">
        <div>
-          <h1 className="text-26 font-bold   text-dark-gray dark:text-white">
+          <h1 className="text-26 font-bold   text-dark-gray dark:text-white">Create for Sell</h1>
            Create for Sell
          </h1>
        </div>
        <div className="slider-btns flex space-x-4">
          <button onClick={nextHandler} type="button">
@@ -91,7 +89,7 @@ export default function CreateSaleSlider({
      <div className="trending-products relative w-full">
        <SliderCom selector={trendingSlider} settings={settings}>
          {products &&
-            products?.length > 0 &&
+            products.length > 0 &&
            products.map((item) => (
              <ProductCardStyleTwo
                key={item.id}
@@ -49,9 +49,7 @@ export default function CreatedBidsSlider({
      {/* heading */}
      <div className="flex justify-between items-center mb-6">
        <div>
-          <h1 className="text-26 font-bold   text-dark-gray dark:text-white">
+          <h1 className="text-26 font-bold   text-dark-gray dark:text-white">Create for Bits</h1>
            Create for Bits
          </h1>
        </div>
        <div className="slider-btns flex space-x-4">
          <button onClick={nextHandler} type="button">
@@ -98,7 +96,7 @@ export default function CreatedBidsSlider({
      <div className="trending-products relative w-full">
        <SliderCom selector={trendingSlider} settings={settings}>
          {products &&
-            products?.length > 0 &&
+            products.length > 0 &&
            products.map((item) => (
              <ProductCardStyleOne
                key={item.id}
@@ -43,7 +43,7 @@ export default function OnSaleTab({ className, products }) {
              <DataIteration
                datas={products}
                startLength={process.env.REACT_APP_ZERO_STATE}
-                endLength={products?.length}
+                endLength={products.length}
              >
                {({ datas }) => (
                  <ProductCardStyleTwo key={datas.id} datas={datas} />
@@ -43,7 +43,7 @@ export default function OwnTab({ className, products }) {
              <DataIteration
                datas={products}
                startLength={process.env.REACT_APP_ZERO_STATE}
-                endLength={products?.length}
+                endLength={products.length}
              >
                {({ datas }) => (
                  <ProductCardStyleOne key={datas.id} datas={datas} />
@@ -86,15 +86,11 @@ export default function VerifyLink() {
      const verifyRes = await userApi.verifyEmail(code);
      if (verifyRes.status === 200) {
        let { data } = verifyRes;
-        console.log('TESTING VERIFY',data)
+
        if (
          data &&
          data.internal_return >= 0 &&
-          data.status == 0 && 
+          data.status_text === "Link Verfied"
          data.pending_id != '' && 
          data.pending_uid != '' && 
          data.username != '' &&
          data.status_text === "Link Verified"
        ) {
          setPageLoader(false);
        } else {
@@ -158,8 +158,8 @@ const SuccessfulComponent = ({
    {/* INPUT */}
    <div className="mb-5">
      <InputCom
-        fieldClass="sm:px-6 px-2 tracking-[0.25em] text-2xl"
+        fieldClass="px-6"
-        value={password?.replace(/./g, "●")}
+        value={password}
        inputHandler={handlePassword}
        placeholder="● ● ● ● ● ●"
        label="Password"
@@ -171,8 +171,8 @@ const SuccessfulComponent = ({
    </div>
    <div className="mb-5">
      <InputCom
-        fieldClass="sm:px-6 px-2 tracking-[0.25em] text-2xl"
+        fieldClass="px-6"
-        value={confirmPassword?.replace(/./g, "●")}
+        value={confirmPassword}
        inputHandler={handlePassword}
        placeholder="● ● ● ● ● ●"
        label="Confirm Password"
@@ -1,40 +0,0 @@
 import React, { useState } from "react";
 import { Link } from "react-router-dom";
 import Layout from "../Partials/Layout";
 import CommonHead from "../UserHeader/CommonHead";
 export default function BlogItem(props) {
    const [selectTab, setValue] = useState("today");
    const filterHandler = (value) => {
        setValue(value);
    };
    return (
        <Layout>
            <CommonHead
                commonHeadData={props.commonHeadData}
            />
            <div className="notification-page w-full mb-10">
                <div className="notification-wrapper w-full">
                    {/* heading */}
                    <div className="sm:flex justify-between items-center mb-6">
                        <div className="mb-5 sm:mb-0">
                            <h1 className="text-26 font-bold   text-dark-gray dark:text-white">
                <span
                    className={`${selectTab === "today" ? "block" : "hidden"}`}
                >
                  Title of this Blog Items
                </span>
                            </h1>
                        </div>
                        <div className="slider-btns flex space-x-4">
                        </div>
                    </div>
                   <div>
                       Blog Items Details need implenet
                   </div>
                </div>
            </div>
        </Layout>
    );
 }
@@ -1,54 +1,43 @@
-import { useCallback, useEffect, useMemo, useState } from "react";
+import React, { useState } from "react";
-import { Link, useNavigate } from "react-router-dom";
+import { Link } from "react-router-dom";
-import MarketPopUp from "../MarketPlace/PopUp/MarketPopUp";
+import { toast } from "react-toastify";
-import usersService from "../../services/UsersService";
+import localImgLoad from "../../lib/localImgLoad";
-import { PriceFormatter } from "../Helpers/PriceFormatter";
+import Icons from "../Helpers/Icons";
 import dataImage2 from "../../assets/images/data-table-user-2.png";
 export default function AvailableJobsCard({
  className,
  datas,
  hidden = false,
  contentDisplay,
 }) {
  //debugger;
-  const [marketPopUp, setMarketPopUp] = useState({ show: false, data: {} });
+  const [addFavorite, setValue] = useState(datas.whishlisted);
-  const [imageUrl, setImageUrl] = useState("");
+  const [options, setOption] = useState(false);
-
+  const favoriteHandler = () => {
-  let thePrice = PriceFormatter(
+    if (!addFavorite) {
-    datas?.price * 0.01,
+      setValue(true);
-    datas?.currency_code,
+      toast.success("Added to Favorite List");
-    datas?.currency
+    } else {
-  );
+      setValue(false);
-
+      toast.warn("Remove to Favorite List");
-  useEffect(() => {
+    }
-    const imagePath = require(`../../assets/images/${datas.thumbnil}`); // Replace with your directory path for local images
+  };
    setImageUrl(imagePath);
  }, []);
  return (
    <>
      {contentDisplay == "grid" ? (
    <div
      className={`card-style-two w-full h-[426px] p-[20px] bg-white dark:bg-dark-white   rounded-2xl section-shadow ${
        className || ""
      }`}
    >
-          <div
+      <div className="flex flex-col justify-between w-full h-full">
-            onClick={() => {
+        <Link to="/shop-details" className="mb-2.5">
              setMarketPopUp({ show: true, data: datas });
            }}
            className="flex flex-col justify-between w-full h-full"
          >
          <h1 className="font-bold text-xl tracking-wide line-clamp-1 text-dark-gray dark:text-white capitalize">
            {datas.title}
          </h1>
        </Link>
        <div className="card-two-info flex justify-between items-center">
          <div className="owned-by flex space-x-2 items-center">
            <div>
-                  <p className="text-thin-light-gray text-sm leading-3">
+              <p className="text-thin-light-gray text-sm leading-3">Added</p>
                    Added
                  </p>
              <p className="text-base   text-dark-gray dark:text-white">
                {datas.offer_added}
              </p>
@@ -68,9 +57,11 @@ export default function AvailableJobsCard({
        </div>
        <div className="thumbnail-area w-full">
          <div
-                className="w-full h-[236px] p-6  rounded-xl overflow-hidden bg-center bg-cover bg-no-repeat"
+            className="w-full h-[236px] p-6  rounded-xl overflow-hidden"
            style={{
-                  backgroundImage: `url('${imageUrl}')`,
+              background: `url(${localImgLoad(
                `images/${datas.thumbnil}`
              )}) 0% 0% / cover no-repeat`,
            }}
          >
            <div className="flex justify-center">{datas.description}</div>
@@ -103,14 +94,11 @@ export default function AvailableJobsCard({
            <div className="flex items-center space-x-2">
              <div>
                <p className="font-bold text-xl tracking-wide line-clamp-1   text-dark-gray dark:text-white">
-                      {/* {thePrice} | {datas.timeline_days} day(s) */}
+                  {datas.price * 0.01}
-                      {thePrice}
+                  {datas.currency} | {datas.timeline_days} day(s)
                </p>
                <p className="text-sm text-lighter-gray">
-                      ( {datas.offer_code}) |
+                  ( {datas.offer_code})
                      <span className="italic ml-1">
                        {datas.timeline_days} day(s)
                      </span>
                </p>
              </div>
            </div>
@@ -118,9 +106,6 @@ export default function AvailableJobsCard({
              <button
                type="button"
                className="px-4 py-2.5 text-white text-sm bg-pink rounded-full tracking-wide"
                    onClick={() => {
                      setMarketPopUp({ show: true, data: datas });
                    }}
              >
                View
              </button>
@@ -129,94 +114,5 @@ export default function AvailableJobsCard({
        </div>
      </div>
    </div>
      ) : (
        <div className="card-style-two w-full p-8 my-2 flex items-center gap-4 bg-white dark:bg-dark-white rounded-2xl section-shadow">
          <div className="flex gap-5 items-center w-full">
            <div className="w-full h-[60px] rounded-full overflow-hidden flex justify-center items-center flex-[0.1] min-w-[60px] max-w-[60px]">
              <img src={dataImage2} alt="data" className="w-full h-full" />
            </div>
            <div className="flex flex-col flex-[0.9]">
              <h1
                onClick={() => {
                  setMarketPopUp({ show: true, data: datas });
                }}
                className="font-bold text-xl tracking-wide line-clamp-1 text-dark-gray dark:text-white capitalize"
              >
                {datas?.title}
              </h1>
              <div
                onClick={() => {
                  setMarketPopUp({ show: true, data: datas });
                }}
                className="my-2"
              >
                <p className="text-dark-gray dark:text-white">
                  {datas?.description}
                </p>
              </div>
              {/* <div className="card-two-info flex gap-2 items-center">
              <div className="owned-by flex space-x-2 items-center">
                <div>
                  <p className="text-thin-light-gray text-sm leading-3">Added</p>
                  <p className="text-base   text-dark-gray dark:text-white">
                    {datas.offer_added}
                  </p>
                </div>
              </div>
              <div className="w-[1px] bg-light-purple dark:bg-dark-light-purple  h-7"></div>
              <div className="created-by flex space-x-2 items-center flex-row-reverse">
                <div>
                  <p className="text-thin-light-gray text-sm leading-3 text-right">
                    Expires
                  </p>
                  <p className="text-base text-dark-gray dark:text-white text-right">
                    {datas.expire}
                  </p>
                </div>
              </div>
            </div> */}
              <div className="block sm:flex flex-wrap gap-4">
                <p className="text-sm text-thin-light-gray flex flext-start gap-1">
                  Price: <span className="text-purple">{thePrice}</span>
                </p>
                <p className="text-sm text-thin-light-gray">
                  Duration:{" "}
                  <span className="text-purple italic">
                    {" "}
                    {datas?.timeline_days} day(s)
                  </span>
                </p>
                <p className="text-sm text-thin-light-gray">
                  Code:{" "}
                  <span className="text-purple"> {datas?.offer_code}</span>
                </p>
              </div>
            </div>
          </div>
          <div className="">
            <button
              type="button"
              className="px-4 py-2.5 text-white text-sm bg-pink rounded-full tracking-wide"
              onClick={() => {
                setMarketPopUp({ show: true, data: datas });
              }}
            >
              View
            </button>
          </div>
        </div>
      )}
      {marketPopUp.show && (
        <MarketPopUp
          details={datas}
          onClose={() => {
            setMarketPopUp({ show: false, data: {} });
          }}
          situation={marketPopUp.show}
        />
      )}
    </>
  );
 }
@@ -1,120 +0,0 @@
 import { useState } from "react";
 import { Link, useLocation } from "react-router-dom";
 import { toast } from "react-toastify";
 import localImgLoad from "../../lib/localImgLoad";
 import CountDown from "../Helpers/CountDown";
 import Icons from "../Helpers/Icons";
 export default function FamilyActiveJobsCard({ datas, hidden = false }) {
    let { pathname } = useLocation();
    const [imageUrl, setImageUrl] = useState("");
    const [addFavorite, setValue] = useState(false);
    const [options, setOption] = useState(false);
    const favoriteHandler = () => {
        if (!addFavorite) {
            setValue(true);
            toast.success("Added to Favorite List");
        } else {
            setValue(false);
            toast.warn("Remove to Favorite List");
        }
    };
 //debugger;
    const bannerName  =  datas.banner == null ?'default.jpg':datas.banner;
    return (
        <div className="card-style-one flex flex-col justify-between w-full h-[387px] bg-white dark:bg-dark-white   p-3 pb rounded-2xl">
            <div className="content">
                {/* thumbnail */}
                <div className="w-full h-40">
                    {/* thumbnail image */}
                    <div
                        className="thumbnail w-full h-full rounded-xl overflow-hidden px-4 pt-4"
                        style={{
                            background: `url(${localImgLoad(
                                `images/taskbanners/${bannerName}`
                            )}) center / contain no-repeat`,
                        }}
                    >
              {/*          <div className="product-options flex justify-between relative">*/}
              {/*<span*/}
              {/*    onClick={favoriteHandler}*/}
              {/*    className={`w-7 h-7 bg-white   rounded-full flex justify-center items-center  cursor-pointer ${*/}
              {/*        addFavorite ? "text-pink" : "  text-dark-gray"*/}
              {/*    }`}*/}
              {/*>*/}
              {/*  <Icons name="love" />*/}
              {/*</span>*/}
              {/*              <span*/}
              {/*                  onClick={() => setOption(!options)}*/}
              {/*                  className="w-7 h-7 flex justify-center items-center bg-white  rounded-full cursor-pointer"*/}
              {/*              >*/}
              {/*  <Icons name="dots" />*/}
              {/*</span>*/}
              {/*              {options && (*/}
              {/*                  <div*/}
              {/*                      onClick={() => setOption(!options)}*/}
              {/*                      className="w-full h-screen fixed top-0 left-0 z-10"*/}
              {/*                  ></div>*/}
              {/*              )}*/}
              {/*              <div*/}
              {/*                  style={{ boxShadow: "0px 4px 87px 0px #0000002B" }}*/}
              {/*                  className={`drop-down-content w-[80px] bg-white dark:bg-dark-white   rounded-[4px] p-2.5 absolute right-0 top-[100%] z-20 ${*/}
              {/*                      options ? "active" : ""*/}
              {/*                  }`}*/}
              {/*              >*/}
              {/*              </div>*/}
              {/*          </div>*/}
                        {hidden && (
                            <div className="flex justify-center">
                            </div>
                        )}
                    </div>
                </div>
                {/* details */}
                <div className="details">
                    {/* product title */}
                    <Link
                        to="/manage-active-job"
                        state={{ ...datas, pathname }}
                        className="text-xl font-bold text-dark-gray dark:text-white mb-2 capitalize line-clamp-1"
                    >
                        {datas.title}
                    </Link>
                    {/* countdown */}
                    <div className="w-full h-[54px] flex justify-evenly items-center p-2 rounded-lg border border-[#E3E4FE] dark:border-[#a7a9b533] ">
                        <div className="flex flex-col justify-between">
                            <p className="text-sm text-thin-light-gray dark:text-white tracking-wide">
                                Task Code
                            </p>
                            <p className="text-base font-bold tracking-wide   text-dark-gray dark:text-white">
                                {datas.contract}
                            </p>
                        </div>
                        <div className="w-[1px] h-full bg-[#E3E4FE] dark:bg-[#a7a9b533] "></div>
                        <div className="flex flex-col justify-between">
                            <p className="text-sm text-thin-light-gray dark:text-white tracking-wide">
                                Remaining Time
                            </p>
                            <p className="text-base font-bold tracking-wide   text-dark-gray dark:text-white">
                                <CountDown lastDate={datas.delivery_date} />
                            </p>
                        </div>
                    </div>
                </div>
            </div>
            <div className="card-buttons flex justify-end items-center space-x-2">
                <Link
                    to="/manage-active-job"
                    state={{ ...datas, pathname }}
                    className="btn-shine w-[98px] h-[33px] text-white rounded-full text-sm bg-pink flex justify-center items-center"
                >
                    View
                </Link>
            </div>
        </div>
    );
 }
@@ -1,78 +0,0 @@
 import { useState } from "react";
 import SuggestTask from "../FamilyPopup/SuggestTask";
 export default function FamilyMarketCard({ className, datas, hidden = false }) {
  // debugger;
  const [popUp, setPopUp] = useState(false);
  const popUpHandler = () => {
    setPopUp((prev) => !prev);
  };
  //   Image
  let selectedImage = require(`../../assets/images/family/${
    datas.banner || "default.jpg"
  }`);
  return (
    <>
      <div
        className={`card-style-two w-full h-[336px] p-[20px] bg-white dark:bg-dark-white   rounded-2xl section-shadow ${
          className || ""
        }`}
        key={datas?.uid}
      >
        <div className="flex flex-col justify-between w-full h-full">
          <div className="thumbnail-area w-full">
            <div
              className="w-full h-[236px] p-6  rounded-xl overflow-hidden"
              onClick={popUpHandler}
              style={{
                // background: `url(${selectedImage}) 0% 0% / cover no-repeat`,
                background: `url(${selectedImage}) center / contain no-repeat`,
              }}
            >
              <div className="product-two-options flex justify-between mb-5 relative">
                <div className="status">
                  {/* <span className="text-xs px-3 py-1.5 tracking-wide rounded-full bg-gold text-white">
                    Active
                  </span> */}
                </div>
              </div>
              {hidden && <div className="flex justify-center"></div>}
            </div>
          </div>
          <div className="details-area mt-12 flex justify-between items-center gap-2">
            {/* title */}
            <button onClick={popUpHandler}>
              <h1 className="font-bold text-xl tracking-wide line-clamp-1 text-dark-gray dark:text-white capitalize">
                {datas?.title}
              </h1>
            </button>
            <div className="flex justify-between">
              {/* <div className="flex items-center space-x-2">
                <p className="italic text-gray-400">
                  {getTimeAgo(datas?.added)}
                </p>
              </div> */}
              <div>
                <button
                  type="button"
                  onClick={popUpHandler}
                  className="px-4 py-2.5 text-white text-sm bg-pink rounded-full tracking-wide"
                >
                  View
                </button>
              </div>
            </div>
          </div>
        </div>
      </div>
      {popUp && (
        <SuggestTask
          onClose={popUpHandler}
          situation={popUp}
          details={{ ...datas, selectedImage }}
        />
      )}
    </>
  );
 }
@@ -1,42 +1,24 @@
-import React, { useEffect, useState } from "react";
+import React from "react";
 import { Link } from "react-router-dom";
 import localImgLoad from "../../lib/localImgLoad";
 export default function HomeBannerOffersCard(props) {
  const [imageUrl, setImageUrl] = useState("");
  const link_result = "/" + props.itemData.link_path;
  useEffect(() => {
    let { banner, banner_location } = props?.itemData;
    if (banner_location === "LOCAL") {
      const imagePath = require(`../../assets/images/${banner}`); // Replace with your directory path for local images
      setImageUrl(imagePath);
    } else if (banner_location === "URL") setImageUrl(banner);
    else return null;
  }, []);
    return (
        <Link
-      to={link_result}
+            to="/my-collection/collection-item"
-      className="item p-2 w-full flex items-center min-h-[340px] bg-alice-blue bg-cover bg-center"
+            className="item w-full block group banner-630-340"
      style={{
        backgroundImage: `url('${imageUrl}')`,
      }}
        >
-      <div className="w-[80%] h-full mx-auto flex flex-col justify-between">
+            <div className="flex flex-col justify-between h-full">
-        <div className="content flex justify-between items-center">
+                <div className="content flex justify-between items-center mb-5">
-          <div className="mb-2">
+                    <div>
-            <h1 className="text-2xl lg:text-4xl font-bold text-dark-gray dark:text-white tracking-wide">
+                        <h1 className="text-xl font-bold text-dark-gray dark:text-white tracking-wide">
-              <span className="heroSilderTitle">{props.itemData.title}</span>
+                            <>Ab hshsh jsjsj hshdhhdjjd</>
                        </h1>
                    </div>
                    {/*<SelectBox datas={filterDatas} action={dataSetHandler} />*/}
                </div>
-        <div className="flex flex-col justify-around items-center flex-1">
+                <div className="h-[233px]">
-          <div className="siderCardDescription mb-2">
+                    BEST IMAGE IN THE WORLLD
            {props.itemData.description}
          </div>
          <button className="w-[150px] h-11 flex justify-center items-center btn-gradient text-base rounded-full text-white">
             {props.itemData.button_text}
          </button>
                </div>
            </div>
        </Link>
@@ -1,108 +0,0 @@
 import localImgLoad from "../../lib/localImgLoad";
 import CountDown from "../Helpers/CountDown";
 import { PriceFormatter } from "../Helpers/PriceFormatter";
 export default function OfferCard({ datas, hidden = false, setOfferPopout }) {
  let thePrice = PriceFormatter(
    datas?.price * 0.01,
    datas?.currency_code,
    datas?.currency
  );
  return (
    <div className="card-style-one flex flex-col justify-between w-full h-[387px] bg-white dark:bg-dark-white   p-3 pb rounded-2xl">
      <div className="content">
        {/* thumbnail */}
        <div className="w-full h-40">
          {/* thumbnail image */}
          <div
            className="thumbnail w-full h-full rounded-xl overflow-hidden px-4 pt-4"
            style={{
              background: `url(${localImgLoad(
                `images/taskbanners/${datas.banner}`
              )}) center / contain no-repeat`,
            }}
          >
            {hidden && <div className="flex justify-center"></div>}
          </div>
        </div>
        {/* details */}
        <div className="details">
          <h1 className="text-xl font-bold text-dark-gray dark:text-white mb-2 capitalize line-clamp-1">
            {datas.title}
          </h1>
          {/* countdown */}
          {/* <div className="w-full h-[54px] flex justify-evenly items-center p-2 rounded-lg border border-[#E3E4FE] dark:border-[#a7a9b533] ">
                        <div className="flex flex-col justify-between">
                            <p className="text-sm text-thin-light-gray dark:text-white tracking-wide">
                                Task Code
                            </p>
                            <p className="text-base font-bold tracking-wide   text-dark-gray dark:text-white">
                                {datas.contract}
                            </p>
                        </div>
                        <div className="w-[1px] h-full bg-[#E3E4FE] dark:bg-[#a7a9b533] "></div>
                        <div className="flex flex-col justify-between">
                            <p className="text-sm text-thin-light-gray dark:text-white tracking-wide">
                                Remaining Time
                            </p>
                            <p className="text-base font-bold tracking-wide   text-dark-gray dark:text-white">
                                <CountDown lastDate={datas.expire} />
                            </p>
                        </div>
                    </div> */}
          <div className="w-full p-2 rounded-lg border border-[#E3E4FE] dark:border-[#a7a9b533] ">
            <div className="grid grid-cols-2 gap-2">
              <div className="flex flex-col justify-between items-center border-r-2">
                <p className="text-sm text-thin-light-gray dark:text-white tracking-wide">
                  Task Code
                </p>
                <p className="text-base font-bold tracking-wide   text-dark-gray dark:text-white">
                  {datas.contract}
                </p>
              </div>
              <div className="flex flex-col justify-between items-center">
                <p className="text-sm text-red-500 tracking-wide">Expires</p>
                <p className="text-base font-bold tracking-wide   text-dark-gray dark:text-white">
                  <CountDown lastDate={datas.expire} />
                </p>
              </div>
            </div>
            <hr className="my-2" />
            <div className="grid grid-cols-2 gap-2">
              <div className="flex flex-col justify-between items-center border-r-2">
                <p className="text-sm text-thin-light-gray dark:text-white tracking-wide">
                  Reward
                </p>
                <p className="text-base font-bold tracking-wide   text-dark-gray dark:text-white">
                  {thePrice}
                </p>
              </div>
              <div className="flex flex-col justify-between items-center">
                <p className="text-sm text-thin-light-gray dark:text-white tracking-wide">
                  Timeline
                </p>
                <p className="text-base font-bold tracking-wide   text-dark-gray dark:text-white">
                  {`${datas.timeline_days} day(s)`}
                </p>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div className="card-buttons flex justify-end items-center space-x-2">
        <button
          type="button"
          onClick={() =>
            setOfferPopout({ show: true, data: { ...datas, thePrice } })
          }
          className="btn-shine w-[98px] h-[33px] text-white rounded-full text-sm bg-pink flex justify-center items-center"
        >
          Start Task
        </button>
      </div>
    </div>
  );
 }
@@ -1,4 +1,4 @@
-import { useState } from "react";
+import React, { useState } from "react";
 import { Link } from "react-router-dom";
 import { toast } from "react-toastify";
 import localImgLoad from "../../lib/localImgLoad";
@@ -6,7 +6,6 @@ import CountDown from "../Helpers/CountDown";
 import Icons from "../Helpers/Icons";
 export default function ProductCardStyleOne({ datas, hidden = false }) {
  const [imageUrl, setImageUrl] = useState("");
  const [addFavorite, setValue] = useState(false);
  const [options, setOption] = useState(false);
  const favoriteHandler = () => {
@@ -18,8 +17,6 @@ export default function ProductCardStyleOne({ datas, hidden = false }) {
      toast.warn("Remove to Favorite List");
    }
  };
  return (
    <div className="card-style-one flex flex-col justify-between w-full h-[387px] bg-white dark:bg-dark-white   p-3 pb rounded-2xl">
      <div className="content">
--- a/Show More
+++ b/Show More
		`@@ -1 +0,0 @@`
			<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" id="naira"><path fill="#fff" d="M24,5A19,19,0,1,0,43,24,19,19,0,0,0,24,5Zm7,20a1,1,0,0,1,0,2H29v3A1.94,1.94,0,0,1,27.45,32a2,2,0,0,1-2.26-1.08L20,17.05l0,14a1,1,0,0,1-2,0V27H16a1,1,0,0,1,0-2h2V22H16a1,1,0,0,1,0-2h2V17a1.94,1.94,0,0,1,1.55-1.92,2,2,0,0,1,2.26,1.08L27,30,27,16a1,1,0,0,1,2,0v4h2a1,1,0,0,1,0,2H29v3Z" class="color3b3c3d svgShape"></path><path fill="#e3e3e3" d="M24,48A24,24,0,1,1,48,24,24,24,0,0,1,24,48ZM24,2A22,22,0,1,0,46,24,22,22,0,0,0,24,2Z" class="color3b3c3d svgShape"></path></svg>
		`@@ -1,2 +0,0 @@`
			`<?xml version="1.0" ?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->`
			<svg fill="#000000" width="800px" height="800px" viewBox="0 0 52 52" data-name="Layer 1" id="Layer_1" xmlns="http://www.w3.org/2000/svg"><path d="M14,16H2a2,2,0,0,1-2-2V2A2,2,0,0,1,2,0H14a2,2,0,0,1,2,2V14A2,2,0,0,1,14,16ZM4,12h8V4H4Z"/><path d="M14,34H2a2,2,0,0,1-2-2V20a2,2,0,0,1,2-2H14a2,2,0,0,1,2,2V32A2,2,0,0,1,14,34ZM4,30h8V22H4Z"/><path d="M14,52H2a2,2,0,0,1-2-2V38a2,2,0,0,1,2-2H14a2,2,0,0,1,2,2V50A2,2,0,0,1,14,52ZM4,48h8V40H4Z"/><path d="M32,16H20a2,2,0,0,1-2-2V2a2,2,0,0,1,2-2H32a2,2,0,0,1,2,2V14A2,2,0,0,1,32,16ZM22,12h8V4H22Z"/><path d="M32,34H20a2,2,0,0,1-2-2V20a2,2,0,0,1,2-2H32a2,2,0,0,1,2,2V32A2,2,0,0,1,32,34ZM22,30h8V22H22Z"/><path d="M32,52H20a2,2,0,0,1-2-2V38a2,2,0,0,1,2-2H32a2,2,0,0,1,2,2V50A2,2,0,0,1,32,52ZM22,48h8V40H22Z"/><path d="M50,16H38a2,2,0,0,1-2-2V2a2,2,0,0,1,2-2H50a2,2,0,0,1,2,2V14A2,2,0,0,1,50,16ZM40,12h8V4H40Z"/><path d="M50,34H38a2,2,0,0,1-2-2V20a2,2,0,0,1,2-2H50a2,2,0,0,1,2,2V32A2,2,0,0,1,50,34ZM40,30h8V22H40Z"/><path d="M50,52H38a2,2,0,0,1-2-2V38a2,2,0,0,1,2-2H50a2,2,0,0,1,2,2V50A2,2,0,0,1,50,52ZM40,48h8V40H40Z"/></svg>
		`@@ -1 +0,0 @@`
			`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" id="Logout"><path d="M4,12a1,1,0,0,0,1,1h7.59l-2.3,2.29a1,1,0,0,0,0,1.42,1,1,0,0,0,1.42,0l4-4a1,1,0,0,0,.21-.33,1,1,0,0,0,0-.76,1,1,0,0,0-.21-.33l-4-4a1,1,0,1,0-1.42,1.42L12.59,11H5A1,1,0,0,0,4,12ZM17,2H7A3,3,0,0,0,4,5V8A1,1,0,0,0,6,8V5A1,1,0,0,1,7,4H17a1,1,0,0,1,1,1V19a1,1,0,0,1-1,1H7a1,1,0,0,1-1-1V16a1,1,0,0,0-2,0v3a3,3,0,0,0,3,3H17a3,3,0,0,0,3-3V5A3,3,0,0,0,17,2Z" fill="#e07c8a" class="color000000 svgShape"></path></svg>`