Skip to content

Commit 994ec65

Browse files
J-Son89J-Son89
authored
chore: restructure quo2 menu page (#13959)
1 parent bc40e5c commit 994ec65

File tree

1 file changed

+81
-68
lines changed

1 file changed

+81
-68
lines changed

‎src/quo2/screens/main.cljs‎

Lines changed: 81 additions & 68 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,8 @@
44
[quo.design-system.colors :as colors]
55
[quo.react-native :as rn]
66
[quo.theme :as theme]
7+
[quo2.components.markdown.text :as quo2-text]
8+
[quo2.components.buttons.button :as quo2-button]
79
[quo2.screens.avatars.icon-avatar :as icon-avatar]
810
[quo2.screens.avatars.group-avatar :as group-avatar]
911
[quo2.screens.avatars.user-avatar :as user-avatar]
@@ -27,69 +29,72 @@
2729
[quo2.screens.wallet.token-overview :as token-overview]
2830
[re-frame.core :as re-frame]))
2931

30-
(def screens [{:name :quo2-texts
31-
:insets {:top false}
32-
:component text/preview-text}
33-
{:name :quo2-wallet-user-avatar
34-
:insets {:top false}
35-
:component wallet-user-avatar/preview-wallet-user-avatar}
36-
{:name :quo2-user-avatar
37-
:insets {:top false}
38-
:component user-avatar/preview-user-avatar}
39-
{:name :quo2-react
40-
:insets {:top false}
41-
:component react/preview-react}
42-
{:name :quo2-button
43-
:insets {:top false}
44-
:component button/preview-button}
45-
{:name :quo2-token-overview
46-
:insets {:top false}
47-
:component token-overview/preview-token-overview}
48-
{:name :quo2-icon-avatar
49-
:insets {:top false}
50-
:component icon-avatar/preview-icon-avatar}
51-
{:name :quo2-status-tags
52-
:insets {:top false}
53-
:component status-tags/preview-status-tags}
54-
{:name :quo2-messages-gap
55-
:insets {:top false}
56-
:component messages-gap/preview-messages-gap}
57-
{:name :quo2-context-tags
58-
:insets {:top false}
59-
:component context-tags/preview-context-tags}
60-
{:name :quo2-group-avatar
61-
:insets {:top false}
62-
:component group-avatar/preview-group-avatar}
63-
{:name :quo2-activity-logs
64-
:insets {:top false}
65-
:component activity-logs/preview-activity-logs}
66-
{:name :quo2-tabs
67-
:insets {:top false}
68-
:component tabs/preview-tabs}
69-
{:name :quo2-token-tag
70-
:insets {:top false}
71-
:component token-tag/preview-token-tag}
72-
{:name :quo2-segmented
73-
:insets {:top false}
74-
:component segmented/preview-segmented}
75-
{:name :quo2-counter
76-
:insets {:top false}
77-
:component counter/preview-counter}
78-
{:name :info-message
79-
:insets {:top false}
80-
:component info-message/preview-info-message}
81-
{:name :information-box
82-
:insets {:top false}
83-
:component information-box/preview-information-box}
84-
{:name :quo2-permission-tag
85-
:insets {:top false}
86-
:component permission-tag/preview-permission-tag}
87-
{:name :quo2-filter-tags
88-
:insets {:top false}
89-
:component filter-tags/preview-filter-tags}
90-
{:name :quo2-community-cards
91-
:insets {:top false}
92-
:component community-card/preview-community-card}])
32+
(def screens-categories
33+
{:avatar [{:name :group-avatar
34+
:insets {:top false}
35+
:component group-avatar/preview-group-avatar}
36+
{:name :icon-avatar
37+
:insets {:top false}
38+
:component icon-avatar/preview-icon-avatar}
39+
{:name :user-avatar
40+
:insets {:top false}
41+
:component user-avatar/preview-user-avatar}
42+
{:name :wallet-user-avatar
43+
:insets {:top false}
44+
:component wallet-user-avatar/preview-wallet-user-avatar}]
45+
:buttons [{:name :button
46+
:insets {:top false}
47+
:component button/preview-button}]
48+
:community [{:name :community-cards
49+
:insets {:top false}
50+
:component community-card/preview-community-card}]
51+
:counter [{:name :counter
52+
:insets {:top false}
53+
:component counter/preview-counter}]
54+
:info [{:name :info-message
55+
:insets {:top false}
56+
:component info-message/preview-info-message}
57+
{:name :information-box
58+
:insets {:top false}
59+
:component information-box/preview-information-box}]
60+
:markdown [{:name :texts
61+
:insets {:top false}
62+
:component text/preview-text}]
63+
:messages [{:name :gap
64+
:insets {:top false}
65+
:component messages-gap/preview-messages-gap}]
66+
:notifications [{:name :activity-logs
67+
:insets {:top false}
68+
:component activity-logs/preview-activity-logs}]
69+
:reactions [{:name :react
70+
:insets {:top false}
71+
:component react/preview-react}]
72+
:tabs [{:name :segmented
73+
:insets {:top false}
74+
:component segmented/preview-segmented}
75+
{:name :tabs
76+
:insets {:top false}
77+
:component tabs/preview-tabs}]
78+
:tags [{:name :context-tags
79+
:insets {:top false}
80+
:component context-tags/preview-context-tags}
81+
{:name :filter-tags
82+
:insets {:top false}
83+
:component filter-tags/preview-filter-tags}
84+
{:name :permission-tag
85+
:insets {:top false}
86+
:component permission-tag/preview-permission-tag}
87+
{:name :status-tags
88+
:insets {:top false}
89+
:component status-tags/preview-status-tags}
90+
{:name :token-tag
91+
:insets {:top false}
92+
:component token-tag/preview-token-tag}]
93+
:wallet [{:name :token-overview
94+
:insets {:top false}
95+
:component token-overview/preview-token-overview}]})
96+
97+
(def screens (flatten (map val screens-categories)))
9398

9499
(defn theme-switcher []
95100
[rn/view {:style {:flex-direction :row
@@ -124,12 +129,20 @@
124129
:padding-horizontal 16
125130
:background-color (:ui-background @colors/theme)}
126131
[theme-switcher]
132+
[quo2-text/text {:size :heading-1} "Preview Quo2 Components"]
127133
[rn/view
128-
(for [{:keys [name]} screens]
129-
^{:key name}
130-
[rn/touchable-opacity {:on-press #(re-frame/dispatch [:navigate-to name])}
131-
[rn/view {:style {:padding-vertical 8}}
132-
[quo/text (str "Preview " name)]]])]])]))
134+
(map (fn [category]
135+
[rn/view {:style {:margin-vertical 8}}
136+
[quo2-text/text
137+
{:weight :semi-bold
138+
:size :heading-2}
139+
(clojure.core/name (key category))]
140+
(for [{:keys [name]} (val category)]
141+
^{:key name}
142+
[quo2-button/button
143+
{:style {:margin-vertical 8}
144+
:on-press #(re-frame/dispatch [:navigate-to name])}
145+
(clojure.core/name name)])]) (sort screens-categories))]])]))
133146

134147
(def main-screens [{:name :quo2-preview
135148
:insets {:top false}

0 commit comments

Comments
 (0)