mirror of
https://github.com/penpot/penpot.git
synced 2025-01-06 14:50:20 -05:00
WIP: add pages list sidebar to workspace.
This commit is contained in:
parent
3a387d8820
commit
7ceca619e0
2 changed files with 69 additions and 9 deletions
|
@ -11,7 +11,6 @@
|
|||
[uxbox.ui.icons.dashboard :as icons]
|
||||
[uxbox.ui.icons :as i]
|
||||
[uxbox.ui.lightbox :as lightbox]
|
||||
[uxbox.ui.header :as ui.h]
|
||||
[uxbox.ui.users :as ui.u]
|
||||
[uxbox.ui.navigation :as nav]
|
||||
[uxbox.ui.dom :as dom]))
|
||||
|
@ -24,6 +23,11 @@
|
|||
(as-> (util/dep-in [:pages-by-id] [:workspace :page]) $
|
||||
(l/focus-atom $ s/state)))
|
||||
|
||||
(def ^:static pages-state
|
||||
(as-> (util/getter #(let [pid (get-in % [:workspace :project])]
|
||||
(dp/project-pages % pid))) $
|
||||
(l/focus-atom $ s/state)))
|
||||
|
||||
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
|
||||
;; Header
|
||||
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
|
||||
|
@ -86,7 +90,7 @@
|
|||
(def header
|
||||
(util/component
|
||||
{:render header-render
|
||||
:name "header"
|
||||
:name "workspace-header"
|
||||
:mixins [rum/reactive]}))
|
||||
|
||||
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
|
||||
|
@ -135,7 +139,59 @@
|
|||
:mixins [rum/reactive]}))
|
||||
|
||||
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
|
||||
;; Header
|
||||
;; Project Bar
|
||||
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
|
||||
|
||||
(defn- project-sidebar-item-render
|
||||
[own page-l]
|
||||
(let [page @page-l]
|
||||
(html
|
||||
[:li.single-page
|
||||
{:class "current"
|
||||
:on-click #(dp/go-to-project (:project page) (:id page))}
|
||||
[:div.tree-icon i/page]
|
||||
[:span (:name page)]
|
||||
[:div.options
|
||||
[:div {:on-click (constantly nil)} i/pencil]
|
||||
[:div {:class (when-not false "hide")
|
||||
:on-click (constantly nil)}
|
||||
i/trash]]])))
|
||||
|
||||
(def project-sidebar-item
|
||||
(util/component
|
||||
{:render project-sidebar-item-render
|
||||
:name "project-sidebar-item"
|
||||
:mixins [util/cursored]}))
|
||||
|
||||
(defn project-sidebar-render
|
||||
[own]
|
||||
(let [project (rum/react project-state)
|
||||
name (:name project)
|
||||
pages (rum/react pages-state)]
|
||||
(println "project-sidebar-render" pages)
|
||||
(html
|
||||
[:div#project-bar.project-bar
|
||||
(when-not (:visible project true)
|
||||
{:class "toggle"})
|
||||
[:div.project-bar-inside
|
||||
[:span.project-name name]
|
||||
[:ul.tree-view
|
||||
(for [page pages]
|
||||
(let [pageid (:id page)
|
||||
lense (l/in [:pages-by-id pageid])
|
||||
page-l (l/focus-atom lense s/state)]
|
||||
;; (println "project-sidebar-render$1" @page-l)
|
||||
(rum/with-key (project-sidebar-item page-l) (str pageid))))]
|
||||
#_(new-page conn project)]])))
|
||||
|
||||
(def project-sidebar
|
||||
(util/component
|
||||
{:render project-sidebar-render
|
||||
:name "project-sidebar"
|
||||
:mixins [rum/reactive]}))
|
||||
|
||||
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
|
||||
;; Workspace
|
||||
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
|
||||
|
||||
(defn workspace-render
|
||||
|
@ -147,8 +203,8 @@
|
|||
[:section.workspace-content
|
||||
;; Toolbar
|
||||
(toolbar)
|
||||
;; ;; Project bar
|
||||
;; (project-bar conn project page pages @project-bar-visible?)
|
||||
;; Project bar
|
||||
(project-sidebar)
|
||||
;; ;; Rules
|
||||
;; (horizontal-rule (rum/react ws/zoom))
|
||||
;; (vertical-rule (rum/react ws/zoom))
|
||||
|
|
|
@ -42,16 +42,16 @@
|
|||
(str ":rum/cursored-" (:rum/id state)))
|
||||
|
||||
(def ^:private
|
||||
deref-map-xform
|
||||
(map (fn [[k v]] [k (if (satisfies? IDeref v) @v v)])))
|
||||
deref-xform
|
||||
(map (fn [x] (if (satisfies? IDeref x) @x x))))
|
||||
|
||||
(defn- deref-props
|
||||
[data]
|
||||
(into {} deref-map-xform data))
|
||||
(into [] deref-xform data))
|
||||
|
||||
(defn- cursored-did-mount
|
||||
[state]
|
||||
(doseq [[k v] (:rum/props state)
|
||||
(doseq [v (:rum/props state)
|
||||
:when (satisfies? IWatchable v)]
|
||||
(add-watch v (cursored-key state)
|
||||
(fn [_ _ _ _]
|
||||
|
@ -126,6 +126,10 @@
|
|||
(fn [s f]
|
||||
(throw (ex-info "Not implemented" {})))))
|
||||
|
||||
(defn getter
|
||||
[f]
|
||||
(l/lens f #(throw (ex-info "Not implemented" {}))))
|
||||
|
||||
(defn derive
|
||||
[a path]
|
||||
(l/focus-atom (l/in path) a))
|
||||
|
|
Loading…
Reference in a new issue