This is an automated email from the ASF dual-hosted git repository. elizabeth pushed a commit to branch refactorReports in repository https://gitbox.apache.org/repos/asf/superset.git
commit 9bc42361fde91c61380540af48e8b8047c7f03d7 Author: AAfghahi <[email protected]> AuthorDate: Fri Aug 20 13:09:40 2021 -0400 code dry (#16358) --- .../HeaderReportActionsDropdown/index.tsx | 24 ++++++++-- .../src/components/ReportModal/index.tsx | 22 ++------- .../src/dashboard/components/Header/index.jsx | 44 +---------------- .../explore/components/DataTablesPane/index.tsx | 2 +- .../src/explore/components/ExploreChartHeader.jsx | 56 +--------------------- superset-frontend/src/reports/actions/reports.js | 12 ++--- 6 files changed, 34 insertions(+), 126 deletions(-) diff --git a/superset-frontend/src/components/ReportModal/HeaderReportActionsDropdown/index.tsx b/superset-frontend/src/components/ReportModal/HeaderReportActionsDropdown/index.tsx index 026a262..cf2ae7f 100644 --- a/superset-frontend/src/components/ReportModal/HeaderReportActionsDropdown/index.tsx +++ b/superset-frontend/src/components/ReportModal/HeaderReportActionsDropdown/index.tsx @@ -16,18 +16,19 @@ * specific language governing permissions and limitations * under the License. */ -import React, { useState } from 'react'; -import { useSelector } from 'react-redux'; +import React, { useState, useEffect } from 'react'; +import { useSelector, useDispatch } from 'react-redux'; import { t, SupersetTheme, css, useTheme } from '@superset-ui/core'; import Icons from 'src/components/Icons'; import { Switch } from 'src/components/Switch'; import { AlertObject } from 'src/views/CRUD/alert/types'; import { Menu, NoAnimationDropdown } from 'src/common/components'; import { isFeatureEnabled, FeatureFlag } from 'src/featureFlags'; - import DeleteModal from 'src/components/DeleteModal'; import ReportModal from 'src/components/ReportModal'; +import { ChartState } from 'src/explore/types'; import { UserWithPermissionsAndRoles } from 'src/types/bootstrapTypes'; +import { fetchUISpecificReport } from 'src/reports/actions/reports'; const deleteColor = (theme: SupersetTheme) => css` color: ${theme.colors.error.base}; @@ -37,11 +38,14 @@ export default function HeaderReportActionsDropDown({ toggleActive, deleteActiveReport, dashboardId, + chart, }: { toggleActive: (data: AlertObject, checked: boolean) => void; deleteActiveReport: (data: AlertObject) => void; dashboardId?: number; + chart?: ChartState; }) { + const dispatch = useDispatch(); const reports: Record<number, AlertObject> = useSelector<any, AlertObject>( state => state.reports, ); @@ -86,6 +90,19 @@ export default function HeaderReportActionsDropDown({ return permissions[0].length > 0; }; + useEffect(() => { + if (canAddReports()) { + dispatch( + fetchUISpecificReport({ + userId: user.userId, + filterField: dashboardId ? 'dashboard_id' : 'chart_id', + creationMethod: dashboardId ? 'dashboards' : 'charts', + resourceId: dashboardId || chart?.id, + }), + ); + } + }, []); + const menu = () => ( <Menu selectable={false} css={{ width: '200px' }}> <Menu.Item> @@ -119,6 +136,7 @@ export default function HeaderReportActionsDropDown({ userId={user.userId} userEmail={user.email} dashboardId={dashboardId} + chart={chart} /> {report ? ( <> diff --git a/superset-frontend/src/components/ReportModal/index.tsx b/superset-frontend/src/components/ReportModal/index.tsx index 6042367..20fecdc 100644 --- a/superset-frontend/src/components/ReportModal/index.tsx +++ b/superset-frontend/src/components/ReportModal/index.tsx @@ -36,6 +36,7 @@ import Icons from 'src/components/Icons'; import withToasts from 'src/components/MessageToasts/withToasts'; import { CronError } from 'src/components/CronPicker'; import { RadioChangeEvent } from 'src/common/components'; +import { ChartState } from 'src/explore/types'; import { StyledModal, StyledTopSection, @@ -72,20 +73,6 @@ export interface ReportObject { working_timeout: number; creation_method: string; } - -interface ChartObject { - id: number; - chartAlert: string; - chartStatus: string; - chartUpdateEndTime: number; - chartUpdateStartTime: number; - latestQueryFormData: object; - queryController: { abort: () => {} }; - queriesResponse: object; - triggerQuery: boolean; - lastRendered: number; -} - interface ReportProps { addDangerToast: (msg: string) => void; addSuccessToast: (msg: string) => void; @@ -96,7 +83,7 @@ interface ReportProps { userId: number; userEmail: string; dashboardId?: number; - chart?: ChartObject; + chart?: ChartState; props: any; } @@ -172,12 +159,11 @@ const ReportModal: FunctionComponent<ReportProps> = ({ chart, userId, userEmail, - ...props }) => { const vizType = chart?.sliceFormData?.viz_type; const isChart = !!chart; const defaultNotificationFormat = - isChart && TEXT_BASED_VISUALIZATION_TYPES.includes(vizType) + vizType && TEXT_BASED_VISUALIZATION_TYPES.includes(vizType) ? NOTIFICATION_FORMATS.TEXT : NOTIFICATION_FORMATS.PNG; const [currentReport, setCurrentReport] = useReducer< @@ -287,7 +273,7 @@ const ReportModal: FunctionComponent<ReportProps> = ({ }} value={currentReport?.report_format || defaultNotificationFormat} > - {TEXT_BASED_VISUALIZATION_TYPES.includes(vizType) && ( + {vizType && TEXT_BASED_VISUALIZATION_TYPES.includes(vizType) && ( <StyledRadio value={NOTIFICATION_FORMATS.TEXT}> {t('Text embedded in email')} </StyledRadio> diff --git a/superset-frontend/src/dashboard/components/Header/index.jsx b/superset-frontend/src/dashboard/components/Header/index.jsx index 398daa9..80b250d 100644 --- a/superset-frontend/src/dashboard/components/Header/index.jsx +++ b/superset-frontend/src/dashboard/components/Header/index.jsx @@ -28,8 +28,6 @@ import { LOG_ACTIONS_FORCE_REFRESH_DASHBOARD, LOG_ACTIONS_TOGGLE_EDIT_DASHBOARD, } from 'src/logger/LogUtils'; -import { isFeatureEnabled, FeatureFlag } from 'src/featureFlags'; - import Icons from 'src/components/Icons'; import Button from 'src/components/Button'; import EditableTitle from 'src/components/EditableTitle'; @@ -165,17 +163,8 @@ class Header extends React.PureComponent { } componentDidMount() { - const { refreshFrequency, user, dashboardInfo } = this.props; + const { refreshFrequency } = this.props; this.startPeriodicRender(refreshFrequency * 1000); - if (this.canAddReports()) { - // this is in case there is an anonymous user. - this.props.fetchUISpecificReport( - user.userId, - 'dashboard_id', - 'dashboards', - dashboardInfo.id, - ); - } } componentDidUpdate(prevProps) { @@ -186,7 +175,6 @@ class Header extends React.PureComponent { } UNSAFE_componentWillReceiveProps(nextProps) { - const { user } = this.props; if ( UNDO_LIMIT - nextProps.undoLength <= 0 && !this.state.didNotifyMaxUndoHistoryToast @@ -200,18 +188,6 @@ class Header extends React.PureComponent { ) { this.props.setMaxUndoHistoryExceeded(); } - if ( - this.canAddReports() && - nextProps.dashboardInfo.id !== this.props.dashboardInfo.id - ) { - // this is in case there is an anonymous user. - this.props.fetchUISpecificReport( - user.userId, - 'dashboard_id', - 'dashboards', - nextProps.dashboardInfo.id, - ); - } } componentWillUnmount() { @@ -402,24 +378,6 @@ class Header extends React.PureComponent { this.setState({ showingPropertiesModal: false }); } - canAddReports() { - if (!isFeatureEnabled(FeatureFlag.ALERT_REPORTS)) { - return false; - } - const { user } = this.props; - if (!user) { - // this is in the case that there is an anonymous user. - return false; - } - const roles = Object.keys(user.roles || []); - const permissions = roles.map(key => - user.roles[key].filter( - perms => perms[0] === 'menu_access' && perms[1] === 'Manage', - ), - ); - return permissions[0].length > 0; - } - render() { const { dashboardTitle, diff --git a/superset-frontend/src/explore/components/DataTablesPane/index.tsx b/superset-frontend/src/explore/components/DataTablesPane/index.tsx index 605c4ed..596cec8 100644 --- a/superset-frontend/src/explore/components/DataTablesPane/index.tsx +++ b/superset-frontend/src/explore/components/DataTablesPane/index.tsx @@ -217,7 +217,7 @@ export const DataTablesPane = ({ }, [queryFormData], ); - + console.log(queryFormData); useEffect(() => { setInLocalStorage(STORAGE_KEYS.isOpen, panelOpen); }, [panelOpen]); diff --git a/superset-frontend/src/explore/components/ExploreChartHeader.jsx b/superset-frontend/src/explore/components/ExploreChartHeader.jsx index 30ae52f..5a04dd9 100644 --- a/superset-frontend/src/explore/components/ExploreChartHeader.jsx +++ b/superset-frontend/src/explore/components/ExploreChartHeader.jsx @@ -22,13 +22,11 @@ import { bindActionCreators } from 'redux'; import PropTypes from 'prop-types'; import { styled, t } from '@superset-ui/core'; import { Tooltip } from 'src/components/Tooltip'; -import ReportModal from 'src/components/ReportModal'; import { fetchUISpecificReport, toggleActive, deleteActiveReport, } from 'src/reports/actions/reports'; -import { isFeatureEnabled, FeatureFlag } from 'src/featureFlags'; import HeaderReportActionsDropdown from 'src/components/ReportModal/HeaderReportActionsDropdown'; import { chartPropShape } from '../../dashboard/util/propShapes'; import ExploreActionButtons from './ExploreActionButtons'; @@ -106,25 +104,9 @@ export class ExploreChartHeader extends React.PureComponent { super(props); this.state = { isPropertiesModalOpen: false, - showingReportModal: false, }; this.openPropertiesModal = this.openPropertiesModal.bind(this); this.closePropertiesModal = this.closePropertiesModal.bind(this); - this.showReportModal = this.showReportModal.bind(this); - this.hideReportModal = this.hideReportModal.bind(this); - } - - componentDidMount() { - if (this.canAddReports()) { - const { user, chart } = this.props; - // this is in the case that there is an anonymous user. - this.props.fetchUISpecificReport( - user.userId, - 'chart_id', - 'charts', - chart.id, - ); - } } getSliceName() { @@ -153,32 +135,6 @@ export class ExploreChartHeader extends React.PureComponent { }); } - showReportModal() { - this.setState({ showingReportModal: true }); - } - - hideReportModal() { - this.setState({ showingReportModal: false }); - } - - canAddReports() { - if (!isFeatureEnabled(FeatureFlag.ALERT_REPORTS)) { - return false; - } - const { user } = this.props; - if (!user) { - // this is in the case that there is an anonymous user. - return false; - } - const roles = Object.keys(user.roles || []); - const permissions = roles.map(key => - user.roles[key].filter( - perms => perms[0] === 'menu_access' && perms[1] === 'Manage', - ), - ); - return permissions[0].length > 0; - } - render() { const { user, form_data: formData } = this.props; const { @@ -268,20 +224,10 @@ export class ExploreChartHeader extends React.PureComponent { status={CHART_STATUS_MAP[chartStatus]} /> <HeaderReportActionsDropdown - showReportModal={this.showReportModal} + chart={this.props.chart} toggleActive={this.props.toggleActive} deleteActiveReport={this.props.deleteActiveReport} /> - <ReportModal - show={this.state.showingReportModal} - onHide={this.hideReportModal} - props={{ - userId: this.props.user.userId, - userEmail: this.props.user.email, - chart: this.props.chart, - creationMethod: 'charts', - }} - /> <ExploreActionButtons actions={{ ...this.props.actions, diff --git a/superset-frontend/src/reports/actions/reports.js b/superset-frontend/src/reports/actions/reports.js index 3c01da7..a46849e 100644 --- a/superset-frontend/src/reports/actions/reports.js +++ b/superset-frontend/src/reports/actions/reports.js @@ -30,23 +30,23 @@ export function setReport(report) { return { type: SET_REPORT, report }; } -export function fetchUISpecificReport( +export function fetchUISpecificReport({ userId, - filter_field, - creation_method, + filterField, + creationMethod, resourceId, -) { +}) { const queryParams = rison.encode({ filters: [ { - col: filter_field, + col: filterField, opr: 'eq', value: resourceId, }, { col: 'creation_method', opr: 'eq', - value: creation_method, + value: creationMethod, }, { col: 'created_by',
