status-im
/
status-react
mirror of https://github.com/status-im/status-react.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

Move photo selector to status-im2 (#14661) 

* Move photo selector to status-im2
This commit is contained in:
Omar Basem 2023-01-02 08:04:03 +04:00 committed by GitHub
parent 0a0b70c633
commit 8d08de3d4b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 58 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/status_im/ui/screens/screens.cljs
View File

@ -108,7 +108,6 @@
[status-im.ui.screens.wallet.swap.views :as wallet.swap]
[status-im.ui.screens.wallet.transactions.views :as wallet-transactions]
[status-im2.contexts.chat.group-details.view :as group-details]
[status-im.ui2.screens.chat.photo-selector.view :as photo-selector]
[status-im.ui2.screens.chat.components.new-chat.view :as new-chat-aio]))
(defn right-button-options
@ -207,10 +206,6 @@
:options {:topBar {:visible false}}
:component pin-messages/pinned-messages}
{:name :photo-selector
:options {:topBar {:visible false}}
:component photo-selector/photo-selector}
{:name :group-chat-profile
;;TODO animated-header
:options {:topBar {:visible false}}

2
src/status_im/ui2/screens/chat/composer/view.cljs
View File

@ -15,7 +15,7 @@
[status-im.ui2.screens.chat.composer.mentions :as mentions]
[status-im.ui2.screens.chat.composer.reply :as reply]
[status-im.ui2.screens.chat.composer.style :as style]
[status-im.ui2.screens.chat.photo-selector.view :as photo-selector]
[status-im2.contexts.chat.photo-selector.view :as photo-selector]
[utils.re-frame :as rf]
[status-im.utils.utils :as utils]
[status-im2.contexts.chat.messages.list.view :refer [scroll-to-bottom]]

8
src/status_im/ui2/screens/chat/photo_selector/style.cljs → src/status_im2/contexts/chat/photo_selector/style.cljs
View File

@ -1,4 +1,4 @@
(ns status-im.ui2.screens.chat.photo-selector.style
(ns status-im2.contexts.chat.photo-selector.style
(:require [quo2.foundations.colors :as colors]
[react-native.platform :as platform]))
@ -37,6 +37,11 @@
:margin-left 20
:margin-bottom 24})
(def title-container
{:flex-direction :row
:position :absolute
:align-self :center})
(defn chevron-container
[]
{:background-color (colors/theme-colors colors/neutral-10 colors/neutral-80)
@ -68,3 +73,4 @@
:border-radius 8
:top 8
:right 8})

74
src/status_im/ui2/screens/chat/photo_selector/view.cljs → src/status_im2/contexts/chat/photo_selector/view.cljs
View File

