- implement i18n

- translation dynamic for sections
- added articles for SEO

src/components/shared/PhotoUpload.js

@@ -1,6 +1,7 @@
 import { Tooltip } from '@material-ui/core';
 import React, { memo, useContext, useRef } from 'react';
 import { MdFileUpload } from 'react-icons/md';
+import { useTranslation } from 'react-i18next';
 import StorageContext from '../../contexts/StorageContext';
 import { handleKeyUp } from '../../utils';
 import Input from './Input';
@@ -8,6 +9,7 @@ import styles from './PhotoUpload.module.css';
 
 const PhotoUpload = () => {
   const fileInputRef = useRef(null);
+  const { t } = useTranslation();
   const { uploadPhotograph } = useContext(StorageContext);
 
   const handleIconClick = () => {
@@ -21,7 +23,10 @@ const PhotoUpload = () => {
 
   return (
     <div className="flex items-center">
-      <Tooltip title="Upload Photograph" placement="right-start">
+      <Tooltip
+        title={t('builder.tooltips.uploadPhotograph')}
+        placement="right-start"
+      >
         <div
           role="button"
           tabIndex="0"
@@ -42,7 +47,7 @@ const PhotoUpload = () => {
 
       <Input
         name="photograph"
-        label="Photograph"
+        label={t('builder.profile.photograph')}
         className="pl-6 w-full"
         path="profile.photograph"
       />