From e55a9326d66e30631147f7903f066a411bffe08d Mon Sep 17 00:00:00 2001 From: Omar Basem Date: Mon, 3 Apr 2023 18:31:29 +0400 Subject: [PATCH] fix: image desktop (#15562) * fix: image desktop not opening --- .../lightbox/zoomable_image/constants.cljs | 2 + .../chat/lightbox/zoomable_image/view.cljs | 9 ++-- .../chat/messages/composer/controls/view.cljs | 6 +-- .../contexts/chat/photo_selector/style.cljs | 4 +- .../contexts/chat/photo_selector/view.cljs | 47 ++++++++++--------- 5 files changed, 36 insertions(+), 32 deletions(-) diff --git a/src/status_im2/contexts/chat/lightbox/zoomable_image/constants.cljs b/src/status_im2/contexts/chat/lightbox/zoomable_image/constants.cljs index 9401caa803..3eb432074a 100644 --- a/src/status_im2/contexts/chat/lightbox/zoomable_image/constants.cljs +++ b/src/status_im2/contexts/chat/lightbox/zoomable_image/constants.cljs @@ -13,3 +13,5 @@ (def ^:const velocity-factor 0.5) (def ^:const default-duration 300) + +(def ^:const default-dimension 1000) diff --git a/src/status_im2/contexts/chat/lightbox/zoomable_image/view.cljs b/src/status_im2/contexts/chat/lightbox/zoomable_image/view.cljs index 12c5d36f08..c8e3d56af1 100644 --- a/src/status_im2/contexts/chat/lightbox/zoomable_image/view.cljs +++ b/src/status_im2/contexts/chat/lightbox/zoomable_image/view.cljs @@ -216,10 +216,11 @@ curr-orientation (or (rf/sub [:lightbox/orientation]) orientation/portrait) portrait? (= curr-orientation orientation/portrait) - dimensions (utils/get-dimensions image-width - image-height - curr-orientation - args) + dimensions (utils/get-dimensions + (or image-width c/default-dimension) + (or image-height c/default-duration) + curr-orientation + args) animations {:scale (anim/use-val c/min-scale) :saved-scale (anim/use-val c/min-scale) :pan-x-start (anim/use-val c/init-offset) diff --git a/src/status_im2/contexts/chat/messages/composer/controls/view.cljs b/src/status_im2/contexts/chat/messages/composer/controls/view.cljs index fa160f9d0b..97a68353ef 100644 --- a/src/status_im2/contexts/chat/messages/composer/controls/view.cljs +++ b/src/status_im2/contexts/chat/messages/composer/controls/view.cljs @@ -40,12 +40,12 @@ :size 32} :i/reaction]]) (defn image-button - [] + [bottom-inset] [quo/button {:on-press (fn [] (permissions/request-permissions {:permissions [:read-external-storage :write-external-storage] - :on-allowed #(rf/dispatch [:open-modal :photo-selector]) + :on-allowed #(rf/dispatch [:open-modal :photo-selector {:bottom-inset bottom-inset}]) :on-denied (fn [] (background-timer/set-timeout #(utils-old/show-popup (i18n/label :t/error) @@ -118,7 +118,7 @@ (when (and (not @input/recording-audio?) (nil? (get @input/reviewing-audio-filepath chat-id))) [:<> - [image-button] + [image-button bottom-inset] [rn/view {:width 12}] [reactions-button] [rn/view {:flex 1}] diff --git a/src/status_im2/contexts/chat/photo_selector/style.cljs b/src/status_im2/contexts/chat/photo_selector/style.cljs index 3e35b07885..3c91d93d4e 100644 --- a/src/status_im2/contexts/chat/photo_selector/style.cljs +++ b/src/status_im2/contexts/chat/photo_selector/style.cljs @@ -3,10 +3,10 @@ [react-native.platform :as platform])) (defn gradient-container - [insets] + [bottom-inset] {:left 0 :right 0 - :height (+ (:bottom insets) (if platform/ios? 65 85)) + :height (+ bottom-inset (if platform/ios? 65 85)) :position :absolute :bottom 0}) diff --git a/src/status_im2/contexts/chat/photo_selector/view.cljs b/src/status_im2/contexts/chat/photo_selector/view.cljs index eab8c855fe..15ad8a8962 100644 --- a/src/status_im2/contexts/chat/photo_selector/view.cljs +++ b/src/status_im2/contexts/chat/photo_selector/view.cljs @@ -13,8 +13,7 @@ [status-im2.contexts.chat.photo-selector.style :as style] [status-im.utils.core :as utils] [quo.react] - [utils.re-frame :as rf] - [react-native.safe-area :as safe-area])) + [utils.re-frame :as rf])) (defn on-press-confirm-selection [selected] @@ -25,13 +24,13 @@ (rf/dispatch [:navigate-back])) (defn bottom-gradient - [selected-images insets selected] + [selected-images bottom-inset selected] (when (or (seq @selected) (seq selected-images)) [linear-gradient/linear-gradient {:colors [:black :transparent] :start {:x 0 :y 1} :end {:x 0 :y 0} - :style (style/gradient-container insets)} + :style (style/gradient-container bottom-inset)} [quo/button {:style {:align-self :stretch :margin-horizontal 20 @@ -109,30 +108,32 @@ (defn photo-selector [{:keys [scroll-enabled on-scroll]}] - [safe-area/consumer - (fn [insets] - [:f> - (let [temporary-selected (reagent/atom [])] ; used when switching albums - (fn [] - (let [selected (reagent/atom []) ; currently selected - selected-images (rf/sub [:chats/sending-image]) ; already selected and dispatched - selected-album (or (rf/sub [:camera-roll/selected-album]) (i18n/label :t/recent))] - (rn/use-effect - (fn [] - (rf/dispatch [:chat.ui/camera-roll-get-photos 20 nil selected-album]) - (if (seq selected-images) - (reset! selected (vec (vals selected-images))) - (reset! selected @temporary-selected))) - [selected-album]) + [:f> + (let [{:keys [bottom-inset]} (rf/sub [:screen-params]) ; TODO: + ; https://github.com/status-im/status-mobile/issues/15535 + temporary-selected (reagent/atom [])] ; used when switching albums + (fn [] + (let [selected (reagent/atom []) ; currently selected + selected-images (rf/sub [:chats/sending-image]) ; already selected and dispatched + selected-album (or (rf/sub [:camera-roll/selected-album]) (i18n/label :t/recent))] + (rn/use-effect + (fn [] + (rf/dispatch [:chat.ui/camera-roll-get-photos 20 nil selected-album]) + (if (seq selected-images) + (reset! selected (vec (vals selected-images))) + (reset! selected @temporary-selected))) + [selected-album]) + [:f> + (fn [] (let [window-width (:width (rn/get-window)) camera-roll-photos (rf/sub [:camera-roll/photos]) end-cursor (rf/sub [:camera-roll/end-cursor]) loading? (rf/sub [:camera-roll/loading-more]) has-next-page? (rf/sub [:camera-roll/has-next-page])] - [rn/view {:flex 1} + [:<> [rn/view {:style style/buttons-container} - [album-title true selected-album selected temporary-selected insets] + [album-title true selected-album selected temporary-selected] [clear-button selected]] [gesture/flat-list {:key-fn identity @@ -141,11 +142,11 @@ :data camera-roll-photos :num-columns 3 :content-container-style {:width "100%" - :padding-bottom (+ (:bottom insets) 100) + :padding-bottom (+ (:bottom bottom-inset) 100) :padding-top 64} :on-scroll on-scroll :scroll-enabled scroll-enabled :on-end-reached #(rf/dispatch [:camera-roll/on-end-reached end-cursor selected-album loading? has-next-page?])}] - [bottom-gradient selected-images insets selected]]))))])]) + [bottom-gradient selected-images bottom-inset selected]]))])))])