Gaps on desktop

This commit is contained in:
Roman Volosovskyi 2019-04-22 15:09:38 +03:00
parent e725fffe22
commit b90f1e5324
No known key found for this signature in database
GPG Key ID: 0238A4B5ECEE70DE
5 changed files with 104 additions and 60 deletions

View File

@ -21,6 +21,10 @@
:on-select #(re-frame/dispatch [:chat.ui/clear-history-pressed])}
{:text (i18n/label :t/fetch-history)
:on-select #(re-frame/dispatch [:chat.ui/fetch-history-pressed chat-id])}
#_{:text "Fetch 48-60h"
:on-select #(re-frame/dispatch [:chat.ui/fetch-history-pressed48-60 chat-id])}
#_{:text "Fetch 84-96h"
:on-select #(re-frame/dispatch [:chat.ui/fetch-history-pressed84-96 chat-id])}
{:text (i18n/label :t/delete-chat)
:on-select #(re-frame/dispatch [(if (and group-chat (not public?))
:group-chats.ui/remove-chat-pressed

View File

@ -0,0 +1,54 @@
(ns status-im.ui.screens.chat.message.gap
(:require-macros [status-im.utils.views :as views])
(:require [status-im.ui.components.react :as react]
[re-frame.core :as re-frame]
[status-im.i18n :as i18n]
[status-im.utils.datetime :as datetime]
[status-im.ui.screens.chat.styles.input.gap :as style]))
(defn on-press
[ids first-gap? idx list-ref]
(fn []
(when (and list-ref @list-ref)
(.scrollToIndex @list-ref
#js {:index (max 0 (dec idx))
:viewOffset 20
:viewPosition 0.5}))
(if first-gap?
(re-frame/dispatch [:chat.ui/fetch-more])
(re-frame/dispatch [:chat.ui/fill-gaps ids]))))
(views/defview gap
[{:keys [gaps first-gap?]} idx list-ref]
(views/letsubs [in-progress? [:chats/fetching-gap-in-progress?
(if first-gap?
[:first-gap]
(:ids gaps))]
connected? [:mailserver/connected?]
range [:chats/range]
intro-status [:chats/current-chat-intro-status]]
(let [ids (:ids gaps)
intro-loading? (= intro-status :loading)]
(when-not (and first-gap? intro-loading?)
[react/view {:style style/gap-container}
[react/touchable-highlight
{:on-press (when (and connected? (not in-progress?))
(on-press ids first-gap? idx list-ref))
:style style/touchable}
[react/view {:style style/label-container}
(if in-progress?
[react/activity-indicator]
[react/nested-text
{:style (style/gap-text connected?)}
(i18n/label (if first-gap?
:t/load-more-messages
:t/fetch-messages))
(when first-gap?
[{:style style/date}
(let [date (datetime/timestamp->long-date
(* 1000 (:lowest-request-from range)))]
(str
"\n"
(i18n/label :t/load-messages-before
{:date date})))])])]]]))))

View File

@ -0,0 +1,33 @@
(ns status-im.ui.screens.chat.styles.input.gap
(:require [status-im.ui.components.colors :as colors]))
(def gap-container
{:align-self :stretch
:margin-top 24
:margin-bottom 24
:height 48
:align-items :center
:justify-content :center
:border-color colors/gray-light
:border-top-width 1
:border-bottom-width 1
:background-color :white})
(def label-container
{:flex 1
:align-items :center
:justify-content :center
:text-align :center})
(defn gap-text [connected?]
{:text-align :center
:color (if connected?
colors/blue
colors/gray)})
(def touchable
{:height 48})
(def date
{:typography :caption
:color colors/gray})

View File

@ -27,7 +27,8 @@
[status-im.ui.screens.chat.toolbar-content :as toolbar-content]
[status-im.utils.platform :as platform]
[status-im.utils.utils :as utils]
[status-im.utils.datetime :as datetime])
[status-im.utils.datetime :as datetime]
[status-im.ui.screens.chat.message.gap :as gap])
(:require-macros [status-im.utils.views :refer [defview letsubs]]))
(defn add-contact-bar [public-key]
@ -71,65 +72,9 @@
[{{:keys [value]} :row}]
[message-datemark/chat-datemark-mobile value])
(defview gap
[ids idx list-ref in-progress? connected? range first-gap? intro-loading?]
(when-not (and first-gap? intro-loading?)
[react/view {:align-self :stretch
:margin-top 24
:margin-bottom 24
:height 48
:align-items :center
:justify-content :center
:border-color colors/gray-light
:border-top-width 1
:border-bottom-width 1
:background-color :white}
[react/touchable-highlight
{:on-press (when (and connected? (not in-progress?))
#(do
(when @list-ref
(.scrollToIndex @list-ref #js {:index (max 0 (dec idx))
:viewOffset 20
:viewPosition 0.5}))
(if first-gap?
(re-frame/dispatch [:chat.ui/fetch-more])
(re-frame/dispatch [:chat.ui/fill-gaps ids]))))}
[react/view {:style {:flex 1
:align-items :center
:justify-content :center
:text-align :center}}
(if in-progress?
[react/activity-indicator]
[react/nested-text
{:style {:text-align :center
:color (if connected?
colors/blue
colors/gray)}}
(i18n/label (if first-gap?
:t/load-more-messages
:t/fetch-messages))
(when first-gap?
[{:style {:typography :caption
:color colors/gray}}
(str "\n"
(i18n/label :t/load-messages-before
{:date (datetime/timestamp->long-date
(* 1000 (:lowest-request-from range)))}))])])]]]))
(defview gap-wrapper [{:keys [gaps first-gap?]} idx list-ref]
(letsubs [in-progress? [:chats/fetching-gap-in-progress?
(if first-gap?
[:first-gap]
(:ids gaps))]
connected? [:mailserver/connected?]
range [:chats/range]
intro-status [:chats/current-chat-intro-status]]
[gap (:ids gaps) idx list-ref in-progress?
connected? range first-gap? (= intro-status :loading)]))
(defmethod message-row :gap
[{:keys [row idx list-ref]}]
[gap-wrapper row idx list-ref])
[gap/gap row idx list-ref])
(defmethod message-row :default
[{:keys [group-chat current-public-key modal? row]}]

View File

@ -25,7 +25,8 @@
[status-im.utils.identicon :as identicon]
[status-im.utils.utils :as utils]
[status-im.ui.screens.desktop.main.chat.emoji :as emoji]
[status-im.ui.components.icons.vector-icons :as icons])
[status-im.ui.components.icons.vector-icons :as icons]
[status-im.ui.screens.chat.message.gap :as gap])
(:require-macros [status-im.utils.views :as views]))
(defn toolbar-chat-view
@ -186,9 +187,16 @@
(defmethod message :default
[text me? {:keys [message-id chat-id message-status user-statuses from
current-public-key content-type outgoing type value] :as message}]
(if (= type :datemark)
(cond
(= type :datemark)
^{:key (str "datemark" message-id)}
[message.datemark/chat-datemark value]
(= type :gap)
^{:key (str "gap" value)}
[gap/gap message nil nil]
:else
(when (contains? constants/desktop-content-types content-type)
(reagent.core/create-class
{:component-did-mount