Title, Avatar and Resume Updates (#86)

payapula · May 26, 2024 · d5ed554 · d5ed554
1 parent 6efd54b
commit d5ed554
Show file tree

Hide file tree

Showing 11 changed files with 36 additions and 25 deletions.
diff --git a/components/author-avatar.tsx b/components/author-avatar.tsx
@@ -2,6 +2,15 @@ import { ReactElement } from 'react';
 import { ChakraNextImage } from './chakra-next-image';
 import profilePic from 'public/assets/resume/bharathikannanavatar.jpg';
 
+/**
+ * * When updating images
+ *
+ * 1. Make sure to resize them to reduce the file size.
+ * 2. Make sure the image is not clipped/cropped: Read about `objectFit` property.
+ *  https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit
+ * 3. When I updated the image on May, 2024, Updated `objectFit` fron `contain` to
+ * `cover`
+ */
 function AuthorAvatar({ size }: { size: number }): ReactElement {
     return (
         <ChakraNextImage
@@ -12,7 +21,7 @@ function AuthorAvatar({ size }: { size: number }): ReactElement {
             height={size}
             priority
             placeholder="blur"
-            objectFit="contain"
+            objectFit="cover"
         />
     );
 }

diff --git a/components/history.tsx b/components/history.tsx
@@ -79,7 +79,7 @@ function History(): JSX.Element {
                     date="2023 - Present"
                     icon={<CustomIcon icon={DiReact} color="#61dafb" />}
                     head={true}>
-                    <Title>Senior Associate, Experience Technology</Title>
+                    <Title>Lead Experience Engineer</Title>
                     <Subtitle>Publicis Sapient</Subtitle>
                     <Description>React | Typescript | SCSS | HTML | CSS</Description>
                 </CustomVerticalTimeLine>

diff --git a/components/technologies.tsx b/components/technologies.tsx
@@ -7,9 +7,9 @@ import {
     SiNextdotjs,
     SiTypescript,
     SiCsharp,
-    SiOracle,
     SiFirebase,
-    SiAwsamplify
+    SiAwsamplify,
+    SiRemix
 } from 'react-icons/si';
 
 type IconMeta = {
@@ -26,14 +26,14 @@ const iconSet: IconSet = {
     ts: { color: '#3178c6', text: 'TypeScript', icon: SiTypescript },
     react: { color: '#61dafb', text: 'React', icon: DiReact },
     next: { color: '', text: 'NextJS', icon: SiNextdotjs },
+    remix: { color: '', text: 'Remix', icon: SiRemix },
     node: { color: '#026e00', text: 'NodeJS', icon: DiNodejs },
     js: { color: '#fcdc00', text: 'Javascript', icon: DiJsBadge },
     firebase: { color: '#FFCA28', text: 'Firebase', icon: SiFirebase },
     amplify: { color: '#FF9900', text: 'AWS Amplify', icon: SiAwsamplify },
     html: { color: '#e54c21', text: 'HTML', icon: DiHtml5 },
     css: { color: '#1672b6', text: 'CSS', icon: DiCss3 },
     csharp: { color: '#189f20', text: 'C Sharp', icon: SiCsharp },
-    oracle: { color: '#ff141d', text: 'Oracle SQL', icon: SiOracle },
     android: { color: '#a5c736', text: 'Android', icon: DiAndroid }
 };
 

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -34,7 +34,7 @@
     "prism-react-renderer": "^1.2.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
-    "react-icons": "^4.3.1",
+    "react-icons": "^5.2.1",
     "react-vertical-timeline-component": "^3.3.3",
     "remark": "11.0.2",
     "remark-html": "10.0.0",

diff --git a/public/assets/resume/Bharathi Kannan Full Stack Resume.pdf b/public/assets/resume/Bharathi Kannan Full Stack Resume.pdf
diff --git a/public/assets/resume/Bharathi Kannan Full Stack Resume_old_26_may.pdf b/public/assets/resume/Bharathi Kannan Full Stack Resume_old_26_may.pdf
diff --git a/public/assets/resume/bharathikannanavatar.jpg b/public/assets/resume/bharathikannanavatar.jpg
diff --git a/public/assets/resume/bharathikannanavatar_old.jpg b/public/assets/resume/bharathikannanavatar_old.jpg
diff --git a/public/sitemap.xml b/public/sitemap.xml
@@ -1,13 +1,15 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9" xmlns:news="http://www.google.com/schemas/sitemap-news/0.9" xmlns:xhtml="http://www.w3.org/1999/xhtml" xmlns:mobile="http://www.google.com/schemas/sitemap-mobile/1.0" xmlns:image="http://www.google.com/schemas/sitemap-image/1.1" xmlns:video="http://www.google.com/schemas/sitemap-video/1.1">
-<url><loc>https://www.bharathikannan.com</loc><lastmod>2022-08-09T05:50:33.029Z</lastmod><changefreq>daily</changefreq><priority>0.7</priority></url>
-<url><loc>https://www.bharathikannan.com/blog</loc><lastmod>2022-08-09T05:50:33.029Z</lastmod><changefreq>daily</changefreq><priority>0.7</priority></url>
-<url><loc>https://www.bharathikannan.com/blog/what-is-this-javascript</loc><lastmod>2022-08-09T05:50:33.029Z</lastmod><changefreq>daily</changefreq><priority>0.7</priority></url>
-<url><loc>https://www.bharathikannan.com/blog/positioned-layout</loc><lastmod>2022-08-09T05:50:33.029Z</lastmod><changefreq>daily</changefreq><priority>0.7</priority></url>
-<url><loc>https://www.bharathikannan.com/blog/use-next-link-with-chakra-ui</loc><lastmod>2022-08-09T05:50:33.029Z</lastmod><changefreq>daily</changefreq><priority>0.7</priority></url>
-<url><loc>https://www.bharathikannan.com/blog/minimizing-lodash-bundle-size</loc><lastmod>2022-08-09T05:50:33.029Z</lastmod><changefreq>daily</changefreq><priority>0.7</priority></url>
-<url><loc>https://www.bharathikannan.com/blog/simple-introduction-to-chakra</loc><lastmod>2022-08-09T05:50:33.029Z</lastmod><changefreq>daily</changefreq><priority>0.7</priority></url>
-<url><loc>https://www.bharathikannan.com/blog/react-hooks-dependencies-and-stale-closures</loc><lastmod>2022-08-09T05:50:33.029Z</lastmod><changefreq>daily</changefreq><priority>0.7</priority></url>
-<url><loc>https://www.bharathikannan.com/blog/react-useeffect-flow</loc><lastmod>2022-08-09T05:50:33.029Z</lastmod><changefreq>daily</changefreq><priority>0.7</priority></url>
-<url><loc>https://www.bharathikannan.com/blog/react-is-just-javascript</loc><lastmod>2022-08-09T05:50:33.029Z</lastmod><changefreq>daily</changefreq><priority>0.7</priority></url>
+<url><loc>https://www.bharathikannan.com</loc><lastmod>2024-05-26T14:28:31.209Z</lastmod><changefreq>daily</changefreq><priority>0.7</priority></url>
+<url><loc>https://www.bharathikannan.com/blog</loc><lastmod>2024-05-26T14:28:31.209Z</lastmod><changefreq>daily</changefreq><priority>0.7</priority></url>
+<url><loc>https://www.bharathikannan.com/quiz</loc><lastmod>2024-05-26T14:28:31.209Z</lastmod><changefreq>daily</changefreq><priority>0.7</priority></url>
+<url><loc>https://www.bharathikannan.com/blog/context-redux-composition</loc><lastmod>2024-05-26T14:28:31.209Z</lastmod><changefreq>daily</changefreq><priority>0.7</priority></url>
+<url><loc>https://www.bharathikannan.com/blog/what-is-this-javascript</loc><lastmod>2024-05-26T14:28:31.209Z</lastmod><changefreq>daily</changefreq><priority>0.7</priority></url>
+<url><loc>https://www.bharathikannan.com/blog/positioned-layout</loc><lastmod>2024-05-26T14:28:31.209Z</lastmod><changefreq>daily</changefreq><priority>0.7</priority></url>
+<url><loc>https://www.bharathikannan.com/blog/use-next-link-with-chakra-ui</loc><lastmod>2024-05-26T14:28:31.209Z</lastmod><changefreq>daily</changefreq><priority>0.7</priority></url>
+<url><loc>https://www.bharathikannan.com/blog/minimizing-lodash-bundle-size</loc><lastmod>2024-05-26T14:28:31.209Z</lastmod><changefreq>daily</changefreq><priority>0.7</priority></url>
+<url><loc>https://www.bharathikannan.com/blog/simple-introduction-to-chakra</loc><lastmod>2024-05-26T14:28:31.209Z</lastmod><changefreq>daily</changefreq><priority>0.7</priority></url>
+<url><loc>https://www.bharathikannan.com/blog/react-hooks-dependencies-and-stale-closures</loc><lastmod>2024-05-26T14:28:31.209Z</lastmod><changefreq>daily</changefreq><priority>0.7</priority></url>
+<url><loc>https://www.bharathikannan.com/blog/react-useeffect-flow</loc><lastmod>2024-05-26T14:28:31.209Z</lastmod><changefreq>daily</changefreq><priority>0.7</priority></url>
+<url><loc>https://www.bharathikannan.com/blog/react-is-just-javascript</loc><lastmod>2024-05-26T14:28:31.209Z</lastmod><changefreq>daily</changefreq><priority>0.7</priority></url>
 </urlset>
diff --git a/tests/homepage/chrome.spec.ts b/tests/homepage/chrome.spec.ts
@@ -15,14 +15,14 @@ test.describe('Chrome Desktop Only', () => {
 
         // Ensure the experience cards are not yet visible
         await expect(
-            page.getByRole('heading', { name: 'Senior Associate, Experience Technology' })
+            page.getByRole('heading', { name: 'Lead Experience Engineer' })
         ).not.toBeVisible();
 
         // Scroll down to kick in Experience Cards
         await page.mouse.wheel(0, 2000);
 
         const firstSetOfExperience = [
-            page.getByRole('heading', { name: 'Senior Associate, Experience Technology' }),
+            page.getByRole('heading', { name: 'Lead Experience Engineer' }),
             page.getByRole('heading', { name: 'Software Engineer' }),
             page.getByRole('heading', { name: 'Technical Lead IV' })
         ];