From b126f829e46dd4b96b40d34b6f64a9633672b6ba Mon Sep 17 00:00:00 2001
From: Mikael Brevik <mikaelbre@gmail.com>
Date: Mon, 6 May 2024 11:42:00 +0200
Subject: [PATCH] fix: fix issue with crash when missing image (hide employee)

---
 src/employees/index.tsx      |  4 ++++
 src/employees/types.ts       |  2 +-
 src/index/index.tsx          | 22 ++++++++++++----------
 src/jobs/listing/listing.tsx |  9 +++++----
 4 files changed, 22 insertions(+), 15 deletions(-)

diff --git a/src/employees/index.tsx b/src/employees/index.tsx
index 1d0ef189c..c3c05fcb2 100644
--- a/src/employees/index.tsx
+++ b/src/employees/index.tsx
@@ -137,6 +137,10 @@ const blurDataUrl =
 export const EmployeeTile = ({
   employee: { name, telephone, email, imageUrl, officeName },
 }: PropsWithChildren<{ employee: EmployeeItem }>) => {
+  if (!imageUrl) {
+    return null;
+  }
+
   return (
     <div
       className={style.employee}
diff --git a/src/employees/types.ts b/src/employees/types.ts
index 72d426c52..dc7833d81 100644
--- a/src/employees/types.ts
+++ b/src/employees/types.ts
@@ -2,6 +2,6 @@ export type EmployeeItem = {
   name: string;
   email: string;
   telephone: string | null;
-  imageUrl: string;
+  imageUrl: string | null;
   officeName: string;
 };
diff --git a/src/index/index.tsx b/src/index/index.tsx
index 7f5d5e1d1..b1792a21b 100644
--- a/src/index/index.tsx
+++ b/src/index/index.tsx
@@ -297,16 +297,18 @@ const Home = ({ randomEmployee, randomCases, feeds }: HomeProps) => {
       <section className={style.employees}>
         {randomEmployee ? (
           <div className={style.employees__random}>
-            <div className={style.employees__random__image}>
-              <Image
-                width={300}
-                height={300}
-                alt={`Bilde av ${randomEmployee.name}`}
-                src={randomEmployee.imageUrl}
-                loading="lazy"
-                decoding="async"
-              />
-            </div>
+            {randomEmployee.imageUrl && (
+              <div className={style.employees__random__image}>
+                <Image
+                  width={300}
+                  height={300}
+                  alt={`Bilde av ${randomEmployee.name}`}
+                  src={randomEmployee.imageUrl}
+                  loading="lazy"
+                  decoding="async"
+                />
+              </div>
+            )}
 
             <p>Dette er {randomEmployee.name}. En av oss som jobber her.</p>
 
diff --git a/src/jobs/listing/listing.tsx b/src/jobs/listing/listing.tsx
index 8f92099d3..52698ff8e 100644
--- a/src/jobs/listing/listing.tsx
+++ b/src/jobs/listing/listing.tsx
@@ -128,6 +128,10 @@ const Listing: NextPage<InferGetStaticPropsType<typeof getStaticProps>> =
 export const ContactTile = ({
   contact: { name, email, telephone, imageUrl },
 }: PropsWithChildren<{ contact: EmployeeItem }>) => {
+  if (!imageUrl) {
+    return null;
+  }
+
   return (
     <div className={style.contact}>
       <div className={style.contact__img}>
@@ -148,10 +152,7 @@ export const ContactTile = ({
           📬 {email}
         </a>
         {telephone && (
-          <a
-            href={`tel:${telephone}`}
-            className={style.contact__type}
-          >
+          <a href={`tel:${telephone}`} className={style.contact__type}>
             📞 {formatTelephone(telephone)}
           </a>
         )}