Minor changes wrt to agent about block (#246)

* Minor changes wrt to agent about block * Minor changes wrt to SEO * Agent Profile changes --------- Co-authored-by: piyushjindal <[email protected]>
hlxsites · Jun 10, 2024 · 317e7ab · 317e7ab
1 parent b5466ba
commit 317e7ab
Show file tree

Hide file tree

Showing 4 changed files with 33 additions and 18 deletions.
diff --git a/blocks/agent-about/agent-about.css b/blocks/agent-about/agent-about.css
@@ -7,10 +7,6 @@
   letter-spacing: normal;
 }
 
-.agent-about.block a {
-  cursor: pointer;
-}
-
 .agent-about.block .hide {
   display: none;
 }
@@ -20,6 +16,8 @@
   display: inline-block;
   margin-top: 1rem;
   text-decoration: underline;
+  font-size: var(--body-font-size-xs);
+  color: var(--black);
 }
 
 .agent-about.block a.view-more::after {
@@ -33,7 +31,7 @@
 .agent-about.block>div.cols-1,
 .agent-about.block>div.cols-2,
 .agent-about.block>div.cols-3 {
-  padding-bottom: 1rem;
+  padding-bottom: 2rem;
 }
 
 .agent-about.block>div>div:first-of-type {

diff --git a/blocks/agent-about/agent-about.js b/blocks/agent-about/agent-about.js
@@ -1,3 +1,4 @@
+import { getMetadata } from '../../scripts/aem.js';
 import {
   a, div, ul, li,
 } from '../../scripts/dom-helpers.js';
@@ -18,7 +19,23 @@ const viewMoreOnClick = (name, anchor, block) => {
   });
 };
 
+const getCol = (list, colText) => {
+  const colsUl = ul();
+  list.split(',').forEach((x) => {
+    colsUl.append(li(x.trim()));
+  });
+  return div(div(colText), div(colsUl));
+};
+
 export default function decorate(block) {
+  const aboutText = getMetadata('about');
+  const accreditations = getMetadata('professional-accreditations');
+  const languages = getMetadata('languages');
+
+  block.replaceChildren(div(div('About'), div(aboutText)),
+    getCol(accreditations, 'Professional Accreditations'),
+    getCol(languages, 'Languages'));
+
   const children = [...block.children];
   if (children?.length) {
     children.forEach((child, index) => {
@@ -31,7 +48,7 @@ export default function decorate(block) {
           child.children[1].classList.add('hide');
           child.append(div({ class: `${name}-truncate` },
             `${child.children[1].textContent.substring(0, threshold)}...`));
-          const anchor = a({ class: 'view-more' });
+          const anchor = a({ class: 'view-more', href: '#' });
           child.append(anchor);
           viewMoreOnClick(name, anchor, block);
         }
@@ -43,15 +60,15 @@ export default function decorate(block) {
 
         if (liItems.length > threshold) {
           child.children[1].classList.add('hide');
-          const tempUl = ul({ });
+          const tempUl = ul();
           Array.from(child.children[1].querySelectorAll('li'))
             .slice(0, threshold).forEach((liItem) => {
-              const tempLi = li({}, liItem.textContent);
+              const tempLi = li(liItem.textContent);
               tempUl.append(tempLi);
             });
 
           child.append(div({ class: `${name}-truncate` }, tempUl));
-          const anchor = a({ class: 'view-more' });
+          const anchor = a({ class: 'view-more', href: '#' });
           child.append(anchor);
           viewMoreOnClick(name, anchor, block);
         }

diff --git a/blocks/agent-profile/agent-profile.js b/blocks/agent-profile/agent-profile.js
@@ -8,13 +8,13 @@ const getPhoneDiv = () => {
   let phoneUl;
 
   if (getMetadata('direct-phone')) {
-    phoneUl = ul({});
-    phoneUl.append(li({}, 'Direct: ', getMetadata('direct-phone')));
+    phoneUl = ul();
+    phoneUl.append(li('Direct: ', getMetadata('direct-phone')));
   }
 
   if (getMetadata('office-phone')) {
-    phoneUl = phoneUl || ul({});
-    phoneUl.append(li({}, 'Office: ', getMetadata('office-phone')));
+    phoneUl = phoneUl || ul();
+    phoneUl.append(li('Office: ', getMetadata('office-phone')));
   }
 
   if (phoneUl) {
@@ -62,9 +62,9 @@ const getSocialDiv = () => {
 
   ['facebook', 'instagram', 'linkedin'].forEach((x) => {
     const url = getMetadata(x);
-    socialUl = socialUl || ul({});
+    socialUl = socialUl || ul();
     if (url) {
-      const socialLi = li({}, a({
+      const socialLi = li(a({
         href: url, class: x, title: x, 'aria-label': x,
       }, span({ class: `icon icon-${x}` })));
       socialUl.append(socialLi);
@@ -82,7 +82,7 @@ const getSocialDiv = () => {
 export default async function decorate(block) {
   const profileImage = getImageDiv();
   const profileContent = div({ class: 'profile-content' },
-    div({ class: 'name' }, h1({}, getMetadata('name'))),
+    div({ class: 'name' }, h1(getMetadata('name'))),
     div({ class: 'designation' }, getMetadata('designation')),
   );
 

diff --git a/blocks/agent-transactions/agent-transactions.js b/blocks/agent-transactions/agent-transactions.js
@@ -78,8 +78,8 @@ export default async function decorate(block) {
     trBody.appendChild(trElement);
   });
 
-  const tableElement = table({}, thead({}, theadTr), trBody);
-  const heading1 = h1({}, 'Closed Transactions');
+  const tableElement = table(thead(theadTr), trBody);
+  const heading1 = h1('Closed Transactions');
   const anchor = a({ class: 'show-more' });
   anchor.addEventListener('click', () => {
     if (anchor.classList.contains('show-more')) {