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

Implement activity logs photos component (#16760)

This commit is contained in:
Parvesh Monu 2023-07-25 00:49:26 +05:30 committed by GitHub
parent eb3de978ce
commit 2a8e6cb304
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
7 changed files with 92 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
src/quo2/components/notifications/activity_logs_photos/style.cljs Normal file
View File

@ -0,0 +1,13 @@
(ns quo2.components.notifications.activity-logs-photos.style)
(def photos-container
{:flex 1
:height 40
:flex-direction :row})
(defn photo
[index]
{:width 40
:height 40
:border-radius 10
:margin-left (if (= index 0) 0 8)})

14
src/quo2/components/notifications/activity_logs_photos/view.cljs Normal file
View File

@ -0,0 +1,14 @@
(ns quo2.components.notifications.activity-logs-photos.view
(:require [react-native.core :as rn]
[quo2.components.notifications.activity-logs-photos.style :as style]))
(defn view
[{:keys [photos]}]
[rn/view {:style style/photos-container}
(map-indexed
(fn [index photo]
^{:key index}
[rn/image
{:source photo
:style (style/photo index)}])
photos)])

2
src/quo2/core.cljs
View File

@ -63,6 +63,7 @@
quo2.components.navigation.floating-shell-button
quo2.components.navigation.page-nav
quo2.components.notifications.activity-log.view
quo2.components.notifications.activity-logs-photos.view
quo2.components.notifications.count-down-circle
quo2.components.notifications.info-count
quo2.components.notifications.notification-dot
@ -214,6 +215,7 @@
;;;; NOTIFICATIONS
(def activity-log quo2.components.notifications.activity-log.view/view)
(def activity-logs-photos quo2.components.notifications.activity-logs-photos.view/view)
(def info-count quo2.components.notifications.info-count/info-count)
(def notification-dot quo2.components.notifications.notification-dot/notification-dot)
(def count-down-circle quo2.components.notifications.count-down-circle/circle-timer)

6
src/status_im2/contexts/quo_preview/list_items/preview_lists.cljs
View File

@ -40,9 +40,9 @@
[{:source (resources/get-mock-image :photo1)}
{:source (resources/get-mock-image :photo2)}
{:source (resources/get-mock-image :photo3)}
{:source (resources/get-mock-image :photo4)}
{:source (resources/get-mock-image :photo5)}
{:source (resources/get-mock-image :photo6)}])
{:source (resources/get-mock-image :photo1)}
{:source (resources/get-mock-image :photo2)}
{:source (resources/get-mock-image :photo3)}])
(defn cool-preview
[]

4
src/status_im2/contexts/quo_preview/main.cljs
View File

@ -63,6 +63,7 @@
[status-im2.contexts.quo-preview.navigation.page-nav :as page-nav]
[status-im2.contexts.quo-preview.navigation.top-nav :as top-nav]
[status-im2.contexts.quo-preview.notifications.activity-logs :as activity-logs]
[status-im2.contexts.quo-preview.notifications.activity-logs-photos :as activity-logs-photos]
[status-im2.contexts.quo-preview.notifications.notification :as notification]
[status-im2.contexts.quo-preview.notifications.toast :as toast]
[status-im2.contexts.quo-preview.onboarding.small-option-card :as small-option-card]
@ -282,6 +283,9 @@
:notifications [{:name :activity-logs
:options {:topBar {:visible true}}
:component activity-logs/preview-activity-logs}
{:name :activity-logs-photos
:options {:topBar {:visible true}}
:component activity-logs-photos/preview-activity-logs-photos}
{:name :toast
:options {:topBar {:visible true}}
:component toast/preview-toasts}

53
src/status_im2/contexts/quo_preview/notifications/activity_logs_photos.cljs Normal file
View File

@ -0,0 +1,53 @@
(ns status-im2.contexts.quo-preview.notifications.activity-logs-photos
(:require [quo2.core :as quo]
[react-native.core :as rn]
[reagent.core :as reagent]
[quo2.foundations.colors :as colors]
[status-im2.common.resources :as resources]
[status-im2.contexts.quo-preview.preview :as preview]))
(def descriptor
[{:label "Photos Count:"
:key :count
:type :select
:options [{:key 1
:value "1"}
{:key 2
:value "2"}
{:key 3
:value "3"}
{:key 4
:value "4"}
{:key 5
:value "5"}
{:key 6
:value "6"}]}])
(def mock-photos
[(resources/get-mock-image :photo1)
(resources/get-mock-image :photo2)
(resources/get-mock-image :photo3)
(resources/get-mock-image :photo1)
(resources/get-mock-image :photo2)
(resources/get-mock-image :photo3)])
(defn cool-preview
[]
(let [state (reagent/atom {:count 1})]
(fn []
[rn/touchable-without-feedback {:on-press rn/dismiss-keyboard!}
[rn/view {:padding-bottom 150}
[preview/customizer state descriptor]
[rn/view
[quo/activity-logs-photos {:photos (take (:count @state) mock-photos)}]]]])))
(defn preview-activity-logs-photos
[]
[rn/view
{:background-color (colors/theme-colors colors/white colors/neutral-95)
:flex 1}
[rn/flat-list
{:flex 1
:keyboard-should-persist-taps :always
:header [cool-preview]
:key-fn str}]])

6
src/status_im2/contexts/quo_preview/switcher/switcher_cards.cljs
View File

@ -93,9 +93,9 @@
[{:source (resources/get-mock-image :photo1)}
{:source (resources/get-mock-image :photo2)}
{:source (resources/get-mock-image :photo3)}
{:source (resources/get-mock-image :photo4)}
{:source (resources/get-mock-image :photo5)}
{:source (resources/get-mock-image :photo6)}])
{:source (resources/get-mock-image :photo1)}
{:source (resources/get-mock-image :photo2)}
{:source (resources/get-mock-image :photo3)}])
(defn get-mock-content
[data]