optimized api calls by moving api call to individual components and improved performance

src/app/contact-sidebar/contact-sidebar.component.html

@@ -3,7 +3,7 @@
     <div class="sidebar-info" ng-init="let displayName = ">
 
       <figure class="avatar-box">
-        <img src="./assets/images/my-avatar.png" alt="{{model.candidate?.displayName}}" width="80">
+        <img src="./assets/images/my-pic.png" alt="{{model.candidate?.displayName}}" width="80">
       </figure>
 
       <div class="info-content">

src/app/contact-sidebar/contact-sidebar.component.scss

@@ -0,0 +1,3 @@
+img {
+    border-radius: inherit;
+}

src/app/contact-sidebar/contact-sidebar.component.ts

@@ -17,8 +17,16 @@ export class ContactSidebarComponent extends BaseComponent<ISideBar> implements
   }
   
   ngOnInit(): void {
-    this.svc.baseSubject.subscribe((resume: ICv | unknown) =>{
-      this.assignData(resume);
+    // this.svc.baseSubject.subscribe((resume: ICv | unknown) =>{
+    //   this.assignData(resume);
+    // });
+    this.getCandidateAndSocialLinks();
+  }
+
+  getCandidateAndSocialLinks(){
+    this.svc.getCandidateWithSocialLinks(this.candidateId).subscribe((response: ISideBar) => {
+      this.svc.candidateAndSocialLinks = this.svc.candidateAndSocialLinks ?? response;
+      this.assignData(response);
     });
   }
 }