diff --git a/src/react_native/navigation.cljs b/src/react_native/navigation.cljs index a41dfd05c908..a5c20687dacc 100644 --- a/src/react_native/navigation.cljs +++ b/src/react_native/navigation.cljs @@ -41,6 +41,10 @@ [comp] (.catch (.dismissOverlay Navigation comp) #())) +(defn dissmiss-all-overlays + [] + (.catch (.dismissAllOverlays Navigation) #())) + (defn reg-app-launched-listener [handler] (.registerAppLaunchedListener ^js (.events ^js Navigation) handler)) diff --git a/src/status_im/events.cljs b/src/status_im/events.cljs index cb6c7ffc9688..a106a35b6f36 100644 --- a/src/status_im/events.cljs +++ b/src/status_im/events.cljs @@ -60,6 +60,9 @@ status-im2.contexts.onboarding.events status-im.chat.models.gaps [status-im2.navigation.events :as navigation] + [status-im2.common.theme.core :as theme] + [react-native.core :as rn] + [react-native.platform :as platform] status-im2.contexts.chat.home.events)) (re-frame/reg-fx @@ -90,6 +93,10 @@ (re-frame/reg-fx ::app-state-change-fx (fn [state] + (when (and platform/ios? (= state "active")) + ;; Change the app theme if the ios device theme was updated when the app was in the background + ;; https://github.com/status-im/status-mobile/issues/15708 + (theme/change-device-theme (rn/get-color-scheme))) (status/app-state-change state))) (re-frame/reg-fx diff --git a/src/status_im/multiaccounts/core.cljs b/src/status_im/multiaccounts/core.cljs index 892976806474..9cd362ee51ca 100644 --- a/src/status_im/multiaccounts/core.cljs +++ b/src/status_im/multiaccounts/core.cljs @@ -12,6 +12,7 @@ [status-im.utils.identicon :as identicon] [status-im2.setup.hot-reload :as hot-reload] [status-im2.common.theme.core :as theme] + [react-native.navigation :as navigation] [taoensso.timbre :as log] [status-im2.contexts.shell.animation :as shell.animation] [status-im.contact.db :as contact.db])) @@ -150,6 +151,7 @@ (re-frame/dispatch [:change-shell-status-bar-style (if (shell.animation/home-stack-open?) status-bar-theme :light)]) (when reload-ui? + (navigation/dissmiss-all-overlays) (hot-reload/reload) (when-not (= view-id :shell-stack) (re-frame/dispatch [:change-shell-nav-bar-color nav-bar-color])))))) diff --git a/src/status_im2/common/theme/core.cljs b/src/status_im2/common/theme/core.cljs index b53df8ac3d15..9798ffeaaaed 100644 --- a/src/status_im2/common/theme/core.cljs +++ b/src/status_im2/common/theme/core.cljs @@ -1,18 +1,29 @@ (ns status-im2.common.theme.core (:require [quo.theme :as quo] [quo2.theme :as quo2] - [react-native.core :as rn])) + [utils.re-frame :as rf] + [oops.core :refer [oget]] + [react-native.core :as rn] + [react-native.platform :as platform])) (def device-theme (atom (rn/get-color-scheme))) -;; Note - don't use value returned by change listener -;; https://github.com/facebook/react-native/issues/28525 +(defn change-device-theme + [theme] + (when-not (= theme @device-theme) + (reset! device-theme theme) + #(rf/dispatch [:system-theme-mode-changed (keyword theme)]))) + +;; Appearance change listener fires false events in ios when the app is in the background +;; So, we are ignoring those events and when the device returns form the background, +;; we are manually checking the device theme, in ::app-state-change-fx +;; https://github.com/status-im/status-mobile/issues/15708 (defn add-device-theme-change-listener - [callback] - (rn/appearance-add-change-listener #(let [theme (rn/get-color-scheme)] - (when-not (= theme @device-theme) - (reset! device-theme theme) - (callback (keyword theme)))))) + [] + (rn/appearance-add-change-listener + #(when (or platform/android? + (not= (oget rn/app-state "currentState") "background")) + (change-device-theme (oget % "colorScheme"))))) (defn device-theme-dark? [] diff --git a/src/status_im2/events.cljs b/src/status_im2/events.cljs index 4e9e3c02d4f9..565b092b9f33 100644 --- a/src/status_im2/events.cljs +++ b/src/status_im2/events.cljs @@ -30,8 +30,7 @@ (re-frame/reg-fx :setup/init-theme (fn [] - (theme/add-device-theme-change-listener - #(re-frame/dispatch [:system-theme-mode-changed %])))) + (theme/add-device-theme-change-listener))) (rf/defn initialize-views {:events [:setup/initialize-view]}