diff --git a/src/components/Cards/AvailableJobsCard.jsx b/src/components/Cards/AvailableJobsCard.jsx
index a76ae0b..25f0a66 100644
--- a/src/components/Cards/AvailableJobsCard.jsx
+++ b/src/components/Cards/AvailableJobsCard.jsx
@@ -125,7 +125,7 @@ export default function AvailableJobsCard({
                   <p className="text-sm text-lighter-gray">
                     ( {datas.offer_code}) |
                     <span className="italic ml-1">
-                      {datas.timeline_days} day(s) ago
+                      {datas.timeline_days} day(s)
                     </span>
                   </p>
                 </div>
diff --git a/src/components/Referral/Index.jsx b/src/components/Referral/Index.jsx
index c162b16..08af400 100644
--- a/src/components/Referral/Index.jsx
+++ b/src/components/Referral/Index.jsx
@@ -1,13 +1,13 @@
-import React from 'react'
-import Layout from '../Partials/Layout'
-import ReferralDisplay from './ReferralDisplay'
+import React from "react";
+import Layout from "../Partials/Layout";
+import ReferralDisplay from "./ReferralDisplay";
 
 function Referral() {
   return (
     <Layout>
-        <ReferralDisplay />
+      <ReferralDisplay />
     </Layout>
-  )
+  );
 }
 
-export default Referral
\ No newline at end of file
+export default Referral;
diff --git a/src/components/Referral/ReferralDisplay.jsx b/src/components/Referral/ReferralDisplay.jsx
index d5b1a89..69c415f 100644
--- a/src/components/Referral/ReferralDisplay.jsx
+++ b/src/components/Referral/ReferralDisplay.jsx
@@ -10,25 +10,25 @@ import * as Yup from "yup";
 import ReferralTable from "../MyWallet/WalletComponent/ReferralTable";
 
 const validationSchema = Yup.object().shape({
-  email: Yup.string()
+  ref_email: Yup.string()
     .email("Wrong email format")
     .min(3, "Minimum 3 characters")
     .max(50, "Maximum 50 characters")
     .required("Email is required"),
-  firstname: Yup.string()
+  ref_firstname: Yup.string()
     .min(3, "Minimum 3 characters")
     .max(25, "Maximum 25 characters")
     .required("Firstname is required"),
-  lastname: Yup.string()
+  ref_lastname: Yup.string()
     .min(3, "Minimum 3 characters")
     .max(25, "Maximum 25 characters")
     .required("Lastname is required"),
 });
 
 const initialValues = {
-  firstname: "",
-  lastname: "",
-  email: "",
+  ref_firstname: "",
+  ref_lastname: "",
+  ref_email: "",
 };
 
 function ReferralDisplay() {
@@ -121,12 +121,9 @@ function ReferralDisplay() {
         <div className="sm:flex justify-between items-center mb-6">
           <div className="mb-5 sm:mb-0">
             <h1 className="text-26 font-bold inline-flex gap-3 text-dark-gray dark:text-white items-center">
-                <span>
-                 Refer a Friend
-                </span>
+              <span>Refer a Friend</span>
             </h1>
           </div>
-
         </div>
 
         <div className="referral w-full  md:p-8 p-4 bg-white dark:bg-dark-white rounded-2xl shadow">
@@ -147,17 +144,18 @@ function ReferralDisplay() {
                       fieldClass="px-6"
                       label="Firstname"
                       type="text"
-                      name="firstname"
+                      name="ref_firstname"
                       placeholder="Firstname"
-                      value={props.values.firstname}
+                      value={props.values.ref_firstname}
                       inputHandler={props.handleChange}
                       blurHandler={props.handleBlur}
                     />
-                    {props.errors.firstname && props.touched.firstname && (
-                      <p className="text-sm text-red-500">
-                        {props.errors.firstname}
-                      </p>
-                    )}
+                    {props.errors.ref_firstname &&
+                      props.touched.ref_firstname && (
+                        <p className="text-sm text-red-500">
+                          {props.errors.ref_firstname}
+                        </p>
+                      )}
                   </div>
 
                   {/* Lastname */}
@@ -166,17 +164,18 @@ function ReferralDisplay() {
                       fieldClass="px-6"
                       label="Lastname"
                       type="text"
-                      name="lastname"
+                      name="ref_lastname"
                       placeholder="Lastname"
-                      value={props.values.lastname}
+                      value={props.values.ref_lastname}
                       inputHandler={props.handleChange}
                       blurHandler={props.handleBlur}
                     />
-                    {props.errors.lastname && props.touched.lastname && (
-                      <p className="text-sm text-red-500">
-                        {props.errors.lastname}
-                      </p>
-                    )}
+                    {props.errors.ref_lastname &&
+                      props.touched.ref_lastname && (
+                        <p className="text-sm text-red-500">
+                          {props.errors.ref_lastname}
+                        </p>
+                      )}
                   </div>
                 </div>
 
@@ -185,14 +184,16 @@ function ReferralDisplay() {
                     fieldClass="px-6"
                     label="Email"
                     type="text"
-                    name="email"
+                    name="ref_email"
                     placeholder="Email"
-                    value={props.values.email}
+                    value={props.values.ref_email}
                     inputHandler={props.handleChange}
                     blurHandler={props.handleBlur}
                   />
-                  {props.errors.email && props.touched.email && (
-                    <p className="text-sm text-red-500">{props.errors.email}</p>
+                  {props.errors.ref_email && props.touched.ref_email && (
+                    <p className="text-sm text-red-500">
+                      {props.errors.ref_email}
+                    </p>
                   )}
                 </div>
 
@@ -206,7 +207,8 @@ function ReferralDisplay() {
                   ) : (
                     <button
                       type="submit"
-                      className="px-2 h-11 flex justify-center items-center btn-gradient text-base rounded-full text-white"                    >
+                      className="px-2 h-11 flex justify-center items-center btn-gradient text-base rounded-full text-white"
+                    >
                       Send Message
                     </button>
                   )}
@@ -221,14 +223,12 @@ function ReferralDisplay() {
             Referral List
           </h2>
           {referralList.loading ? (
-              <LoadingSpinner size="32" color="sky-blue" />
+            <LoadingSpinner size="32" color="sky-blue" />
           ) : (
-              <ReferralTable history={referralList} />
+            <ReferralTable history={referralList} />
           )}
         </div>
       </div>
-
-
     </div>
   );
 }
diff --git a/src/views/ReferralPage.jsx b/src/views/ReferralPage.jsx
index 8247e86..1430548 100644
--- a/src/views/ReferralPage.jsx
+++ b/src/views/ReferralPage.jsx
@@ -1,12 +1,12 @@
-import React from 'react'
-import Referral from '../components/Referral/Index'
+import React from "react";
+import Referral from "../components/Referral/Index";
 
 function ReferralPage() {
   return (
     <>
-    <Referral />
+      <Referral />
     </>
-  )
+  );
 }
 
-export default ReferralPage
\ No newline at end of file
+export default ReferralPage;