mirror of
https://github.com/penpot/penpot.git
synced 2025-01-22 14:39:45 -05:00
♻️ Refactor layout flags
This commit is contained in:
Andrés Moya
parent
17813e5090
commit
8f8dc80cad
3 changed files with 48 additions and 112 deletions
|
|
@ -54,23 +54,38 @@
|
|||
;; Workspace Initialization
|
||||
;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
|
||||
|
||||
(declare initialized)
|
||||
(declare file-initialized)
|
||||
|
||||
;; --- Initialize Workspace
|
||||
|
||||
(s/def ::layout-flag
|
||||
#{:sitemap
|
||||
:sitemap-pages
|
||||
:layers
|
||||
:libraries
|
||||
:document-history
|
||||
:colorpalette
|
||||
:element-options
|
||||
:rules
|
||||
:display-grid
|
||||
:snap-grid
|
||||
:dynamic-alignment})
|
||||
|
||||
(s/def ::layout-flags (s/coll-of ::layout-flag))
|
||||
|
||||
(def default-layout
|
||||
#{:sitemap
|
||||
:sitemap-pages
|
||||
:layers
|
||||
:element-options
|
||||
:rules
|
||||
:dynamic-alignment
|
||||
:display-grid
|
||||
:snap-grid})
|
||||
:snap-grid
|
||||
:dynamic-alignment})
|
||||
|
||||
(s/def ::options-mode #{:design :prototype})
|
||||
|
||||
(def workspace-default
|
||||
(def workspace-local-default
|
||||
{:zoom 1
|
||||
:flags #{}
|
||||
:selected (d/ordered-set)
|
||||
|
|
@ -81,7 +96,8 @@
|
|||
:options-mode :design
|
||||
:draw-interaction-to nil
|
||||
:left-sidebar? true
|
||||
:right-sidebar? true})
|
||||
:right-sidebar? true
|
||||
:color-for-rename nil})
|
||||
|
||||
(def initialize-layout
|
||||
(ptk/reify ::initialize-layout
|
||||
|
|
@ -89,12 +105,12 @@
|
|||
(update [_ state]
|
||||
(assoc state :workspace-layout default-layout))))
|
||||
|
||||
(defn initialize
|
||||
(defn initialize-file
|
||||
[project-id file-id]
|
||||
(us/verify ::us/uuid project-id)
|
||||
(us/verify ::us/uuid file-id)
|
||||
|
||||
(ptk/reify ::initialize
|
||||
(ptk/reify ::initialize-file
|
||||
ptk/UpdateEvent
|
||||
(update [_ state]
|
||||
(assoc state :workspace-presence {}))
|
||||
|
|
@ -118,9 +134,9 @@
|
|||
(->> stream
|
||||
(rx/filter #(= ::dwc/index-initialized %))
|
||||
(rx/map (constantly
|
||||
(initialized project-id file-id))))))))
|
||||
(file-initialized project-id file-id))))))))
|
||||
|
||||
(defn- initialized
|
||||
(defn- file-initialized
|
||||
[project-id file-id]
|
||||
(ptk/reify ::initialized
|
||||
ptk/UpdateEvent
|
||||
|
|
@ -131,7 +147,7 @@
|
|||
(assoc file :initialized true)
|
||||
file))))))
|
||||
|
||||
(defn finalize
|
||||
(defn finalize-file
|
||||
[project-id file-id]
|
||||
(ptk/reify ::finalize
|
||||
ptk/UpdateEvent
|
||||
|
|
@ -149,7 +165,7 @@
|
|||
ptk/UpdateEvent
|
||||
(update [_ state]
|
||||
(let [page (get-in state [:workspace-pages page-id])
|
||||
local (get-in state [:workspace-cache page-id] workspace-default)]
|
||||
local (get-in state [:workspace-cache page-id] workspace-local-default)]
|
||||
(-> state
|
||||
(assoc :current-page-id page-id ; mainly used by events
|
||||
:workspace-local local
|
||||
|
|
@ -276,6 +292,7 @@
|
|||
|
||||
(defn- toggle-layout-flag
|
||||
[state flag]
|
||||
(us/assert ::layout-flag flag)
|
||||
(update state :workspace-layout
|
||||
(fn [flags]
|
||||
(if (contains? flags flag)
|
||||
|
|
@ -289,19 +306,34 @@
|
|||
:sitemap
|
||||
:document-history
|
||||
:libraries])))
|
||||
right-sidebar? (not (empty? (keep layout [:icons
|
||||
:element-options])))]
|
||||
right-sidebar? (not (empty? (keep layout [:element-options])))]
|
||||
(update-in state [:workspace-local]
|
||||
assoc :left-sidebar? left-sidebar?
|
||||
:right-sidebar? right-sidebar?)))
|
||||
|
||||
(defn- check-auto-flags
|
||||
[state flags-to-toggle]
|
||||
(update state :workspace-layout
|
||||
(fn [flags]
|
||||
(cond
|
||||
(contains? (set flags-to-toggle) :assets)
|
||||
(disj flags :sitemap :layers)
|
||||
|
||||
(contains? (set flags-to-toggle) :sitemap)
|
||||
(disj flags :assets)
|
||||
|
||||
:else
|
||||
flags))))
|
||||
|
||||
(defn toggle-layout-flags
|
||||
[& flags]
|
||||
(us/assert ::layout-flags flags)
|
||||
(ptk/reify ::toggle-layout-flags
|
||||
ptk/UpdateEvent
|
||||
(update [_ state]
|
||||
(-> (reduce toggle-layout-flag state flags)
|
||||
(check-sidebars)))))
|
||||
(check-sidebars)
|
||||
(check-auto-flags flags)))))
|
||||
|
||||
;; --- Set element options mode
|
||||
|
||||
|
|
|
|||
|
|
@ -106,8 +106,8 @@
|
|||
(mf/use-effect
|
||||
(mf/deps project-id file-id)
|
||||
(fn []
|
||||
(st/emit! (dw/initialize project-id file-id))
|
||||
#(st/emit! (dw/finalize project-id file-id))))
|
||||
(st/emit! (dw/initialize-file project-id file-id))
|
||||
#(st/emit! (dw/finalize-file project-id file-id))))
|
||||
|
||||
(hooks/use-shortcuts dw/shortcuts)
|
||||
|
||||
|
|
|
|||
|
|
@ -1,96 +0,0 @@
|
|||
;; This Source Code Form is subject to the terms of the Mozilla Public
|
||||
;; License, v. 2.0. If a copy of the MPL was not distributed with this
|
||||
;; file, You can obtain one at http://mozilla.org/MPL/2.0/.
|
||||
;;
|
||||
;; This Source Code Form is "Incompatible With Secondary Licenses", as
|
||||
;; defined by the Mozilla Public License, v. 2.0.
|
||||
;;
|
||||
;; Copyright (c) 2020 UXBOX Labs SL
|
||||
|
||||
(ns uxbox.main.ui.workspace.sidebar.icons
|
||||
(:require
|
||||
#_[uxbox.main.ui.dashboard.icons :as icons]
|
||||
[rumext.alpha :as mf]
|
||||
[uxbox.common.data :as d]
|
||||
[uxbox.main.data.icons :as di]
|
||||
[uxbox.main.data.workspace :as dw]
|
||||
[uxbox.main.refs :as refs]
|
||||
[uxbox.main.store :as st]
|
||||
[uxbox.main.ui.icons :as i]
|
||||
[uxbox.main.ui.shapes.icon :as icon]
|
||||
[uxbox.util.data :refer [read-string]]
|
||||
[uxbox.util.dom :as dom]
|
||||
[uxbox.util.i18n :as i18n :refer [t]]
|
||||
[uxbox.util.router :as r]))
|
||||
|
||||
(mf/defc icons-collections
|
||||
[{:keys [collections value on-change] :as props}]
|
||||
[:div.figures-catalog
|
||||
;; extract component: set selector
|
||||
[:select.input-select.small
|
||||
{:on-change (fn [event]
|
||||
(let [val (-> (dom/get-target event)
|
||||
(dom/get-value))]
|
||||
(on-change (d/read-string val))))
|
||||
:value (pr-str value)}
|
||||
[:option {:value (pr-str nil)} "Storage"]
|
||||
(for [coll collections]
|
||||
[:option {:key (str "icon-coll" (:id coll))
|
||||
:value (pr-str (:id coll))}
|
||||
(:name coll)])]])
|
||||
|
||||
(mf/defc icons-list
|
||||
[{:keys [collection-id] :as props}]
|
||||
(let [icons [] #_(mf/deref icons/icons-iref) ;; TODO: Fix this
|
||||
|
||||
on-select
|
||||
(fn [event data]
|
||||
(st/emit! (dw/select-for-drawing :icon data)))]
|
||||
|
||||
#_(mf/use-effect
|
||||
{:fn #(st/emit! (di/fetch-icons collection-id))
|
||||
:deps (mf/deps collection-id)})
|
||||
|
||||
(for [icon icons
|
||||
:let [selected? (= nil #_(:drawing local) icon)]]
|
||||
[:div.figure-btn {:key (str (:id icon))
|
||||
:class (when selected? "selected")
|
||||
:on-click #(on-select % icon)
|
||||
}
|
||||
[:& icon/icon-svg {:shape icon}]])))
|
||||
|
||||
;; --- Icons (Component)
|
||||
|
||||
(mf/defc icons-toolbox
|
||||
[props]
|
||||
(let [locale (i18n/use-locale)
|
||||
selected (mf/use-state nil)
|
||||
|
||||
local (mf/deref refs/workspace-local)
|
||||
|
||||
collections (vals [] #_(mf/deref icons/collections-iref)) ;; TODO: FIX THIS
|
||||
collection (first collections)
|
||||
|
||||
on-close
|
||||
(fn [event]
|
||||
(st/emit! (dw/toggle-layout-flags :icons)))
|
||||
|
||||
on-change
|
||||
(fn [val]
|
||||
(st/emit! (dw/select-for-drawing nil))
|
||||
(reset! selected val))]
|
||||
|
||||
#_(mf/use-effect
|
||||
{:fn #(st/emit! di/fetch-collections)})
|
||||
|
||||
[:div#form-figures.tool-window
|
||||
[:div.tool-window-bar
|
||||
[:div.tool-window-icon i/icon-set]
|
||||
[:span (t locale "workspace.sidebar.icons")]
|
||||
[:div.tool-window-close {:on-click on-close} i/close]]
|
||||
[:div.tool-window-content
|
||||
[:& icons-collections {:collections collections
|
||||
:value @selected
|
||||
:on-change on-change
|
||||
}]
|
||||
[:& icons-list {:collection-id @selected}]]]))
|
||||
Loading…
Add table
Reference in a new issue