diff --git a/superset-frontend/src/dashboard/components/SliceAdder.jsx b/superset-frontend/src/dashboard/components/SliceAdder.jsx index 8c2fc920e9b2..eeb83d7c56e4 100644 --- a/superset-frontend/src/dashboard/components/SliceAdder.jsx +++ b/superset-frontend/src/dashboard/components/SliceAdder.jsx @@ -21,10 +21,18 @@ import React from 'react'; import PropTypes from 'prop-types'; import { List } from 'react-virtualized'; import { createFilter } from 'react-search-input'; -import { t, styled, isFeatureEnabled, FeatureFlag } from '@superset-ui/core'; +import { + t, + styled, + isFeatureEnabled, + FeatureFlag, + css, +} from '@superset-ui/core'; import { Input } from 'src/components/Input'; import { Select } from 'src/components'; import Loading from 'src/components/Loading'; +import Button from 'src/components/Button'; +import Icons from 'src/components/Icons'; import { CHART_TYPE, NEW_COMPONENT_SOURCE_TYPE, @@ -79,6 +87,7 @@ const Controls = styled.div` display: flex; flex-direction: row; padding: ${({ theme }) => theme.gridUnit * 3}px; + padding-top: ${({ theme }) => theme.gridUnit * 4}px; `; const StyledSelect = styled(Select)` @@ -86,6 +95,28 @@ const StyledSelect = styled(Select)` min-width: 150px; `; +const NewChartButtonContainer = styled.div` + ${({ theme }) => css` + display: flex; + justify-content: flex-end; + padding-right: ${theme.gridUnit * 2}px; + `} +`; + +const NewChartButton = styled(Button)` + ${({ theme }) => css` + height: auto; + & > .anticon + span { + margin-left: 0; + } + & > [role='img']:first-of-type { + margin-right: ${theme.gridUnit}px; + padding-bottom: 1px; + line-height: 0; + } + `} +`; + class SliceAdder extends React.Component { static sortByComparator(attr) { const desc = attr === 'changed_on' ? -1 : 1; @@ -240,6 +271,18 @@ class SliceAdder extends React.Component { MARGIN_BOTTOM; return (
+ + + window.open('/chart/add', '_blank', 'noopener noreferrer') + } + > + + {t('Create new chart')} + +