status-react/src/status_im/chats_list/screen.cljs

(ns status-im.chats-list.screen
  (:require-macros [status-im.utils.views :refer [defview]])
  (:require [re-frame.core :refer [subscribe dispatch]]
            [status-im.components.react :refer [list-view
                                                list-item
                                                view
                                                animated-view
                                                text
                                                icon
                                                image
                                                touchable-highlight]]
            [status-im.components.action-button :refer [action-button
                                                        action-button-item]]
            [status-im.components.drawer.view :refer [open-drawer]]
            [status-im.components.styles :refer [color-blue]]
            [status-im.components.status-bar :refer [status-bar]]
            [status-im.components.toolbar-new.view :refer [toolbar toolbar-with-search]]
            [status-im.components.toolbar-new.actions :as act]
            [status-im.components.toolbar-new.styles :as tst]
            [status-im.components.icons.custom-icons :refer [ion-icon]]
            [status-im.components.react :refer [linear-gradient]]
            [status-im.components.sync-state.offline :refer [offline-view]]
            [status-im.components.context-menu :refer [context-menu]]
            [status-im.components.tabs.styles :refer [tabs-height]]
            [status-im.utils.listview :refer [to-datasource]]
            [status-im.chats-list.views.chat-list-item :refer [chat-list-item]]
            [status-im.chats-list.styles :as st]
            [status-im.i18n :refer [label]]
            [status-im.utils.platform :refer [platform-specific ios?]]))

(def android-toolbar-popup-options
  [{:text (label :t/edit) :value #(dispatch [:set-in [:chat-list-ui-props :edit?] true])}])

(defn android-toolbar-actions []
  [(act/search #(dispatch [:set-in [:toolbar-search :show] true]))
   (act/opts android-toolbar-popup-options)])

(def ios-toolbar-popup-options
  [{:text (label :t/edit-chats) :value #(dispatch [:set-in [:chat-list-ui-props :edit?] true])}
   {:text (label :t/search-chats) :value #(dispatch [:set-in [:toolbar-search :show] true])}])

(defn ios-toolbar-actions []
  [(act/opts ios-toolbar-popup-options)
   (act/add #(dispatch [:navigate-to :new-chat]))])

(defn toolbar-view []
  [toolbar {:title      (label :t/chats)
            :nav-action (act/hamburger open-drawer)
            :actions    (if ios?
                          (ios-toolbar-actions)
                          (android-toolbar-actions))}])

(defn toolbar-edit []
  [toolbar {:nav-action (act/back #(dispatch [:set-in [:chat-list-ui-props :edit?] false]))
            :title      (label :t/edit-chats)}])

(defn toolbar-search []
  [toolbar-with-search
   {:show-search?       true
    :search-key         :chat-list
    :title              (label :t/chats)
    :search-placeholder (label :t/search-for)}])

(defn chats-action-button []
  [action-button {:button-color color-blue
                  :offset-x     16
                  :offset-y     22
                  :hide-shadow  true
                  :spacing      13
                  :on-press     #(dispatch [:navigate-to :new-chat])}])

(defn chat-list-padding []
  [view {:height (if ios? 0 8)
         :background-color :white}])

(defn chat-shadow-item []
  (when-not ios?
    [view {:height 12}
     [chat-list-padding]
     [linear-gradient {:style  {:height 4}
                       :colors st/gradient-top-bottom-shadow}]]))

(defn render-separator-fn [chats]
  (fn [_ row-id _]
    (list-item
     (when (< row-id (dec (count chats)))
       ^{:key (str "separator-" row-id)}
       [view st/chat-separator-wrapper
        [view st/chat-separator-item]]))))

(defview chats-list []
  [chats        [:filtered-chats]
   edit?        [:get-in [:chat-list-ui-props :edit?]]
   search?      [:get-in [:toolbar-search :show]]
   tabs-hidden? [:tabs-hidden?]]
  [view st/chats-container
   (cond
     edit?   [toolbar-edit]
     search? [toolbar-search]
     :else   [toolbar-view])
   [list-view {:dataSource      (to-datasource chats)
               :renderRow       (fn [[id :as row] _ _]
                                  (list-item ^{:key id} [chat-list-item row edit?]))
               :renderHeader    #(when (seq chats) (list-item [chat-list-padding]))
               :renderFooter    #(when (seq chats) (list-item [chat-shadow-item]))
               :renderSeparator (when (get-in platform-specific [:chats :render-separator?])
                                  (render-separator-fn chats))
               :style           (st/list-container tabs-hidden?)}]
   (when (and (not edit?)
              (not search?)
              (get-in platform-specific [:chats :action-button?]))
     [chats-action-button])
   [offline-view]])