Penpot/penpot
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-04-03 10:31:38 -05:00
Code Issues Activity

Merge remote-tracking branch 'origin/staging' into develop

Browse source
This commit is contained in:
Andrey Antukh 2024-10-10 14:51:16 +02:00
commit 66053ae9df
24 changed files with 1672 additions and 1610 deletions
.circleci
config.yml
CHANGES.md
backend/src/app
email.clj
rpc/commands
feedback.cljteams.clj
common/src/app/common/geom/shapes
path.cljc
exporter
shadow-cljs.edn
frontend
.nvmrcpackage.jsonplaywright.config.js
playwright/ui/pages
WorkspacePage.js
resources
plugins-runtime
index.js
templates
index.mustache
scripts
_helpers.js
src/app/main
data
plugins.cljs
ui
components
forms.cljs
shapes
frame.cljsshape.cljs
text
svg_text.cljs
static.cljs
workspace
plugins.cljs
shapes
frame.cljs
sidebar
layer_item.scss
viewport
hooks.cljs

2
.circleci/config.yml
View file

@ -111,7 +111,7 @@ jobs:
yarn run build:app:assets
clojure -M:dev:shadow-cljs release main
yarn playwright install --with-deps chromium
yarn e2e:test
yarn test:e2e
- run:
name: "backend tests"

18
CHANGES.md
View file

