Blue hashtags (#435), other small status-related fixes
This commit is contained in:
parent
4c876587ed
commit
deaafded22
|
@ -1,7 +1,7 @@
|
|||
{
|
||||
"name": "StatusIm",
|
||||
"interface": "reagent",
|
||||
"androidHost": "localhost",
|
||||
"androidHost": "10.0.3.2",
|
||||
"modules": [
|
||||
"react-native-contacts",
|
||||
"react-native-invertible-scroll-view",
|
||||
|
@ -43,4 +43,4 @@
|
|||
"dev": "env/dev",
|
||||
"prod": "env/prod"
|
||||
}
|
||||
}
|
||||
}
|
|
@ -3,7 +3,6 @@
|
|||
(:require [re-frame.core :refer [subscribe dispatch dispatch-sync]]
|
||||
[status-im.components.react :refer [view
|
||||
text
|
||||
text-input
|
||||
image
|
||||
linear-gradient
|
||||
touchable-highlight
|
||||
|
@ -18,8 +17,7 @@
|
|||
icon-search
|
||||
icon-back
|
||||
icon-qr
|
||||
button-input
|
||||
white-form-text-input]]
|
||||
button-input]]
|
||||
[status-im.i18n :refer [label]]
|
||||
[status-im.accounts.login.styles :as st]))
|
||||
|
||||
|
|
|
@ -3,7 +3,6 @@
|
|||
(:require [re-frame.core :refer [subscribe dispatch dispatch-sync]]
|
||||
[status-im.components.react :refer [view
|
||||
text
|
||||
text-input
|
||||
image
|
||||
linear-gradient
|
||||
touchable-highlight]]
|
||||
|
|
|
@ -27,7 +27,7 @@
|
|||
:margin-top 2
|
||||
:margin-bottom 4
|
||||
:margin-right 2
|
||||
:elevation 3}
|
||||
:elevation 2}
|
||||
:tag {:flex-direction "column"
|
||||
:background-color "#7099e619"
|
||||
:border-radius 5
|
||||
|
|
|
@ -4,7 +4,6 @@
|
|||
[status-im.components.react :refer [view
|
||||
icon
|
||||
text
|
||||
text-input
|
||||
touchable-highlight]]
|
||||
[status-im.chat.styles.input :as st]))
|
||||
|
||||
|
|
|
@ -8,7 +8,6 @@
|
|||
icon
|
||||
image
|
||||
text
|
||||
text-input
|
||||
touchable-highlight
|
||||
web-view
|
||||
scroll-view]]
|
||||
|
|
|
@ -43,20 +43,30 @@
|
|||
:text-align :center})
|
||||
|
||||
(def status-container
|
||||
{:margin-left 16
|
||||
:margin-right 16
|
||||
:margin-top (if p/ios? 5 5)
|
||||
:align-items :center})
|
||||
{:margin-left 16
|
||||
:margin-right 16
|
||||
:flex-direction "row"
|
||||
:margin-top (if p/ios? 5 5)
|
||||
:justify-content :center})
|
||||
|
||||
(def status-input
|
||||
{:align-self "stretch"
|
||||
:height 56
|
||||
(def status-view
|
||||
{:height 56
|
||||
:width 200
|
||||
:font-size 14
|
||||
:padding-left 4
|
||||
:text-align :center
|
||||
:text-align-vertical :top
|
||||
:color text2-color})
|
||||
|
||||
(def status-input
|
||||
(merge status-view
|
||||
{:padding-left 4
|
||||
:padding-top (if p/ios? 0 5)}))
|
||||
|
||||
(def status-text
|
||||
(merge status-view
|
||||
{:padding-left 0
|
||||
:padding-top 5}))
|
||||
|
||||
(def menu-items-container
|
||||
{:flex 1
|
||||
:margin-top 20
|
||||
|
|
|
@ -12,10 +12,12 @@
|
|||
touchable-without-feedback
|
||||
touchable-opacity]]
|
||||
[status-im.components.text-field.view :refer [text-field]]
|
||||
[status-im.components.status-view.view :refer [status-view]]
|
||||
[status-im.components.drawer.styles :as st]
|
||||
[status-im.profile.validations :as v]
|
||||
[status-im.resources :as res]
|
||||
[status-im.utils.gfycat.core :refer [generate-gfy]]
|
||||
[status-im.utils.utils :refer [clean-text]]
|
||||
[status-im.i18n :refer [label]]
|
||||
[status-im.components.react :refer [dismiss-keyboard!]]
|
||||
[clojure.string :as str]
|
||||
|
@ -39,18 +41,13 @@
|
|||
:font :default}
|
||||
name]])
|
||||
|
||||
(defn clean-text [s]
|
||||
(-> s
|
||||
(str/replace #"\n" " ")
|
||||
(str/replace #"\r" "")
|
||||
(str/trim)))
|
||||
|
||||
(defn drawer-menu []
|
||||
(let
|
||||
[account (subscribe [:get-current-account])
|
||||
profile (subscribe [:get :profile-edit])
|
||||
keyboard-height (subscribe [:get :keyboard-height])
|
||||
placeholder (generate-gfy)]
|
||||
placeholder (generate-gfy)
|
||||
status-edit? (r/atom false)]
|
||||
(fn []
|
||||
(let [{:keys [name photo-path status]} @account
|
||||
{new-name :name new-status :status} @profile]
|
||||
|
@ -73,19 +70,28 @@
|
|||
:on-end-editing #(when (and new-name (not (str/blank? new-name)))
|
||||
(dispatch [:account-update {:name (clean-text new-name)}]))}]]
|
||||
[view st/status-container
|
||||
[text-input {:style st/status-input
|
||||
:editable true
|
||||
:multiline true
|
||||
:blur-on-submit true
|
||||
:maxLength 140
|
||||
:accessibility-label :input
|
||||
:placeholder (label :t/profile-no-status)
|
||||
:on-change-text #(dispatch [:set-in [:profile-edit :status] %])
|
||||
:on-blur (fn []
|
||||
(when (and new-status (not (str/blank? new-status)))
|
||||
(dispatch [:check-status-change (clean-text new-status)])
|
||||
(dispatch [:account-update {:status (clean-text new-status)}])))
|
||||
:default-value status}]]
|
||||
(if @status-edit?
|
||||
[text-input {:style st/status-input
|
||||
:editable true
|
||||
:multiline true
|
||||
:auto-focus true
|
||||
:blur-on-submit true
|
||||
:focus status-edit?
|
||||
:maxLength 140
|
||||
:accessibility-label :input
|
||||
:placeholder (label :t/profile-no-status)
|
||||
:on-change-text (fn [t]
|
||||
(dispatch [:set-in [:profile-edit :status] (clean-text t)]))
|
||||
:on-submit-editing (fn []
|
||||
(reset! status-edit? false)
|
||||
(when (and new-status (not (str/blank? new-status)))
|
||||
(dispatch [:check-status-change (clean-text new-status)])
|
||||
(dispatch [:account-update {:status (clean-text new-status)}])))
|
||||
:default-value status}]
|
||||
[status-view {:style st/status-text
|
||||
:on-press #(reset! status-edit? true)
|
||||
:number-of-lines 3
|
||||
:status status}])]
|
||||
[view st/menu-items-container
|
||||
[menu-item {:name (label :t/profile)
|
||||
:handler #(dispatch [:navigate-to :my-profile])}]
|
||||
|
@ -96,8 +102,7 @@
|
|||
[menu-item {:name (label :t/discovery)
|
||||
:handler #(dispatch [:navigate-to :discovery])}]
|
||||
[menu-item {:name (label :t/contacts)
|
||||
:handler #(dispatch [:navigate-to :contact-list])}]
|
||||
]
|
||||
:handler #(dispatch [:navigate-to :contact-list])}]]
|
||||
(when (zero? @keyboard-height)
|
||||
[text {:style st/feedback
|
||||
:font :default} (label :t/feedback)])
|
||||
|
|
|
@ -5,7 +5,6 @@
|
|||
[reagent.core :as r]
|
||||
[status-im.components.react :refer [view
|
||||
animated-view
|
||||
text-input
|
||||
text
|
||||
image
|
||||
touchable-highlight
|
||||
|
|
|
@ -67,13 +67,17 @@
|
|||
(assoc :style (merge style font)))]
|
||||
ts))))))
|
||||
|
||||
(defn text-input [props text]
|
||||
[text-input-class (merge
|
||||
{:underline-color-android :transparent
|
||||
:placeholder-text-color st/text2-color
|
||||
:placeholder "Type"
|
||||
:value text}
|
||||
props)])
|
||||
(defn text-input [{:keys [font style] :as opts
|
||||
:or {font :default}} text]
|
||||
(let [font (get-in platform-specific [:fonts (keyword font)])]
|
||||
[text-input-class (merge
|
||||
{:underline-color-android :transparent
|
||||
:placeholder-text-color st/text2-color
|
||||
:placeholder "Type"
|
||||
:value text}
|
||||
(-> opts
|
||||
(dissoc :font)
|
||||
(assoc :style (merge style font))))]))
|
||||
|
||||
(defn icon
|
||||
([n] (icon n {}))
|
||||
|
|
|
@ -0,0 +1,28 @@
|
|||
(ns status-im.components.status-view.view
|
||||
(:require-macros [status-im.utils.views :refer [defview]])
|
||||
(:require [re-frame.core :refer [subscribe dispatch]]
|
||||
[clojure.string :as str]
|
||||
[status-im.components.react :refer [view text]]
|
||||
[status-im.utils.platform :refer [platform-specific]]))
|
||||
|
||||
(defn tag-view [tag]
|
||||
[text {:style {:color "#7099e6"}
|
||||
:font :medium}
|
||||
(str tag " ")])
|
||||
|
||||
(defn status-view [{:keys [style
|
||||
message-id
|
||||
status
|
||||
on-press
|
||||
number-of-lines]
|
||||
:or {message-id "msg"}}]
|
||||
[text {:style style
|
||||
:on-press on-press
|
||||
:number-of-lines number-of-lines
|
||||
:font :default}
|
||||
(for [[i status] (map-indexed vector (str/split status #" "))]
|
||||
(if (.startsWith status "#")
|
||||
^{:key (str "item-" message-id "-" i)}
|
||||
[tag-view status]
|
||||
^{:key (str "item-" message-id "-" i)}
|
||||
(str status " ")))])
|
|
@ -1,7 +1,6 @@
|
|||
(ns status-im.components.toolbar.view
|
||||
(:require [re-frame.core :refer [subscribe dispatch]]
|
||||
[status-im.components.react :refer [view
|
||||
text-input
|
||||
icon
|
||||
text
|
||||
image
|
||||
|
|
|
@ -4,7 +4,6 @@
|
|||
[clojure.string :as str]
|
||||
[status-im.components.react :refer [view
|
||||
text
|
||||
text-input
|
||||
image
|
||||
linear-gradient
|
||||
touchable-highlight]]
|
||||
|
|
|
@ -2,33 +2,19 @@
|
|||
(:require-macros [status-im.utils.views :refer [defview]])
|
||||
(:require [re-frame.core :refer [subscribe dispatch]]
|
||||
[clojure.string :as str]
|
||||
[status-im.components.react :refer [view text image touchable-highlight]]
|
||||
[status-im.components.react :refer [view text touchable-highlight]]
|
||||
[status-im.discovery.styles :as st]
|
||||
[status-im.components.status-view.view :refer [status-view]]
|
||||
[status-im.utils.gfycat.core :refer [generate-gfy]]
|
||||
[status-im.utils.identicon :refer [identicon]]
|
||||
[status-im.i18n :refer [label]]
|
||||
[status-im.components.chat-icon.screen :as ci]
|
||||
[status-im.utils.platform :refer [platform-specific]]
|
||||
[taoensso.timbre :as log]))
|
||||
|
||||
(defn tag-view [tag]
|
||||
[text {:style {:color "#7099e6"}
|
||||
:font :medium}
|
||||
(str tag " ")])
|
||||
|
||||
(defn status-view [item-style {:keys [message-id status]}]
|
||||
[text {:style (:status-text item-style)
|
||||
:font :default}
|
||||
(for [[i status] (map-indexed vector (str/split status #" "))]
|
||||
(if (.startsWith status "#")
|
||||
^{:key (str "item-" message-id "-" i)}
|
||||
[tag-view status]
|
||||
^{:key (str "item-" message-id "-" i)}
|
||||
(str status " ")))])
|
||||
[status-im.utils.platform :refer [platform-specific]]))
|
||||
|
||||
(defview discovery-list-item [{{:keys [name
|
||||
photo-path
|
||||
whisper-id]
|
||||
whisper-id
|
||||
message-id
|
||||
status]
|
||||
:as message} :message
|
||||
show-separator? :show-separator?
|
||||
{account-photo-path :photo-path
|
||||
|
@ -49,7 +35,9 @@
|
|||
(not (str/blank? contact-name)) contact-name
|
||||
(not (str/blank? name)) name
|
||||
:else (generate-gfy))]
|
||||
[status-view item-style message]]
|
||||
[status-view {:id message-id
|
||||
:style (:status-text item-style)
|
||||
:status status}]]
|
||||
[view (merge st/popular-list-item-avatar-container
|
||||
(:icon item-style))
|
||||
[touchable-highlight {:on-press #(dispatch [:start-chat whisper-id])}
|
||||
|
|
|
@ -3,7 +3,6 @@
|
|||
(:require [re-frame.core :refer [subscribe dispatch]]
|
||||
[status-im.resources :as res]
|
||||
[status-im.components.react :refer [view
|
||||
text-input
|
||||
text
|
||||
image
|
||||
icon
|
||||
|
|
|
@ -3,7 +3,6 @@
|
|||
(:require [re-frame.core :refer [subscribe dispatch]]
|
||||
[status-im.resources :as res]
|
||||
[status-im.components.react :refer [view
|
||||
text-input
|
||||
text
|
||||
image
|
||||
touchable-highlight
|
||||
|
|
|
@ -21,6 +21,7 @@
|
|||
[status-im.components.status-bar :refer [status-bar]]
|
||||
[status-im.components.text-field.view :refer [text-field]]
|
||||
[status-im.components.selectable-field.view :refer [selectable-field]]
|
||||
[status-im.components.status-view.view :refer [status-view]]
|
||||
[status-im.utils.phone-number :refer [format-phone-number]]
|
||||
[status-im.utils.image-processing :refer [img->base64]]
|
||||
[status-im.utils.platform :refer [platform-specific]]
|
||||
|
@ -28,9 +29,9 @@
|
|||
[status-im.profile.validations :as v]
|
||||
[status-im.profile.styles :as st]
|
||||
[status-im.utils.random :refer [id]]
|
||||
[status-im.utils.utils :refer [clean-text]]
|
||||
[status-im.components.image-button.view :refer [show-qr-button]]
|
||||
[status-im.i18n :refer [label]]
|
||||
[taoensso.timbre :as log]))
|
||||
[status-im.i18n :refer [label]]))
|
||||
|
||||
(defn toolbar [{:keys [account edit?]}]
|
||||
(let [profile-edit-data-valid? (s/valid? ::v/profile account)]
|
||||
|
@ -56,22 +57,10 @@
|
|||
:style (st/ok-btn-icon profile-edit-data-valid?)}]
|
||||
[icon :dots st/edit-btn-icon])]]]))
|
||||
|
||||
(defn- get-text
|
||||
[word]
|
||||
(let [props (merge {:key (id)}
|
||||
(if (str/starts-with? word "#")
|
||||
{:style st/hashtag}
|
||||
{}))]
|
||||
[text props (str word " ")]))
|
||||
|
||||
(defn- highlight-tags
|
||||
[status]
|
||||
(->>
|
||||
(str/split status #" ")
|
||||
(map get-text)))
|
||||
|
||||
(defn status-image-view [_]
|
||||
(let [component (r/current-component)
|
||||
just-opened? (r/atom true)
|
||||
input-ref (r/atom nil)
|
||||
set-status-height #(let [height (-> (.-nativeEvent %)
|
||||
(.-contentSize)
|
||||
(.-height))]
|
||||
|
@ -102,15 +91,23 @@
|
|||
:wrapper-style st/username-wrapper
|
||||
:value name
|
||||
:on-change-text #(dispatch [:set-in [:profile-edit :name] %])}]
|
||||
[text-input {:style (st/status-input (:height (r/state component)))
|
||||
:on-change #(set-status-height %)
|
||||
:on-content-size-change #(set-status-height %)
|
||||
:maxLength 140
|
||||
:multiline true
|
||||
:editable edit?
|
||||
:placeholder (label :t/profile-no-status)
|
||||
:on-change-text #(dispatch [:set-in [:profile-edit :status] %])
|
||||
:default-value status}]])})))
|
||||
(if (or edit? @just-opened?)
|
||||
[text-input {:ref #(reset! input-ref %)
|
||||
:style (st/status-input (:height (r/state component)))
|
||||
:multiline true
|
||||
:editable true
|
||||
:blur-on-submit true
|
||||
:on-content-size-change #(do (set-status-height %)
|
||||
(reset! just-opened? false))
|
||||
:max-length 140
|
||||
:placeholder (label :t/profile-no-status)
|
||||
:on-change-text (fn [t]
|
||||
(dispatch [:set-in [:profile-edit :status] (clean-text t)]))
|
||||
:on-submit-editing (fn []
|
||||
(.blur @input-ref))
|
||||
:default-value status}]
|
||||
[status-view {:style (st/status-text (:height (r/state component)))
|
||||
:status status}])])})))
|
||||
|
||||
(defview profile []
|
||||
[{whisper-identity :whisper-identity
|
||||
|
@ -189,9 +186,10 @@
|
|||
changed-account [:get :profile-edit]]
|
||||
(let [{:keys [phone
|
||||
address
|
||||
public-key] :as account} (if edit?
|
||||
changed-account
|
||||
current-account)]
|
||||
public-key]
|
||||
:as account} (if edit?
|
||||
changed-account
|
||||
current-account)]
|
||||
[scroll-view {:style st/profile
|
||||
:bounces false}
|
||||
[status-bar]
|
||||
|
|
|
@ -72,16 +72,26 @@
|
|||
:margin-left 55
|
||||
:margin-right 55})
|
||||
|
||||
(defn status-view [height]
|
||||
{:align-self "stretch"
|
||||
:font-size 14
|
||||
:height height
|
||||
:min-height 30
|
||||
:text-align "center"
|
||||
:color text2-color})
|
||||
|
||||
(defn status-input [height]
|
||||
{:align-self "stretch"
|
||||
:margin-left (if p/ios? 22 16)
|
||||
:margin-right 16
|
||||
:margin-top (if p/ios? 6 1)
|
||||
:font-size 14
|
||||
:height height
|
||||
:min-height 30
|
||||
:text-align "center"
|
||||
:color text2-color})
|
||||
(merge (status-view height)
|
||||
{:margin-left (if p/ios? 21 16)
|
||||
:margin-right 16
|
||||
:margin-top (if p/ios? 6 1)}))
|
||||
|
||||
(defn status-text [height]
|
||||
(merge (status-view (- height (if p/ios? 5 10)))
|
||||
{:margin-left 18
|
||||
:margin-right 18
|
||||
:margin-top 11
|
||||
:margin-bottom 0}))
|
||||
|
||||
(def btns-container
|
||||
{:margin-top 0
|
||||
|
|
|
@ -1,6 +1,7 @@
|
|||
(ns status-im.utils.utils
|
||||
(:require [status-im.constants :as const]
|
||||
[reagent.core :as r]))
|
||||
[reagent.core :as r]
|
||||
[clojure.string :as str]))
|
||||
|
||||
(defn require [module]
|
||||
(if (exists? js/window)
|
||||
|
@ -54,6 +55,12 @@
|
|||
(str (subs s 0 (- max 3)) "...")
|
||||
s))
|
||||
|
||||
(defn clean-text [s]
|
||||
(-> s
|
||||
(str/replace #"\n" " ")
|
||||
(str/replace #"\r" "")
|
||||
(str/trim)))
|
||||
|
||||
(defn first-index
|
||||
[cond coll]
|
||||
(loop [index 0
|
||||
|
|
Loading…
Reference in New Issue