[7947] Feature: Blank out app preview screen when switching apps on m…

…obile

src/status_im/ui/components/styles.cljs

@@ -20,3 +20,16 @@
 (def icon-default
   {:width  24
    :height 24})
+
+(def inactive-overlay
+  {:position         :absolute
+   :left             0
+   :top              0
+   :right            0
+   :bottom           0
+   :flex             1
+   :align-items      :center
+   :justify-content  :center
+   :elevation        8
+   :z-index          2019
+   :background-color colors/white})

src/status_im/ui/screens/views.cljs

@@ -5,6 +5,8 @@
             [status-im.utils.universal-links.core :as utils.universal-links]
             [status-im.ui.components.react :as react]
             [status-im.ui.components.bottom-sheet.core :as bottom-sheet]
+            [status-im.ui.components.common.common :as components.common]
+            [status-im.ui.components.styles :as components.styles]
             [status-im.utils.navigation :as navigation]
             [reagent.core :as reagent]
             [status-im.utils.random :as rand]
@@ -35,6 +37,19 @@
 
       [bottom-sheet/bottom-sheet opts])))
 
+(views/defview inactive-overlay []
+  (letsubs [app-state [:get :app-state]]
+    {:component-will-mount
+     (fn []
+       (react/dismiss-keyboard!))
+     :component-will-update
+     (fn []
+       (react/dismiss-keyboard!))}
+    (when (= app-state (or "inactive" "background"))
+      [react/view {:style components.styles/inactive-overlay}
+       [components.common/logo {:size      111
+                                :icon-size 46}]])))
+
 (defn main []
   (let [view-id        (re-frame/subscribe [:get :view-id])
         main-component (atom nil)]
@@ -84,5 +99,6 @@
                                  (navigation/navigate-to @view-id)))
              ;; see https://reactnavigation.org/docs/en/state-persistence.html#development-mode
              :persistenceKey (when js/goog.DEBUG rand-label)}]
-           [bottom-sheet]]))})))
+           [bottom-sheet]
+           [inactive-overlay]]))})))