@ -1,69 +1,82 @@
(ns status-im.ui2.screens.chat.photo-selector.view
(ns status-im2.contexts.chat.photo-selector.view
(:require [i18n.i18n :as i18n]
[quo.components.safe-area :as safe-area]
[quo2.components.notifications.info-count :as info-count]
[quo2.core :as quo2]
[quo2.core :as quo]
[quo2.foundations.colors :as colors]
[react-native.core :as rn]
[react-native.linear-gradient :as linear-gradient]
[reagent.core :as reagent]
[status-im.ui2.screens.chat.photo-selector.style :as style]
[status-im2.contexts.chat.photo-selector.style :as style]
[status-im.utils.core :as utils]
[quo.react]
[utils.re-frame :as rf]))
(def selected (reagent/atom []))
(defn on-press-confirm-selection
[chat-id]
(rf/dispatch [:chat.ui/clear-sending-images chat-id])
(doseq [item @selected]
(rf/dispatch [:chat.ui/camera-roll-pick item]))
(reset! selected [])
(rf/dispatch [:bottom-sheet/hide]))
(defn bottom-gradient
[chat-id selected-images]
[:f>
(fn []
(let [safe-area (safe-area/use-safe-area)]
(when (or (pos? (count @selected)) selected-images)
(when (or (seq @selected) selected-images)
[linear-gradient/linear-gradient
{:colors [:black :transparent]
:start {:x 0 :y 1}
:end {:x 0 :y 0}
:style (style/gradient-container safe-area)}
[quo2/button
{:style {:align-self :stretch
:margin-horizontal 20}
:on-press #(do
(rf/dispatch [:chat.ui/clear-sending-images chat-id])
(doseq [item @selected]
(rf/dispatch [:chat.ui/camera-roll-pick item]))
(reset! selected [])
(rf/dispatch [:bottom-sheet/hide]))}
[quo/button
{:style {:align-self :stretch
:margin-horizontal 20}
:on-press #(on-press-confirm-selection chat-id)
:accessibility-label :confirm-selection}
(i18n/label :t/confirm-selection)]])))])
(defn clear-button
[]
(when (pos? (count @selected))
(when (seq @selected)
[rn/touchable-opacity
{:on-press #(reset! selected [])
:style (style/clear-container)}
[quo2/text {:weight :medium} (i18n/label :t/clear)]]))
{:on-press #(reset! selected [])
:style (style/clear-container)
:accessibility-label :clear}
[quo/text {:weight :medium} (i18n/label :t/clear)]]))
(defn remove-selected
[coll item]
(vec (remove #(= % item) coll)))
(defn image
[item index _ {:keys [window-width]}]
[rn/touchable-opacity
{:active-opacity 1
:on-press (fn []
(if (some #{item} @selected)
(reset! selected (vec (remove #(= % item) @selected)))
(swap! selected conj item)))}
{:active-opacity 1
:on-press (fn []
(if (some #{item} @selected)
(swap! selected remove-selected item)
(swap! selected conj item)))
:accessibility-label (str "image-" index)}
[rn/image
{:source {:uri item}
:style (style/image window-width index)}]
(when (some #{item} @selected)
[rn/view {:style (style/overlay window-width)}])
(when (some #{item} @selected)
[info-count/info-count {:style style/image-count}
[info-count/info-count
{:style style/image-count
:accessibility-label (str "count-" index)}
(inc (utils/first-index #(= item %) @selected))])])
(defn photo-selector
[chat-id]
(rf/dispatch [:chat.ui/camera-roll-get-photos 20])
(let [selected-images (keys (get-in (rf/sub [:chat/inputs]) [chat-id :metadata :sending-image]))]
(let [selected-images (keys (rf/sub [:chats/sending-image]))]
(when selected-images
(reset! selected (vec selected-images)))
[:f>
@ -78,17 +91,15 @@
[rn/touchable-opacity
{:on-press #(js/alert "Camera: not implemented")
:style (style/camera-button-container)}
[quo2/icon :i/camera {:color (colors/theme-colors colors/neutral-100 colors/white)}]]
[quo/icon :i/camera {:color (colors/theme-colors colors/neutral-100 colors/white)}]]
[rn/view
{:style {:flex-direction :row
:position :absolute
:align-self :center}}
[quo2/text {:weight :medium} (i18n/label :t/recent)]
{:style style/title-container}
[quo/text {:weight :medium} (i18n/label :t/recent)]
[rn/view {:style (style/chevron-container)}
[quo2/icon :i/chevron-down {:color (colors/theme-colors colors/neutral-100 colors/white)}]]]
[quo/icon :i/chevron-down {:color (colors/theme-colors colors/neutral-100 colors/white)}]]]
[clear-button]
[rn/flat-list
{:key-fn (fn [item] item)
{:key-fn identity
:render-fn image
:render-data {:window-width window-width}
:data camera-roll-photos
@ -100,3 +111,4 @@
has-next-page?])}]
[bottom-gradient chat-id selected-images]]))]))

7
src/status_im2/subs/chat/chats.cljs
View File

@ -145,6 +145,13 @@
(fn [[inputs public-key]]
(get inputs (chat.models/profile-chat-topic public-key))))
(re-frame/reg-sub
:chats/sending-image
:<- [:chats/current-chat-id]
:<- [:chat/inputs]
(fn [[chat-id inputs]]
(get-in inputs [chat-id :metadata :sending-image])))
(re-frame/reg-sub
:chats/timeline-chat-input-text
:<- [:chats/timeline-chat-input]