Notification Centre - add Empty Content screen

status-im · Jul 17, 2023 · 77a8469 · 77a8469
1 parent e99f6de
commit 77a8469
Show file tree

Hide file tree

Showing 3 changed files with 49 additions and 23 deletions.
diff --git a/src/status_im2/contexts/shell/activity_center/style.cljs b/src/status_im2/contexts/shell/activity_center/style.cljs
@@ -35,10 +35,10 @@
    :padding-vertical 12})
 
 (def empty-container
-  {:align-items      :center
-   :flex             1
-   :justify-content  :center
-   :padding-vertical 12})
+  {:align-items     :center
+   :flex            1
+   :justify-content :center
+   :padding-bottom  20})
 
 (def empty-title
   {:padding-bottom 2

diff --git a/src/status_im2/contexts/shell/activity_center/view.cljs b/src/status_im2/contexts/shell/activity_center/view.cljs
@@ -21,7 +21,8 @@
             [utils.i18n :as i18n]
             [utils.re-frame :as rf]
             [react-native.blur :as blur]
-            [react-native.navigation :as navigation]))
+            [react-native.navigation :as navigation]
+            [status-im2.common.resources :as resources]))
 
 (defn filter-selector-read-toggle
   []
@@ -53,26 +54,42 @@
                                            :override-theme :dark})])
                           (rf/dispatch [:hide-bottom-sheet]))}]]]))
 
+(defn empty-tab-description
+  [filter-type]
+  (case filter-type
+    types/no-type
+    (i18n/label :t/empty-notifications-all-tab)
+    types/admin
+    (i18n/label :t/empty-notifications-admin-tab)
+    types/mention
+    (i18n/label :t/empty-notifications-mentions-tab)
+    types/reply
+    (i18n/label :t/empty-notifications-replies-tab)
+    types/contact-request
+    (i18n/label :t/empty-notifications-contact-requests-tab)
+    types/contact-verification
+    (i18n/label :t/empty-notifications-identity-verification-tab)
+    types/tx
+    (i18n/label :t/empty-notifications-transactions-tab)
+    types/membership
+    (i18n/label :t/empty-notifications-membership-tab)
+    types/system
+    (i18n/label :t/empty-notifications-system-tab)
+    nil))
+
 (defn empty-tab
   []
-  (let [filter-status (rf/sub [:activity-center/filter-status])]
-    [rn/view
-     {:style               style/empty-container
-      :accessibility-label :empty-notifications}
-     [rn/view {:style style/empty-rectangle-placeholder}]
-     [quo/text
-      {:size   :paragraph-1
-       :style  style/empty-title
-       :weight :semi-bold}
-      (i18n/label (if (= :unread filter-status)
-                    :t/empty-notifications-title-unread
-                    :t/empty-notifications-title-read))]
-     [quo/text
-      {:size  :paragraph-2
-       :style style/empty-subtitle}
-      (i18n/label (if (= :unread filter-status)
-                    :t/empty-notifications-subtitle-unread
-                    :t/empty-notifications-subtitle-read))]]))
+  (let [filter-type   (rf/sub [:activity-center/filter-type])
+        description   (empty-tab-description filter-type)
+        filter-status (rf/sub [:activity-center/filter-status])]
+    [rn/view {:style style/empty-container}
+     [quo/empty-state
+      {:blur?       true
+       :image       (resources/get-image :no-notifications-dark)
+       :title       (i18n/label (if (= :unread filter-status)
+                                  :t/empty-notifications-title-unread
+                                  :t/empty-notifications-title-read))
+       :description description}]]))
 
 (defn tabs
   []

diff --git a/translations/en.json b/translations/en.json
@@ -2020,6 +2020,15 @@
     "bold": "Bold",
     "italic": "Italic",
     "strikethrough": "Strikethrough",
+    "empty-notifications-all-tab": "No unread notifications.",
+    "empty-notifications-admin-tab": "No unread admin notifications.",
+    "empty-notifications-mentions-tab": "No unread mention notifications.",
+    "empty-notifications-replies-tab": "No unread reply notifications to your messages.",
+    "empty-notifications-contact-requests-tab": "No contact requests notifications",
+    "empty-notifications-identity-verification-tab": "No identity verification requests",
+    "empty-notifications-transactions-tab": "No transaction notifications",
+    "empty-notifications-membership-tab": "No membership notifications",
+    "empty-notifications-system-tab": "No system notifications",
     "empty-notifications-title-unread": "You're up to date",
     "empty-notifications-subtitle-unread": "Unread notifications will be here",
     "empty-notifications-title-read": "No notifications",