Response suggestions
This commit is contained in:
parent
5333eadd67
commit
a495fa7961
|
@ -0,0 +1,62 @@
|
|||
(ns status-im.chat.styles.response-suggestions
|
||||
(:require [status-im.components.styles :refer [font
|
||||
font-medium
|
||||
color-light-blue-transparent
|
||||
color-white
|
||||
color-black
|
||||
color-blue
|
||||
color-blue-transparent
|
||||
selected-message-color
|
||||
online-color
|
||||
separator-color
|
||||
text1-color
|
||||
text2-color
|
||||
text3-color]]))
|
||||
|
||||
(def header-height 50)
|
||||
(def suggestion-height 56)
|
||||
|
||||
(def header-container
|
||||
{:paddingLeft 16
|
||||
:height header-height
|
||||
:backgroundColor color-white})
|
||||
|
||||
(def header-text
|
||||
{:marginTop 18
|
||||
:fontSize 13
|
||||
:fontFamily font-medium
|
||||
:color text2-color})
|
||||
|
||||
(def suggestion-container
|
||||
{:flexDirection :column
|
||||
:paddingLeft 16
|
||||
:height 56
|
||||
:backgroundColor color-white})
|
||||
|
||||
(def suggestion-sub-container
|
||||
{:height suggestion-height
|
||||
:borderBottomWidth 1
|
||||
:borderBottomColor separator-color})
|
||||
|
||||
(def value-text
|
||||
{:marginTop 10
|
||||
:fontSize 12
|
||||
:fontFamily font
|
||||
:color text1-color})
|
||||
|
||||
(def description-text
|
||||
{:marginTop 2
|
||||
:fontSize 12
|
||||
:fontFamily font
|
||||
:color text2-color})
|
||||
|
||||
(defn suggestions-container [suggestions]
|
||||
{:flexDirection :row
|
||||
:marginVertical 1
|
||||
:marginHorizontal 0
|
||||
:height (min 150 (reduce + 0 (map #(if (:header %)
|
||||
header-height
|
||||
suggestion-height)
|
||||
suggestions)))
|
||||
:backgroundColor color-white
|
||||
:borderRadius 5})
|
|
@ -2,11 +2,11 @@
|
|||
(:require-macros [status-im.utils.views :refer [defview]])
|
||||
(:require [re-frame.core :refer [subscribe dispatch]]
|
||||
[status-im.components.react :refer [view
|
||||
icon
|
||||
text
|
||||
touchable-highlight
|
||||
list-view
|
||||
list-item]]
|
||||
icon
|
||||
text
|
||||
touchable-highlight
|
||||
list-view
|
||||
list-item]]
|
||||
[status-im.chat.styles.content-suggestions :as st]
|
||||
[status-im.utils.listview :refer [to-datasource]]))
|
||||
|
||||
|
@ -32,6 +32,6 @@
|
|||
:onPress (fn [])}
|
||||
[view [icon :drag_down st/drag-down-icon]]]
|
||||
[view (st/suggestions-container (count suggestions))
|
||||
[list-view {:dataSource (to-datasource suggestions)
|
||||
[list-view {:dataSource (to-datasource (filter :value suggestions))
|
||||
:keyboardShouldPersistTaps true
|
||||
:renderRow render-row}]]]))
|
||||
|
|
|
@ -8,6 +8,7 @@
|
|||
dismiss-keyboard!]]
|
||||
[status-im.chat.views.suggestions :refer [suggestions-view]]
|
||||
[status-im.chat.views.content-suggestions :refer [content-suggestions-view]]
|
||||
[status-im.chat.views.response-suggestions :refer [response-suggestions-view]]
|
||||
[status-im.chat.views.command :as command]
|
||||
[status-im.chat.views.response :as response]
|
||||
[status-im.chat.styles.plain-input :as st]
|
||||
|
@ -44,9 +45,10 @@
|
|||
response? (and command @to-msg-id)]
|
||||
[view st/input-container
|
||||
(if response? [response/request-info command])
|
||||
(if command
|
||||
[content-suggestions-view]
|
||||
[suggestions-view])
|
||||
(cond
|
||||
response? [response-suggestions-view]
|
||||
command [content-suggestions-view]
|
||||
:else [suggestions-view])
|
||||
[view st/input-view
|
||||
(if command
|
||||
(when-not response?
|
||||
|
|
|
@ -0,0 +1,39 @@
|
|||
(ns status-im.chat.views.response-suggestions
|
||||
(:require-macros [status-im.utils.views :refer [defview]])
|
||||
(:require [re-frame.core :refer [subscribe dispatch]]
|
||||
[status-im.components.react :refer [view
|
||||
icon
|
||||
text
|
||||
touchable-highlight
|
||||
list-view
|
||||
list-item]]
|
||||
[status-im.chat.styles.response-suggestions :as st]
|
||||
[status-im.utils.listview :refer [to-datasource]]))
|
||||
|
||||
(defn set-command-content [content]
|
||||
(dispatch [:set-chat-command-content content]))
|
||||
|
||||
(defn header-list-item [{:keys [header]}]
|
||||
[view st/header-container
|
||||
[text {:style st/header-text} header]])
|
||||
|
||||
(defn suggestion-list-item [{:keys [value description]}]
|
||||
[touchable-highlight {:onPress #(set-command-content value)}
|
||||
[view st/suggestion-container
|
||||
[view st/suggestion-sub-container
|
||||
[text {:style st/value-text} value]
|
||||
[text {:style st/description-text} description]]]])
|
||||
|
||||
(defn render-row [row _ _]
|
||||
(list-item (if (:header row)
|
||||
[header-list-item row]
|
||||
[suggestion-list-item row])))
|
||||
|
||||
(defview response-suggestions-view []
|
||||
[suggestions [:get-content-suggestions]]
|
||||
(when (seq suggestions)
|
||||
[view nil
|
||||
[view (st/suggestions-container suggestions)
|
||||
[list-view {:dataSource (to-datasource suggestions)
|
||||
:keyboardShouldPersistTaps true
|
||||
:renderRow render-row}]]]))
|
|
@ -4,19 +4,22 @@
|
|||
[status-im.utils.logging :as log]
|
||||
[clojure.string :as s]))
|
||||
|
||||
;; TODO stub data?
|
||||
(def suggestions
|
||||
{:phone [{:value "89171111111"
|
||||
{:phone [{:header "Phone number formats"}
|
||||
{:value "89171111111"
|
||||
:description "Number format 1"}
|
||||
{:value "+79171111111"
|
||||
{:value "+79171111111"
|
||||
:description "Number format 2"}
|
||||
{:value "9171111111"
|
||||
{:value "9171111111"
|
||||
:description "Number format 3"}]})
|
||||
|
||||
(defn get-content-suggestions [db command text]
|
||||
(or (when command
|
||||
(when-let [command-suggestions ((:command command) suggestions)]
|
||||
(filterv (fn [s]
|
||||
(and (.startsWith (:value s) (or text ""))
|
||||
(not= (:value s) text)))
|
||||
(or (:header s)
|
||||
(and (.startsWith (:value s) (or text ""))
|
||||
(not= (:value s) text))))
|
||||
command-suggestions)))
|
||||
[]))
|
||||
|
|
Loading…
Reference in New Issue