From e98e7e4f2fd4da5013e8156dd8ad0b646330de6a Mon Sep 17 00:00:00 2001 From: Krijovnick Date: Fri, 3 Dec 2021 16:31:04 +0300 Subject: [PATCH 1/3] chore(site): add a notification banner --- ...rvey-header-addon.jsx => header-addon.jsx} | 23 ++++++++++++------- .../components/docs/header-addon.module.scss | 20 ++++++++++++++++ .../docs/survey-header-addon.module.scss | 20 ---------------- .../src/components/layouts/page-layout.jsx | 6 +++-- 4 files changed, 39 insertions(+), 30 deletions(-) rename packages/dx-site/src/components/docs/{survey-header-addon.jsx => header-addon.jsx} (68%) create mode 100644 packages/dx-site/src/components/docs/header-addon.module.scss delete mode 100644 packages/dx-site/src/components/docs/survey-header-addon.module.scss diff --git a/packages/dx-site/src/components/docs/survey-header-addon.jsx b/packages/dx-site/src/components/docs/header-addon.jsx similarity index 68% rename from packages/dx-site/src/components/docs/survey-header-addon.jsx rename to packages/dx-site/src/components/docs/header-addon.jsx index 5c2f5dc349..559c136581 100644 --- a/packages/dx-site/src/components/docs/survey-header-addon.jsx +++ b/packages/dx-site/src/components/docs/header-addon.jsx @@ -1,10 +1,11 @@ /* globals document */ import * as React from 'react'; -import styles from './survey-header-addon.module.scss'; +import * as PropTypes from 'prop-types'; +import styles from './header-addon.module.scss'; -const COOKIE_ID = 'dx-cookie-survey'; +const COOKIE_ID = 'dx-cookie-header-addon'; -const SurveyHeaderAddon = React.memo(() => { +const HeaderAddon = React.memo(({ spanText, link, linkText }) => { const [shown, setShown] = React.useState(typeof document !== 'undefined' && document.cookie.indexOf(COOKIE_ID) === -1); const onClick = React.useCallback(() => { @@ -23,17 +24,17 @@ const SurveyHeaderAddon = React.memo(() => { >
- Help us make our products better. + {spanText} - - Take our 5 minute survey. + + {linkText}
{/* eslint-disable-next-line */} - Dismiss + Dismiss @@ -42,4 +43,10 @@ const SurveyHeaderAddon = React.memo(() => { } return null; }); -export default SurveyHeaderAddon; +HeaderAddon.propTypes = { + spanText: PropTypes.string.isRequired, + linkText: PropTypes.string.isRequired, + link: PropTypes.string.isRequired, +}; + +export default HeaderAddon; diff --git a/packages/dx-site/src/components/docs/header-addon.module.scss b/packages/dx-site/src/components/docs/header-addon.module.scss new file mode 100644 index 0000000000..022cb65d2a --- /dev/null +++ b/packages/dx-site/src/components/docs/header-addon.module.scss @@ -0,0 +1,20 @@ +.main { + width: 100%; + background-color: rgb(95, 208, 238); + color: #114e5f; + } + + .underline { + padding-right: 20px; + text-decoration: underline; + cursor: pointer; + } + + .row { + justify-content: space-between; + margin: 0px; + } + + .link { + color: #114e5f !important; + } \ No newline at end of file diff --git a/packages/dx-site/src/components/docs/survey-header-addon.module.scss b/packages/dx-site/src/components/docs/survey-header-addon.module.scss deleted file mode 100644 index d0d26af960..0000000000 --- a/packages/dx-site/src/components/docs/survey-header-addon.module.scss +++ /dev/null @@ -1,20 +0,0 @@ -.main { - width: 100%; - background-color: rgb(95, 208, 238); - color: #114e5f; -} - -.underline { - padding-right: 20px; - text-decoration: underline; - cursor: pointer; -} - -.row { - justify-content: space-between; - margin: 0px; -} - -.link { - color: #114e5f !important; -} diff --git a/packages/dx-site/src/components/layouts/page-layout.jsx b/packages/dx-site/src/components/layouts/page-layout.jsx index 23f0ef502b..9d80f444e9 100644 --- a/packages/dx-site/src/components/layouts/page-layout.jsx +++ b/packages/dx-site/src/components/layouts/page-layout.jsx @@ -5,7 +5,7 @@ import Header from '../header'; import VersionLink from '../docs/version-link'; import LandingProductLinks from '../landing/product-links'; import ContentContainer from './content-container'; -// import SurveyHeaderAddon from '../docs/survey-header-addon'; +import HeaderAddon from '../docs/header-addon'; class PageLayout extends React.PureComponent { static propTypes = { @@ -29,7 +29,9 @@ class PageLayout extends React.PureComponent { )} - // addon={} + addon={ + + } /> {children} From 13e15d149f0170a2f41627df0bfe40d252d2b6d5 Mon Sep 17 00:00:00 2001 From: Krijovnick Date: Wed, 19 Jan 2022 13:05:27 +0300 Subject: [PATCH 2/3] change readme file --- README.md | 3 +++ 1 file changed, 3 insertions(+) diff --git a/README.md b/README.md index 905dbe83b6..540970d954 100644 --- a/README.md +++ b/README.md @@ -2,6 +2,9 @@ DevExtreme Reactive is a set of business React components that deeply integrate with Bootstrap and Material-UI libraries. +## This project is not in development but supported +We are currently investigating the possibility of making our [DevExtreme](https://github.com/DevExpress/DevExtreme) components [native](https://github.com/DevExpress/DevExtreme/issues/16468) to replace DevExtreme Reactive components. Thus, if you want to create a new application, we recommend doing it with [devextreme react](https://github.com/DevExpress/devextreme-react). For those who already have an application on Reactive, we will write migration guides and do our best to make the migration easier. + ## Common Features - Composable and extendable plugin-based architecture From b4cab7f4253f4f81deffbe425355cbb2022fbdea Mon Sep 17 00:00:00 2001 From: Krijovnick Date: Wed, 19 Jan 2022 15:21:13 +0300 Subject: [PATCH 3/3] add changes --- README.md | 4 ++-- packages/dx-site/src/components/layouts/page-layout.jsx | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/README.md b/README.md index 540970d954..f79e1d7eb4 100644 --- a/README.md +++ b/README.md @@ -2,8 +2,8 @@ DevExtreme Reactive is a set of business React components that deeply integrate with Bootstrap and Material-UI libraries. -## This project is not in development but supported -We are currently investigating the possibility of making our [DevExtreme](https://github.com/DevExpress/DevExtreme) components [native](https://github.com/DevExpress/DevExtreme/issues/16468) to replace DevExtreme Reactive components. Thus, if you want to create a new application, we recommend doing it with [devextreme react](https://github.com/DevExpress/devextreme-react). For those who already have an application on Reactive, we will write migration guides and do our best to make the migration easier. +## This project is not in development. We continue to support and fix bugs in it +We are currently investigating the possibility of making our [DevExtreme](https://github.com/DevExpress/DevExtreme) components [native](https://github.com/DevExpress/DevExtreme/issues/16468). They will replace DevExtreme Reactive components. To create a new application, use [devextreme react](https://github.com/DevExpress/devextreme-react). We are now working on migration guides for those who already have applications based on Reactive to make the migration easier. ## Common Features diff --git a/packages/dx-site/src/components/layouts/page-layout.jsx b/packages/dx-site/src/components/layouts/page-layout.jsx index 9d80f444e9..f15ae6a04a 100644 --- a/packages/dx-site/src/components/layouts/page-layout.jsx +++ b/packages/dx-site/src/components/layouts/page-layout.jsx @@ -30,7 +30,7 @@ class PageLayout extends React.PureComponent { )} addon={ - + } />