Skip to content

Commit

Permalink
[#17288] refactor: migrate previews to new api
Browse files Browse the repository at this point in the history
  • Loading branch information
@mohsen-ghafouri
mohsen-ghafouri committed Oct 16, 2023
1 parent dd20d88 commit 3e2e853
Show file tree
Hide file tree
Showing 12 changed files with 79 additions and 299 deletions.
56 changes: 0 additions & 56 deletions src/quo2/components/settings/settings_list/style.cljs
View file

This file was deleted.

18 changes: 9 additions & 9 deletions src/status_im2/contexts/quo_preview/main.cljs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -385,23 +385,23 @@
{:name :react
:component react/preview-react}]
:settings [{:name :privacy-option
:component privacy-option/preview-options}
:component privacy-option/view}
{:name :accounts
:component accounts/preview-accounts}
:component accounts/view}
{:name :settings-item
:component settings-item/preview}
:component settings-item/view}
{:name :reorder-item
:component reorder-item/preview-reorder-item}
:component reorder-item/view}
{:name :category
:component category/preview}
:component category/view}
{:name :data-item
:component data-item/preview-data-item}
:component data-item/view}
{:name :section-label
:component section-label/preview}]
:component section-label/view}]
:share [{:name :qr-code
:component qr-code/preview}
:component qr-code/view}
{:name :share-qr-code
:component share-qr-code/preview-share-qr-code}]
:component share-qr-code/view}]
:switchers [{:name :group-messaging-card
:component group-messaging-card/view}
{:name :switcher-cards
Expand Down
36 changes: 10 additions & 26 deletions src/status_im2/contexts/quo_preview/settings/accounts.cljs
View file
Original file line number Diff line number Diff line change
@@ -1,26 +1,14 @@
(ns status-im2.contexts.quo-preview.settings.accounts
(:require [clojure.string :as string]
[quo2.components.settings.accounts.view :as quo]
[quo2.foundations.colors :as colors]
[react-native.core :as rn]
(:require [quo2.core :as quo]
[reagent.core :as reagent]
[status-im2.contexts.quo-preview.preview :as preview]))

(def descriptor
[{:label "Custom color"
:key :customization-color
:type :select
:options (map (fn [[k _]]
{:key k :value (string/capitalize (name k))})
colors/customization)}
{:label "Account name"
:key :account-name
:type :text}
{:label "Account address"
:key :account-address
:type :text}])
[(preview/customization-color-option)
{:key :account-name :type :text}
{:key :account-address :type :text}])

(defn preview-accounts
(defn view
[]
(let [state (reagent/atom {:customization-color :blue
:account-name "Booze for Dubai"
Expand All @@ -30,12 +18,8 @@
(js/alert "Menu button pressed"))})]
(fn []
[preview/preview-container
{:state state
:descriptor descriptor}
[rn/view
{:padding-vertical 100
:align-items :center
:background-color (colors/theme-colors
colors/neutral-30
colors/neutral-95)}
[quo/account @state]]])))
{:state state
:descriptor descriptor
:component-container-style {:padding-vertical 100
:align-items :center}}
[quo/account @state]])))
57 changes: 15 additions & 42 deletions src/status_im2/contexts/quo_preview/settings/category.cljs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,66 +6,39 @@
[status-im2.contexts.quo-preview.preview :as preview]))

(defn create-item-array
[n {:keys [right-icon? image? subtitle? list-type]}]
[n]
(vec
(for [i (range n)]
{:title (str "Item " i)
:subtitle (when subtitle? "subtitle")
:subtitle "subtitle"
:action :arrow
:right-icon (when right-icon? :i/globe)
:image (if (= list-type :settings) :icon (when image? (resources/get-mock-image :diamond)))
:right-icon :i/globe
:image (resources/get-mock-image :diamond)
:image-props :i/browser
:image-size (if image? 32 0)})))
:image-size 32})))

