From e61721333923cdef142a7539ecc8a0367a7db3e9 Mon Sep 17 00:00:00 2001 From: Brent Bovenzi Date: Wed, 15 Jun 2022 17:45:38 -0400 Subject: [PATCH 1/5] update webpack-cli, eslint, stylelint, babel --- .pre-commit-config.yaml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.pre-commit-config.yaml b/.pre-commit-config.yaml index 883816f901e60..993ed0f321a55 100644 --- a/.pre-commit-config.yaml +++ b/.pre-commit-config.yaml @@ -583,7 +583,7 @@ repos: language: node files: ^airflow/www/.*\.(css|scss|sass)$ # Keep dependency versions in sync w/ airflow/www/package.json - additional_dependencies: ['stylelint@13.3.1', 'stylelint-config-standard@20.0.0'] + additional_dependencies: ['stylelint@^14.0.0', 'stylelint-config-standard@^25.0.0'] - id: check-providers-init-file-missing name: Provider init file is missing pass_filenames: false From a94350375603b782f6887d9a52e3d277efa63902 Mon Sep 17 00:00:00 2001 From: Brent Bovenzi Date: Thu, 16 Jun 2022 10:22:23 -0400 Subject: [PATCH 2/5] revert stylelint changes --- .pre-commit-config.yaml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.pre-commit-config.yaml b/.pre-commit-config.yaml index 993ed0f321a55..883816f901e60 100644 --- a/.pre-commit-config.yaml +++ b/.pre-commit-config.yaml @@ -583,7 +583,7 @@ repos: language: node files: ^airflow/www/.*\.(css|scss|sass)$ # Keep dependency versions in sync w/ airflow/www/package.json - additional_dependencies: ['stylelint@^14.0.0', 'stylelint-config-standard@^25.0.0'] + additional_dependencies: ['stylelint@13.3.1', 'stylelint-config-standard@20.0.0'] - id: check-providers-init-file-missing name: Provider init file is missing pass_filenames: false From ad74f24e14966dea5a75cadc5f613b607465efa0 Mon Sep 17 00:00:00 2001 From: Brent Bovenzi Date: Thu, 16 Jun 2022 11:38:15 -0400 Subject: [PATCH 3/5] update more plugins --- airflow/www/webpack.config.js | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/airflow/www/webpack.config.js b/airflow/www/webpack.config.js index e48b01c687736..24e252eae1275 100644 --- a/airflow/www/webpack.config.js +++ b/airflow/www/webpack.config.js @@ -54,6 +54,10 @@ Foundation (http://www.apache.org/). }; const config = { + node: { + Buffer: false, + process: false, + }, entry: { airflowDefaultTheme: `${CSS_DIR}/bootstrap-theme.css`, connectionForm: `${JS_DIR}/connection_form.js`, From 28c06b1a36edf0b633857df54e655aa025187663 Mon Sep 17 00:00:00 2001 From: Brent Bovenzi Date: Thu, 16 Jun 2022 12:20:59 -0400 Subject: [PATCH 4/5] update to webpack 5 --- airflow/www/webpack.config.js | 4 ---- 1 file changed, 4 deletions(-) diff --git a/airflow/www/webpack.config.js b/airflow/www/webpack.config.js index 24e252eae1275..e48b01c687736 100644 --- a/airflow/www/webpack.config.js +++ b/airflow/www/webpack.config.js @@ -54,10 +54,6 @@ Foundation (http://www.apache.org/). }; const config = { - node: { - Buffer: false, - process: false, - }, entry: { airflowDefaultTheme: `${CSS_DIR}/bootstrap-theme.css`, connectionForm: `${JS_DIR}/connection_form.js`, From 65e86ec702b8baea22dd58bad3ada85f0aad4af3 Mon Sep 17 00:00:00 2001 From: Brent Bovenzi Date: Thu, 16 Jun 2022 14:25:33 -0400 Subject: [PATCH 5/5] use portalProps to properly style toast msgs --- .../static/js/grid/context/containerRef.jsx | 5 ++- airflow/www/static/js/grid/index.jsx | 36 +++++++++++-------- .../www/static/js/grid/utils/useErrorToast.js | 2 +- 3 files changed, 25 insertions(+), 18 deletions(-) diff --git a/airflow/www/static/js/grid/context/containerRef.jsx b/airflow/www/static/js/grid/context/containerRef.jsx index 4ef3352122c49..9062f907ede00 100644 --- a/airflow/www/static/js/grid/context/containerRef.jsx +++ b/airflow/www/static/js/grid/context/containerRef.jsx @@ -18,7 +18,6 @@ */ import React, { useContext, useRef } from 'react'; -import { Box } from '@chakra-ui/react'; const ContainerRefContext = React.createContext(null); @@ -29,9 +28,9 @@ export const ContainerRefProvider = ({ children }) => { return ( - +
{children} - +
); }; diff --git a/airflow/www/static/js/grid/index.jsx b/airflow/www/static/js/grid/index.jsx index 6a7e129a3d662..549c0b7b292d3 100644 --- a/airflow/www/static/js/grid/index.jsx +++ b/airflow/www/static/js/grid/index.jsx @@ -29,7 +29,7 @@ import { QueryClient, QueryClientProvider } from 'react-query'; import Main from './Main'; import theme from './theme'; -import { ContainerRefProvider } from './context/containerRef'; +import { ContainerRefProvider, useContainerRef } from './context/containerRef'; import { TimezoneProvider } from './context/timezone'; import { AutoRefreshProvider } from './context/autorefresh'; @@ -61,23 +61,31 @@ const queryClient = new QueryClient({ }, }); +// Chakra needs to access the containerRef provider so our tooltips pick up the correct styles +const ChakraApp = () => { + const containerRef = useContainerRef(); + return ( + + + + + +
+ + + + + + ); +}; + function App() { return ( - - - - - - -
- - - - - - + + + ); diff --git a/airflow/www/static/js/grid/utils/useErrorToast.js b/airflow/www/static/js/grid/utils/useErrorToast.js index 842eb53810ba4..c4107bc91f487 100644 --- a/airflow/www/static/js/grid/utils/useErrorToast.js +++ b/airflow/www/static/js/grid/utils/useErrorToast.js @@ -35,10 +35,10 @@ const useErrorToast = () => { // Add an error prop and handle it as a description return ({ error, ...rest }) => { toast({ + ...rest, status: 'error', title: getErrorTitle(error), description: getErrorDescription(error).slice(0, 500), - ...rest, }); }; };