1
0
mirror of https://github.com/Unleash/unleash.git synced 2025-06-23 01:16:27 +02:00
unleash.unleash/frontend/src/component/common/Gradient/Gradient.tsx
Jaanus Sellin 3acb3ad2c2
feat: upgrade from react v17 to v18 (#7265)
**Upgrade to React v18 for Unleash v6. Here's why I think it's a good
time to do it:**
- Command Bar project: We've begun work on the command bar project, and
there's a fantastic library we want to use. However, it requires React
v18 support.
- Straightforward Upgrade: I took a look at the upgrade guide
https://react.dev/blog/2022/03/08/react-18-upgrade-guide and it seems
fairly straightforward. In fact, I was able to get React v18 running
with minimal changes in just 10 minutes!
- Dropping IE Support: React v18 no longer supports Internet Explorer
(IE), which is no longer supported by Microsoft as of June 15, 2022.
Upgrading to v18 in v6 would be a good way to align with this change.

TS updates:
* FC children has to be explicit:
https://stackoverflow.com/questions/71788254/react-18-typescript-children-fc
* forcing version 18 types in resolutions:
https://sentry.io/answers/type-is-not-assignable-to-type-reactnode/

Test updates:
* fixing SWR issue that we have always had but it manifests more in new
React (https://github.com/vercel/swr/issues/2373)

---------

Co-authored-by: kwasniew <kwasniewski.mateusz@gmail.com>
2024-06-11 13:59:52 +03:00

35 lines
640 B
TypeScript

import type React from 'react';
interface IGradientProps {
from: string;
to: string;
style?: object;
className?: string;
children?: React.ReactNode;
}
const Gradient: React.FC<IGradientProps> = ({
children,
from,
to,
style,
...rest
}) => {
return (
<div
style={{
background: `linear-gradient(${from}, ${to})`,
height: '100%',
width: '100%',
position: 'relative',
...style,
}}
{...rest}
>
{children}
</div>
);
};
export default Gradient;