Mirrors/unleash.unleash
1
0
Fork 0
mirror of https://github.com/Unleash/unleash.git synced 2024-12-22 19:07:54 +01:00
Code Issues Projects Releases Wiki Activity
1c36205f01
unleash.unleash/frontend
History
renovate[bot] 08467f9dac
chore(deps): update react-router monorepo to v6.11.0 (#3703) 
[![Mend
Renovate](https://app.renovatebot.com/images/banner.svg)](https://renovatebot.com)

This PR contains the following updates:

| Package | Change | Age | Adoption | Passing | Confidence |
|---|---|---|---|---|---|
| [react-router](https://togithub.com/remix-run/react-router) | [`6.8.1`
->
`6.11.0`](https://renovatebot.com/diffs/npm/react-router/6.8.1/6.11.0) |
[![age](https://badges.renovateapi.com/packages/npm/react-router/6.11.0/age-slim)](https://docs.renovatebot.com/merge-confidence/)
|
[![adoption](https://badges.renovateapi.com/packages/npm/react-router/6.11.0/adoption-slim)](https://docs.renovatebot.com/merge-confidence/)
|
[![passing](https://badges.renovateapi.com/packages/npm/react-router/6.11.0/compatibility-slim/6.8.1)](https://docs.renovatebot.com/merge-confidence/)
|
[![confidence](https://badges.renovateapi.com/packages/npm/react-router/6.11.0/confidence-slim/6.8.1)](https://docs.renovatebot.com/merge-confidence/)
|
| [react-router-dom](https://togithub.com/remix-run/react-router) |
[`6.8.1` ->
`6.11.0`](https://renovatebot.com/diffs/npm/react-router-dom/6.8.1/6.11.0)
|
[![age](https://badges.renovateapi.com/packages/npm/react-router-dom/6.11.0/age-slim)](https://docs.renovatebot.com/merge-confidence/)
|
[![adoption](https://badges.renovateapi.com/packages/npm/react-router-dom/6.11.0/adoption-slim)](https://docs.renovatebot.com/merge-confidence/)
|
[![passing](https://badges.renovateapi.com/packages/npm/react-router-dom/6.11.0/compatibility-slim/6.8.1)](https://docs.renovatebot.com/merge-confidence/)
|
[![confidence](https://badges.renovateapi.com/packages/npm/react-router-dom/6.11.0/confidence-slim/6.8.1)](https://docs.renovatebot.com/merge-confidence/)
|

---

### Release Notes

<details>
<summary>remix-run/react-router (react-router)</summary>

###
[`v6.11.0`](https://togithub.com/remix-run/react-router/blob/HEAD/packages/react-router/CHANGELOG.md#&#8203;6110)

[Compare
Source](https://togithub.com/remix-run/react-router/compare/react-router@6.10.0...react-router@6.11.0)

##### Patch Changes

- Log loader/action errors to the console in dev for easier stack trace
evaluation
([#&#8203;10286](https://togithub.com/remix-run/react-router/pull/10286))
- Fix bug preventing rendering of descendant `<Routes>` when
`RouterProvider` errors existed
([#&#8203;10374](https://togithub.com/remix-run/react-router/pull/10374))
- Fix inadvertent re-renders when using `Component` instead of `element`
on a route definition
([#&#8203;10287](https://togithub.com/remix-run/react-router/pull/10287))
- Fix detection of `useNavigate` in the render cycle by setting the
`activeRef` in a layout effect, allowing the `navigate` function to be
passed to child components and called in a `useEffect` there.
([#&#8203;10394](https://togithub.com/remix-run/react-router/pull/10394))
- Switched from `useSyncExternalStore` to `useState` for internal
`@remix-run/router` router state syncing in `<RouterProvider>`. We found
some [subtle
bugs](https://codesandbox.io/s/use-sync-external-store-loop-9g7b81)
where router state updates got propagated *before* other normal
`useState` updates, which could lead to footguns in `useEffect` calls.
([#&#8203;10377](https://togithub.com/remix-run/react-router/pull/10377),
[#&#8203;10409](https://togithub.com/remix-run/react-router/pull/10409))
- Allow `useRevalidator()` to resolve a loader-driven error boundary
scenario
([#&#8203;10369](https://togithub.com/remix-run/react-router/pull/10369))
- Avoid unnecessary unsubscribe/resubscribes on router state changes
([#&#8203;10409](https://togithub.com/remix-run/react-router/pull/10409))
- When using a `RouterProvider`,
`useNavigate`/`useSubmit`/`fetcher.submit` are now stable across
location changes, since we can handle relative routing via the
`@remix-run/router` instance and get rid of our dependence on
`useLocation()`. When using `BrowserRouter`, these hooks remain unstable
across location changes because they still rely on `useLocation()`.
([#&#8203;10336](https://togithub.com/remix-run/react-router/pull/10336))
-   Updated dependencies:
    -   `@remix-run/router@1.6.0`

###
[`v6.10.0`](https://togithub.com/remix-run/react-router/blob/HEAD/packages/react-router/CHANGELOG.md#&#8203;6100)

[Compare
Source](https://togithub.com/remix-run/react-router/compare/react-router@6.9.0...react-router@6.10.0)

##### Minor Changes

- Added support for [**Future
Flags**](https://reactrouter.com/en/main/guides/api-development-strategy)
in React Router. The first flag being introduced is
`future.v7_normalizeFormMethod` which will normalize the exposed
`useNavigation()/useFetcher()` `formMethod` fields as uppercase HTTP
methods to align with the `fetch()` behavior.
([#&#8203;10207](https://togithub.com/remix-run/react-router/pull/10207))

- When `future.v7_normalizeFormMethod === false` (default v6 behavior),
        -   `useNavigation().formMethod` is lowercase
        -   `useFetcher().formMethod` is lowercase
    -   When `future.v7_normalizeFormMethod === true`:
        -   `useNavigation().formMethod` is uppercase
        -   `useFetcher().formMethod` is uppercase

##### Patch Changes

- Fix route ID generation when using Fragments in
`createRoutesFromElements`
([#&#8203;10193](https://togithub.com/remix-run/react-router/pull/10193))
-   Updated dependencies:
    -   `@remix-run/router@1.5.0`

###
[`v6.9.0`](https://togithub.com/remix-run/react-router/blob/HEAD/packages/react-router/CHANGELOG.md#&#8203;690)

[Compare
Source](https://togithub.com/remix-run/react-router/compare/react-router@6.8.2...react-router@6.9.0)

##### Minor Changes

- React Router now supports an alternative way to define your route
`element` and `errorElement` fields as React Components instead of React
Elements. You can instead pass a React Component to the new `Component`
and `ErrorBoundary` fields if you choose. There is no functional
difference between the two, so use whichever approach you prefer 😀. You
shouldn't be defining both, but if you do `Component`/`ErrorBoundary`
will "win".
([#&#8203;10045](https://togithub.com/remix-run/react-router/pull/10045))

    **Example JSON Syntax**

    ```jsx
    // Both of these work the same:
    const elementRoutes = [{
      path: '/',
      element: <Home />,
      errorElement: <HomeError />,
    }]

    const componentRoutes = [{
      path: '/',
      Component: Home,
      ErrorBoundary: HomeError,
    }]

    function Home() { ... }
    function HomeError() { ... }
    ```

    **Example JSX Syntax**

    ```jsx
    // Both of these work the same:
    const elementRoutes = createRoutesFromElements(
<Route path='/' element={<Home />} errorElement={<HomeError /> } />
    );

    const componentRoutes = createRoutesFromElements(
      <Route path='/' Component={Home} ErrorBoundary={HomeError} />
    );

    function Home() { ... }
    function HomeError() { ... }
    ```

- **Introducing Lazy Route Modules!**
([#&#8203;10045](https://togithub.com/remix-run/react-router/pull/10045))

In order to keep your application bundles small and support
code-splitting of your routes, we've introduced a new `lazy()` route
property. This is an async function that resolves the non-route-matching
portions of your route definition (`loader`, `action`,
`element`/`Component`, `errorElement`/`ErrorBoundary`,
`shouldRevalidate`, `handle`).

Lazy routes are resolved on initial load and during the `loading` or
`submitting` phase of a navigation or fetcher call. You cannot lazily
define route-matching properties (`path`, `index`, `children`) since we
only execute your lazy route functions after we've matched known routes.

Your `lazy` functions will typically return the result of a dynamic
import.

    ```jsx
// In this example, we assume most folks land on the homepage so we
include that
// in our critical-path bundle, but then we lazily load modules for /a
and /b so
    // they don't load until the user navigates to those routes
    let routes = createRoutesFromElements(
      <Route path="/" element={<Layout />}>
        <Route index element={<Home />} />
        <Route path="a" lazy={() => import("./a")} />
        <Route path="b" lazy={() => import("./b")} />
      </Route>
    );
    ```

Then in your lazy route modules, export the properties you want defined
for the route:

    ```jsx
    export async function loader({ request }) {
      let data = await fetchData(request);
      return json(data);
    }

// Export a `Component` directly instead of needing to create a React
Element from it
    export function Component() {
      let data = useLoaderData();

      return (
        <>
          <h1>You made it!</h1>
          <p>{data}</p>
        </>
      );
    }

// Export an `ErrorBoundary` directly instead of needing to create a
React Element from it
    export function ErrorBoundary() {
      let error = useRouteError();
      return isRouteErrorResponse(error) ? (
        <h1>
          {error.status} {error.statusText}
        </h1>
      ) : (
        <h1>{error.message || error}</h1>
      );
    }
    ```

An example of this in action can be found in the
[`examples/lazy-loading-router-provider`](https://togithub.com/remix-run/react-router/tree/main/examples/lazy-loading-router-provider)
directory of the repository.

🙌 Huge thanks to [@&#8203;rossipedia](https://togithub.com/rossipedia)
for the [Initial
Proposal](https://togithub.com/remix-run/react-router/discussions/9826)
and [POC
Implementation](https://togithub.com/remix-run/react-router/pull/9830).

-   Updated dependencies:
    -   `@remix-run/router@1.4.0`

##### Patch Changes

- Fix `generatePath` incorrectly applying parameters in some cases
([#&#8203;10078](https://togithub.com/remix-run/react-router/pull/10078))
- Improve memoization for context providers to avoid unnecessary
re-renders
([#&#8203;9983](https://togithub.com/remix-run/react-router/pull/9983))

###
[`v6.8.2`](https://togithub.com/remix-run/react-router/blob/HEAD/packages/react-router/CHANGELOG.md#&#8203;682)

[Compare
Source](https://togithub.com/remix-run/react-router/compare/react-router@6.8.1...react-router@6.8.2)

##### Patch Changes

-   Updated dependencies:
    -   `@remix-run/router@1.3.3`

</details>

<details>
<summary>remix-run/react-router (react-router-dom)</summary>

###
[`v6.11.0`](https://togithub.com/remix-run/react-router/blob/HEAD/packages/react-router-dom/CHANGELOG.md#&#8203;6110)

[Compare
Source](https://togithub.com/remix-run/react-router/compare/react-router-dom@6.10.0...react-router-dom@6.11.0)

##### Minor Changes

- Enable `basename` support in `useFetcher`
([#&#8203;10336](https://togithub.com/remix-run/react-router/pull/10336))
- If you were previously working around this issue by manually
prepending the `basename` then you will need to remove the manually
prepended `basename` from your `fetcher` calls
(`fetcher.load('/basename/route') -> fetcher.load('/route')`)

##### Patch Changes

- Fix inadvertent re-renders when using `Component` instead of `element`
on a route definition
([#&#8203;10287](https://togithub.com/remix-run/react-router/pull/10287))
- Fail gracefully on `<Link to="//">` and other invalid URL values
([#&#8203;10367](https://togithub.com/remix-run/react-router/pull/10367))
- Switched from `useSyncExternalStore` to `useState` for internal
`@remix-run/router` router state syncing in `<RouterProvider>`. We found
some [subtle
bugs](https://codesandbox.io/s/use-sync-external-store-loop-9g7b81)
where router state updates got propagated *before* other normal
`useState` updates, which could lead to footguns in `useEffect` calls.
([#&#8203;10377](https://togithub.com/remix-run/react-router/pull/10377),
[#&#8203;10409](https://togithub.com/remix-run/react-router/pull/10409))
- Add static prop to `StaticRouterProvider`'s internal `Router`
component
([#&#8203;10401](https://togithub.com/remix-run/react-router/pull/10401))
- When using a `RouterProvider`,
`useNavigate`/`useSubmit`/`fetcher.submit` are now stable across
location changes, since we can handle relative routing via the
`@remix-run/router` instance and get rid of our dependence on
`useLocation()`. When using `BrowserRouter`, these hooks remain unstable
across location changes because they still rely on `useLocation()`.
([#&#8203;10336](https://togithub.com/remix-run/react-router/pull/10336))
-   Updated dependencies:
    -   `react-router@6.11.0`
    -   `@remix-run/router@1.6.0`

###
[`v6.10.0`](https://togithub.com/remix-run/react-router/blob/HEAD/packages/react-router-dom/CHANGELOG.md#&#8203;6100)

[Compare
Source](https://togithub.com/remix-run/react-router/compare/react-router-dom@6.9.0...react-router-dom@6.10.0)

##### Minor Changes

- Added support for [**Future
Flags**](https://reactrouter.com/en/main/guides/api-development-strategy)
in React Router. The first flag being introduced is
`future.v7_normalizeFormMethod` which will normalize the exposed
`useNavigation()/useFetcher()` `formMethod` fields as uppercase HTTP
methods to align with the `fetch()` behavior.
([#&#8203;10207](https://togithub.com/remix-run/react-router/pull/10207))

- When `future.v7_normalizeFormMethod === false` (default v6 behavior),
        -   `useNavigation().formMethod` is lowercase
        -   `useFetcher().formMethod` is lowercase
    -   When `future.v7_normalizeFormMethod === true`:
        -   `useNavigation().formMethod` is uppercase
        -   `useFetcher().formMethod` is uppercase

##### Patch Changes

- Fix `createStaticHandler` to also check for `ErrorBoundary` on routes
in addition to `errorElement`
([#&#8203;10190](https://togithub.com/remix-run/react-router/pull/10190))
-   Updated dependencies:
    -   `@remix-run/router@1.5.0`
    -   `react-router@6.10.0`

###
[`v6.9.0`](https://togithub.com/remix-run/react-router/blob/HEAD/packages/react-router-dom/CHANGELOG.md#&#8203;690)

[Compare
Source](https://togithub.com/remix-run/react-router/compare/react-router-dom@6.8.2...react-router-dom@6.9.0)

##### Minor Changes

- React Router now supports an alternative way to define your route
`element` and `errorElement` fields as React Components instead of React
Elements. You can instead pass a React Component to the new `Component`
and `ErrorBoundary` fields if you choose. There is no functional
difference between the two, so use whichever approach you prefer 😀. You
shouldn't be defining both, but if you do `Component`/`ErrorBoundary`
will "win".
([#&#8203;10045](https://togithub.com/remix-run/react-router/pull/10045))

    **Example JSON Syntax**

    ```jsx
    // Both of these work the same:
    const elementRoutes = [{
      path: '/',
      element: <Home />,
      errorElement: <HomeError />,
    }]

    const componentRoutes = [{
      path: '/',
      Component: Home,
      ErrorBoundary: HomeError,
    }]

    function Home() { ... }
    function HomeError() { ... }
    ```

    **Example JSX Syntax**

    ```jsx
    // Both of these work the same:
    const elementRoutes = createRoutesFromElements(
<Route path='/' element={<Home />} errorElement={<HomeError /> } />
    );

    const componentRoutes = createRoutesFromElements(
      <Route path='/' Component={Home} ErrorBoundary={HomeError} />
    );

    function Home() { ... }
    function HomeError() { ... }
    ```

- **Introducing Lazy Route Modules!**
([#&#8203;10045](https://togithub.com/remix-run/react-router/pull/10045))

In order to keep your application bundles small and support
code-splitting of your routes, we've introduced a new `lazy()` route
property. This is an async function that resolves the non-route-matching
portions of your route definition (`loader`, `action`,
`element`/`Component`, `errorElement`/`ErrorBoundary`,
`shouldRevalidate`, `handle`).

Lazy routes are resolved on initial load and during the `loading` or
`submitting` phase of a navigation or fetcher call. You cannot lazily
define route-matching properties (`path`, `index`, `children`) since we
only execute your lazy route functions after we've matched known routes.

Your `lazy` functions will typically return the result of a dynamic
import.

    ```jsx
// In this example, we assume most folks land on the homepage so we
include that
// in our critical-path bundle, but then we lazily load modules for /a
and /b so
    // they don't load until the user navigates to those routes
    let routes = createRoutesFromElements(
      <Route path="/" element={<Layout />}>
        <Route index element={<Home />} />
        <Route path="a" lazy={() => import("./a")} />
        <Route path="b" lazy={() => import("./b")} />
      </Route>
    );
    ```

Then in your lazy route modules, export the properties you want defined
for the route:

    ```jsx
    export async function loader({ request }) {
      let data = await fetchData(request);
      return json(data);
    }

// Export a `Component` directly instead of needing to create a React
Element from it
    export function Component() {
      let data = useLoaderData();

      return (
        <>
          <h1>You made it!</h1>
          <p>{data}</p>
        </>
      );
    }

// Export an `ErrorBoundary` directly instead of needing to create a
React Element from it
    export function ErrorBoundary() {
      let error = useRouteError();
      return isRouteErrorResponse(error) ? (
        <h1>
          {error.status} {error.statusText}
        </h1>
      ) : (
        <h1>{error.message || error}</h1>
      );
    }
    ```

An example of this in action can be found in the
[`examples/lazy-loading-router-provider`](https://togithub.com/remix-run/react-router/tree/main/examples/lazy-loading-router-provider)
directory of the repository.

🙌 Huge thanks to [@&#8203;rossipedia](https://togithub.com/rossipedia)
for the [Initial
Proposal](https://togithub.com/remix-run/react-router/discussions/9826)
and [POC
Implementation](https://togithub.com/remix-run/react-router/pull/9830).

-   Updated dependencies:
    -   `react-router@6.9.0`
    -   `@remix-run/router@1.4.0`

###
[`v6.8.2`](https://togithub.com/remix-run/react-router/blob/HEAD/packages/react-router-dom/CHANGELOG.md#&#8203;682)

[Compare
Source](https://togithub.com/remix-run/react-router/compare/react-router-dom@6.8.1...react-router-dom@6.8.2)

##### Patch Changes

- Treat same-origin absolute URLs in `<Link to>` as external if they are
outside of the router `basename`
([#&#8203;10135](https://togithub.com/remix-run/react-router/pull/10135))
- Fix `useBlocker` to return `IDLE_BLOCKER` during SSR
([#&#8203;10046](https://togithub.com/remix-run/react-router/pull/10046))
- Fix SSR of absolute `<Link to>` urls
([#&#8203;10112](https://togithub.com/remix-run/react-router/pull/10112))
- Properly escape HTML characters in `StaticRouterProvider` serialized
hydration data
([#&#8203;10068](https://togithub.com/remix-run/react-router/pull/10068))
-   Updated dependencies:
    -   `@remix-run/router@1.3.3`
    -   `react-router@6.8.2`

</details>

---

### Configuration

📅 **Schedule**: Branch creation - At any time (no schedule defined),
Automerge - At any time (no schedule defined).

🚦 **Automerge**: Enabled.

♻ **Rebasing**: Whenever PR becomes conflicted, or you tick the
rebase/retry checkbox.

🔕 **Ignore**: Close this PR and you won't be reminded about these
updates again.

---

- [ ] <!-- rebase-check -->If you want to rebase/retry this PR, check
this box

---

This PR has been generated by [Mend
Renovate](https://www.mend.io/free-developer-tools/renovate/). View
repository job log
[here](https://app.renovatebot.com/dashboard#github/Unleash/unleash).

<!--renovate-debug:eyJjcmVhdGVkSW5WZXIiOiIzNS43MS40IiwidXBkYXRlZEluVmVyIjoiMzUuNzEuNCIsInRhcmdldEJyYW5jaCI6Im1haW4ifQ==-->

Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>
2023-05-06 14:21:15 +00:00
..
cypress fix: Updated cypress API usage to stop using deprecated API (#3636) 2023-04-27 08:49:55 +00:00
public
scripts
src Feat: default strategy UI (#3682) 2023-05-05 14:32:44 +03:00
.editorconfig
.gitignore Test npm publish (#3554) 2023-04-18 15:44:19 +02:00
.nvmrc chore: update to node 18 (#3527) 2023-04-18 10:35:32 +02:00
.prettierignore
.prettierrc
cypress.d.ts
cypress.json
index.html
index.js
orval.config.js
package.json chore(deps): update react-router monorepo to v6.11.0 (#3703) 2023-05-06 14:21:15 +00:00
README.md
tsconfig.json
tsconfig.node.json
vercel.json
vite.config.ts
yarn.lock chore(deps): update react-router monorepo to v6.11.0 (#3703) 2023-05-06 14:21:15 +00:00

README.md

frontend

This directory contains the Unleash Admin UI frontend app.

Run with a local instance of the unleash-api

First, start the unleash-api backend on port 4242. Then, start the frontend dev server:

cd ./frontend
yarn install
yarn run start

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:

./scripts/generate-openapi.sh

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