diff --git a/client/src/actions/experience.ts b/client/src/actions/experience.ts
index f52fc3f..8e20eeb 100644
--- a/client/src/actions/experience.ts
+++ b/client/src/actions/experience.ts
@@ -23,12 +23,10 @@ export const getExperiencesTalent =
 
 export const ExperienceUpdate = (id, ExperienceData) => async (dispatch) => {
     try {
-        // dispatch({ type: 'START_LOADING' });
         const { data } = await updateExperience(id, ExperienceData);
         dispatch({ type: 'UPDATE_TALENT_EXPERIENCE', payload: data });
-        // dispatch({ type: 'END_LOADING' });
     } catch (error) {
-        console.log(error.message);
+        console.log(error);
     }
 };
 
@@ -39,7 +37,7 @@ export const ExperienceDelete = (id) => async (dispatch) => {
         dispatch({ type: 'DELETE_TALENT_EXPERIENCE', payload: id });
         // setLoading(false);
     } catch (error) {
-        console.log(error.message);
+        console.log(error);
     }
 };
 
@@ -51,6 +49,6 @@ export const ExperienceCreate =
             dispatch({ type: 'CREATE_TALENT_EXPERIENCE', payload: data });
             setLoading(false);
         } catch (error) {
-            console.log(error.message);
+            console.log(error);
         }
     };
diff --git a/client/src/components/Modal/AddCertificateModal.tsx b/client/src/components/Modal/AddCertificateModal.tsx
index 74ef240..f38a7e4 100644
--- a/client/src/components/Modal/AddCertificateModal.tsx
+++ b/client/src/components/Modal/AddCertificateModal.tsx
@@ -1,59 +1,59 @@
-import { modalProps } from "./interfaces/modaInterface.ts";
-import TButton from "../Button/TButton.tsx";
-import "./styles/AddProjectModal.css";
-import { useContext } from "react";
-import { TalentContext } from "../../pages/Talent/Talent.tsx";
-import { createExperience } from "../../api/experience.ts";
+import { modalProps } from './interfaces/modaInterface.ts';
+import TButton from '../Button/TButton.tsx';
+import './styles/AddProjectModal.css';
+import { useContext } from 'react';
+import { TalentContext } from '../../pages/Talent/Talent.tsx';
+import { createCertification } from '../../api/certifications.ts';
 
 function AddCertificateModal({ show, setShow }: modalProps) {
-  const modalStyle = show ? "showModal" : "";
-  const tp = useContext(TalentContext);
+    const modalStyle = show ? 'showModal' : '';
+    const tp = useContext(TalentContext);
 
-  const { talentProfile } = localStorage;
-  const tal = talentProfile ? JSON.parse(talentProfile as string).talent : {};
-  const handleSubmit = async (e: React.FormEvent<HTMLFormElement>) => {
-    e.preventDefault();
-    const formData = new FormData(e.target as HTMLFormElement);
-    formData.append("talentId", tal._id);
-    const data = Object.fromEntries(formData);
+    const { talentProfile } = localStorage;
+    const tal = talentProfile ? JSON.parse(talentProfile as string).talent : {};
+    const handleSubmit = async (e: React.FormEvent<HTMLFormElement>) => {
+        e.preventDefault();
+        const formData = new FormData(e.target as HTMLFormElement);
+        formData.append('talentId', tal._id);
+        const data = Object.fromEntries(formData);
 
-    await createExperience(data);
-    tp.setRefresh(!tp.refresh);
-    const formElement = e.target as HTMLFormElement;
-    formElement.reset();
-    setShow(false);
-  };
+        await createCertification(data);
+        tp.setRefresh(!tp.refresh);
+        const formElement = e.target as HTMLFormElement;
+        formElement.reset();
+        setShow(false);
+    };
 
-  return (
-    <div className={"Modal " + modalStyle}>
-      <div className="content">
-        <div className={"header-11"}>
-          <h1>Add Certification Modal</h1>{" "}
-          <TButton value={"X"} onClick={() => setShow(false)} />
-        </div>
-        <hr />
-        <form onSubmit={handleSubmit}>
-          <div className="form-control">
-            <label htmlFor="title">Title</label>
-            <input type="text" name={"title"} />
-          </div>
-          <div className="form-control">
-            <label htmlFor="link">Link</label>
-            <input type="url" name={"link"} />
-          </div>
+    return (
+        <div className={'Modal ' + modalStyle}>
+            <div className='content'>
+                <div className={'header-11'}>
+                    <h1>Add Certification Modal</h1>{' '}
+                    <TButton value={'X'} onClick={() => setShow(false)} />
+                </div>
+                <hr />
+                <form onSubmit={handleSubmit}>
+                    <div className='form-control'>
+                        <label htmlFor='title'>Title</label>
+                        <input type='text' name={'title'} />
+                    </div>
+                    <div className='form-control'>
+                        <label htmlFor='link'>Link</label>
+                        <input type='url' name={'link'} />
+                    </div>
 
-          <div className="form-control">
-            <label htmlFor={"description"}>Description</label>
-            <textarea name={"description"} />
-          </div>
-          {/*  add a save button */}
-          <div className="form-control">
-            <TButton value={"Save"} type={"submit"} />
-          </div>
-        </form>
-      </div>
-    </div>
-  );
+                    <div className='form-control'>
+                        <label htmlFor={'description'}>Description</label>
+                        <textarea name={'description'} />
+                    </div>
+                    {/*  add a save button */}
+                    <div className='form-control'>
+                        <TButton value={'Save'} type={'submit'} />
+                    </div>
+                </form>
+            </div>
+        </div>
+    );
 }
 
 export default AddCertificateModal;
