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

feat: Lightbox share images (#16224) 

* feat: share images
This commit is contained in:
Omar Basem 2023-06-14 18:24:55 +04:00 committed by GitHub
parent eddbeb8896
commit fbe4b0a36c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
9 changed files with 34 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
ios/Podfile.lock
View File

@ -702,7 +702,7 @@ SPEC CHECKSUMS:
FBLazyVector: a8af91c2b5a0029d12ff6b32e428863d63c48991
FBReactNativeSpec: 1b2309b096448a1dc9d0c43999216f8fda809ae8
fmt: ff9d55029c625d3757ed641535fd4a75fedc7ce9
glog: 7b2c4d9c9069ba6898fcdc14b66f8fc622f7bacc
glog: 3a2d032685329b68abb308254142e4c875b6e40d
HMSegmentedControl: 34c1f54d822d8308e7b24f5d901ec674dfa31352
Keycard: ac6df4d91525c3c82635ac24d4ddd9a80aca5fc8
libwebp: f62cb61d0a484ba548448a4bd52aabf150ff6eef
@ -766,7 +766,7 @@ SPEC CHECKSUMS:
RNLanguages: 962e562af0d34ab1958d89bcfdb64fafc37c513e
RNPermissions: ad71dd4f767ec254f2cd57592fbee02afee75467
RNReactNativeHapticFeedback: 2566b468cc8d0e7bb2f84b23adc0f4614594d071
RNReanimated: eb404c151f308954dcf3690fbdb88f8f6abbc362
RNReanimated: 06a228c5a245ef7b5b03f0efc29d76ce4db9031c
RNShare: 2dc2fcac3f7321cfd6b60a23ed4bf4d549f86f5f
RNStaticSafeAreaInsets: 055ddbf5e476321720457cdaeec0ff2ba40ec1b8
RNSVG: 8ba35cbeb385a52fd960fd28db9d7d18b4c2974f

2
package.json
View File

@ -65,7 +65,7 @@
"react-native-reanimated": "2.11.0",
"react-native-redash": "^16.0.11",
"react-native-shake": "^3.3.1",
"react-native-share": "^7.0.1",
"react-native-share": "^8.2.2",
"react-native-static-safe-area-insets": "^2.2.0",
"react-native-status-keycard": "git+https://github.com/status-im/react-native-status-keycard.git#refs/tags/v2.5.39",
"react-native-svg": "^9.8.4",

2
src/status_im/utils/fs.cljs → src/react_native/fs.cljs
View File

@ -1,4 +1,4 @@
(ns status-im.utils.fs
(ns react-native.fs
(:require ["react-native-fs" :as react-native-fs]))
(defn move-file

2
src/status_im/utils/share.cljs → src/react_native/share.cljs
View File

@ -1,4 +1,4 @@
(ns status-im.utils.share
(ns react-native.share
(:require ["react-native-share" :default react-native-share]))
(defn open

12
src/status_im/chat/models/images.cljs
View File

@ -2,11 +2,12 @@
(:require ["@react-native-community/cameraroll" :as CameraRoll]
["react-native-blob-util" :default ReactNativeBlobUtil]
[re-frame.core :as re-frame]
[react-native.share :as share]
[utils.i18n :as i18n]
[react-native.permissions :as permissions]
[status-im.ui.components.react :as react]
[status-im2.config :as config]
[status-im.utils.fs :as fs]
[react-native.fs :as fs]
[utils.re-frame :as rf]
[status-im.utils.platform :as platform]
[status-im.utils.utils :as utils]
@ -23,6 +24,15 @@
(.then #(on-success (.path %)))
(.catch #(log/error "could not save image"))))
(defn share-image
[uri]
(download-image-http uri
(fn [downloaded-url]
(share/open {:url (str (when platform/android? "file://") downloaded-url)
:isNewTask true}
#(fs/unlink downloaded-url)
#(fs/unlink downloaded-url)))))
(defn save-to-gallery [path] (.save CameraRoll path))
(re-frame/reg-fx

14
src/status_im2/contexts/chat/lightbox/top_view.cljs
View File

@ -6,11 +6,13 @@
[react-native.orientation :as orientation]
[react-native.platform :as platform]
[react-native.reanimated :as reanimated]
[status-im.utils.http :as http]
[status-im2.contexts.chat.lightbox.animations :as anim]
[status-im2.contexts.chat.lightbox.style :as style]
[utils.datetime :as datetime]
[utils.re-frame :as rf]
[status-im2.contexts.chat.lightbox.constants :as c]))
[status-im2.contexts.chat.lightbox.constants :as c]
[status-im.chat.models.images :as images]))
(defn animate-rotation
[result screen-width screen-height insets
@ -40,13 +42,16 @@
(anim/animate top-view-bg colors/neutral-100-opa-0)))))
(defn top-view
[{:keys [from timestamp]} insets index animations derived landscape? screen-width]
(let [display-name (first (rf/sub [:contacts/contact-two-names-by-identity
[messages insets index animations derived landscape? screen-width]
(let [{:keys [from timestamp content]} (nth @messages @index)
display-name (first (rf/sub [:contacts/contact-two-names-by-identity
from]))
bg-color (if landscape?
colors/neutral-100-opa-70
colors/neutral-100-opa-0)
{:keys [background-color opacity]} animations]
{:keys [background-color opacity]} animations
uri (http/replace-port (:image content)
(rf/sub [:mediaserver/port]))]
[reanimated/view
{:style
(style/top-view-container (:top insets) screen-width bg-color landscape? animations derived)}
@ -79,6 +84,7 @@
[rn/view {:style style/top-right-buttons}
[rn/touchable-opacity
{:active-opacity 1
:on-press #(images/share-image uri)
:style (merge style/close-container {:margin-right 12})}
[quo/icon :share {:size 20 :color colors/white}]]
[rn/touchable-opacity

2
src/status_im2/contexts/chat/lightbox/utils.cljs
View File

@ -139,7 +139,7 @@
(defn init-animations
[]
{:background-color (anim/use-val colors/black-opa-0)
{:background-color (anim/use-val colors/neutral-100-opa-0)
:border (anim/use-val (if platform/ios? 0 12))
:opacity (anim/use-val 0)
:rotate (anim/use-val "0deg")

5
src/status_im2/contexts/chat/lightbox/view.cljs
View File

@ -1,6 +1,7 @@
(ns status-im2.contexts.chat.lightbox.view
(:require
[clojure.string :as string]
[quo2.foundations.colors :as colors]
[react-native.core :as rn]
[react-native.orientation :as orientation]
[react-native.platform :as platform]
@ -65,7 +66,7 @@
{:style (reanimated/apply-animations-to-style {:background-color (:background-color animations)}
{:height screen-height})}
(when-not @transparent?
[:f> top-view/top-view (first messages) insets scroll-index animations derived landscape?
[:f> top-view/top-view data insets scroll-index animations derived landscape?
screen-width])
[gesture/gesture-detector
{:gesture (utils/drag-gesture animations (and landscape? platform/ios?) set-full-height?)}
@ -112,7 +113,7 @@
derived (utils/init-derived-animations animations)
callback (fn [e]
(on-viewable-items-changed e props state))]
(anim/animate (:background-color animations) "rgba(0,0,0,1)")
(anim/animate (:background-color animations) colors/neutral-100)
(reset! (:data state) messages)
(when platform/ios? ; issue: https://github.com/wix/react-native-navigation/issues/7726
(utils/orientation-change props state animations))

8
yarn.lock
View File

@ -9164,10 +9164,10 @@ react-native-shake@^3.3.1:
dependencies:
invariant "^2.2.x"
react-native-share@^7.0.1:
version "7.0.1"
resolved "https://registry.yarnpkg.com/react-native-share/-/react-native-share-7.0.1.tgz#1deef27afcd8275222ba0efeac337e7cea99bc4b"
integrity sha512-hq7nOirgih/zIF9UU9FuYKZ3NGvasu2c/eJesvyPKYiykTtgQZM+mvDwFk/ogEsGwRtTPJBtj8/6IyIFcGa7lw==
react-native-share@^8.2.2:
version "8.2.2"
resolved "https://registry.yarnpkg.com/react-native-share/-/react-native-share-8.2.2.tgz#987d6f164afe57b089950dca42e0555f19045d27"
integrity sha512-kVCI/cT0GnuYUTXe6mAimrjrnt4VWoRfrWqJZjFeoYFqAyOEfos84RC4eZlZnOT5eVtmTXRIkor5vgSkKOlZhw==
react-native-static-safe-area-insets@^2.2.0:
version "2.2.0"