From 59f0ff9228cd39776d7fa08296442d0abf045693 Mon Sep 17 00:00:00 2001
From: gianantoniopini <63844628+gianantoniopini@users.noreply.github.com>
Date: Wed, 4 Nov 2020 13:38:43 +0100
Subject: [PATCH] Issue #314: Added BirthDate field to Profile builder and
 Castform template

---
 .../builder/left/sections/Profile.js          |  7 ++++++
 src/data/demoState.json                       |  1 +
 src/data/initialState.json                    |  1 +
 src/i18n/locales/en.json                      |  1 +
 src/templates/Castform.js                     | 23 +++++++++++++++++--
 src/utils/index.js                            |  7 ++++--
 6 files changed, 36 insertions(+), 4 deletions(-)

diff --git a/src/components/builder/left/sections/Profile.js b/src/components/builder/left/sections/Profile.js
index 45be2af4..2c4c9422 100644
--- a/src/components/builder/left/sections/Profile.js
+++ b/src/components/builder/left/sections/Profile.js
@@ -38,6 +38,13 @@ const Profile = ({ id }) => {
         path="profile.subtitle"
       />
 
+      <Input
+        type="date"
+        name="birthDate"
+        label={t('builder.profile.birthDate')}
+        path="profile.birthDate"
+      />
+
       <hr />
 
       <Input
diff --git a/src/data/demoState.json b/src/data/demoState.json
index f4f3d311..0e5088fd 100644
--- a/src/data/demoState.json
+++ b/src/data/demoState.json
@@ -190,6 +190,7 @@
       "line2": "Brindavan Layout, Subramanyapura,",
       "pincode": "560061"
     },
+    "birthDate": "",
     "email": "hello@amruthpillai.com",
     "firstName": "Amruth",
     "heading": "Profile",
diff --git a/src/data/initialState.json b/src/data/initialState.json
index 1b0a704c..172df956 100644
--- a/src/data/initialState.json
+++ b/src/data/initialState.json
@@ -5,6 +5,7 @@
     "firstName": "",
     "lastName": "",
     "subtitle": "",
+    "birthDate": "",
     "address": {
       "line1": "",
       "line2": "",
diff --git a/src/i18n/locales/en.json b/src/i18n/locales/en.json
index 6c38a737..1be5a910 100644
--- a/src/i18n/locales/en.json
+++ b/src/i18n/locales/en.json
@@ -96,6 +96,7 @@
       "photograph": "Photograph",
       "firstName": "First Name",
       "lastName": "Last Name",
+      "birthDate": "Date of Birth",
       "address": {
         "line1": "Address Line 1",
         "line2": "Address Line 2",
diff --git a/src/templates/Castform.js b/src/templates/Castform.js
index 3c32798e..44d2c558 100644
--- a/src/templates/Castform.js
+++ b/src/templates/Castform.js
@@ -1,4 +1,5 @@
 import React from 'react';
+import { useTranslation } from 'react-i18next';
 import PageContext from '../contexts/PageContext';
 import AwardsA from './blocks/Awards/AwardsA';
 import CertificationsA from './blocks/Certifications/CertificationsA';
@@ -12,6 +13,7 @@ import ProjectsA from './blocks/Projects/ProjectsA';
 import ReferencesA from './blocks/References/ReferencesA';
 import SkillsA from './blocks/Skills/SkillsA';
 import WorkA from './blocks/Work/WorkA';
+import { formatDate } from '../utils';
 
 const Blocks = {
   objective: ObjectiveA,
@@ -26,7 +28,8 @@ const Blocks = {
   references: ReferencesA,
 };
 
-const Castform = ({ data }) => {
+const Castform = ({ data, language }) => {
+  const { t } = useTranslation();
   const layout = data.metadata.layout.castform;
 
   const Photo = () =>
@@ -51,6 +54,19 @@ const Castform = ({ data }) => {
     </div>
   );
 
+  const BirthDate = () => (
+    data.profile.birthDate && (
+      <div className="text-xs">
+        <h6 className="capitalize font-semibold">
+          {t('builder.profile.birthDate')}
+        </h6>
+        <div>
+          <span>{formatDate({ date: data.profile.birthDate, language, includeDay: true })}</span>
+        </div>
+      </div>
+    )
+  );
+
   return (
     <PageContext.Provider value={{ data, heading: HeadingD }}>
       <div
@@ -76,7 +92,10 @@ const Castform = ({ data }) => {
 
               <div>
                 <HeadingD>{data.profile.heading}</HeadingD>
-                <ContactC />
+                <div className="grid gap-4">
+                  <BirthDate />
+                  <ContactC />
+                </div>
               </div>
 
               {layout[0] &&
diff --git a/src/utils/index.js b/src/utils/index.js
index 87e0daa9..273c53d3 100644
--- a/src/utils/index.js
+++ b/src/utils/index.js
@@ -20,8 +20,11 @@ export const isFileImage = (file) => {
   return file && acceptedImageTypes.includes(file.type);
 };
 
-export const formatDate = ({ date, language = 'en' }) => {
-  return dayjs(date).locale(language.substr(0, 2)).format('MMMM YYYY');
+export const formatDate = ({ date, language = 'en', includeDay = false }) => {
+  const monthYearTemplate = 'MMMM YYYY';
+  const template = includeDay ? 'DD ' + monthYearTemplate : monthYearTemplate;
+
+  return dayjs(date).locale(language.substr(0, 2)).format(template);
 };
 
 export const formatDateRange = ({ startDate, endDate, language = 'en' }, t) => {