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

Input fixes (#1067, #676), #1110

This commit is contained in:
alwx 2017-04-28 14:40:10 +03:00 committed by Roman Volosovskyi
parent 05886cc628
commit ddb6344dca
7 changed files with 62 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
.re-natal
View File

@ -41,7 +41,8 @@
"instabug-reactnative",
"nfc-react-native",
"react-native-http-bridge",
"react-native-network-info"
"react-native-network-info",
"react-native-autogrow-textinput"
],
"imageDirs": [
"images"

1
package.json
View File

@ -46,6 +46,7 @@
"react-native": "^0.43.4",
"react-native-action-button": "^2.0.13",
"react-native-android-sms-listener": "github:adrian-tiberius/react-native-android-sms-listener#listener-bugfix",
"react-native-autogrow-textinput": "^3.0.2",
"react-native-autolink": "^0.10.0",
"react-native-camera": "^0.7.0",
"react-native-circle-checkbox": "github:paramoshkinandrew/ReactNativeCircleCheckbox",

19
src/status_im/chat/handlers.cljs
View File

@ -225,10 +225,8 @@
chats
(->> loaded-chats
(map (fn [{:keys [chat-id] :as chat}]
(let [last-message (messages/get-last-message chat-id)
prev-chat (get chats chat-id)
new-chat (assoc chat :last-message last-message)]
[chat-id (merge prev-chat new-chat)])))
(let [last-message (messages/get-last-message chat-id)]
[chat-id (assoc chat :last-message last-message)])))
(into (priority-map-by compare-chats))))]
(-> db
@ -242,12 +240,23 @@
db
(assoc db :loaded-chats (chats/get-all))))
;TODO: check if its new account / signup status / create console chat
(register-handler :initialize-chats
[(after #(dispatch [:load-unviewed-messages!]))
(after #(dispatch [:load-default-contacts!]))]
((enrich initialize-chats) load-chats!))
(register-handler :reload-chats
(fn [{:keys [chats] :as db} _]
(let [chats' (->> (chats/get-all)
(map (fn [{:keys [chat-id] :as chat}]
(let [last-message (messages/get-last-message chat-id)
prev-chat (get chats chat-id)
new-chat (assoc chat :last-message last-message)]
[chat-id (merge prev-chat new-chat)])))
(into (priority-map-by compare-chats)))]
(-> (assoc db :chats chats')
(init-console-chat true)))))
(defmethod nav/preload-data! :chat
[{:keys [current-chat-id] :as db} [_ _ id]]
(let [chat-id (or id current-chat-id)

11
src/status_im/chat/styles/input/input.cljs
View File

@ -13,8 +13,8 @@
(def max-input-height 66)
(def min-input-height 38)
(def input-spacing-top 5)
(def input-spacing-bottom 8)
(def input-spacing-top 3)
(def input-spacing-bottom 5)
(defnstyle root [margin-bottom]
{:flex-direction :column
@ -50,12 +50,17 @@
:android {:border-radius 4}
:ios {:border-radius 8}})
(defnstyle input-touch-handler-view [container-width]
{:position :absolute
:width container-width
:height min-input-height})
(defnstyle input-view [content-height]
{:flex 1
:font-size 14
:padding-top input-spacing-top
:padding-bottom input-spacing-bottom
:height (min (max min-input-height content-height) max-input-height)})
:height (+ (min (max min-input-height content-height) max-input-height))})
(def invisible-input-text
{:font-size 14

53
src/status_im/chat/views/input/input.cljs
View File

@ -6,6 +6,7 @@
[taoensso.timbre :as log]
[status-im.accessibility-ids :as id]
[status-im.components.react :refer [view
autogrow-text-input
animated-view
text
scroll-view
@ -64,41 +65,45 @@
command (subscribe [:selected-chat-command])
sending-in-progress? (subscribe [:chat-ui-props :sending-in-progress?])
input-focused? (subscribe [:chat-ui-props :input-focused?])]
(fn [{:keys [set-layout-height height]}]
(fn [{:keys [set-layout-height set-container-width height]}]
[text-input
{:ref #(when %
(dispatch [:set-chat-ui-props {:input-ref %}]))
:accessibility-label id/chat-message-input
:multiline true
:default-value (or @input-text "")
:editable (not @sending-in-progress?)
:on-blur #(do (dispatch [:set-chat-ui-props {:input-focused? false}])
(set-layout-height 0))
:on-content-size-change (when-not @input-focused?
:editable true
:blur-on-submit false
:on-focus #(dispatch [:set-chat-ui-props {:input-focused? true
:show-emoji? false}])
:on-blur #(do (dispatch [:set-chat-ui-props {:input-focused? false}]))
:on-layout (fn [e]
(set-container-width (.-width (.-layout (.-nativeEvent e)))))
:on-change (fn [e]
(let [native-event (.-nativeEvent e)
height (.. native-event -contentSize -height)
text (.-text native-event)]
(set-layout-height height)
(when (not= text @input-text)
(dispatch [:set-chat-input-text text])
(if @command
(do
(dispatch [:load-chat-parameter-box (:command @command)])
(dispatch [:set-chat-ui-props {:validation-messages nil}]))
(do
(dispatch [:set-chat-input-metadata nil])
(dispatch [:set-chat-ui-props {:result-box nil
:validation-messages nil}]))))))
:on-content-size-change (when-not input-focused?
#(let [h (-> (.-nativeEvent %)
(.-contentSize)
(.-height))]
(set-layout-height h)))
:on-change #(let [h (-> (.-nativeEvent %)
(.-contentSize)
(.-height))]
(set-layout-height h))
:on-change-text #(do (dispatch [:set-chat-input-text %])
(if @command
(do
(dispatch [:load-chat-parameter-box (:command @command)])
(dispatch [:set-chat-ui-props {:validation-messages nil}]))
(do
(dispatch [:set-chat-input-metadata nil])
(dispatch [:set-chat-ui-props {:result-box nil
:validation-messages nil}]))))
:on-selection-change #(let [s (-> (.-nativeEvent %)
(.-selection))]
(when (and (= (.-end s) (+ 2 (count (get-in @command [:command :name]))))
(get-in @command [:command :sequential-params]))
(dispatch [:chat-input-focus :seq-input-ref])))
:on-focus #(dispatch [:set-chat-ui-props {:input-focused? true
:show-emoji? false}])
:style (style/input-view height)
:placeholder-text-color style/color-input-helper-placeholder
:auto-capitalize :sentences}])))
@ -168,16 +173,18 @@
(let [component (r/current-component)
set-layout-width #(r/set-state component {:width %})
set-layout-height #(r/set-state component {:height %})
set-container-width #(r/set-state component {:container-width %})
command (subscribe [:selected-chat-command])]
(r/create-class
{:reagent-render
(fn [{:keys [anim-margin]}]
(let [{:keys [width height]} (r/state component)
(let [{:keys [width height container-width]} (r/state component)
command @command]
[animated-view {:style (style/input-root height anim-margin)}
[basic-text-input {:set-layout-height set-layout-height
:height height}]
[invisible-input {:set-layout-width set-layout-width}]
[basic-text-input {:set-layout-height set-layout-height
:set-container-width set-container-width
:height height}]
[input-helper {:command command
:width width}]
[seq-input {:command-width width}]

6
src/status_im/components/react.cljs
View File

@ -127,6 +127,12 @@
(def swiper (adapt-class (js/require "react-native-swiper")))
;; Autogrow text input
(def autogrow-class (js/require "react-native-autogrow-textinput"))
(def autogrow-text-input (r/adapt-react-class (.-AutoGrowingTextInput autogrow-class)))
;; Clipboard
(def sharing

4
src/status_im/data_store/chats.cljs
View File

@ -43,9 +43,7 @@
(defn add-contacts
[chat-id identities]
(data-store/add-contacts chat-id identities)
; TODO: move this somewhere else
; TODO: temp. Update chat in db atom
(dispatch [:initialize-chats]))
(dispatch [:reload-chats]))
(defn remove-contacts
[chat-id identities]