[chore] add Vercel preview for PRs

[remybar]

This PR adds a Github action Vercel / Preview which build and deploy the cairovm.codes front-end to Vercel for every PR.

A button View Deployment is automatically posted on the PR by the Vercel bot.

Note to configure Github and Vercel properly:

• First of all, you need to install the Vercel CLI tool:
  • npm i -g vercel@latest
  • In your local git checkout of cairovm.codes, enter vercel login to log in to Vercel and then vercel link to create the project on Vercel and generate a .vercel folder in local (this folder is ignored by git).
• Go in the settings panel of your Vercel account on vercel.com. In Tokens, create a new one dedicated to cairovm.codes and don't forget to copy it.
• Go to the settings of the cairovm.codes repository on Github. In "Secrets and Variables" > "Actions", create 3 new repository secrets:
  • VERCEL_ORG_ID: copy the orgId value from .vercel/project.json file,
  • VERCEL_PROJECT_ID: copy the projectId value from .vercel/project.json file,
  • VERCEL_TOKEN: copy the previously created vercel token.

Now, each time a PR is created, a new action should be visible and the deployed version should be accessible.

Still to be done: check deployed version access to see if anyone can access to the deployed version or if something has to be configured in the Vercel project settings.

[mazurroman]

Thank you! Let's wait for some new PR to check if this works, then we can close it.

[remybar]

@mazurroman

I've read some pages about running actions using repo tokens in a pull request coming from a fork and I found a solution (explained in details here. and here.

In brief, using the pull_request_target event instead of pull_request, the pull request coming from a fork is treated as a PR coming from the original repository so it can access to tokens.
Of course, if Github does not allow this by default, it is because there are some risks that someone creates a malicious PR to get access to Github tokens.

So, the solution proposed by Github is to trigger the action only when a specific label is set on the PR. As label can be set by repo owner/collaborators only, it's safe.

I updated this PR to trigger the action when the label "safe to preview" is added. So, the idea is first to have a look a the PR and if safe, add this label and the preview will be deployed.

I let you read some information about this solution so you will be able to decide if you agree to use it or not.

FYI: I did some tests by creating another Github account and forking a test repo from my account and it works as expected :)

[mazurroman]

I added the safe to preview label and also approved in review but no preview was generated. Anything I am missing?

[remybar]

I added the safe to preview label and also approved in review but no preview was generated. Anything I am missing?

This PR has to be merged on the main branch first, so the Github action related to Vercel preview will be active on the repo :) Then, each time you add safe to preview label on a PR, it will trigger the preview.