formatted date style

.env.production

@@ -79,7 +79,7 @@ REACT_APP_ANDROID_APP='https://play.google.com/store/apps/details?id=com.wrenchb
 REACT_APP_APPLE_APP='https://itunes.apple.com/us/app/wrenchboard/id1435718367?ls=1&mt=8'
 
 # Displays the new family dashboard with boxes
-REACT_APP_SHOW_NEW_FAMILY_DASH=0
+REACT_APP_SHOW_NEW_FAMILY_DASH=1
 
 # Displays the account dashboard
-REACT_APP_SHOW_ACCOUNT_DASH=0
+REACT_APP_SHOW_ACCOUNT_DASH=1

src/components/Cards/AvailableJobsCard.jsx

@@ -5,7 +5,6 @@ import MarketPopUp from "../MarketPlace/PopUp/MarketPopUp";
 export default function AvailableJobsCard({
   className,
   datas,
-  key,
   hidden = false,
   contentDisplay,
   image_server,
@@ -38,7 +37,6 @@ export default function AvailableJobsCard({
           className={`card-style-two w-full h-[426px] p-[20px] bg-white dark:bg-dark-white   rounded-2xl section-shadow ${
             className || ""
           }`}
-          key={key}
         >
           <div
             onClick={() => {
@@ -57,7 +55,7 @@ export default function AvailableJobsCard({
                     Added
                   </p>
                   <p className="text-base   text-dark-gray dark:text-white">
-                    {datas.offer_added}
+                    {new Date(datas.offer_added).toLocaleDateString()}
                   </p>
                 </div>
               </div>
@@ -68,7 +66,7 @@ export default function AvailableJobsCard({
                     Expires
                   </p>
                   <p className="text-base text-dark-gray dark:text-white text-right">
-                    {datas.expire}
+                    {new Date(datas.expire).toLocaleDateString()}
                   </p>
                 </div>
               </div>

src/components/Dashboards/AccountDashboard.jsx

@@ -85,7 +85,7 @@ const TopBanner = ({ image, title = "", desc = "", btn, link_path, key }) => {
           </Link>
         </div>
         <div className="flex justify-between w-full px-2 items-center">
-          <Link to={link_path} className="text-slate-300 font-semibold">
+          <Link to={link_path} className="text-slate-300 font-semibold text-sm">
             {btn}
           </Link>
           <button className="flex items-center justify-center gap-2">
@@ -125,7 +125,7 @@ const LowerBanner = ({ image, title = "", desc = "", btn, link_path, key }) => {
         </Link>
       </div>
       <div className="flex justify-between w-full px-2 items-center">
-        <Link to={link_path} className="text-slate-300 font-semibold">
+        <Link to={link_path} className="text-slate-300 font-semibold text-sm">
           {btn}
         </Link>
         <button className="flex items-center justify-center gap-2">

src/components/Dashboards/FamilyParentDashboard.jsx

@@ -16,7 +16,7 @@ export default function JobOwnerDashboard({
 
   return (
     <div
-      className={`w-full min-h-[100px] flex lg:p-8 p-4 justify-between items-center gap-2 rounded-2xl overflow-hidden bg-sky-blue ${
+      className={`w-full h-[75px] flex p-4 justify-between items-center gap-2 rounded-2xl overflow-hidden bg-sky-blue ${
         className || ""
       }`}
       style={{
@@ -28,12 +28,12 @@ export default function JobOwnerDashboard({
       <div className="h-full flex w-full justify-between mb-5 lg:mb-0">
         {/* heading */}
         <div className="flex gap-8">
-          <h1 className="lg:text-2xl text-xl font-medium text-white tracking-wide">
+          <h1 className="text-base ng font-medium text-white tracking-wide">
             Welcome
           </h1>
           {/* user */}
           <div>
-            <p className="text-3xl tracking-wide font-bold antise text-white">
+            <p className="text-base tracking-wide font-bold antise text-white">
               {`${firstname} ${lastname}`}
             </p>
             <p className="text-sm tracking-wide text-white">@{userEmail}</p>
@@ -72,7 +72,7 @@ export default function JobOwnerDashboard({
               </div>
             </div>
           )}
-        <span className="text-[18px] font-thin tracking-wide text-white flex items-end">
+        <span className="text-base font-thin tracking-wide text-white flex items-end">
           Last Login : {loginDate}
         </span>
       </div>

src/components/Dashboards/HomeDashboard.jsx

@@ -16,7 +16,7 @@ export default function JobOwnerDashboard({
 
   return (
     <div
-      className={`w-full min-h-[100px] flex lg:p-8 p-4 justify-between items-center gap-2 rounded-2xl overflow-hidden bg-sky-blue ${
+      className={`w-full h-[75px] flex p-4 justify-between items-center gap-2 rounded-2xl overflow-hidden bg-sky-blue ${
         className || ""
       }`}
       style={{
@@ -28,12 +28,12 @@ export default function JobOwnerDashboard({
       <div className="h-full flex w-full justify-between mb-5 lg:mb-0">
         {/* heading */}
         <div className="flex gap-8">
-          <h1 className="lg:text-2xl text-xl font-medium text-white tracking-wide">
+          <h1 className="text-base ng font-medium text-white tracking-wide">
             Welcome
           </h1>
           {/* user */}
           <div>
-            <p className="text-3xl tracking-wide font-bold antise text-white">
+            <p className="text-base tracking-wide font-bold antise text-white">
               {`${firstname} ${lastname}`}
             </p>
             <p className="text-sm tracking-wide text-white">@{userEmail}</p>
@@ -72,7 +72,7 @@ export default function JobOwnerDashboard({
               </div>
             </div>
           )}
-        <span className="text-[18px] font-thin tracking-wide text-white flex items-end">
+        <span className="text-base font-thin tracking-wide text-white flex items-end">
           Last Login : {loginDate}
         </span>
       </div>

src/components/Dashboards/JobOwnerDashboard.jsx

@@ -16,7 +16,7 @@ export default function JobOwnerDashboard({
 
   return (
     <div
-      className={`w-full min-h-[100px] flex lg:p-8 p-4 justify-between items-center gap-2 rounded-2xl overflow-hidden bg-sky-blue ${
+      className={`w-full h-[75px] flex p-4 justify-between items-center gap-2 rounded-2xl overflow-hidden bg-sky-blue ${
         className || ""
       }`}
       style={{
@@ -28,12 +28,12 @@ export default function JobOwnerDashboard({
       <div className="h-full flex w-full justify-between mb-5 lg:mb-0">
         {/* heading */}
         <div className="flex gap-8">
-          <h1 className="lg:text-2xl text-xl font-medium text-white tracking-wide">
+          <h1 className="text-base font-medium text-white tracking-wide">
             Welcome
           </h1>
           {/* user */}
           <div>
-            <p className="text-3xl tracking-wide font-bold antise text-white">
+            <p className="text-base tracking-wide font-bold antise text-white">
               {`${firstname} ${lastname}`}
             </p>
             <p className="text-sm tracking-wide text-white">@{userEmail}</p>
@@ -72,11 +72,10 @@ export default function JobOwnerDashboard({
               </div>
             </div>
           )}
-        <span className="text-[18px] font-thin tracking-wide text-white flex items-end">
+        <span className="text-base font-thin tracking-wide text-white flex items-end">
           Last Login : {loginDate}
         </span>
       </div>
     </div>
   );
 }
-

src/components/Dashboards/WorkerDashboard.jsx

@@ -16,7 +16,7 @@ export default function JobOwnerDashboard({
 
   return (
     <div
-      className={`w-full min-h-[100px] flex lg:p-8 p-4 justify-between items-center gap-2 rounded-2xl overflow-hidden bg-sky-blue ${
+      className={`w-full h-[75px] flex p-4 justify-between items-center gap-2 rounded-2xl overflow-hidden bg-sky-blue ${
         className || ""
       }`}
       style={{
@@ -28,12 +28,12 @@ export default function JobOwnerDashboard({
       <div className="h-full flex w-full justify-between mb-5 lg:mb-0">
         {/* heading */}
         <div className="flex gap-8">
-          <h1 className="lg:text-2xl text-xl font-medium text-white tracking-wide">
+          <h1 className="text-base ng font-medium text-white tracking-wide">
             Welcome
           </h1>
           {/* user */}
           <div>
-            <p className="text-3xl tracking-wide font-bold antise text-white">
+            <p className="text-base tracking-wide font-bold antise text-white">
               {`${firstname} ${lastname}`}
             </p>
             <p className="text-sm tracking-wide text-white">@{userEmail}</p>
@@ -72,7 +72,7 @@ export default function JobOwnerDashboard({
               </div>
             </div>
           )}
-        <span className="text-[18px] font-thin tracking-wide text-white flex items-end">
+        <span className="text-base font-thin tracking-wide text-white flex items-end">
           Last Login : {loginDate}
         </span>
       </div>

src/components/MarketPlace/MainSection.jsx

@@ -109,12 +109,13 @@ export default function MainSection({
               endLength={products?.length}
             >
               {({ datas }) => (
-                <AvailableJobsCard
+                <div key={datas.job_uid}>
-                  contentDisplay={contentDisplay}
+                  <AvailableJobsCard
-                  image_server={image_server}
+                    contentDisplay={contentDisplay}
-                  key={datas.job_uid}
+                    image_server={image_server}
-                  datas={datas}
+                    datas={datas}
-                />
+                  />
+                </div>
               )}
             </DataIteration>
           </div>