[2.4.3] Add Docker Support, Make Address Optional

2020-12-24 11:08:59 +05:30 · 2020-12-24 11:08:59 +05:30 · 85a489cefa
parent c1cc9d0a69
commit 85a489cefa
15 changed files with 92 additions and 51 deletions
--- a/.dockerignore
+++ b/.dockerignore
@ -0,0 +1,4 @@
+.cache/
+node_modules/
+functions/
+public/
--- a/12
+++ b/12
@ -0,0 +1,12 @@
+FROM node as builder
+
+WORKDIR /app
+COPY ./ /app/
+
+RUN npm install
+RUN npm run build
+
+FROM nginx:alpine
+RUN rm -rf /usr/share/nginx/html
+COPY --from=builder /app/public/ /usr/share/nginx/html
+COPY server.conf /etc/nginx/conf.d/default.conf
--- a/gatsby-config.js
+++ b/gatsby-config.js
@ -6,7 +6,7 @@ module.exports = {
    title: 'Reactive Resume',
    siteUrl: 'https://rxresu.me',
    description: 'A free and open source resume builder.',
-    version: '2.4.2',
+    version: '2.4.3',
  },
  plugins: [
    'gatsby-plugin-react-helmet',
--- a/server.conf
+++ b/server.conf
@ -0,0 +1,19 @@
+server {
+  listen 80;
+  root /usr/share/nginx/html;
+
+  index index.html;
+  autoindex off;
+  charset urtf-8;
+
+  error_page 404 /404.html;
+
+  location ~* \.(html)$ {
+    add_header Cache-Control "no-store";
+    expires off;
+  }
+
+  rewrite ^([^.\?]*[^/])$ $1/ permanent;
+
+  try_files $uri $uri/ $uri/index.html =404;
+}
--- a/src/templates/Castform.js
+++ b/src/templates/Castform.js
@ -12,7 +12,6 @@ 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 BirthDateA from './blocks/BirthDate/BirthDateA';

 const Blocks = {
  objective: ObjectiveA,
@ -77,10 +76,7 @@ const Castform = ({ data }) => {

              <div>
                <HeadingD>{data.profile.heading}</HeadingD>
-                <div className="grid gap-4">
-                  <BirthDateA />
-                  <ContactC />
-                </div>
+                <ContactC />
              </div>

              {layout[0] &&
--- a/src/templates/Celebi.js
+++ b/src/templates/Celebi.js
@ -14,7 +14,6 @@ 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 BirthDateA from './blocks/BirthDate/BirthDateA';

 const Blocks = {
  objective: ObjectiveA,
@ -102,7 +101,6 @@ const Celebi = ({ data }) => {
              <div>
                <HeadingE>{t('builder.sections.profile')}</HeadingE>
                <div className="relative w-full grid gap-4 text-xs">
-                  <BirthDateA />
                  <ContactC />
                </div>
              </div>
--- a/src/templates/Gengar.js
+++ b/src/templates/Gengar.js
@ -1,6 +1,7 @@
 import React from 'react';
+import { useTranslation } from 'react-i18next';
 import PageContext from '../contexts/PageContext';
-import { hexToRgb } from '../utils';
+import { hasAddress, hexToRgb } from '../utils';
 import AwardsA from './blocks/Awards/AwardsA';
 import CertificationsA from './blocks/Certifications/CertificationsA';
 import ContactB from './blocks/Contact/ContactB';
@ -13,7 +14,6 @@ import ProjectsA from './blocks/Projects/ProjectsA';
 import ReferencesB from './blocks/References/ReferencesB';
 import SkillsA from './blocks/Skills/SkillsA';
 import WorkA from './blocks/Work/WorkA';
-import BirthDateC from './blocks/BirthDate/BirthDateC';

 const Blocks = {
  objective: ObjectiveA,
@ -29,6 +29,7 @@ const Blocks = {
 };

 const Gengar = ({ data }) => {
+  const { t } = useTranslation();
  const layout = data.metadata.layout.gengar;
  const { r, g, b } = hexToRgb(data.metadata.colors.primary) || {};

@ -80,29 +81,28 @@ const Gengar = ({ data }) => {
              <Profile />
            </div>

-            <div className="flex flex-col mt-4 text-xs">
-              <h6 className="font-bold text-xs uppercase tracking-wide mb-1">
-                Address
-              </h6>
-              <span>{data.profile.address.line1}</span>
-              <span>{data.profile.address.line2}</span>
-              <span>
-                {data.profile.address.city} {data.profile.address.pincode}
-              </span>
-            </div>
+            {hasAddress(data.profile.address) && (
+              <div className="flex flex-col mt-4 text-xs">
+                <h6 className="font-bold text-xs uppercase tracking-wide mb-1">
+                  {t('shared.forms.address')}
+                </h6>
+                <span>{data.profile.address.line1}</span>
+                <span>{data.profile.address.line2}</span>
+                <span>
+                  {data.profile.address.city} {data.profile.address.pincode}
+                </span>
+              </div>
+            )}

            <hr
              className="w-1/4 my-5 opacity-25"
              style={{ borderColor: data.metadata.colors.background }}
            />

-            <div className="grid gap-4">
-              <h6 className="font-bold text-xs uppercase tracking-wide mb-1">
-                Contacts
-              </h6>
-              <ContactB />
-              <BirthDateC />
-            </div>
+            <h6 className="font-bold text-xs uppercase tracking-wide mb-2">
+              Contact
+            </h6>
+            <ContactB />
          </div>

          <div
--- a/src/templates/Glalie.js
+++ b/src/templates/Glalie.js
@ -13,7 +13,6 @@ 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 BirthDateA from './blocks/BirthDate/BirthDateA';

 const Blocks = {
  objective: ObjectiveA,
@ -71,11 +70,7 @@ const Glalie = ({ data }) => {
          >
            <div className="grid gap-6 text-center p-8">
              <Profile />
-
-              <div className="grid">
-                <BirthDateA />
-                <ContactD />
-              </div>
+              <ContactD />

              {layout[0] &&
                layout[0].map((x) => {
--- a/src/templates/Onyx.js
+++ b/src/templates/Onyx.js
@ -1,4 +1,5 @@
 import React, { memo } 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,7 +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 BirthDateB from './blocks/BirthDate/BirthDateB';
+import { hasAddress } from '../utils';

 const Blocks = {
  objective: ObjectiveA,
@ -28,6 +29,7 @@ const Blocks = {
 };

 const Onyx = ({ data }) => {
+  const { t } = useTranslation();
  const layout = data.metadata.layout.onyx;

  return (
@ -61,20 +63,22 @@ const Onyx = ({ data }) => {
              </h1>
              <h6 className="font-medium text-sm">{data.profile.subtitle}</h6>

-              <div className="flex flex-col mt-4 text-xs">
-                <span>{data.profile.address.line1}</span>
-                <span>{data.profile.address.line2}</span>
-                <span>
-                  {data.profile.address.city} {data.profile.address.pincode}
-                </span>
-              </div>
+              {hasAddress(data.profile.address) && (
+                <div className="flex flex-col mt-4 text-xs">
+                  <h6 className="font-bold text-xs uppercase tracking-wide mb-1">
+                    {t('shared.forms.address')}
+                  </h6>
+                  <span>{data.profile.address.line1}</span>
+                  <span>{data.profile.address.line2}</span>
+                  <span>
+                    {data.profile.address.city} {data.profile.address.pincode}
+                  </span>
+                </div>
+              )}
            </div>
          </div>

-          <div className="grid gap-4">
-            <BirthDateB />
-            <Contact />
-          </div>
+          <Contact />
        </div>

        <hr
--- a/src/templates/Pikachu.js
+++ b/src/templates/Pikachu.js
@ -12,7 +12,6 @@ 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 BirthDateB from './blocks/BirthDate/BirthDateB';

 const Blocks = {
  work: WorkA,
@ -90,7 +89,6 @@ const Pikachu = ({ data }) => {

          <div className="col-span-4">
            <div className="grid gap-4">
-              <BirthDateB />
              <ContactA />

              {layout[0] &&
--- a/src/templates/blocks/Contact/ContactA.js
+++ b/src/templates/blocks/Contact/ContactA.js
@ -4,6 +4,7 @@ import { useTranslation } from 'react-i18next';
 import { FaCaretRight } from 'react-icons/fa';
 import PageContext from '../../../contexts/PageContext';
 import { safetyCheck } from '../../../utils';
+import BirthDateB from '../BirthDate/BirthDateB';
 import Icons from '../Icons';

 const ContactItem = ({ value, icon, link }) => {
@ -53,6 +54,8 @@ const ContactA = () => {
        link={`mailto:${data.profile.email}`}
      />

+      <BirthDateB />
+
      {safetyCheck(data.social) &&
        data.social.items.map((x) => (
          <ContactItem
--- a/src/templates/blocks/Contact/ContactB.js
+++ b/src/templates/blocks/Contact/ContactB.js
@ -4,6 +4,7 @@ import { useTranslation } from 'react-i18next';
 import { FaCaretRight } from 'react-icons/fa';
 import PageContext from '../../../contexts/PageContext';
 import { safetyCheck } from '../../../utils';
+import BirthDateC from '../BirthDate/BirthDateC';
 import Icons from '../Icons';

 const ContactItem = ({ value, icon, link }) => {
@ -53,6 +54,8 @@ const ContactB = () => {
        link={`mailto:${data.profile.email}`}
      />

+      <BirthDateC />
+
      {safetyCheck(data.social) &&
        data.social.items.map((x) => (
          <ContactItem
--- a/src/templates/blocks/Contact/ContactC.js
+++ b/src/templates/blocks/Contact/ContactC.js
@ -1,7 +1,8 @@
 import React, { memo, useContext } from 'react';
 import { useTranslation } from 'react-i18next';
 import PageContext from '../../../contexts/PageContext';
-import { safetyCheck } from '../../../utils';
+import { hasAddress, safetyCheck } from '../../../utils';
+import BirthDateA from '../BirthDate/BirthDateA';

 const ContactItem = ({ value, label, link }) =>
  value ? (
@ -23,7 +24,7 @@ const ContactC = () => {

  return (
    <div className="text-xs grid gap-2">
-      {data.profile.address.line1 && (
+      {hasAddress(data.profile.address) && (
        <div>
          <h6 className="capitalize font-semibold">
            {t('shared.forms.address')}
@ -54,6 +55,8 @@ const ContactC = () => {
        link={`mailto:${data.profile.email}`}
      />

+      <BirthDateA />
+
      {safetyCheck(data.social) &&
        data.social.items.map((x) => (
          <ContactItem
--- a/src/templates/blocks/Contact/ContactD.js
+++ b/src/templates/blocks/Contact/ContactD.js
@ -2,7 +2,8 @@ import React, { memo, useContext } from 'react';
 import { useTranslation } from 'react-i18next';
 import { MdFlare } from 'react-icons/md';
 import PageContext from '../../../contexts/PageContext';
-import { safetyCheck } from '../../../utils';
+import { hasAddress, safetyCheck } from '../../../utils';
+import BirthDateA from '../BirthDate/BirthDateA';

 const ContactItem = ({ value, label, link }) =>
  value ? (
@ -41,7 +42,7 @@ const ContactD = () => {
        <MdFlare size="20px" />
      </div>

-      {data.profile.address.line1 && (
+      {hasAddress(data.profile.address) && (
        <div>
          <h6 className="capitalize font-semibold">
            {t('shared.forms.address')}
@ -72,6 +73,8 @@ const ContactD = () => {
        link={`mailto:${data.profile.email}`}
      />

+      <BirthDateA />
+
      {safetyCheck(data.social) &&
        data.social.items.map((x) => (
          <ContactItem
--- a/src/utils/index.js
+++ b/src/utils/index.js
@ -48,6 +48,9 @@ export const getUnsplashPhoto = async () => {
  return response.url;
 };

+export const hasAddress = (address) =>
+  !!address.line1 || !!address.line2 || !!address.city || !!address.pincode;
+
 export const hexToRgb = (hex) => {
  const shorthandRegex = /^#?([a-f\d])([a-f\d])([a-f\d])$/i;
  hex = hex.replace(shorthandRegex, (m, r, g, b) => r + r + g + g + b + b);