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

Sanitize quo2 namespace (#15207)

This commit is contained in:
flexsurfer 2023-02-28 13:59:09 +01:00 committed by GitHub
parent f9dda56310
commit fa03e91080
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
14 changed files with 82 additions and 85 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
scripts/lint-re-frame-in-quo-components.sh
View File

@ -1,11 +1,9 @@
#!/usr/bin/env sh #!/usr/bin/env sh
CHANGES=$(git diff --no-ext-diff --diff-filter=d --cached --unified=0 --no-prefix --minimal --exit-code src/quo src/quo2 | grep '^+' || echo '') INVALID_CHANGES=$(grep -E -r '(re-frame/dispatch|rf/dispatch|re-frame/subscribe|rf/subscribe|rf/sub|<sub|>evt|status-im\.|status-im2\.)' './src/quo2')
INVALID_CHANGES=$(echo "$CHANGES" | grep -E '(re-frame/dispatch|rf/dispatch|re-frame/subscribe|rf/subscribe|rf/sub|<sub|>evt|status-im)')
if test -n "$INVALID_CHANGES"; then if test -n "$INVALID_CHANGES"; then
echo "re-frame dispatch/subscribe and status-im are not allowed in quo/quo2 components" echo "WARNING: re-frame, status-im are not allowed in quo2 components"
echo '' echo ''
echo "$INVALID_CHANGES" echo "$INVALID_CHANGES"
exit 1 exit 1

11
src/quo2/components/animated_header_flatlist/view.cljs
View File

@ -5,12 +5,11 @@
[react-native.platform :as platform] [react-native.platform :as platform]
[react-native.reanimated :as reanimated] [react-native.reanimated :as reanimated]
[react-native.safe-area :as safe-area] [react-native.safe-area :as safe-area]
[react-native.fast-image :as fast-image]
[reagent.core :as reagent] [reagent.core :as reagent]
[quo2.foundations.colors :as colors] [quo2.foundations.colors :as colors]
[status-im.ui.components.fast-image :as fast-image]
[quo2.components.animated-header-flatlist.style :as style] [quo2.components.animated-header-flatlist.style :as style]
[oops.core :as oops] [oops.core :as oops]))
[utils.re-frame :as rf]))
(def header-height 234) (def header-height 234)
(def cover-height 192) (def cover-height 192)
@ -51,10 +50,8 @@
[reanimated/view {:style (style/entity-picture size-animation)} [reanimated/view {:style (style/entity-picture size-animation)}
[display-picture-comp image-animation]]])) [display-picture-comp image-animation]]]))
(defn animated-header-list (defn animated-header-list
[{:keys [header-comp main-comp] :as parameters}] [{:keys [header-comp main-comp back-button-on-press] :as parameters}]
[safe-area/consumer [safe-area/consumer
(fn [insets] (fn [insets]
(let [window-height (:height (rn/get-window)) (let [window-height (:height (rn/get-window))
@ -76,7 +73,7 @@
[rn/view {:style (style/container-view view-height)} [rn/view {:style (style/container-view view-height)}
[rn/touchable-opacity [rn/touchable-opacity
{:active-opacity 1 {:active-opacity 1
:on-press #(rf/dispatch [:navigate-back]) :on-press back-button-on-press
:style (style/button-container {:left 20})} :style (style/button-container {:left 20})}
[quo/icon :i/arrow-left {:size 20 :color (colors/theme-colors colors/black colors/white)}]] [quo/icon :i/arrow-left {:size 20 :color (colors/theme-colors colors/black colors/white)}]]
[rn/touchable-opacity [rn/touchable-opacity

4
src/quo2/components/notifications/activity_log/view.cljs
View File

@ -7,9 +7,9 @@
[quo2.components.notifications.activity-log.style :as style] [quo2.components.notifications.activity-log.style :as style]
[quo2.components.tags.status-tags :as status-tags] [quo2.components.tags.status-tags :as status-tags]
[quo2.foundations.colors :as colors] [quo2.foundations.colors :as colors]
[utils.i18n :as i18n]
[react-native.core :as rn] [react-native.core :as rn]
[reagent.core :as reagent] [reagent.core :as reagent]))
[utils.i18n :as i18n]))
(defn- activity-reply-text-input (defn- activity-reply-text-input
[{:keys [on-update-reply max-reply-length valid-reply?]} reply-input] [{:keys [on-update-reply max-reply-length valid-reply?]} reply-input]

4
src/quo2/components/notifications/toast.cljs
View File

@ -5,9 +5,9 @@
[quo2.foundations.colors :as colors] [quo2.foundations.colors :as colors]
[quo2.foundations.shadows :as shadows] [quo2.foundations.shadows :as shadows]
[quo2.theme :as theme] [quo2.theme :as theme]
[utils.i18n :as i18n]
[react-native.blur :as blur] [react-native.blur :as blur]
[react-native.core :as rn] [react-native.core :as rn]))
[utils.i18n :as i18n]))
(def ^:private themes (def ^:private themes
{:container {:dark {:background-color colors/white-opa-70} {:container {:dark {:background-color colors/white-opa-70}

4
src/quo2/components/onboarding/small_option_card/component_spec.cljs
View File

@ -1,6 +1,5 @@
(ns quo2.components.onboarding.small-option-card.component-spec (ns quo2.components.onboarding.small-option-card.component-spec
(:require [quo2.components.onboarding.small-option-card.view :as small-option-card] (:require [quo2.components.onboarding.small-option-card.view :as small-option-card]
[status-im.react-native.resources :as resources]
[test-helpers.component :as h])) [test-helpers.component :as h]))
(defn- testing-small-option-card (defn- testing-small-option-card
@ -43,8 +42,7 @@
(-> on-press-fn js/expect .toHaveBeenCalled)))) (-> on-press-fn js/expect .toHaveBeenCalled))))
(h/describe "Image rendered" (h/describe "Image rendered"
(let [image (resources/get-mock-image :small-opt-card-main) (let [component-props {:image nil}]
component-props {:image image}]
(h/test "`:main` variant" (h/test "`:main` variant"
(h/render (testing-small-option-card :main component-props)) (h/render (testing-small-option-card :main component-props))
(-> (h/get-by-label-text :small-option-card-main-image) h/expect .-not .toBeNull)) (-> (h/get-by-label-text :small-option-card-main-image) h/expect .-not .toBeNull))

26
src/quo2/components/record_audio/record_audio/__tests__/record_audio_component_spec.cljs
View File

@ -1,6 +1,6 @@
(ns quo2.components.record-audio.record-audio.--tests--.record-audio-component-spec (ns quo2.components.record-audio.record-audio.--tests--.record-audio-component-spec
(:require [quo2.components.record-audio.record-audio.view :as record-audio] (:require [quo2.components.record-audio.record-audio.view :as record-audio]
[status-im.audio.core :as audio] [react-native.audio-toolkit :as audio]
[test-helpers.component :as h])) [test-helpers.component :as h]))
(h/describe "record audio component" (h/describe "record audio component"
@ -20,7 +20,9 @@
(h/test "record-audio on-start-recording works" (h/test "record-audio on-start-recording works"
(let [event (js/jest.fn)] (let [event (js/jest.fn)]
(h/render [record-audio/record-audio {:on-start-recording event}]) (h/render [record-audio/record-audio
{:on-start-recording event
:record-audio-permission-granted true}])
(h/fire-event (h/fire-event
:on-start-should-set-responder :on-start-should-set-responder
(h/get-by-test-id "record-audio") (h/get-by-test-id "record-audio")
@ -31,7 +33,9 @@
(h/test "record-audio on-reviewing-audio works" (h/test "record-audio on-reviewing-audio works"
(let [event (js/jest.fn)] (let [event (js/jest.fn)]
(h/render [record-audio/record-audio {:on-reviewing-audio event}]) (h/render [record-audio/record-audio
{:on-reviewing-audio event
:record-audio-permission-granted true}])
(with-redefs [audio/start-recording (fn [_ on-start _] (with-redefs [audio/start-recording (fn [_ on-start _]
(on-start))] (on-start))]
(h/fire-event (h/fire-event
@ -50,7 +54,9 @@
(h/test "record-audio on-send works after reviewing audio" (h/test "record-audio on-send works after reviewing audio"
(let [event (js/jest.fn)] (let [event (js/jest.fn)]
(h/render [record-audio/record-audio {:on-send event}]) (h/render [record-audio/record-audio
{:on-send event
:record-audio-permission-granted true}])
(with-redefs [audio/start-recording (fn [_ on-start _] (with-redefs [audio/start-recording (fn [_ on-start _]
(on-start)) (on-start))
audio/get-recorder-file-path (fn [] "audio-file-path")] audio/get-recorder-file-path (fn [] "audio-file-path")]
@ -77,7 +83,9 @@
(h/test "record-audio on-send works after sliding to the send button" (h/test "record-audio on-send works after sliding to the send button"
(let [event (js/jest.fn)] (let [event (js/jest.fn)]
(h/render [record-audio/record-audio {:on-send event}]) (h/render [record-audio/record-audio
{:on-send event
:record-audio-permission-granted true}])
(with-redefs [audio/start-recording (fn [_ on-start _] (with-redefs [audio/start-recording (fn [_ on-start _]
(on-start)) (on-start))
audio/stop-recording (fn [_ on-stop _] audio/stop-recording (fn [_ on-stop _]
@ -108,7 +116,9 @@
(h/test "record-audio on-cancel works after reviewing audio" (h/test "record-audio on-cancel works after reviewing audio"
(let [event (js/jest.fn)] (let [event (js/jest.fn)]
(h/render [record-audio/record-audio {:on-cancel event}]) (h/render [record-audio/record-audio
{:on-cancel event
:record-audio-permission-granted true}])
(with-redefs [audio/start-recording (fn [_ on-start _] (with-redefs [audio/start-recording (fn [_ on-start _]
(on-start))] (on-start))]
(h/fire-event (h/fire-event
@ -132,7 +142,9 @@
(h/test "cord-audio on-cancel works after sliding to the cancel button" (h/test "cord-audio on-cancel works after sliding to the cancel button"
(let [event (js/jest.fn)] (let [event (js/jest.fn)]
(h/render [record-audio/record-audio {:on-cancel event}]) (h/render [record-audio/record-audio
{:on-cancel event
:record-audio-permission-granted true}])
(with-redefs [audio/start-recording (fn [_ on-start _] (with-redefs [audio/start-recording (fn [_ on-start _]
(on-start)) (on-start))
audio/stop-recording (fn [_ on-stop _] audio/stop-recording (fn [_ on-stop _]

2
src/quo2/components/record_audio/record_audio/buttons/record_button_big.cljs
View File

@ -4,7 +4,7 @@
[quo2.foundations.colors :as colors] [quo2.foundations.colors :as colors]
[react-native.core :as rn :refer [use-effect]] [react-native.core :as rn :refer [use-effect]]
[react-native.reanimated :as reanimated] [react-native.reanimated :as reanimated]
[status-im.audio.core :as audio] [react-native.audio-toolkit :as audio]
[taoensso.timbre :as log] [taoensso.timbre :as log]
[cljs-bean.core :as bean] [cljs-bean.core :as bean]
[reagent.core :as reagent] [reagent.core :as reagent]

53
src/quo2/components/record_audio/record_audio/view.cljs
View File

@ -1,19 +1,14 @@
(ns quo2.components.record-audio.record-audio.view (ns quo2.components.record-audio.record-audio.view
(:require [cljs-bean.core :as bean] (:require [oops.core :as oops]
[oops.core :as oops]
[quo2.components.icon :as icons] [quo2.components.icon :as icons]
[quo2.components.record-audio.record-audio.style :as style] [quo2.components.record-audio.record-audio.style :as style]
[quo2.foundations.colors :as colors] [quo2.foundations.colors :as colors]
[quo2.components.record-audio.soundtrack.view :as soundtrack] [quo2.components.record-audio.soundtrack.view :as soundtrack]
[react-native.core :as rn :refer [use-effect]] [react-native.core :as rn :refer [use-effect]]
[reagent.core :as reagent] [reagent.core :as reagent]
[status-im.utils.utils :as utils]
[quo2.components.markdown.text :as text] [quo2.components.markdown.text :as text]
[goog.string :as gstring] [goog.string :as gstring]
[status-im.audio.core :as audio] [react-native.audio-toolkit :as audio]
[utils.re-frame :as rf]
[utils.i18n :as i18n]
[react-native.permissions :as permissions]
[taoensso.timbre :as log] [taoensso.timbre :as log]
[quo2.components.record-audio.record-audio.buttons.record-button-big :as record-button-big] [quo2.components.record-audio.record-audio.buttons.record-button-big :as record-button-big]
[quo2.components.record-audio.record-audio.buttons.send-button :as send-button] [quo2.components.record-audio.record-audio.buttons.send-button :as send-button]
@ -154,7 +149,8 @@
{:color (colors/theme-colors colors/neutral-100 colors/white)}]]))]) {:color (colors/theme-colors colors/neutral-100 colors/white)}]]))])
(defn view (defn view
[{:keys [on-start-recording on-send on-cancel on-reviewing-audio]}] [{:keys [on-start-recording on-send on-cancel on-reviewing-audio record-audio-permission-granted
on-request-record-audio-permission on-check-audio-permissions]}]
[:f> [:f>
(fn [] (fn []
(let [recording? (reagent/atom false) (let [recording? (reagent/atom false)
@ -176,29 +172,8 @@
playing-timer (atom nil) playing-timer (atom nil)
recorder-ref (atom nil) recorder-ref (atom nil)
player-ref (atom nil) player-ref (atom nil)
record-audio-permission-granted (atom true)
output-file (atom nil) output-file (atom nil)
reached-max-duration? (atom false) reached-max-duration? (atom false)
check-audio-permission
(fn []
(permissions/permission-granted?
:record-audio
#(reset! record-audio-permission-granted %)
#(reset! record-audio-permission-granted false)))
request-record-audio-permission
(fn []
(rf/dispatch
[:request-permissions
{:permissions [:record-audio]
:on-allowed
#(reset! record-audio-permission-granted true)
:on-denied
#(js/setTimeout
(fn []
(utils/show-popup
(i18n/label :t/audio-recorder-error)
(i18n/label :t/audio-recorder-permissions-error)))
50)}]))
destroy-player destroy-player
(fn [] (fn []
(audio/destroy-player @player-ref) (audio/destroy-player @player-ref)
@ -247,7 +222,7 @@
:ignore-max-x? false} :ignore-max-x? false}
record-button-area)] record-button-area)]
(when-not @reviewing-audio? (when-not @reviewing-audio?
(if @record-audio-permission-granted (if record-audio-permission-granted
(do (do
(when (not @idle?) (when (not @idle?)
(reset! recording? pressed-record-button?)) (reset! recording? pressed-record-button?))
@ -294,8 +269,8 @@
#(log/error "[record-audio] start recording - error: " %)) #(log/error "[record-audio] start recording - error: " %))
(when on-start-recording (when on-start-recording
(on-start-recording)))) (on-start-recording))))
(request-record-audio-permission))) (some-> on-request-record-audio-permission)))
(when @record-audio-permission-granted (when record-audio-permission-granted
(reset! touch-active? true)))) (reset! touch-active? true))))
(not @idle?)) (not @idle?))
on-responder-move on-responder-move
@ -469,7 +444,7 @@
(reset! reached-max-duration? false)))] (reset! reached-max-duration? false)))]
(fn [] (fn []
(use-effect (fn [] (use-effect (fn []
(check-audio-permission) (some-> on-check-audio-permissions)
(reload-recorder))) (reload-recorder)))
[rn/view [rn/view
{:style style/bar-container} {:style style/bar-container}
@ -515,14 +490,4 @@
on-cancel] on-cancel]
[record-button/record-button recording? reviewing-audio?]]])))]) [record-button/record-button recording? reviewing-audio?]]])))])
(def record-audio (def record-audio view)
(reagent/adapt-react-class
(rn/memo
(fn [props]
(let [{:keys [onStartRecording onReviewingAudio onSend onCancel]} (bean/bean props)]
(reagent/as-element
[view
{:on-start-recording onStartRecording
:on-reviewing-audio onReviewingAudio
:on-send onSend
:on-cancel onCancel}]))))))

2
src/quo2/components/record_audio/soundtrack/__tests__/soundtrack_component_spec.cljs
View File

@ -2,7 +2,7 @@
(:require [quo2.components.record-audio.soundtrack.view :as soundtrack] (:require [quo2.components.record-audio.soundtrack.view :as soundtrack]
[test-helpers.component :as h] [test-helpers.component :as h]
[reagent.core :as reagent] [reagent.core :as reagent]
[status-im.audio.core :as audio])) [react-native.audio-toolkit :as audio]))
(h/describe "soundtrack component" (h/describe "soundtrack component"
(h/before-each (h/before-each

2
src/quo2/components/record_audio/soundtrack/view.cljs
View File

@ -1,7 +1,7 @@
(ns quo2.components.record-audio.soundtrack.view (ns quo2.components.record-audio.soundtrack.view
(:require [quo2.components.record-audio.soundtrack.style :as style] (:require [quo2.components.record-audio.soundtrack.style :as style]
[quo2.foundations.colors :as colors] [quo2.foundations.colors :as colors]
[status-im.audio.core :as audio] [react-native.audio-toolkit :as audio]
[taoensso.timbre :as log] [taoensso.timbre :as log]
[react-native.platform :as platform] [react-native.platform :as platform]
[react-native.slider :as slider])) [react-native.slider :as slider]))

2
src/status_im/audio/core.cljs → src/react_native/audio_toolkit.cljs
View File

@ -1,4 +1,4 @@
(ns status-im.audio.core (ns react-native.audio-toolkit
(:require ["@react-native-community/audio-toolkit" :refer (Player Recorder MediaStates)])) (:require ["@react-native-community/audio-toolkit" :refer (Player Recorder MediaStates)]))
;; get mediastates from react module ;; get mediastates from react module

2
src/status_im/ui/screens/chat/message/audio.cljs
View File

@ -4,7 +4,7 @@
[goog.string :as gstring] [goog.string :as gstring]
[quo.design-system.colors :as colors] [quo.design-system.colors :as colors]
[reagent.core :as reagent] [reagent.core :as reagent]
[status-im.audio.core :as audio] [react-native.audio-toolkit :as audio]
[status-im.ui.components.animation :as anim] [status-im.ui.components.animation :as anim]
[status-im.ui.components.icons.icons :as icons] [status-im.ui.components.icons.icons :as icons]
[status-im.ui.components.react :as react] [status-im.ui.components.react :as react]

3
src/status_im2/contexts/quo_preview/animated_header_list/animated_header_list.cljs
View File

@ -81,7 +81,8 @@
:display-picture-comp display-picture-comp :display-picture-comp display-picture-comp
:header-comp header-comp :header-comp header-comp
:title-comp title-comp :title-comp title-comp
:main-comp main-comp}) :main-comp main-comp
:back-button-on-press #()})
(defn mock-screen (defn mock-screen
[] []

46
src/status_im2/contexts/quo_preview/record_audio/record_audio.cljs
View File

@ -2,15 +2,21 @@
(:require [quo2.components.record-audio.record-audio.view :as record-audio] (:require [quo2.components.record-audio.record-audio.view :as record-audio]
[quo2.core :as quo] [quo2.core :as quo]
[react-native.core :as rn] [react-native.core :as rn]
[reagent.core :as reagent])) [reagent.core :as reagent]
[utils.re-frame :as rf]
[status-im2.common.alert.events :as alert]
[utils.i18n :as i18n]
[react-native.permissions :as permissions]))
(defn cool-preview (defn cool-preview
[] []
(let [message (reagent/atom "Press & hold the mic button to start recording...") (let [message (reagent/atom
on-send #(reset! message (str "onSend event triggered. File path: " %)) "Press & hold the mic button to start recording...")
on-start-recording #(reset! message "onStartRecording event triggered.") record-audio-permission-granted (reagent/atom false)
on-reviewing-audio #(reset! message "onReviewingAudio event triggered.") on-send #(reset! message (str "onSend event triggered. File path: " %))
on-cancel #(reset! message "onCancel event triggered.")] on-start-recording #(reset! message "onStartRecording event triggered.")
on-reviewing-audio #(reset! message "onReviewingAudio event triggered.")
on-cancel #(reset! message "onCancel event triggered.")]
(fn [] (fn []
[rn/view [rn/view
[rn/view [rn/view
@ -19,10 +25,30 @@
:background-color :transparent :background-color :transparent
:flex-direction :row} :flex-direction :row}
[record-audio/record-audio [record-audio/record-audio
{:on-send on-send {:record-audio-permission-granted @record-audio-permission-granted
:on-start-recording on-start-recording :on-send on-send
:on-reviewing-audio on-reviewing-audio :on-start-recording on-start-recording
:on-cancel on-cancel}]] :on-reviewing-audio on-reviewing-audio
:on-cancel on-cancel
:on-check-audio-permissions (fn []
(permissions/permission-granted?
:record-audio
#(reset! record-audio-permission-granted %)
#(reset! record-audio-permission-granted false)))
:on-request-record-audio-permission (fn []
(rf/dispatch
[:request-permissions
{:permissions [:record-audio]
:on-allowed
#(reset! record-audio-permission-granted true)
:on-denied
#(js/setTimeout
(fn []
(alert/show-popup
(i18n/label :t/audio-recorder-error)
(i18n/label
:t/audio-recorder-permissions-error)))
50)}]))}]]
[quo/text {:style {:margin-horizontal 20}} @message]]))) [quo/text {:style {:margin-horizontal 20}} @message]])))
(defn preview-record-audio (defn preview-record-audio