Lemoncode · juanpms2 · Dec 14, 2023 · Dec 7, 2023 · Dec 8, 2023 · Dec 8, 2023
diff --git a/apps/react-app/src/pods/template-export/components/export-config/export-config.component.tsx b/apps/react-app/src/pods/template-export/components/export-config/export-config.component.tsx
@@ -17,7 +17,7 @@ interface Props {
 }
 
 const DOWNLOAD_MESSAGE_TIMEOUT = 2500;
-const DESING_OPTIONS: TemplateCV[] = ['Sith Elegance', 'Galactic CleanTech'];
+const DESING_OPTIONS: TemplateCV[] = ['Sith Elegance', 'Galactic CleanTech', 'X-Wing Squadron'];
 const LANGUAGE_OPTIONS: Language[] = ['es', 'en'];
 
 export const ExportConfig: React.FC<Props> = props => {

diff --git a/packages/manfred-common/src/doc-parts/profile-section/profile-section.mapper.spec.ts b/packages/manfred-common/src/doc-parts/profile-section/profile-section.mapper.spec.ts
@@ -82,6 +82,9 @@ describe('Testing profile-section.mapper.ts', () => {
         fullname: ' ',
         emails: [] as string[],
         relevantLinks: [] as RelevantLinkVm[],
+        avatar: '',
+        regionLocation: '',
+        countryLocation: '',
       };
 
       // Act
@@ -101,6 +104,9 @@ describe('Testing profile-section.mapper.ts', () => {
         fullname: ' ',
         emails: [] as string[],
         relevantLinks: [] as RelevantLinkVm[],
+        avatar: '',
+        regionLocation: '',
+        countryLocation: '',
       };
 
       // Act
@@ -132,6 +138,9 @@ describe('Testing profile-section.mapper.ts', () => {
         fullname: ' ',
         emails: [] as string[],
         relevantLinks: [] as RelevantLinkVm[],
+        avatar: '',
+        regionLocation: '',
+        countryLocation: '',
       };
 
       // Act
@@ -163,6 +172,9 @@ describe('Testing profile-section.mapper.ts', () => {
         fullname: ' ',
         emails: [] as string[],
         relevantLinks: [] as RelevantLinkVm[],
+        avatar: '',
+        regionLocation: '',
+        countryLocation: '',
       };
 
       // Act
@@ -203,6 +215,9 @@ describe('Testing profile-section.mapper.ts', () => {
         fullname: ' ',
         emails: [] as string[],
         relevantLinks: [] as RelevantLinkVm[],
+        avatar: '',
+        regionLocation: '',
+        countryLocation: '',
       };
 
       // Act
@@ -244,6 +259,9 @@ describe('Testing profile-section.mapper.ts', () => {
         fullname: ' ',
         emails: [] as string[],
         relevantLinks: [] as RelevantLinkVm[],
+        avatar: '',
+        regionLocation: '',
+        countryLocation: '',
       };
 
       // Act
@@ -270,9 +288,14 @@ describe('Testing profile-section.mapper.ts', () => {
         title: 'Computer Science Bachelor',
         description: 'Frontend developer',
         birthday: '30/03/1990',
-        avatar: undefined,
+        avatar: {
+          link: '',
+        },
         contact: theContact,
-        location: undefined,
+        location: {
+          country: '',
+          region: '',
+        },
       };
 
       const cv: ManfredAwesomicCV = {
@@ -295,6 +318,9 @@ describe('Testing profile-section.mapper.ts', () => {
         fullname: 'John Doe',
         emails: ['[email protected]', '[email protected]'] as string[],
         relevantLinks: [theLink] as RelevantLinkVm[],
+        avatar: '',
+        regionLocation: '',
+        countryLocation: '',
       };
 
       // Act
@@ -304,4 +330,5 @@ describe('Testing profile-section.mapper.ts', () => {
     });
   });
 });
+
 export {};
diff --git a/packages/manfred-common/src/doc-parts/profile-section/profile-section.mapper.ts b/packages/manfred-common/src/doc-parts/profile-section/profile-section.mapper.ts
@@ -30,7 +30,9 @@ export const mapFromMacCvToProfileSectionVm = (cv: ManfredAwesomicCV): ProfileSe
   const relevantLinks = cv?.aboutMe?.relevantLinks
     ? mapRelevantLinksToVm(cv.aboutMe.relevantLinks as ManfredRelevantLink[])
     : [];
-
+  const avatar = (cv?.aboutMe?.profile?.avatar?.link as string) ?? '';
+  const regionLocation = cv?.aboutMe?.profile?.location?.region ?? '';
+  const countryLocation = cv?.aboutMe?.profile?.location?.country ?? '';
   return {
     name,
     surnames,
@@ -39,5 +41,8 @@ export const mapFromMacCvToProfileSectionVm = (cv: ManfredAwesomicCV): ProfileSe
     fullname,
     emails,
     relevantLinks,
+    avatar,
+    regionLocation,
+    countryLocation,
   };
 };
diff --git a/packages/manfred-common/src/doc-parts/profile-section/profile-section.vm.ts b/packages/manfred-common/src/doc-parts/profile-section/profile-section.vm.ts
@@ -6,6 +6,9 @@ export interface ProfileSectionVm {
   fullname: string;
   emails: string[];
   relevantLinks: RelevantLinkVm[];
+  avatar: string;
+  regionLocation: string;
+  countryLocation: string;
 }
 
 export interface RelevantLinkVm {

diff --git a/...d2html/src/engine/cv-x-wing-squadron/html-parts/header-element-end/header-element-end.ejs b/...d2html/src/engine/cv-x-wing-squadron/html-parts/header-element-end/header-element-end.ejs
@@ -0,0 +1 @@
+</header>
diff --git a/...ml/src/engine/cv-x-wing-squadron/html-parts/header-element-end/header-element-end.part.ts b/...ml/src/engine/cv-x-wing-squadron/html-parts/header-element-end/header-element-end.part.ts
@@ -0,0 +1,4 @@
+import ejs from 'ejs';
+import headerElementEndTemplate from './header-element-end.ejs?raw';
+
+export const generateHeaderElementEnd = (): string => ejs.render(headerElementEndTemplate);
diff --git a/packages/manfred2html/src/engine/cv-x-wing-squadron/html-parts/header-element-end/index.ts b/packages/manfred2html/src/engine/cv-x-wing-squadron/html-parts/header-element-end/index.ts
@@ -0,0 +1 @@
+export * from './header-element-end.part';
diff --git a/...ml/src/engine/cv-x-wing-squadron/html-parts/header-element-start/header-element-start.ejs b/...ml/src/engine/cv-x-wing-squadron/html-parts/header-element-start/header-element-start.ejs
@@ -0,0 +1 @@
+<header>
diff --git a/...rc/engine/cv-x-wing-squadron/html-parts/header-element-start/header-element-start.part.ts b/...rc/engine/cv-x-wing-squadron/html-parts/header-element-start/header-element-start.part.ts
@@ -0,0 +1,4 @@
+import ejs from 'ejs';
+import headerElementStartTemplate from './header-element-start.ejs?raw';
+
+export const generateHeaderElementStart = (): string => ejs.render(headerElementStartTemplate);
diff --git a/packages/manfred2html/src/engine/cv-x-wing-squadron/html-parts/header-element-start/index.ts b/packages/manfred2html/src/engine/cv-x-wing-squadron/html-parts/header-element-start/index.ts
@@ -0,0 +1 @@
+export * from './header-element-start.part';
diff --git a/...s/manfred2html/src/engine/cv-x-wing-squadron/html-parts/header-section/header-section.ejs b/...s/manfred2html/src/engine/cv-x-wing-squadron/html-parts/header-section/header-section.ejs
@@ -0,0 +1,117 @@
+<%_ if (profile && profile !== 'undefined') { -%>
+  <%_ if (profile.avatar && profile.avatar.link) { -%>
+    <img src="<%= profile?.avatar%>" alt="photo cv">
+  <%_ } -%>
+  <section class="header__content">
+    <div class="header__content__name">
+      <svg xmlns="http://www.w3.org/2000/svg" width="64" height="10" viewBox="0 0 64 10" fill="none">
+        <path d="M1.10269e-06 5L64 5" stroke="#3BA0B7" stroke-width="9" />
+      </svg>
+      <h1><%= profile.name %> </h1>
+      <h2 class="surname"><%= profile?.surnames %></h2>
+      <p class="job-title"><%= profile?.title %></p>
+    </div>
+    <%_ if (profile.regionLocation && profile.countryLocation && profile.regionLocation !== 'undefined' && profile.countryLocation !== 'undefined') { -%>
+      <div class="header__content__address">
+        <svg xmlns="http://www.w3.org/2000/svg" width="18" height="24" viewBox="0 0 18 24" fill="none">
+          <g clip-path="url(#clip0_1762_1661)">
+            <path
+              d="M10.1109 23.4C12.5156 20.3906 18 13.0969 18 9C18 4.03125 13.9688 0 9 0C4.03125 0 0 4.03125 0 9C0 13.0969 5.48438 20.3906 7.88906 23.4C8.46562 24.1172 9.53438 24.1172 10.1109 23.4ZM14.2969 6.79688L8.29688 12.7969C7.85625 13.2375 7.14375 13.2375 6.70781 12.7969L3.70312 9.79688C3.2625 9.35625 3.2625 8.64375 3.70312 8.20781C4.14375 7.77188 4.85625 7.76719 5.29219 8.20781L7.49531 10.4109L12.7031 5.20312C13.1438 4.7625 13.8562 4.7625 14.2922 5.20312C14.7281 5.64375 14.7328 6.35625 14.2922 6.79219L14.2969 6.79688Z"
+              fill="#3BA0B7"
+            />
+          </g>
+          <defs>
+            <clipPath id="clip0_1762_1661">
+              <rect width="18" height="24" fill="white" />
+            </clipPath>
+          </defs>
+        </svg>
+        <p><%= profile?.regionLocation %>, <%= profile?.countryLocation %></p>
+      </div>
+    <%_ } -%>
+    <%_ if (profile.relevantLinks && profile.relevantLinks.length !== 0) { -%>
+      <div class="header__content__links">
+        <%_ for (const link of profile?.relevantLinks) { -%>
+          <%_ if (link.type === 'linkedin') { -%>
+            <div class="aside__section__item">
+              <a href=<%= link.URL %> target="_blank">
+                <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
+                  <g clip-path="url(#clip0_1745_1632)">
+                    <path
+                      d="M20.447 20.452H16.893V14.883C16.893 13.555 16.866 11.846 15.041 11.846C13.188 11.846 12.905 13.291 12.905 14.785V20.452H9.351V9H12.765V10.561H12.811C13.288 9.661 14.448 8.711 16.181 8.711C19.782 8.711 20.448 11.081 20.448 14.166V20.452H20.447ZM5.337 7.433C5.06588 7.43313 4.79739 7.37979 4.54691 7.27604C4.29642 7.17229 4.06886 7.02015 3.87724 6.82835C3.68562 6.63654 3.5337 6.40883 3.43019 6.15825C3.32668 5.90766 3.27361 5.63912 3.274 5.368C3.2742 4.95978 3.39544 4.56078 3.6224 4.22147C3.84936 3.88216 4.17184 3.61777 4.54907 3.46173C4.92629 3.30569 5.34131 3.26502 5.74165 3.34485C6.14198 3.42469 6.50966 3.62144 6.79817 3.91024C7.08669 4.19903 7.28309 4.5669 7.36254 4.96731C7.44198 5.36773 7.40091 5.78271 7.2445 6.15978C7.0881 6.53685 6.8234 6.85908 6.48387 7.08571C6.14433 7.31234 5.74522 7.4332 5.337 7.433ZM7.119 20.452H3.555V9H7.119V20.452ZM22.225 0H1.771C0.792 0 0 0.774 0 1.729V22.271C0 23.227 0.792 24 1.771 24H22.222C23.2 24 24 23.227 24 22.271V1.729C24 0.774 23.2 0 22.222 0H22.225Z"
+                      fill="#3BA0B7"
+                    />
+                  </g>
+                  <defs>
+                    <clipPath id="clip0_1745_1632">
+                      <rect width="24" height="24" fill="white" />
+                    </clipPath>
+                  </defs>
+                </svg>
+              </a>
+            </div>
+          <%_ } -%>
+            <%_ if (link.type === 'github') { -%>
+              <div class="aside__section__item">
+                <a href=<%= link.URL %> target="_blank">
+                  <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
+                    <g clip-path="url(#clip0_1745_1636)">
+                      <path
+                        d="M12 0.296875C5.37 0.296875 0 5.66988 0 12.2969C0 17.5999 3.438 22.0969 8.205 23.6819C8.805 23.7949 9.025 23.4239 9.025 23.1049C9.025 22.8199 9.015 22.0649 9.01 21.0649C5.672 21.7889 4.968 19.4549 4.968 19.4549C4.422 18.0699 3.633 17.6999 3.633 17.6999C2.546 16.9559 3.717 16.9709 3.717 16.9709C4.922 17.0549 5.555 18.2069 5.555 18.2069C6.625 20.0419 8.364 19.5119 9.05 19.2049C9.158 18.4289 9.467 17.8999 9.81 17.5999C7.145 17.2999 4.344 16.2679 4.344 11.6699C4.344 10.3599 4.809 9.28988 5.579 8.44988C5.444 8.14688 5.039 6.92688 5.684 5.27388C5.684 5.27388 6.689 4.95188 8.984 6.50388C9.944 6.23688 10.964 6.10488 11.984 6.09888C13.004 6.10488 14.024 6.23688 14.984 6.50388C17.264 4.95188 18.269 5.27388 18.269 5.27388C18.914 6.92688 18.509 8.14688 18.389 8.44988C19.154 9.28988 19.619 10.3599 19.619 11.6699C19.619 16.2799 16.814 17.2949 14.144 17.5899C14.564 17.9499 14.954 18.6859 14.954 19.8099C14.954 21.4159 14.939 22.7059 14.939 23.0959C14.939 23.4109 15.149 23.7859 15.764 23.6659C20.565 22.0919 24 17.5919 24 12.2969C24 5.66988 18.627 0.296875 12 0.296875Z"
+                        fill="#3BA0B7"
+                      />
+                    </g>
+                    <defs>
+                      <clipPath id="clip0_1745_1636">
+                        <rect width="24" height="24" fill="white" />
+                      </clipPath>
+                    </defs>
+                  </svg>
+                </a>
+              </div>
+            <%_ } %>
+            <%_ if (link.type === 'twitter') { -%>
+              <div class="aside__section__item">
+                <a href=<%= link.URL %> target="_blank">
+                  <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none">
+                    <path
+                      d="M0.048762 0.640625L7.77054 10.9654L0 19.3598H1.74884L8.55193 12.0104L14.0486 19.3598H20L11.8438 8.45433L19.0765 0.640625H17.3277L11.0624 7.40935L6.00012 0.640625H0.048762ZM2.62056 1.92882H5.35462L17.4278 18.0714H14.6937L2.62056 1.92882Z"
+                      fill="#3BA0B7"
+                    />
+                  </svg>
+                </a>
+              </div>
+            <%_ } %>
+            <%_ if (link.type === 'web') { -%>
+              <div class="aside__section__item">
+                <a href=<%= link.URL %> target="_blank">
+                  <svg xmlns="http://www.w3.org/2000/svg" width="24" height="20" viewBox="0 0 24 20" fill="none">
+                    <path
+                      d="M21.742 10.4387C23.8608 8.31996 23.8608 4.88871 21.742 2.76996C19.867 0.89496 16.912 0.65121 14.7558 2.19246L14.6958 2.23371C14.1558 2.61996 14.032 3.36996 14.4183 3.90621C14.8045 4.44246 15.5545 4.56996 16.0908 4.18371L16.1508 4.14246C17.3545 3.28371 19.0008 3.41871 20.0433 4.46496C21.2245 5.64621 21.2245 7.55871 20.0433 8.73996L15.8358 12.955C14.6545 14.1362 12.742 14.1362 11.5608 12.955C10.5145 11.9087 10.3795 10.2625 11.2383 9.06246L11.2795 9.00246C11.6658 8.46246 11.5383 7.71246 11.002 7.32996C10.4658 6.94746 9.71203 7.07121 9.32953 7.60746L9.28828 7.66746C7.74328 9.81996 7.98703 12.775 9.86203 14.65C11.9808 16.7687 15.412 16.7687 17.5308 14.65L21.742 10.4387ZM2.25703 9.56121C0.138281 11.68 0.138281 15.1112 2.25703 17.23C4.13203 19.105 7.08703 19.3487 9.24328 17.8075L9.30328 17.7662C9.84328 17.38 9.96703 16.63 9.58078 16.0937C9.19453 15.5575 8.44453 15.43 7.90828 15.8162L7.84828 15.8575C6.64453 16.7162 4.99828 16.5812 3.95578 15.535C2.77453 14.35 2.77453 12.4375 3.95578 11.2562L8.16328 7.04496C9.34453 5.86371 11.257 5.86371 12.4383 7.04496C13.4845 8.09121 13.6195 9.73746 12.7608 10.9412L12.7195 11.0012C12.3333 11.5412 12.4608 12.2912 12.997 12.6737C13.5333 13.0562 14.287 12.9325 14.6695 12.3962L14.7108 12.3362C16.2558 10.18 16.012 7.22496 14.137 5.34996C12.0183 3.23121 8.58703 3.23121 6.46828 5.34996L2.25703 9.56121Z"
+                      fill="#3BA0B7"
+                    />
+                  </svg>
+                </a>
+              </div>
+            <%_ } %>
+            <%_ if (link.type === 'otros') { -%>
+              <div class="aside__section__item">
+                <a href=<%= link.URL %> target="_blank">
+                  <svg xmlns="http://www.w3.org/2000/svg" width="24" height="20" viewBox="0 0 24 20" fill="none">
+                    <path
+                      d="M21.742 10.4387C23.8608 8.31996 23.8608 4.88871 21.742 2.76996C19.867 0.89496 16.912 0.65121 14.7558 2.19246L14.6958 2.23371C14.1558 2.61996 14.032 3.36996 14.4183 3.90621C14.8045 4.44246 15.5545 4.56996 16.0908 4.18371L16.1508 4.14246C17.3545 3.28371 19.0008 3.41871 20.0433 4.46496C21.2245 5.64621 21.2245 7.55871 20.0433 8.73996L15.8358 12.955C14.6545 14.1362 12.742 14.1362 11.5608 12.955C10.5145 11.9087 10.3795 10.2625 11.2383 9.06246L11.2795 9.00246C11.6658 8.46246 11.5383 7.71246 11.002 7.32996C10.4658 6.94746 9.71203 7.07121 9.32953 7.60746L9.28828 7.66746C7.74328 9.81996 7.98703 12.775 9.86203 14.65C11.9808 16.7687 15.412 16.7687 17.5308 14.65L21.742 10.4387ZM2.25703 9.56121C0.138281 11.68 0.138281 15.1112 2.25703 17.23C4.13203 19.105 7.08703 19.3487 9.24328 17.8075L9.30328 17.7662C9.84328 17.38 9.96703 16.63 9.58078 16.0937C9.19453 15.5575 8.44453 15.43 7.90828 15.8162L7.84828 15.8575C6.64453 16.7162 4.99828 16.5812 3.95578 15.535C2.77453 14.35 2.77453 12.4375 3.95578 11.2562L8.16328 7.04496C9.34453 5.86371 11.257 5.86371 12.4383 7.04496C13.4845 8.09121 13.6195 9.73746 12.7608 10.9412L12.7195 11.0012C12.3333 11.5412 12.4608 12.2912 12.997 12.6737C13.5333 13.0562 14.287 12.9325 14.6695 12.3962L14.7108 12.3362C16.2558 10.18 16.012 7.22496 14.137 5.34996C12.0183 3.23121 8.58703 3.23121 6.46828 5.34996L2.25703 9.56121Z"
+                      fill="#3BA0B7"
+                    />
+                  </svg>
+                </a>
+              </div>
+            <%_ } %>
+          <%_ } %>
+        <%_ } %>
+      </div>
+  </section>
+<%_ } -%>
+
+
+
+
diff --git a/...nfred2html/src/engine/cv-x-wing-squadron/html-parts/header-section/header-section.part.ts b/...nfred2html/src/engine/cv-x-wing-squadron/html-parts/header-section/header-section.part.ts
@@ -0,0 +1,16 @@
+import { ManfredAwesomicCV } from '@/model';
+import { ProfileSectionVm, mapFromMacCvToProfileSectionVm } from '@lemoncode/manfred-common/profile-section';
+import headerSection from './header-section.ejs?raw';
+import ejs from 'ejs';
+
+export const generateHeaderSection = (cv: ManfredAwesomicCV): string => {
+  const profileSectionVm = mapFromMacCvToProfileSectionVm(cv);
+  return generateHeaderSectionInner(profileSectionVm);
+};
+
+const generateHeaderSectionInner = (profileSectionVm: ProfileSectionVm): string => {
+  const rootObject = {
+    profile: profileSectionVm,
+  };
+  return ejs.render(headerSection, rootObject);
+};
diff --git a/packages/manfred2html/src/engine/cv-x-wing-squadron/html-parts/header-section/index.ts b/packages/manfred2html/src/engine/cv-x-wing-squadron/html-parts/header-section/index.ts
@@ -0,0 +1 @@
+export * from './header-section.part';
diff --git a/packages/manfred2html/src/engine/cv-x-wing-squadron/html-parts/index.ts b/packages/manfred2html/src/engine/cv-x-wing-squadron/html-parts/index.ts
@@ -1,2 +1,5 @@
 export * from './html-document-start';
 export * from './html-document-end';
+export * from './header-element-start';
+export * from './header-element-end';
+export * from './header-section';
diff --git a/packages/manfred2html/src/engine/cv-x-wing-squadron/index.ts b/packages/manfred2html/src/engine/cv-x-wing-squadron/index.ts
@@ -1,12 +1,24 @@
 import { ManfredAwesomicCV } from '@/model';
-import { generateHtmlDocumentStart, generateHtmlDocumentEnd } from './html-parts';
+import {
+  generateHtmlDocumentStart,
+  generateHtmlDocumentEnd,
+  generateHeaderElementEnd,
+  generateHeaderElementStart,
+  generateHeaderSection,
+} from './html-parts';
 
 export const exportManfredJsonToCVXWingHTML = (manfredJsonContent: ManfredAwesomicCV): string => {
   const htmlDocumentStart = generateHtmlDocumentStart();
   const htmlDocumentEnd = generateHtmlDocumentEnd();
+  const headerElementStart = generateHeaderElementStart();
+  const headerElementEnd = generateHeaderElementEnd();
+  const headerSection = generateHeaderSection(manfredJsonContent);
 
   return `
     ${htmlDocumentStart}
+      ${headerElementStart}
+      ${headerSection}
+      ${headerElementEnd}
     ${htmlDocumentEnd}
   `;
 };
diff --git a/packages/manfred2html/src/engine/index.ts b/packages/manfred2html/src/engine/index.ts
@@ -2,6 +2,7 @@ import { ManfredAwesomicCV, ExportHTMLSettings } from '@/model';
 import { mapExportHTMLSettingsToSettings } from '@/mappers';
 import { exportManfredJSonToCVSithEleganceHTML } from './cv-sith-elegance';
 import { exportManfredJSonToCVGalacticCleanTechHTML } from './cv-galactic-cleantech';
+import { exportManfredJsonToCVXWingHTML } from './cv-x-wing-squadron';
 
 export const exportHTMLTemplate = (
   manfredJsonContent: ManfredAwesomicCV,
@@ -14,6 +15,8 @@ export const exportHTMLTemplate = (
       return exportManfredJSonToCVSithEleganceHTML(manfredJsonContent, settings);
     case 'Galactic CleanTech':
       return exportManfredJSonToCVGalacticCleanTechHTML(manfredJsonContent, settings);
+    case 'X-Wing Squadron':
+      return exportManfredJsonToCVXWingHTML(manfredJsonContent);
     default:
       throw new Error('Template not found');
   }