(def reorder-descriptor
[{:label "Right icon:"
:key :right-icon?
:type :boolean}
{:label "Image:"
:key :image?
:type :boolean}
{:label "Subtitle:"
:key :subtitle?
:type :boolean}
{:label "Blur:"
:key :blur?
:type :boolean}
{:label "List type:"
:key :list-type
(def descriptor
[{:key :blur? :type :boolean}
{:key :list-type
:type :select
:options [{:key :settings :value :settings} {:key :reorder :value :reorder}]}])

(def settings-descriptor
[{:label "Blur:"
:key :blur?
:type :boolean}
{:label "List type:"
:key :list-type
:type :select
:options [{:key :settings :value :settings} {:key :reorder :value :reorder}]}])

(defn preview
(defn view
[]
(let [state (reagent/atom {:label "Label"
:size "5"
:blur? false
:right-icon? true
:image? true
:subtitle? true
:list-type :settings})]
(let [state (reagent/atom {:label "Label"
:blur? false
:list-type :settings})]
(fn []
(let [data (reagent/atom (create-item-array (max (js/parseInt (:size @state)) 1) @state))]
(let [data (create-item-array 5)]
[preview/preview-container
{:state state
:descriptor (if (= (:list-type @state) :settings)
settings-descriptor
reorder-descriptor)
:descriptor descriptor
:blur? (:blur? @state)
:show-blur-background? true
:blur-dark-only? true
:blur-height 400}
[quo/category
{:list-type (:list-type @state)
:label (:label @state)
:data @data
:data data
:blur? (:blur? @state)}]]))))
59 changes: 19 additions & 40 deletions src/status_im2/contexts/quo_preview/settings/data_item.cljs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,56 +5,35 @@
[status-im2.common.resources :as resources]))

(def descriptor
[{:label "Blur:"
:key :blur?
:type :boolean}
{:label "Card:"
:key :card?
:type :boolean}
{:label "Icon Right:"
:key :icon-right?
:type :boolean}
{:label "Label:"
:type :select
[{:key :blur? :type :boolean}
{:key :card? :type :boolean}
{:key :icon-right? :type :boolean}
{:type :select
:key :label
:options [{:key :none
:value "None"}
{:key :graph
:value "Graph"}
{:key :preview
:value "Preview"}]}
{:label "Description:"
:type :select
:options [{:key :none}
{:key :graph}
{:key :preview}]}
{:type :select
:key :description
:options [{:key :default
:value "Default"}
{:key :icon
:value "Icon"}
{:key :network
:value "Network"}
{:key :account
:value "Account"}]}
{:label "Status:"
:type :select
:options [{:key :default}
{:key :icon}
{:key :network}
{:key :account}]}
{:type :select
:key :status
:options [{:key :default
:value "Default"}
{:key :loading
:value "Loading"}]}
{:label "Size:"
:type :select
:options [{:key :default}
{:key :loading}]}
{:type :select
:key :size
:options [{:key :default
:value "Default"}
{:key :small
:value "Small"}]}])
:options [{:key :default}
{:key :small}]}])

(def communities-list
[{:source (resources/get-mock-image :coinbase)}
{:source (resources/get-mock-image :decentraland)}
{:source (resources/get-mock-image :rarible)}])

(defn preview-data-item
(defn view
[]
(let [state (reagent/atom {:on-press #(js/alert (str "pressed"))
:blur? false
Expand Down
10 changes: 3 additions & 7 deletions src/status_im2/contexts/quo_preview/settings/privacy_option.cljs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,12 +5,8 @@
[status-im2.contexts.quo-preview.preview :as preview]))

(def descriptor
[{:label "Header:"
:key :header
:type :text}
{:label "Footer:"
:key :footer
:type :text}
[{:key :header :type :text}
{:key :footer :type :text}
{:label "Line 1:"
:key :li1
:type :text}
Expand All @@ -21,7 +17,7 @@
:key :li3
:type :text}])

(defn preview-options
(defn view
[]
(let [state (reagent/atom {:selected :contacts
:header "header"
Expand Down
23 changes: 6 additions & 17 deletions src/status_im2/contexts/quo_preview/settings/reorder_item.cljs
View file
Original file line number Diff line number Diff line change
@@ -1,10 +1,9 @@
(ns status-im2.contexts.quo-preview.settings.reorder-item
(:require
[quo2.core :as quo]
[react-native.core :as rn]
[status-im2.common.resources :as resources]
[quo2.foundations.resources :as quo2.resources]
[quo2.foundations.colors :as colors]
[status-im2.contexts.quo-preview.preview :as preview]
[quo2.components.settings.reorder-item.types :as types]))

(def mock-data
Expand Down Expand Up @@ -77,19 +76,9 @@
:on-change (fn [tab-id] (println tab-id))
:default-active 1}}])


(defn container
[]
{:padding-horizontal 38
:padding-vertical 20
:background-color (colors/theme-colors
colors/neutral-10
colors/neutral-100)
:flex 1})

(defn preview-reorder-item
(defn view
[]
[rn/scroll-view
{:style (container)}
(for [item mock-data]
[quo/reorder-item (item :data) (item :type)])])
(fn []
[preview/preview-container {}
(for [item mock-data]
[quo/reorder-item (item :data) (item :type)])]))
2 changes: 1 addition & 1 deletion src/status_im2/contexts/quo_preview/settings/section_label.cljs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@
{:key :blur?
:type :boolean}])

(defn preview
(defn view
[]
(let [state (reagent/atom {:section "Section label"
:description ""
Expand Down
6 changes: 2 additions & 4 deletions src/status_im2/contexts/quo_preview/settings/settings_item.cljs
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,6 @@
(ns status-im2.contexts.quo-preview.settings.settings-item
(:require
[quo2.core :as quo]
[react-native.core :as rn]
[status-im2.common.resources :as resources]
[reagent.core :as reagent]
[status-im2.contexts.quo-preview.preview :as preview]))
Expand Down Expand Up @@ -100,7 +99,7 @@
:context "Context"}
nil)}))

(defn preview
(defn view
[]
(let [state (reagent/atom {:title "Account"
:accessibility-label :settings-item
Expand All @@ -115,5 +114,4 @@
:blur? (:blur? @state)
:show-blur-background? true
:blur-dark-only? true}
[rn/view {:style {:flex 1}}
[quo/settings-item (get-props @state)]]])))
[quo/settings-item (get-props @state)]])))
Loading

0 comments on commit 3e2e853

Please sign in to comment.