diff --git a/client/src/components/TalentDetails.tsx b/client/src/components/TalentDetails.tsx
index 0783046..a50c1d9 100644
--- a/client/src/components/TalentDetails.tsx
+++ b/client/src/components/TalentDetails.tsx
@@ -1,78 +1,154 @@
-import React from 'react';
+import React, { useEffect, useState } from 'react';
+import { getExperiencesTalent } from '../actions/experience';
+import { getEducationsTalent } from '../actions/education.ts';
+import { getProjectsTalent } from '../actions/project.ts';
+import { getSkillsTalent } from '../actions/skill.ts';
+import { getCertificationsTalent } from '../actions/certifications.ts';
+import { useDispatch, useSelector } from 'react-redux';
+import { useParams } from 'react-router-dom';
+import Showwcase from '../components/talentProfile/Showwcase.tsx';
+import {
+    CertificationShowwcaseCard,
+    EducationShowwcaseCard,
+    ExperienceShowwcaseCard,
+    ProjectShowwcaseCard,
+    SkillShowwcaseCard,
+} from '../components/talentProfile/ShowwcaseCard.tsx';
 
 const TalentDetails = ({ talent }) => {
+    const { id } = useParams();
+    const dispatch = useDispatch();
+    const [loading, setLoading] = useState();
+    const experiences = useSelector((state) => state.talentData.experiences);
+    const educations = useSelector((state) => state.talentData.educations);
+    const projects = useSelector((state) => state.talentData.projects);
+    const skills = useSelector((state) => state.talentData.skills);
+    const certs = useSelector((state) => state.talentData.certifications);
+
+    useEffect(() => {
+        dispatch(getExperiencesTalent(id, setLoading));
+        dispatch(getEducationsTalent(id, setLoading));
+        dispatch(getProjectsTalent(id, setLoading));
+        dispatch(getSkillsTalent(id, setLoading));
+        dispatch(getCertificationsTalent(id, setLoading));
+    }, [id, dispatch]);
+
     return (
         <>
-            <div className='m-10 mx-[100px]'>
-                <div>
-                    <div className='md:flex flex-row'>
-                        <div className='w-[170px] h-[170px] border-gray rounded-full flex justify-center'>
-                            <img
-                                src={
-                                    !talent.profileImg
-                                        ? '/assets/talents/no_image.png'
-                                        : talent.profileImg
-                                }
-                                alt={talent.name}
-                                className='object-cover'
-                            />
+            {!loading && (
+                <div className='m-10 mx-[100px]'>
+                    <div>
+                        <div className='md:flex flex-row'>
+                            <div className='w-[170px] h-[170px] border-gray rounded-full flex justify-center'>
+                                <img
+                                    src={
+                                        !talent.profileImg
+                                            ? '/assets/talents/no_image.png'
+                                            : talent.profileImg
+                                    }
+                                    alt={talent.name}
+                                    className='object-cover'
+                                />
+                            </div>
+                            <div className='md:basis-1/2 my-20 mx-5 '>
+                                <h1 className='text-3xl font-bold'>
+                                    {talent.name}
+                                </h1>
+                                <h2>Id: {talent._id}</h2>
+                            </div>
                         </div>
-                        <div className='md:basis-1/2 my-20 mx-5 '>
-                            <h1 className='text-3xl font-bold'>
-                                {talent.name}
-                            </h1>
-                            <h2>Id: {talent._id}</h2>
+                        <div className='mx-5'>
+                            <p className='text-gray-400'>Socials</p>
+                            <p>Bio</p>
                         </div>
                     </div>
-                    <div className='mx-5'>
-                        <p className='text-gray-400'>Socials</p>
-                        <p>Bio</p>
-                    </div>
-                </div>
 
-                <hr className='my-5' />
-                <div>
-                    <h2 className='text-3xl font-semibold'>Experience</h2>
-                    <div className='my-5'>
-                        <h3>All Experience</h3>
+                    <hr className='my-5' />
+                    <div>
+                        <h2 className='text-3xl font-semibold'>Experience</h2>
+                        <div className='my-5'>
+                            <Showwcase>
+                                {experiences.map((exp) => (
+                                    <ExperienceShowwcaseCard
+                                        experience={exp}
+                                        key={exp?._id}
+                                        showEdit={false}
+                                    />
+                                ))}
+                            </Showwcase>
+                        </div>
                     </div>
-                </div>
 
-                <hr className='my-5' />
+                    <hr className='my-5' />
 
-                <div>
-                    <h2 className='text-3xl font-semibold'>Education</h2>
-                    <div className='my-5'>
-                        <h3>All Education</h3>
+                    <div>
+                        <h2 className='text-3xl font-semibold'>Education</h2>
+                        <div className='my-5'>
+                            <Showwcase>
+                                {educations.map((edu) => (
+                                    <EducationShowwcaseCard
+                                        education={edu}
+                                        key={edu?._id}
+                                        showEdit={false}
+                                    />
+                                ))}
+                            </Showwcase>
+                        </div>
                     </div>
-                </div>
 
-                <hr className='my-5' />
+                    <hr className='my-5' />
 
-                <div>
-                    <h2 className='text-3xl font-semibold'>Project</h2>
-                    <div className='my-5'>
-                        <h3>All Projects</h3>
+                    <div>
+                        <h2 className='text-3xl font-semibold'>Project</h2>
+                        <div className='my-5'>
+                            <Showwcase>
+                                {projects.map((proj) => (
+                                    <ProjectShowwcaseCard
+                                        project={proj}
+                                        key={proj?._id}
+                                        showEdit={false}
+                                    />
+                                ))}
+                            </Showwcase>
+                        </div>
                     </div>
-                </div>
 
-                <hr className='my-5' />
+                    <hr className='my-5' />
 
-                <div>
-                    <h2 className='text-3xl font-semibold'>Skills</h2>
-                    <div className='my-5'>
-                        <h3>All Skills</h3>
+                    <div>
+                        <h2 className='text-3xl font-semibold'>Skills</h2>
+                        <div className='my-5'>
+                            <Showwcase>
+                                {skills.map((skill) => (
+                                    <SkillShowwcaseCard
+                                        skill={skill}
+                                        key={skill?._id}
+                                        showEdit={false}
+                                    />
+                                ))}
+                            </Showwcase>
+                        </div>
                     </div>
-                </div>
-                <hr className='my-5' />
+                    <hr className='my-5' />
 
-                <div>
-                    <h2 className='text-3xl font-semibold'>Certification</h2>
-                    <div className='my-5'>
-                        <h3>All Certifications</h3>
+                    <div>
+                        <h2 className='text-3xl font-semibold'>
+                            Certification
+                        </h2>
+                        <div className='my-5'>
+                            <Showwcase>
+                                {certs.map((cert) => (
+                                    <CertificationShowwcaseCard
+                                        certificate={cert}
+                                        key={cert?._id}
+                                        showEdit={false}
+                                    />
+                                ))}
+                            </Showwcase>
+                        </div>
                     </div>
                 </div>
-            </div>
+            )}
         </>
     );
 };
