Index: jobvista-frontend/src/views/job_advertisements/JobAdDetails.js
===================================================================
--- jobvista-frontend/src/views/job_advertisements/JobAdDetails.js	(revision 28b3398dcd7f9cfd044c2cb7923434b06037fee2)
+++ jobvista-frontend/src/views/job_advertisements/JobAdDetails.js	(revision befb98800bd9171fa5ce8a5f29287e549f0ff5aa)
@@ -10,4 +10,6 @@
 import {AddJobAdModal} from "./AddJobAdModal";
 import {ApplyToJobAdModal} from "../applications/ApplyToJobAdModal";
+import {Link} from "react-router-dom";
+import {RecruiterActions} from "../../redux/actions/recruiterActions";
 
 
@@ -20,7 +22,28 @@
     const auth = useSelector(state => state.auth.currentUser);
 
+    let logosState = useSelector(state => state.images.logos)
+    const [logoDispatched, setLogoDispatched] = useState(false)
+    const [logoView, setLogoView] = useState(null);
+
     useEffect(() => {
         setRole(auth.role)
     }, [auth])
+
+    useEffect(() => {
+        if (jobAd) {
+            if (!logoDispatched && !logosState[jobAd.recruiterId]) {
+                dispatch(RecruiterActions.downloadLogo(jobAd.recruiterId, (success, response) => {
+                    if (success) {
+                        setLogoView(response)
+                        setLogoDispatched(true)
+                    }
+                }))
+            } else {
+                setLogoView(logosState[jobAd.recruiterId])
+            }
+
+        }
+
+    }, [jobAd])
 
 
@@ -41,18 +64,36 @@
             <div className="col-md-9">
                 <div className="details-wrap">
+                    <div className="row">
+                        <div className="col-md-9">
+                            <div className="title">
+                                <h2>{jobAd.title} </h2>
+                                <span className="job-type"> {jobAd.jobType===JobType.JOB ? "Job" : "Internship"}</span>
+                                {!jobAd.active && <span className="expired">Expired</span>}
+                            </div>
 
-                    <div className="title">
-                        <h2>{jobAd.title} </h2>
-                        <span className="job-type"> {jobAd.jobType===JobType.JOB ? "Job" : "Internship"}</span>
-                        {!jobAd.active && <span className="expired">Expired</span>}
+                            <p className="details-head-info">
+                                <span><b>{jobAd.recruiterName}</b></span> • <span>{jobAd.industry}</span> • <span>{formatRelativeTime(jobAd.postedOn)}</span>
+                            </p>
+
+                            <p><i className="fa-solid fa-money-check-dollar"></i> <span>Hourly rate: ${jobAd.startingSalary}</span></p>
+                            <p><i className="fa-solid fa-briefcase"></i> Employment status: {jobAd.employmentStatus==="FULL_TIME" ? "Full-time" : "Part-time"}</p>
+                            <p><i className="fa-solid fa-calendar-days"></i> Active until: {new Date(jobAd.activeUntil).toLocaleString('default', { day: 'numeric', month: 'long',  year: 'numeric' })}</p>
+
+                        </div>
+                        <div className="col-md-3">
+                            {jobAd.recruiterId &&
+                                <>
+                                    <img
+                                        // loading gif
+                                        src={logosState[jobAd.recruiterId]}
+                                        alt=""
+                                        width={200} height={200}
+                                    />
+                                </>
+                            }
+
+                        </div>
                     </div>
 
-                    <p className="details-head-info">
-                        <span><b>{jobAd.recruiterName}</b></span> • <span>{jobAd.industry}</span> • <span>{formatRelativeTime(jobAd.postedOn)}</span>
-                    </p>
-
-                    <p><i className="fa-solid fa-money-check-dollar"></i> <span>Hourly rate: ${jobAd.startingSalary}</span></p>
-                    <p><i className="fa-solid fa-briefcase"></i> Employment status: {jobAd.employmentStatus==="FULL_TIME" ? "Full-time" : "Part-time"}</p>
-                    <p><i className="fa-solid fa-calendar-days"></i> Active until: {new Date(jobAd.activeUntil).toLocaleString('default', { day: 'numeric', month: 'long',  year: 'numeric' })}</p>
 
                     <h4>About the job</h4>
@@ -66,17 +107,25 @@
             <div className="col-md-3">
                 <div className="details-wrap">
-                    <h3>{jobAd.recruiterName}</h3>
+                    <Link className="recruiter-link" to={`/recruiters/${jobAd.recruiterId}`}>{jobAd.recruiterName} </Link>
 
-                    {/*TO DO - AFTER IMPLEMENTING FORM FOR UPDATING PERSONAL INFO*/}
                     <h4>About the company</h4>
                     <p>
-                        For over two decades, we have been harnessing technology to drive meaningful change.  Working side by side with leading brands, we build strategies, products and solutions tailored to unique needs –regardless of industry, region or scale. By combining world-class engineering, industry expertise and a people-centric mindset, we consult and partner with our customers to create technological solutions that drive innovation and transform businesses.
-                        <br/><br/>
-                        From ideation to production, we support our customers with bespoke solutions across various industries, including payments, insurance, finance and banking, technology, media and entertainment, telecommunications, retail and consumer goods, supply chain and logistics, healthcare and life sciences, energy and resources, government, automotive and travel.
+                        {recruiterDetails.companyDescription
+                            ? recruiterDetails.companyDescription.length > 710
+                                ? `${recruiterDetails.companyDescription.substring(0, 710)}...`
+                                : recruiterDetails.companyDescription
+                            : "There is no info about this company yet."
+                        }
+                    </p>
 
+                    <p>
+                        <i className="fa-solid fa-envelope"></i> <span className="span-about"> {recruiterDetails.contactEmail}</span> <br/>
+                        <i className="fa-solid fa-phone"></i> <span className="span-about"> {recruiterDetails.contactPhoneNumber}</span> <br/>
+                        {recruiterDetails.receptionist && <><i className="fa-solid fa-user-tie"></i> <span className="span-about"> {recruiterDetails.receptionist}</span> </>}
                     </p>
-                    <p><span><i className="fa-solid fa-envelope"></i> {recruiterDetails.email}</span> • <span>
-                <i className="fa-solid fa-phone"></i> {recruiterDetails.phoneNumber}</span>
-                    </p>
+
+                    <div className="d-flex justify-content-center mt-4">
+                        <Link className="card-button" to={`/recruiters/${jobAd.recruiterId}`}>Read more </Link>
+                    </div>
                 </div>
             </div>
