1
0
mirror of https://github.com/Unleash/unleash.git synced 2024-12-28 00:06:53 +01:00
unleash.unleash/frontend
Thomas Heartman 1f4126e495
fix: make rendering of new project form independent of rendering the project list (#7405)
This change takes the rendering of the new project form component and
puts in a child component of the project list, thereby
significantly speeding up the time it takes to render the form if you
have lots of projects (about to 10x for 50 projects on my machine).

The reason it was so slow before was that the open state of the form
component was stored in the project list component. This meant that
whenever you wanted to open or close the form, you'd have to rerender
the entire project list.

This change abstracts that process into the new ProjectCreationButton
component. This component takes care of checking the feature flag for
whether to render the dialog or to send the user to the old form, and
takes care of state management for the dialog.

Because this is a child component of the project list, it does not
cause rerenders of the entire project list.
2024-06-18 09:36:36 +02:00
..
cypress chore: wait to input the name of the segment when checking for error messages (#7377) 2024-06-12 14:06:44 +02:00
public feat: Project owners UI (#6949) 2024-04-29 11:51:44 +02:00
scripts
src fix: make rendering of new project form independent of rendering the project list (#7405) 2024-06-18 09:36:36 +02:00
.editorconfig
.gitignore chore: add gitignores to frontend and website subdirectories (#7336) 2024-06-10 14:39:14 +02:00
.nvmrc chore: bump to @types/node 20 as well as updating frontend .nvmrc (#7137) 2024-05-24 07:40:20 +00:00
check-imports.rc Revert "fix: yarn v4 requires prepack instead of prepare script when building…" (#7373) 2024-06-12 13:25:51 +02:00
cypress.config.ts
cypress.d.ts
index.html
index.js
orval.config.js
package.json Revert "fix: yarn v4 requires prepack instead of prepare script when building…" (#7373) 2024-06-12 13:25:51 +02:00
README.md
tsconfig.json
tsconfig.node.json
vercel.json
vite.config.mts
yarn.lock Revert "fix: yarn v4 requires prepack instead of prepare script when building…" (#7373) 2024-06-12 13:25:51 +02:00

frontend

This directory contains the Unleash Admin UI frontend app.

Run with a local instance of the unleash-api

Refer to the Contributing to Unleash guide for instructions. The frontend dev server runs (in port 3000) simultaneously with the backend dev server (in port 4242):

yarn install
yarn dev

Run with a sandbox instance of the Unleash API

Alternatively, instead of running unleash-api on localhost, you can use a remote instance:

cd ./frontend
yarn install
yarn run start:sandbox

Running end-to-end tests

We have a set of Cypress tests that run on the build before a PR can be merged so it's important that you check these yourself before submitting a PR. On the server the tests will run against the deployed Heroku app so this is what you probably want to test against:

yarn run start:sandbox

In a different shell, you can run the tests themselves:

yarn run e2e:heroku

If you need to test against patches against a local server instance, you'll need to run that, and then run the end to end tests using:

yarn run e2e

You may also need to test that a feature works against the enterprise version of unleash. Assuming the Heroku instance is still running, this can be done by:

yarn run start:enterprise
yarn run e2e

Generating the OpenAPI client

The frontend uses an OpenAPI client generated from the backend's OpenAPI spec. Whenever there are changes to the backend API, the client should be regenerated:

For now we only use generated types (src/openapi/models). We will use methods (src/openapi/apis) for new features soon.

yarn gen:api
rm -rf src/openapi/apis

clean up src/openapi/index.ts imports, only keep first line export * from './models';

This script assumes that you have a running instance of the enterprise backend at http://localhost:4242. The new OpenAPI client will be generated from the runtime schema of this instance. The target URL can be changed by setting the UNLEASH_OPENAPI_URL env var.

Analyzing bundle size

npx vite-bundle-visualizer in the root of the frontend directory