diff --git a/client/src/components/talentProfile/ShowwcaseCard.tsx b/client/src/components/talentProfile/ShowwcaseCard.tsx
index cc05735..a598f17 100644
--- a/client/src/components/talentProfile/ShowwcaseCard.tsx
+++ b/client/src/components/talentProfile/ShowwcaseCard.tsx
@@ -1,274 +1,302 @@
-import React, { useState } from "react";
-import TButton from "../Button/TButton.tsx";
-import "./ShowwcaseCard.css";
-import { noOfMonths } from "../util/numOfMonths.ts";
-import { FaGlobe } from "react-icons/fa";
-import UpdateCertificateModal from "../Modal/UpdateCertificateModal.tsx";
-import UpdateEducationModal from "../Modal/UpdateEducationModal.tsx";
-import UpdateExperienceModal from "../Modal/UpdateExperienceModal.tsx";
-import UpdateProjectModal from "../Modal/UpdateProjectModal.tsx";
-import UpdateSkillModal from "../Modal/UpdateSkillModal.tsx";
+import React, { useState } from 'react';
+import TButton from '../Button/TButton.tsx';
+import './ShowwcaseCard.css';
+import { noOfMonths } from '../util/numOfMonths.ts';
+import { FaGlobe } from 'react-icons/fa';
+import UpdateCertificateModal from '../Modal/UpdateCertificateModal.tsx';
+import UpdateEducationModal from '../Modal/UpdateEducationModal.tsx';
+import UpdateExperienceModal from '../Modal/UpdateExperienceModal.tsx';
+import UpdateProjectModal from '../Modal/UpdateProjectModal.tsx';
+import UpdateSkillModal from '../Modal/UpdateSkillModal.tsx';
 
 interface experienceProp {
-  experience: {
-    _id: string;
-    jobTitle: string;
-    employer: string;
-    startDate: string;
-    endDate: string;
-    description: string;
-    country: string;
-  };
+    experience: {
+        _id: string;
+        jobTitle: string;
+        employer: string;
+        startDate: string;
+        endDate: string;
+        description: string;
+        country: string;
+    };
 }
 
 interface projectProps {
-  project: {
-    _id: string;
-    talentId: string;
-    name?: string;
-    description?: string;
-    startDate: Date;
-    endDate: Date;
-    link?: string;
-  };
+    project: {
+        _id: string;
+        talentId: string;
+        name?: string;
+        description?: string;
+        startDate: Date;
+        endDate: Date;
+        link?: string;
+    };
 }
 
 interface educationProps {
-  education: {
-    _id: string;
-    talentId?: string;
-    degree: string;
-    school: string;
-    country: string;
-    city: string;
-    startDate: Date;
-    endDate: Date;
-    description?: string;
-  };
+    education: {
+        _id: string;
+        talentId?: string;
+        degree: string;
+        school: string;
+        country: string;
+        city: string;
+        startDate: Date;
+        endDate: Date;
+        description?: string;
+    };
 }
 
 interface certificateProps {
-  certificate: {
-    _id: string;
-    talentId: string;
-    title?: string;
-    description?: string;
-    link?: string;
-  };
+    certificate: {
+        _id: string;
+        talentId: string;
+        title?: string;
+        description?: string;
+        link?: string;
+    };
 }
 
 interface skillProps {
-  skill: {
-    _id: string;
-    talentId: string;
-    name?: string;
-    subSkills?: string;
-  };
+    skill: {
+        _id: string;
+        talentId: string;
+        name?: string;
+        subSkills?: string;
+    };
 }
 
 const ExperienceShowwcaseCard: React.FC<experienceProp> = ({
-  experience,
+    experience,
+    showEdit = true,
 }): React.ReactElement => {
-  const [showexp, setShowexp] = useState(false);
+    const [showexp, setShowexp] = useState(false);
 
-  return (
-    <div className={"showwcasecard"} key={experience._id}>
-      <div className={"experience"}>
-        <div className={"title"}>
-          <h1>{experience.jobTitle}</h1>
+    return (
+        <div className={'showwcasecard'} key={experience._id}>
+            <div className={'experience'}>
+                <div className={'title'}>
+                    <h1>{experience.jobTitle}</h1>
+                </div>
+                <div className={'work-info'}>
+                    <p>{experience.employer}</p>
+                    &bull;
+                    <p>
+                        {new Date(experience.startDate).toDateString()} -{' '}
+                        {new Date(experience.endDate).toDateString()}
+                    </p>
+                    &bull;
+                    <p>
+                        {noOfMonths(
+                            new Date(experience.startDate),
+                            new Date(experience.endDate)
+                        )}{' '}
+                        mo
+                    </p>
+                </div>
+                <div className={'location-info'}>
+                    <p>{experience.country}</p>
+                </div>
+                <div className={'description'}>
+                    <p>{experience.description}</p>
+                </div>
+            </div>
+            <UpdateExperienceModal
+                show={showexp}
+                setShow={setShowexp}
+                info={experience}
+            />
+            {showEdit ? (
+                <TButton
+                    value={'edit'}
+                    onClick={() => {
+                        setShowexp(true);
+                    }}
+                />
+            ) : (
+                ''
+            )}
         </div>
-        <div className={"work-info"}>
-          <p>{experience.employer}</p>
-          &bull;
-          <p>
-            {new Date(experience.startDate).toDateString()} -{" "}
-            {new Date(experience.endDate).toDateString()}
-          </p>
-          &bull;
-          <p>
-            {noOfMonths(
-              new Date(experience.startDate),
-              new Date(experience.endDate),
-            )}{" "}
-            mo
-          </p>
-        </div>
-        <div className={"location-info"}>
-          <p>{experience.country}</p>
-        </div>
-        <div className={"description"}>
-          <p>{experience.description}</p>
-        </div>
-      </div>
-      <UpdateExperienceModal
-        show={showexp}
-        setShow={setShowexp}
-        info={experience}
-      />
-      <TButton
-        value={"edit"}
-        onClick={() => {
-          setShowexp(true);
-        }}
-      />
-    </div>
-  );
+    );
 };
 const ProjectShowwcaseCard: React.FC<projectProps> = ({
-  project,
+    project,
+    showEdit = true,
 }): React.ReactElement => {
-  const [showproj, setShowproj] = useState(false);
-  return (
-    <div className={"showwcasecard"}>
-      <div className={"project"}>
-        <div className={"title"}>
-          <h1>{project.name}</h1>
-        </div>
-        <div className={"project-info"}>
-          <a href={project.link}>
-            <FaGlobe />
-          </a>
-          &bull;
-          <p>
-            {new Date(project.startDate).toDateString()} -{" "}
-            {new Date(project.endDate).toDateString()}
-          </p>
-          &bull;
-          <p>
-            {noOfMonths(new Date(project.startDate), new Date(project.endDate))}{" "}
-            mo
-          </p>
-        </div>
+    const [showproj, setShowproj] = useState(false);
+    return (
+        <div className={'showwcasecard'}>
+            <div className={'project'}>
+                <div className={'title'}>
+                    <h1>{project.name}</h1>
+                </div>
+                <div className={'project-info'}>
+                    <a href={project.link}>
+                        <FaGlobe />
+                    </a>
+                    &bull;
+                    <p>
+                        {new Date(project.startDate).toDateString()} -{' '}
+                        {new Date(project.endDate).toDateString()}
+                    </p>
+                    &bull;
+                    <p>
+                        {noOfMonths(
+                            new Date(project.startDate),
+                            new Date(project.endDate)
+                        )}{' '}
+                        mo
+                    </p>
+                </div>
 
-        <div className={"description"}>
-          <p>{project.description}</p>
+                <div className={'description'}>
+                    <p>{project.description}</p>
+                </div>
+            </div>
+            <UpdateProjectModal
+                show={showproj}
+                setShow={setShowproj}
+                info={project}
+            />
+            {showEdit ? (
+                <TButton
+                    value={'edit'}
+                    onClick={() => {
+                        setShowproj(true);
+                    }}
+                />
+            ) : (
+                ''
+            )}
         </div>
-      </div>
-      <UpdateProjectModal
-        show={showproj}
-        setShow={setShowproj}
-        info={project}
-      />
-      <TButton
-        value={"edit"}
-        onClick={() => {
-          setShowproj(true);
-        }}
-      />
-    </div>
-  );
+    );
 };
 const EducationShowwcaseCard: React.FC<educationProps> = ({
-  education,
+    education,
+    showEdit = true,
 }): React.ReactElement => {
-  const [showedu, setShowedu] = useState(false);
+    const [showedu, setShowedu] = useState(false);
 
-  return (
-    <div className={"showwcasecard"}>
-      <div className={"experience"}>
-        <div className={"title"}>
-          <h1>{education.degree}</h1>
-        </div>
-        <div className={"work-info"}>
-          <p>{education.school}</p>
-          &bull;
-          <p>
-            {new Date(education.startDate).toDateString()} -{" "}
-            {new Date(education.endDate).toDateString()}
-          </p>
-          &bull;
-          <p>
-            {noOfMonths(
-              new Date(education.startDate),
-              new Date(education.endDate),
-            )}{" "}
-            mo
-          </p>
+    return (
+        <div className={'showwcasecard'}>
+            <div className={'experience'}>
+                <div className={'title'}>
+                    <h1>{education.degree}</h1>
+                </div>
+                <div className={'work-info'}>
+                    <p>{education.school}</p>
+                    &bull;
+                    <p>
+                        {new Date(education.startDate).toDateString()} -{' '}
+                        {new Date(education.endDate).toDateString()}
+                    </p>
+                    &bull;
+                    <p>
+                        {noOfMonths(
+                            new Date(education.startDate),
+                            new Date(education.endDate)
+                        )}{' '}
+                        mo
+                    </p>
+                </div>
+                <div className={'location-info'}>
+                    <p>{education.country}</p>
+                    <p>{education.city}</p>
+                </div>
+                <div className={'description'}>
+                    <p>{education.description}</p>
+                </div>
+            </div>
+            <UpdateEducationModal
+                show={showedu}
+                setShow={setShowedu}
+                info={education}
+            />
+            {showEdit ? (
+                <TButton
+                    value={'edit'}
+                    onClick={() => {
+                        setShowedu(true);
+                    }}
+                />
+            ) : (
+                ''
+            )}
         </div>
-        <div className={"location-info"}>
-          <p>{education.country}</p>
-          <p>{education.city}</p>
-        </div>
-        <div className={"description"}>
-          <p>{education.description}</p>
-        </div>
-      </div>
-      <UpdateEducationModal
-        show={showedu}
-        setShow={setShowedu}
-        info={education}
-      />
-      <TButton
-        value={"edit"}
-        onClick={() => {
-          setShowedu(true);
-        }}
-      />{" "}
-    </div>
-  );
+    );
 };
 const CertificationShowwcaseCard: React.FC<certificateProps> = ({
-  certificate,
+    certificate,
+    showEdit = true,
 }): React.ReactElement => {
-  const [showcert, setShowcert] = useState(false);
+    const [showcert, setShowcert] = useState(false);
 
-  return (
-    <div className={"showwcasecard"}>
-      <div className={"certificate"}>
-        <div className={"title"}>
-          <h1>{certificate.title}</h1>
-        </div>
-        <div className={"work-info"}>
-          <a href={certificate.link}>View Certification</a>
+    return (
+        <div className={'showwcasecard'}>
+            <div className={'certificate'}>
+                <div className={'title'}>
+                    <h1>{certificate.title}</h1>
+                </div>
+                <div className={'work-info'}>
+                    <a href={certificate.link}>View Certification</a>
+                </div>
+                <div className={'description'}>
+                    <p>{certificate.description}</p>
+                </div>
+            </div>
+            <UpdateCertificateModal
+                show={showcert}
+                setShow={setShowcert}
+                info={certificate}
+            />
+            {showEdit && (
+                <TButton
+                    value={'edit'}
+                    onClick={() => {
+                        setShowcert(true);
+                    }}
+                />
+            )}
         </div>
-        <div className={"description"}>
-          <p>{certificate.description}</p>
-        </div>
-      </div>
-      <UpdateCertificateModal
-        show={showcert}
-        setShow={setShowcert}
-        info={certificate}
-      />
-      <TButton
-        value={"edit"}
-        onClick={() => {
-          setShowcert(true);
-        }}
-      />{" "}
-    </div>
-  );
+    );
 };
 const SkillShowwcaseCard: React.FC<skillProps> = ({
-  skill,
+    skill,
+    showEdit = true,
 }): React.ReactElement => {
-  const [showskill, setShowskill] = useState(false);
+    const [showskill, setShowskill] = useState(false);
 
-  return (
-    <div className={"showwcasecard"}>
-      <div className={"certificate"}>
-        <div className={"title"}>
-          <h1>{skill.name}</h1>
-        </div>
-        <div className={"work-info"}>
-          <p>{skill.subSkills}</p>
+    return (
+        <div className={'showwcasecard'}>
+            <div className={'certificate'}>
+                <div className={'title'}>
+                    <h1>{skill.name}</h1>
+                </div>
+                <div className={'work-info'}>
+                    <p>{skill.subSkills}</p>
+                </div>
+            </div>
+            <UpdateSkillModal
+                show={showskill}
+                setShow={setShowskill}
+                info={skill}
+            />
+            {showEdit && (
+                <TButton
+                    value={'edit'}
+                    onClick={() => {
+                        setShowskill(true);
+                    }}
+                />
+            )}
         </div>
-      </div>
-      <UpdateSkillModal show={showskill} setShow={setShowskill} info={skill} />
-      <TButton
-        value={"edit"}
-        onClick={() => {
-          setShowskill(true);
-        }}
-      />{" "}
-    </div>
-  );
+    );
 };
 
 export {
-  ExperienceShowwcaseCard,
-  ProjectShowwcaseCard,
-  EducationShowwcaseCard,
-  CertificationShowwcaseCard,
-  SkillShowwcaseCard,
+    ExperienceShowwcaseCard,
+    ProjectShowwcaseCard,
+    EducationShowwcaseCard,
+    CertificationShowwcaseCard,
+    SkillShowwcaseCard,
 };
diff --git a/client/src/pages/Employer/Employer.tsx b/client/src/pages/Employer/Employer.tsx
index 3f32011..c49d3f6 100644
--- a/client/src/pages/Employer/Employer.tsx
+++ b/client/src/pages/Employer/Employer.tsx
@@ -14,7 +14,6 @@ const Employer = () => {
     useEffect(() => {
         dispatch(getTalents(setLoading));
     }, [dispatch]);
-    console.log(talents);
     return (
         <>
             <TalentNav />