From 0b8313315500910aaefd7c0f0d36092a9378189d Mon Sep 17 00:00:00 2001
From: Peer Richelsen <peeroke@gmail.com>
Date: Thu, 10 Mar 2022 19:21:27 +0000
Subject: [PATCH] added emptyscreen for away mode profile (#2093)

* added emptyscreen for away mode profile

* eplaced shadow with border

* added snooze emoji

* Remove modified yarn.lock file from PR

* space between smiley and text

Co-authored-by: Peer Richelsen <peer@Peers-MacBook-Pro-2.local>
Co-authored-by: Peer Richelsen <peer@hey.com>
---
 apps/web/pages/[user].tsx | 18 ++++++++++++++----
 1 file changed, 14 insertions(+), 4 deletions(-)

diff --git a/apps/web/pages/[user].tsx b/apps/web/pages/[user].tsx
index 7a288541..e5a8303f 100644
--- a/apps/web/pages/[user].tsx
+++ b/apps/web/pages/[user].tsx
@@ -58,7 +58,16 @@ export default function User(props: inferSSRProps<typeof getServerSideProps>) {
             <p className="text-neutral-500 dark:text-white">{user.bio}</p>
           </div>
           <div className="space-y-6" data-testid="event-types">
-            {!user.away &&
+            {user.away ? (
+              <div className="overflow-hidden rounded-sm border dark:border-gray-900">
+                <div className="p-8 text-center text-gray-400 dark:text-white">
+                  <h2 className="font-cal mb-2 text-3xl font-semibold text-gray-600 dark:text-white">
+                    😴{" " + t("user_away")}
+                  </h2>
+                  <p className="mx-auto max-w-md">{t("user_away_description")}</p>
+                </div>
+              </div>
+            ) : (
               eventTypes.map((type) => (
                 <div
                   key={type.id}
@@ -101,12 +110,13 @@ export default function User(props: inferSSRProps<typeof getServerSideProps>) {
                     />
                   )}
                 </div>
-              ))}
+              ))
+            )}
           </div>
           {eventTypes.length === 0 && (
-            <div className="overflow-hidden rounded-sm shadow">
+            <div className="overflow-hidden rounded-sm border dark:border-gray-900">
               <div className="p-8 text-center text-gray-400 dark:text-white">
-                <h2 className="font-cal text-3xl font-semibold text-gray-600 dark:text-white">
+                <h2 className="font-cal mb-2 text-3xl font-semibold text-gray-600 dark:text-white">
                   {t("uh_oh")}
                 </h2>
                 <p className="mx-auto max-w-md">{t("no_event_types_have_been_setup")}</p>