Commit Graph
136 Commits
Author SHA1 Message Date
Ivan Starkov 13da170ef4 experimental: Allow json in template literals (#3886)
## Description
closes #3872


- [x] - Builder support
- [x] - Publish support

## Steps for reproduction

Example

https://add-json.staging.webstudio.is/builder/8160e16d-5ab4-4249-86de-0c98a64526a3

https://test-json-ki9yj.wstd.work/

## Code Review

- [ ] hi @kof, I need you to do
  - conceptual review (architecture, feature-correctness)
  - detailed review (read every line)
  - test it on preview

## Before requesting a review

- [ ] made a self-review
- [ ] added inline comments where things may be not obvious (the "why",
not "what")

## Before merging

- [ ] tested locally and on preview environment (preview dev login:
5de6)
- [ ] updated [test
cases](https://github.com/webstudio-is/webstudio/blob/main/apps/builder/docs/test-cases.md)
document
- [ ] added tests
- [ ] if any new env variables are added, added them to `.env` file
2024-08-11 11:50:18 +03:00
Bogdan Chadkin f7a3a46b85 build: upgrade storybook (#3915)
Bumped storybook and removed unused addons.
2024-08-10 15:00:43 +02:00
Ivan Starkov 749d56920f chore: Load fixtures by build id, use current deplyment for sync (#3890)
## Description

- [x] - Sync fixtures by buildId `pnpm cli sync --buildId blabla`
- [x] - Sync with current branch deployment 

## Steps for reproduction

1. click button
2. expect xyz

## Code Review

- [ ] hi @kof, I need you to do
  - conceptual review (architecture, feature-correctness)
  - detailed review (read every line)
  - test it on preview

## Before requesting a review

- [ ] made a self-review
- [ ] added inline comments where things may be not obvious (the "why",
not "what")

## Before merging

- [ ] tested locally and on preview environment (preview dev login:
5de6)
- [ ] updated [test
cases](https://github.com/webstudio-is/webstudio/blob/main/apps/builder/docs/test-cases.md)
document
- [ ] added tests
- [ ] if any new env variables are added, added them to `.env` file
2024-08-07 01:29:05 +03:00
Bogdan Chadkin a22cbd4573 fix: automatically add json content-type to webhook forms (#3889)
Looks like I overlooked n8n automatically adds
content-type: application/json to requests.
2024-08-06 23:19:18 +02:00
Bogdan Chadkin 097d2922c3 build: remove unused eslint suppressions (#3876)
Looks like we forgot to enable the flag
2024-08-04 23:37:59 +02:00
Bogdan Chadkin 44b2e80c31 build: bump remix (#3865)
Ref https://github.com/remix-run/remix/releases/tag/remix%402.11.0

Upgraded to the latest remix. Nothing major.
2024-08-04 14:56:28 +02:00
Bogdan Chadkin 829d46aed6 refactor: split react-sdk/runtime (#3858)
Here split everything imported from react-sdk by published sites into
separate entry point react-sdk/runtime.

The result in ssg fixture is the following

```diff
-  429788 chunk-CuG10VAj.js
+  370366 chunk-D4NWbWis.js
```
2024-08-02 14:17:42 +02:00
Bogdan Chadkin f887b97587 refactor: remove legacy n8n handler (#3844)
Here testing new context.getDefaultActionResource in saas which replaces
form-handlers package.
2024-08-01 19:21:50 +02:00
Ivan Starkov f446df6a5d chore: Resync fixtures (#3852)
## Description

1. What is this PR about (link the issue and add a short description)

## Steps for reproduction

1. click button
2. expect xyz

## Code Review

- [ ] hi @kof, I need you to do
  - conceptual review (architecture, feature-correctness)
  - detailed review (read every line)
  - test it on preview

## Before requesting a review

- [ ] made a self-review
- [ ] added inline comments where things may be not obvious (the "why",
not "what")

## Before merging

- [ ] tested locally and on preview environment (preview dev login:
5de6)
- [ ] updated [test
cases](https://github.com/webstudio-is/webstudio/blob/main/apps/builder/docs/test-cases.md)
document
- [ ] added tests
- [ ] if any new env variables are added, added them to `.env` file
2024-08-01 17:59:06 +03:00
Ivan Starkov 54e686a4e3 experimental: Add ssg-netlify and ssg-vercel to the cli (#3835)
## Description

### Todos

- [x] - Expand support: `ssg` and `ssg-(netlify|vercel)` differ by only
one file. This expansion allows a single external template to apply to
multiple internal uses (previously hardcoded in prebuild, see
`defaults`).
- [x] - Add & test ssg-vercel and ssg-netlify constants.mjs templates to
support image optimizations.

## Steps for reproduction

```bash
cd ./fixtures/ssg
pnpm cli build --template ssg-netlify --template internal --preview && pnpm prettier --write .
pnpm build
```

then drag drop on netlify and see the result
[example](https://66a9d3c5c6bb86681c6611e4--inspiring-liger-df7a81.netlify.app/)
```html
<img alt="" width="14" height="16" src="/.netlify/images?url=%2Fassets%2Ficonly_svg_converted-converted_zMaMiAAutUl8XrITgz7d1.svg&amp;w=32&amp;q=80" class="w-image c161qeci" sizes="100vw" srcset="/.netlify/images?url=%2Fassets%2Ficonly_svg_converted-converted_zMaMiAAutUl8XrITgz7d1.svg&amp;w=16&amp;q=80 16w, /.netlify/images?url=%2Fassets%2Ficonly_svg_converted-converted_zMaMiAAutUl8XrITgz7d1.svg&amp;w=32&amp;q=80 32w" decoding="async" loading="lazy">
```


```bash
cd ./fixtures/ssg
pnpm cli build --template ssg-vercel --template internal --preview && pnpm prettier --write .
pnpm build
```

Upload to https://github.com/webstudio-is/ssg-vercel-test/tree/main
See vercel deployment
[example](https://ssg-vercel-test-r0a778rpj-getwebstudio.vercel.app/)

```html
<img alt="" width="14" height="16" src="/_vercel/image?url=%2Fassets%2Ficonly_svg_converted-converted_zMaMiAAutUl8XrITgz7d1.svg&amp;w=32&amp;q=80" class="w-image c161qeci" sizes="100vw" srcset="/_vercel/image?url=%2Fassets%2Ficonly_svg_converted-converted_zMaMiAAutUl8XrITgz7d1.svg&amp;w=16&amp;q=80 16w, /_vercel/image?url=%2Fassets%2Ficonly_svg_converted-converted_zMaMiAAutUl8XrITgz7d1.svg&amp;w=32&amp;q=80 32w" decoding="async" loading="lazy">
```





## Code Review

- [ ] hi @kof, I need you to do
  - conceptual review (architecture, feature-correctness)
  - detailed review (read every line)
  - test it on preview

## Before requesting a review

- [ ] made a self-review
- [ ] added inline comments where things may be not obvious (the "why",
not "what")

## Before merging

- [ ] tested locally and on preview environment (preview dev login:
5de6)
- [ ] updated [test
cases](https://github.com/webstudio-is/webstudio/blob/main/apps/builder/docs/test-cases.md)
document
- [ ] added tests
- [ ] if any new env variables are added, added them to `.env` file
2024-07-31 19:06:43 +03:00
Bogdan Chadkin 87d841f808 build: update fixtures (#3841)
Ref https://github.com/webstudio-is/webstudio/pull/3840

Need to update fixtures after stabilizing asset sorting.
2024-07-31 11:02:40 +02:00
Bogdan Chadkin caa16f2c4a refactor: invoke default action resource from context (#3836)
We want to replace n8n handler as proprietary code with injected
handler. The idea is to return resource request from this handler which
can be executed same way as user defined resource.
2024-07-31 01:30:01 +02:00
Bogdan Chadkin c79d56efc7 refactor: move reserved form fields to sdk (#3834)
Form handlers no longer rely on reserved form fields. They are excluded
before passing form data to n8n handler.
2024-07-30 22:19:08 +02:00
Bogdan Chadkin b6f87bac06 build: stop building in checks (#3831)
-1 minute in checks
2024-07-30 18:43:38 +02:00
Bogdan Chadkin 78a81a012d fix: handle empty action in webhook form (#3827)
Closes https://github.com/webstudio-is/webstudio/issues/3826

When user deleted action prop was still converted to resource but
resource itself was not created.
2024-07-30 14:57:48 +02:00
Bogdan Chadkin 8a746f6594 feat: drop data-ws-* attributes (#3806)
Ref https://github.com/webstudio-is/webstudio/issues/3763

We no longer rely on data-ws-id and data-ws-component in generated apps.
Now we get a few benefits

- smaller workers to deploy
- cleaner html to inspect
- generated ssg can be modified directly by user

See generated fixtures

<img width="726" alt="image"
src="https://github.com/user-attachments/assets/59012201-0dce-47f3-aa80-387c77b8f7d6">
2024-07-28 21:30:26 +02:00
Bogdan Chadkin 1c1c09f6c6 feat: submit webhook form without n8n (#3811)
Closes https://github.com/webstudio-is/webstudio/issues/3789

Here stopped submitting webhook form with custom action to n8n and
requested directly from generated code. This has a few benefits

- self-hosted websites (vercel, netlify) no longer have to setup n8n to
support forms
- we can pay n8n for these executions no more
- user no longer have to unsubscribe from emails when setup custom
webhook
2024-07-28 20:44:26 +02:00
Bogdan Chadkin d7531b73b7 refactor: manage forms with resources (#3803)
Ref https://github.com/webstudio-is/webstudio/issues/3789

Here changed a few things

- replace WebhookForm action prop with resource, which is sent with
hidden field instead of instance id
- prevented generating method and action in client side code
- generate "action" resource instead of form properties for server

action prop is replaced only inside cli to not require support in
builder yet, in the future this can be part of client migrations
2024-07-27 20:20:29 +02:00
Bogdan Chadkin 34ae0411db refactor: decouple resource loader from generated requests (#3798)
Ref https://github.com/webstudio-is/webstudio/issues/3789

Unified resource generation to output computed request factory to use in
both loader and action.
2024-07-27 11:59:46 +02:00
Bogdan Chadkin 31bdec9f3b feat: use classes for regular styles (#3796)
Closes https://github.com/webstudio-is/webstudio/issues/3788

Here switched from attribute selector to classes when atomic styles are
disabled. This will let us get rid from data-ws-* attributes in
generated html.
2024-07-26 14:00:20 +02:00
Bogdan Chadkin f73680027f feat: use classes for preset styles (#3794)
Closes https://github.com/webstudio-is/webstudio/issues/3787

Replaced [data-ws-component=...] selector with classes in generated
styles. This will unlock cleaner html output in the future.
2024-07-26 10:45:29 +02:00
Bogdan Chadkin 2518719ba9 refactor: merge tsconfig from CLI templates (#3774)
Here changed tsconfig copying logic to merge instead of override. This
simplifies alternative frameworks support.
2024-07-22 13:49:10 +02:00
Bogdan Chadkin a10c9d16b3 refactor: replace constants in templates (#3770)
Here made constants path easier to access from dynamic paths by
automatically replacing __CONSTANTS__ with actual relative path.

This is necessary for vike support which has folder based routes.
2024-07-21 15:34:07 +02:00
Bogdan Chadkin c60e55feea refactor: add page link to basic fixture (#3769)
We need at least to test page links in basic fixtures.
2024-07-21 15:23:26 +02:00
Bogdan Chadkin 1c3e878ca0 refactor: merge exclude from search flags (#3765)
Write environment flag to page meta in load instead of exposing to
client.
2024-07-20 11:22:12 +02:00
Bogdan Chadkin 4977e82031 refactor: move social asset into page meta (#3764)
Removed social asset form top level and moved into generated page meta.
Will be less generated data and simple page head.
2024-07-19 21:32:22 +02:00
Bogdan Chadkin a533debc3b build: bump remix (#3749)
- netlify got rid of opentelemetry
- postcss is deduped
2024-07-18 13:28:54 +02:00
Bogdan Chadkin b0726f1be1 build: bump storybook (#3731)
Storybook cut a lot of transitive packages. Now upgrades should be
easier. Future 8.3 promise to cut even more.
2024-07-17 13:32:18 +02:00
Bogdan Chadkin a65ab3379f build: forbid unused parameters (#3732)
Enabled flag in tsconfig to forbid unused parameters.
2024-07-15 21:17:13 +02:00
Bogdan Chadkin 50a17ebb8b refactor: move redirect into template (#3664)
Here decoupled redirect generation from cli.
Moved remix related code to template and
generated only module with url and status.
2024-07-04 11:54:57 +03:00
Bogdan Chadkin 3ba82579bc refactor: simplify placeholders in CLI templates (#3663)
Here improved replacing placeholders in our templates. Before used some
relative path to stubs. Now use explicitly named placeholders like
`__CLIENT__`, `__SERVER__`, `__CSS__` and `__SITEMAP__`.

This will give more flexibility when support other frameworks, for
example vike.
2024-07-03 20:01:50 +03:00
Bogdan Chadkin a58f2eff04 build: run all tests and typechecks in CI (#3661)
Here improved our checks. No longet rely on "checks" script but run
"test" and "typescript" scripts from each package in monorepo.

Would also make each package less boilerplaty.
2024-07-02 18:21:05 +03:00
Bogdan Chadkin 13a4af8277 build: upgrade storybook (#3639)
Ref https://github.com/storybookjs/storybook/releases/tag/v8.1.11

Nothing critical
2024-06-28 13:14:31 +03:00
Ivan Starkov 4d0574d573 build: Update typescript (#3637)
## Description

1. What is this PR about (link the issue and add a short description)

## Steps for reproduction

1. click button
2. expect xyz

## Code Review

- [ ] hi @kof, I need you to do
  - conceptual review (architecture, feature-correctness)
  - detailed review (read every line)
  - test it on preview

## Before requesting a review

- [ ] made a self-review
- [ ] added inline comments where things may be not obvious (the "why",
not "what")

## Before merging

- [ ] tested locally and on preview environment (preview dev login:
5de6)
- [ ] updated [test
cases](https://github.com/webstudio-is/webstudio/blob/main/apps/builder/docs/test-cases.md)
document
- [ ] added tests
- [ ] if any new env variables are added, added them to `.env` file
2024-06-28 11:46:13 +03:00
Bogdan Chadkin 5d1ca5b4f8 Update fixtures with HtmlEmbed preset 2024-06-26 22:46:09 +03:00
Bogdan Chadkin 06a3e84487 build: upgrade to remix 2.10.0 (#3621)
Ref https://github.com/remix-run/remix/blob/main/CHANGELOG.md#v2100

Not important changes.
Netlify adds more opentelemetry, grpc and protobuf packages.
Reinstalled vanilla-extract drops old version of vite
2024-06-26 21:14:29 +03:00
Bogdan Chadkin 0e468fe748 feat: merge longhand css into shorthands (#3615)
Here added optimization to css engine to produce much less classes when
some lonhands can be combined into shorthand.

Supported following properties

- border
- outline
- margin
- padding

Later the same utility will be used to make white-space and text-wrap
longhands better supported.

<img width="263" alt="Screenshot 2024-06-25 at 14 01 01"
src="https://github.com/webstudio-is/webstudio/assets/5635476/3b877e8b-969a-4e09-b3f4-557b2135d4cc">

<img width="270" alt="Screenshot 2024-06-23 at 17 39 33"
src="https://github.com/webstudio-is/webstudio/assets/5635476/e8de1c63-d7a5-465a-9f21-66fb67c1b02a">
2024-06-25 19:32:26 +03:00
Bogdan Chadkin 7f399154de fix: prefix more css properties (#3613)
These fields should have -webkit- prefix additionally to unprefixed
version to support more browsers.

- background-clip
- user-select
- text-size-adjust
2024-06-25 13:41:02 +03:00
Ivan Starkov 5e27dec1f4 fix: Reload scripts in HTML Embed on dynamic pages (#3587)
## Description

Reload scripts in HTML Embed on dynamic pages
Closes #3581


## Steps for reproduction

Open
https://scripts-reload-saas-2-pgmkm.wstd.work/test/1

dynamic link clicks should cause `console.log` from IFrame

Anchor link should not.


## Code Review

- [ ] hi @kof, I need you to do
  - conceptual review (architecture, feature-correctness)
  - detailed review (read every line)
  - test it on preview

## Before requesting a review

- [ ] made a self-review
- [ ] added inline comments where things may be not obvious (the "why",
not "what")

## Before merging

- [ ] tested locally and on preview environment (preview dev login:
5de6)
- [ ] updated [test
cases](https://github.com/webstudio-is/webstudio/blob/main/apps/builder/docs/test-cases.md)
document
- [ ] added tests
- [ ] if any new env variables are added, added them to `.env` file
2024-06-20 10:49:59 +03:00
Bogdan Chadkin 93aeceac59 build: bump storybook (#3559)
Upgrade storybook and vite, esbuild and tsx with it.
2024-06-14 01:18:30 +03:00
Ivan Starkov 60e7c064a7 fix: Correct single-quoted attribute handling in Custom Code (#3539)
## Description

Following code in Project Setting Custom Code 

```
<script data-cf-beacon='{"token": "123"}'>
```
failed on build

## Steps for reproduction

1. click button
2. expect xyz

## Code Review

- [ ] hi @kof, I need you to do
  - conceptual review (architecture, feature-correctness)
  - detailed review (read every line)
  - test it on preview

## Before requesting a review

- [ ] made a self-review
- [ ] added inline comments where things may be not obvious (the "why",
not "what")

## Before merging

- [ ] tested locally and on preview environment (preview dev login:
5de6)
- [ ] updated [test
cases](https://github.com/webstudio-is/webstudio/blob/main/apps/builder/docs/test-cases.md)
document
- [ ] added tests
- [ ] if any new env variables are added, added them to `.env` file
2024-06-12 00:06:29 +03:00
Ivan Starkov 9626c6dee5 fix: Favicon sizes conform to Google Search guidelines (#3527)
## Description

width,height must be multiple of 48
https://developers.google.com/search/docs/appearance/favicon-in-search

- In case of non square favicon uploaded add paddings to make it square
[favicon-non-sqare](https://favicon-non-sqare-saas-1noth.wstd.work/) see
white paddings
<img width="207" alt="image"
src="https://github.com/webstudio-is/webstudio/assets/5077042/717d18bc-0d4c-4d68-8c11-e232cafac795">

https://favicon-non-sqare-saas-1noth.wstd.work/cgi/image/IMG_2882_(1)_LY_eDOEMEwtikKi5Pyld-.png?width=144&quality=100&format=auto&height=144&fit=pad



_padding crop is used because all other `fit` modes we have can't
upscale images as I know to get exact final height and width set_


corresponding SAAS PR
https://github.com/webstudio-is/webstudio-saas/pull/300

## Steps for reproduction
Open 

https://favicon.staging.webstudio.is/builder/28fb95a3-5236-430c-950e-dda451a31c4d?authToken=2627c718-308e-4690-8919-1e1f00e5b3a5&mode=preview
Publish
See <link rel="icon" and check sizes


## Code Review

- [ ] hi @kof, I need you to do
  - conceptual review (architecture, feature-correctness)
  - detailed review (read every line)
  - test it on preview

## Before requesting a review

- [ ] made a self-review
- [ ] added inline comments where things may be not obvious (the "why",
not "what")

## Before merging

- [ ] tested locally and on preview environment (preview dev login:
5de6)
- [ ] updated [test
cases](https://github.com/webstudio-is/webstudio/blob/main/apps/builder/docs/test-cases.md)
document
- [ ] added tests
- [ ] if any new env variables are added, added them to `.env` file
2024-06-10 19:15:57 +03:00
Bogdan Chadkin d014c5209b fix: publish without local development hacks (#3528) 2024-06-10 13:43:49 +03:00
Bogdan Chadkin d2be4bee67 build: bump storybook (#3515)
Here upgraded storybook with reresolved transitive dependencies. Removed
babel/types override, will eventually let us deduplicate a lot of
dependencies.
2024-06-07 17:11:29 +03:00
Bogdan Chadkin fde5e8a6f1 build: run webstudio cli without rebuilding (#3513)
Finally figured out how to leverage node conditions to run webstudio cli
in fixtures without rebuilding it on every change.

Import conditions is another thing which allows
to constrain not exposed modules but internal ones.

Now to run cli locally it should be have this env
which is basically same we do with vite.
Works for both import and export conditions.

```
NODE_OPTIONS='--conditions=webstudio --import=tsx' webstudio
```
2024-06-07 13:51:34 +03:00
Ivan Starkov ef81ccfafd fix: Resolve issue with script tag compilation in self-hosted Project Settings (#3483)
## Description

Corresponding SAAS PR
https://github.com/webstudio-is/webstudio-saas/pull/298
(Must be renamed to "release.staging" on release to allow testing)

closes #3378 

## Steps for reproduction

See fixtures now have working scripts.
Publish see saas supports script and language
https://rewrites.staging.webstudio.is/builder/f30da574-8022-433e-9a15-050792747b6f
.

## Code Review

- [ ] hi @kof, I need you to do
  - conceptual review (architecture, feature-correctness)
  - detailed review (read every line)
  - test it on preview

## Before requesting a review

- [ ] made a self-review
- [ ] added inline comments where things may be not obvious (the "why",
not "what")

## Before merging

- [ ] tested locally and on preview environment (preview dev login:
5de6)
- [ ] updated [test
cases](https://github.com/webstudio-is/webstudio/blob/main/apps/builder/docs/test-cases.md)
document
- [ ] added tests
- [ ] if any new env variables are added, added them to `.env` file
2024-06-05 09:53:43 +03:00
Bogdan Chadkin be20193a85 build: upgrade remix (#3472)
Bumped a few packages
- remix run
- react router dom
- remix auth
- isbot
- netlify remix adapters
2024-06-01 23:15:05 +03:00
Bogdan Chadkin ea30e840a1 refactor: merge all storybooks into one (#3441)
Monorepo setup for storybook is very complicated, it has two major
problems

- it is very annoying to look for any link in commit status
- hard to upgrade comparing with single project setup

Here merged all storybooks into one in the root.
2024-05-29 17:05:17 +03:00
Ivan Starkov 8cdc103263 feat: Simple bot protection that should elimiminate most of the spam on our forms (#3350)
## Description

Add simple protection against non js and jsdom bots

Idea is to add hidden js generated field on submit, and check that
matchMedia is working.


## Steps for reproduction

Go here
https://saas-form-rdlrc.wstd.work/

then check via curl

```bash
curl 'https://saas-form-rdlrc.wstd.work/?index=&_data=routes%2F_index' \
  -H 'content-type: application/x-www-form-urlencoded;charset=UTF-8' \
  -H 'referer: https://saas-form-rdlrc.wstd.work/' \
  --data-raw 'ws--form-id=2TIgyB2vQViDMitiYiGSK&name=wewe&email=wewe&ws--form-bot=18f72a6'

curl 'https://saas-form-rdlrc.wstd.work/?index=&_data=routes%2F_index' \
  -H 'content-type: application/x-www-form-urlencoded;charset=UTF-8' \
  -H 'referer: https://saas-form-rdlrc.wstd.work/' \
  --data-raw 'ws--form-id=2TIgyB2vQViDMitiYiGSK&name=wewe&email=wewe'

curl 'https://saas-form-rdlrc.wstd.work/?index=&_data=routes%2F_index' \
  -H 'content-type: application/x-www-form-urlencoded;charset=UTF-8' \
  -H 'referer: https://saas-form-rdlrc.wstd.work/' \
  --data-raw 'ws--form-id=2TIgyB2vQViDMitiYiGSK&name=wewe&email=wewe&ws--form-bot=jsdom'
```
## Code Review

- [ ] hi @kof, I need you to do
  - conceptual review (architecture, feature-correctness)
  - detailed review (read every line)
  - test it on preview

## Before requesting a review

- [ ] made a self-review
- [ ] added inline comments where things may be not obvious (the "why",
not "what")

## Before merging

- [ ] tested locally and on preview environment (preview dev login:
5de6)
- [ ] updated [test
cases](https://github.com/webstudio-is/webstudio/blob/main/apps/builder/docs/test-cases.md)
document
- [ ] added tests
- [ ] if any new env variables are added, added them to `.env.example`
and the `builder/env-check.js` if mandatory
2024-05-14 19:18:51 +03:00
Bogdan Chadkin eb2e397d0a build: drop eslint-plugin-import (#3333)
Turns out no-internal-imports did not forbid anything out of the box but
requires specifying specific folders to forbid. This does not scale well
and this rule mostly harms because requires either excluding each
package with submodules or suppressing it with comment.
2024-05-09 18:53:35 +04:00