@ -18,10 +18,17 @@
### :rocket: Epics and highlights
- **New plugin system.**
Penpot now supports custom plugins. Read everything about developing your plugins [HERE](https://help.penpot.app/plugins/)
### :boom: Breaking changes & Deprecations
### :heart: Community contributions (Thank you!)
- All our plugins beta testers :heart:.
- Fix problem when translating multiple path points by @eeropic [#4459](https://github.com/penpot/penpot/issues/4459)
### :sparkles: New features
- **Replace Draft.js completely with a custom editor** [Taiga #7706](https://tree.taiga.io/project/penpot/us/7706)
@ -32,8 +39,17 @@
You can enable it with the `enable-feature-text-editor-v2` configuration flag.
### :bug: Bugs fixed
- Fix problem with go back button on error page [Taiga #8887](https://tree.taiga.io/project/penpot/issue/8887)
- Fix problem with shadows in text for Safari [Taiga #8770](https://tree.taiga.io/project/penpot/issue/8770)
- Fix a regression with feedback form subject and content limits [Taiga #8908](https://tree.taiga.io/project/penpot/issue/8908)
- Fix problem with stroke and filter ordering in frames [Github #5058](https://github.com/penpot/penpot/issues/5058)
- Fix problem with hover layers when hidden/blocked [Github #5074](https://github.com/penpot/penpot/issues/5074)
- Fix problem with precision on boolean calculation [Taiga #8482](https://tree.taiga.io/project/penpot/issue/8482)
- Fix problem when translating multiple path points [Github #4459](https://github.com/penpot/penpot/issues/4459)
## 2.2.1
### :bug: Bugs fixed
@ -178,7 +194,7 @@ time being.
### :boom: Breaking changes & Deprecations
### :heart: Community contributions (Thank you!)
### :heart: Communityq contributions (Thank you!)
### :sparkles: New features

6
backend/src/app/email.clj
View file

@ -315,15 +315,13 @@
(l/dbg :hint "sendmail"
:id (:id params)
:to (:to params)
:subject (str/trim (:subject params))
:body (str/join "," (map :type (:body params))))
:subject (str/trim (:subject params)))
(.sendMessage ^Transport transport
^MimeMessage message
(.getAllRecipients message))))))
(when (or (contains? cf/flags :log-emails)
(not (contains? cf/flags :smtp)))
(when (contains? cf/flags :log-emails)
(send-to-logger! cfg params))))
(defmethod ig/pre-init-spec ::handler [_]

4
backend/src/app/rpc/commands/feedback.clj
View file

@ -21,8 +21,8 @@
(def ^:private schema:send-user-feedback
[:map {:title "send-user-feedback"}
[:subject [:string {:max 250}]]
[:content [:string {:max 250}]]])
[:subject [:string {:max 400}]]
[:content [:string {:max 2500}]]])
(sv/defmethod ::send-user-feedback
{::doc/added "1.18"

41
backend/src/app/rpc/commands/teams.clj
View file

@ -780,6 +780,7 @@
(def ^:private schema:create-invitation
[:map {:title "params:create-invitation"}
[::rpc/profile-id ::sm/uuid]
[:team
[:map
[:id ::sm/uuid]
@ -936,7 +937,7 @@
(map :email))
(defn- create-team-invitations
[{:keys [::db/conn] :as cfg} profile team role emails]
[{:keys [::db/conn] :as cfg} {:keys [profile team role emails] :as params}]
(let [join-requests (into #{} xf:map-email
(get-valid-requests-email conn (:id team)))
team-members (into #{} xf:map-email
@ -950,11 +951,7 @@
;; We don't send invitations to
;; join-requested members
(remove join-requests)
(map (fn [email]
{:email email
:team team
:profile profile
:role role}))
(map (fn [email] (assoc params :email email)))
(keep (partial create-invitation cfg)))
emails)]
@ -980,7 +977,7 @@
join the team."
{::doc/added "1.17"
::sm/params schema:create-team-invitations}
[cfg {:keys [::rpc/profile-id team-id emails role] :as params}]
[cfg {:keys [::rpc/profile-id team-id emails] :as params}]
(let [perms (get-permissions cfg profile-id team-id)
profile (db/get-by-id cfg :profile profile-id)
emails (into #{} (map profile/clean-email) emails)]
@ -1006,7 +1003,16 @@
(check-profile-muted cfg profile)
(let [team (db/get-by-id cfg :team team-id)
invitations (db/tx-run! cfg create-team-invitations profile team role emails)]
;; NOTE: Is important pass RPC method params down to the
;; `create-team-invitations` because it uses the implicit
;; RPC properties from params for fill necessary data on
;; emiting an entry to the audit-log
invitations (db/tx-run! cfg create-team-invitations
(-> params
(assoc :profile profile)
(assoc :team team)
(assoc :emails emails)))]
(with-meta {:total (count invitations)
:invitations invitations}
{::audit/props {:invitations (count invitations)}}))))
@ -1057,17 +1063,16 @@
(audit/submit! cfg event))
;; Create invitations for all provided emails.
(let [profile (db/get-by-id conn :profile profile-id)]
(->> emails
(map (fn [email]
(-> params
(assoc :team team)
(assoc :profile profile)
(assoc :email email)
(assoc :role role))))
(run! (partial create-invitation cfg))))
(let [profile (db/get-by-id conn :profile profile-id)
params (-> params
(assoc :team team)
(assoc :profile profile)
(assoc :role role))
invitations (->> emails
(map (fn [email] (assoc params :email email)))
(map (partial create-invitation cfg)))]
(vary-meta team assoc ::audit/props {:invitations (count emails)})))
(vary-meta team assoc ::audit/props {:invitations (count invitations)}))))
;; --- Query: get-team-invitation-token

6
common/src/app/common/geom/shapes/path.cljc
View file

@ -852,8 +852,10 @@
(defn ray-overlaps?
[ray-point {selrect :selrect}]
(and (>= (:y ray-point) (:y1 selrect))
(<= (:y ray-point) (:y2 selrect))))
(and (or (> (:y ray-point) (:y1 selrect))
(mth/almost-zero? (- (:y ray-point) (:y1 selrect))))
(or (< (:y ray-point) (:y2 selrect))
(mth/almost-zero? (- (:y ray-point) (:y2 selrect))))))
(defn content->geom-data
[content]

3
exporter/shadow-cljs.edn
View file

@ -15,8 +15,7 @@
:output-wrapper false}
:release
{:closure-defines {goog.debug.LOGGING_ENABLED true}
:compiler-options
{:compiler-options
{:fn-invoke-direct true
:source-map true
:optimizations #shadow/env ["PENPOT_BUILD_OPTIMIZATIONS" :as :keyword :default :simple]

2
frontend/.nvmrc
View file

@ -1 +1 @@
v14.15.0
v20.11.1

2
frontend/package.json
View file

@ -23,7 +23,6 @@
"build:storybook:cljs": "clojure -M:dev:shadow-cljs release storybook",
"build:renderer": "yarn run wasm-pack build ./renderer --target web --out-dir ../resources/public/js/renderer --release",
"e2e:server": "node ./scripts/e2e-server.js",
"e2e:test": "playwright test --project default",
"fmt:clj": "cljfmt fix --parallel=true src/ test/",
"fmt:clj:check": "cljfmt check --parallel=false src/ test/",
"fmt:js": "yarn run prettier -c src/**/*.stories.jsx -c playwright/**/*.js -c scripts/**/*.js -w",
@ -35,6 +34,7 @@
"test:compile": "clojure -M:dev:shadow-cljs compile test --config-merge '{:autorun false}'",
"test:run": "node target/tests.cjs",
"test:watch": "clojure -M:dev:shadow-cljs watch test",
"test:e2e": "playwright test --project default",
"translations": "node ./scripts/translations.js",
"watch": "yarn run watch:app:assets",
"watch:app:assets": "node ./scripts/watch.js",

2
frontend/playwright.config.js
View file

@ -56,7 +56,7 @@ export default defineConfig({
/* Run your local dev server before starting the tests */
webServer: {
timeout: 2 * 60 * 1000,
command: "yarn e2e:server",
command: "yarn run e2e:server",
url: "http://localhost:3000",
reuseExistingServer: !process.env.CI,
},

2
frontend/playwright/ui/pages/WorkspacePage.js
View file

@ -168,7 +168,7 @@ export class WorkspacePage extends BaseWebSocketPage {
async moveSelectionToShape(name) {
await this.page.locator("rect.viewport-selrect").hover();
await this.page.mouse.down();
await this.viewport.getByTestId(name).first().hover({ force: true });
await this.viewport.getByText(name).first().hover({ force: true });
await this.page.mouse.up();
}

3045
frontend/resources/plugins-runtime/index.js
View file

File diff suppressed because it is too large Load diff

2
frontend/resources/templates/index.mustache
View file

@ -29,7 +29,7 @@
<script defer src="{{& polyfills}}"></script>
{{/manifest}}
<script type="module" src="{{pluginRuntimeUri}}/index.js"></script>
<script type="module" src="{{& pluginRuntimeUri}}"></script>
<script>
window.penpotTranslations = JSON.parse({{& translations}});

23
frontend/scripts/_helpers.js
View file

@ -181,14 +181,16 @@ export async function watch(baseDir, predicate, callback) {
}
async function readShadowManifest() {
const ts = Date.now();
try {
const manifestPath = "resources/public/js/manifest.json";
let content = await fs.readFile(manifestPath, { encoding: "utf8" });
content = JSON.parse(content);
const index = {
config: "js/config.js?ts=" + Date.now(),
polyfills: "js/polyfills.js?ts=" + Date.now(),
ts: ts,
config: "js/config.js?ts=" + ts,
polyfills: "js/polyfills.js?ts=" + ts,
};
for (let item of content) {
@ -198,12 +200,13 @@ async function readShadowManifest() {
return index;
} catch (cause) {
return {
config: "js/config.js",
polyfills: "js/polyfills.js",
main: "js/main.js",
shared: "js/shared.js",
worker: "js/worker.js",
rasterizer: "js/rasterizer.js",
ts: ts,
config: "js/config.js?ts=" + ts,
polyfills: "js/polyfills.js?ts=" + ts,
main: "js/main.js?ts=" + ts,
shared: "js/shared.js?ts=" + ts,
worker: "js/worker.js?ts=" + ts,
rasterizer: "js/rasterizer.js?ts=" + ts,
};
}
}
@ -409,8 +412,8 @@ async function generateTemplates() {
const pluginRuntimeUri =
process.env.PENPOT_PLUGIN_DEV === "true"
? "http://localhost:4200"
: "./plugins-runtime";
? "http://localhost:4200/index.js?ts=" + manifest.ts
: "plugins-runtime/index.js?ts=" + manifest.ts;
content = await renderTemplate(
"resources/templates/index.mustache",

7
frontend/src/app/main/data/plugins.cljs
View file

@ -26,6 +26,13 @@
(catch :default e
(.error js/console "Error" e))))
(defn close-plugin!
[{:keys [plugin-id]}]
(try
(.ɵunloadPlugin ^js ug/global plugin-id)
(catch :default e
(.error js/console "Error" e))))
(defn delay-open-plugin
[plugin]
(ptk/reify ::delay-open-plugin

3
frontend/src/app/main/ui/components/forms.cljs
View file

@ -483,7 +483,8 @@
;; Empty values means "submit" the form (whent some items have been added
(when (and (kbd/enter? event) (str/empty? @value) (not-empty @items))
(on-submit form))
(when (fn? on-submit)
(on-submit form event)))
;; If we have a string in the input we add it only if valid
(when (and (valid-item-fn val) (not (str/empty? @value)))

44
frontend/src/app/main/ui/shapes/frame.cljs
View file

@ -15,6 +15,7 @@
[app.main.ui.context :as muc]
[app.main.ui.shapes.attrs :as attrs]
[app.main.ui.shapes.custom-stroke :refer [shape-fills shape-strokes]]
[app.main.ui.shapes.filters :as filters]
[app.util.debug :as dbg]
[app.util.object :as obj]
[rumext.v2 :as mf]))
@ -65,6 +66,11 @@
render-id (mf/use-ctx muc/render-id)
filter-id-blur (dm/fmt "filter-blur-%" render-id)
filter-id-shadows (dm/fmt "filter-shadow-%" render-id)
filter-str-blur (filters/filter-str filter-id-blur shape)
filter-str-shadows (filters/filter-str filter-id-shadows shape)
x (dm/get-prop shape :x)
y (dm/get-prop shape :y)
w (dm/get-prop shape :width)
@ -86,29 +92,37 @@
:className "frame-background"})))
path? (some? (.-d props))]
[:*
[:g {:clip-path (when-not ^boolean show-content?
(frame-clip-url shape render-id))
;; A frame sets back normal fill behavior (default
;; transparent). It may have been changed to default black
;; if a shape coming from an imported SVG file is
;; rendered. See main.ui.shapes.attrs/add-style-attrs.
:fill "none"
:opacity opacity}
;; We need to separate blur from shadows because the blur is applied to the strokes
;; while the shadows have to be placed *under* the stroke (for example, the inner shadows)
;; and the shadows needs to be applied only to the content (without the stroke)
[:g {:filter filter-str-blur}
[:defs
[:& filters/filters {:shape (dissoc shape :blur) :filter-id filter-id-shadows}]
[:& filters/filters {:shape (assoc shape :shadow []) :filter-id filter-id-blur}]]
[:& shape-fills {:shape shape}
(if ^boolean path?
[:> :path props]
[:> :rect props])]
;; This need to be separated in two layers so the clip doesn't affect the shadow filters
;; otherwise the shadow will be clipped and not visible
[:g {:filter filter-str-shadows}
[:g {:clip-path (when-not ^boolean show-content? (frame-clip-url shape render-id))
;; A frame sets back normal fill behavior (default
;; transparent). It may have been changed to default black
;; if a shape coming from an imported SVG file is
;; rendered. See main.ui.shapes.attrs/add-style-attrs.
:fill "none"
:opacity opacity}
children]
[:& shape-fills {:shape shape}
(if ^boolean path?
[:> :path props]
[:> :rect props])]
children]]
[:& shape-strokes {:shape shape}
(if ^boolean path?
[:> :path props]
[:> :rect props])]]))
(mf/defc frame-thumbnail-image
{::mf/wrap-props false}
[props]

47
frontend/src/app/main/ui/shapes/shape.cljs
View file

@ -56,7 +56,6 @@
(let [shape (unchecked-get props "shape")
children (unchecked-get props "children")
pointer-events (unchecked-get props "pointer-events")
disable-shadows? (unchecked-get props "disable-shadows?")
shape-id (dm/get-prop shape :id)
preview-blend-mode-ref
@ -67,7 +66,6 @@
type (dm/get-prop shape :type)
render-id (h/use-render-id)
filter-id (dm/str "filter-" render-id)
styles (-> (obj/create)
(obj/set! "pointerEvents" pointer-events)
(cond-> (not (cfh/frame-shape? shape))
@ -82,32 +80,30 @@
shape-without-blur (dissoc shape :blur)
shape-without-shadows (assoc shape :shadow [])
filter-id (dm/str "filter-" render-id)
filter-str
(when (and (or (cfh/group-shape? shape)
(cfh/frame-shape? shape)
(cfh/svg-raw-shape? shape))
(not disable-shadows?))
(when (or (cfh/group-shape? shape)
(cfh/svg-raw-shape? shape))
(filters/filter-str filter-id shape))
wrapper-props
(-> (obj/clone props)
(obj/unset! "shape")
(obj/unset! "children")
(obj/unset! "disable-shadows?")
(obj/set! "ref" ref)
(obj/set! "id" (dm/fmt "shape-%" shape-id))
(obj/set! "data-testid" (:name shape))
;; TODO: This is added for backward compatibility.
(cond-> (and (cfh/text-shape? shape) (empty? (:position-data shape)))
(-> (obj/set! "x" (:x shape))
(obj/set! "y" (:y shape))
(obj/set! "width" (:width shape))
(obj/set! "height" (:height shape))))
(obj/set! "style" styles))
wrapper-props
(cond-> wrapper-props
;; NOTE: This is added for backward compatibility
(and (cfh/text-shape? shape)
(empty? (:position-data shape)))
(-> (obj/set! "x" (:x shape))
(obj/set! "y" (:y shape))
(obj/set! "width" (:width shape))
(obj/set! "height" (:height shape)))
(= :group type)
(-> (attrs/add-fill-props! shape render-id)
(attrs/add-border-props! shape))
@ -115,11 +111,13 @@
(some? filter-str)
(obj/set! "filter" filter-str))
svg-group? (and (contains? shape :svg-attrs) (= :group type))
svg-group?
(and (contains? shape :svg-attrs) (= :group type))
children (cond-> children
svg-group?
(propagate-wrapper-styles wrapper-props))]
children
(cond-> children
svg-group?
(propagate-wrapper-styles wrapper-props))]
[:& (mf/provider muc/render-id) {:value render-id}
[:> :g wrapper-props
@ -128,9 +126,14 @@
[:defs
[:& defs/svg-defs {:shape shape :render-id render-id}]
[:& filters/filters {:shape shape :filter-id filter-id}]
[:& filters/filters {:shape shape-without-blur :filter-id (dm/fmt "filter-shadow-%" render-id)}]
[:& filters/filters {:shape shape-without-shadows :filter-id (dm/fmt "filter-blur-%" render-id)}]
;; The filters for frames should be setup inside the container.
(when-not (cfh/frame-shape? shape)
[:*
[:& filters/filters {:shape shape :filter-id filter-id}]
[:& filters/filters {:shape shape-without-blur :filter-id (dm/fmt "filter-shadow-%" render-id)}]
[:& filters/filters {:shape shape-without-shadows :filter-id (dm/fmt "filter-blur-%" render-id)}]])
[:& frame/frame-clip-def {:shape shape :render-id render-id}]
;; Text fills need to be defined afterwards because they are specified per text-block

6
frontend/src/app/main/ui/shapes/text/svg_text.cljs
View file

@ -98,7 +98,11 @@
(obj/set! "fill" (str "url(#fill-" index "-" render-id ")")))}
(cond-> browser-props
(obj/merge! browser-props)))
shape (assoc shape :fills (:fills data))
shape (-> shape
(assoc :fills (:fills data))
;; The text elements have the shadow and blur already applied in the
;; group parent.
(dissoc :shadow :blur))
;; Need to create new render-id per text-block
render-id (dm/str render-id "-" index)]

5
frontend/src/app/main/ui/static.cljs
View file

@ -42,11 +42,10 @@
[:section {:class (stl/css :exception-layout)}
[:button
{:class (stl/css :exception-header)
:on-click rt/nav-root}
:on-click on-nav-root}
i/logo-icon
(when profile-id
(str "< "
(tr "not-found.no-permission.go-dashboard")))]
(str "< " (tr "not-found.no-permission.go-dashboard")))]
[:div {:class (stl/css :deco-before)} i/logo-error-screen]
(when-not profile-id
[:button {:class (stl/css :login-header)

1
frontend/src/app/main/ui/workspace/plugins.cljs
View file

@ -141,6 +141,7 @@
(st/emit! (ptk/event ::ev/event {::ev/name "remove-plugin"
:name (:name plugin)
:host (:host plugin)}))
(dp/close-plugin! plugin)
(preg/remove-plugin! plugin)
(reset! plugins-state* (preg/plugins-list)))))]

5
frontend/src/app/main/ui/workspace/shapes/frame.cljs
View file

@ -8,7 +8,6 @@
(:require
[app.common.data :as d]
[app.common.data.macros :as dm]
[app.common.files.helpers :as cfh]
[app.common.geom.shapes.bounds :as gsb]
[app.common.math :as mth]
[app.common.thumbnails :as thc]
@ -45,7 +44,7 @@
(refs/children-objects shape-id))
childs (mf/deref childs-ref)]
[:& shape-container {:shape shape :ref ref :disable-shadows? (cfh/is-direct-child-of-root? shape)}
[:& shape-container {:shape shape :ref ref}
[:& frame-shape {:shape shape :childs childs}]
(when *assert*
[:& wsd/shape-debug {:shape shape}])]))))
@ -187,7 +186,7 @@
(fdm/use-dynamic-modifiers objects (mf/ref-val content-ref) modifiers)
[:& shape-container {:shape shape :disable-shadows? thumbnail?}
[:& shape-container {:shape shape}
[:g.frame-container
{:id (dm/str "frame-container-" frame-id)
:key "frame-container"

4
frontend/src/app/main/ui/workspace/sidebar/layer_item.scss
View file

@ -230,6 +230,10 @@
}
}
.layer-row:hover .element-actions.selected & {
opacity: $op-10;
}
.layer-row.highlight &,
.layer-row:hover & {
display: flex;

2
frontend/src/app/main/ui/workspace/viewport/hooks.cljs
View file

@ -218,7 +218,7 @@
(rx/filter some?))))))
over-shapes-stream
(mf/with-memo [move-stream mod-str]
(mf/with-memo [query-point move-stream mod-str]
(->> (rx/merge
;; This stream works to "refresh" the outlines when the control is pressed
;; but the mouse has not been moved from its position.