From 3e15c5490a209a32f4aecf8f7d936fd9e61e676f Mon Sep 17 00:00:00 2001 From: AAfghahi <48933336+AAfghahi@users.noreply.github.com> Date: Fri, 20 Aug 2021 13:09:40 -0400 Subject: [PATCH] code dry (#16358) --- .../HeaderReportActionsDropdown/index.tsx | 24 +++++++-- .../src/components/ReportModal/index.tsx | 24 +++++++++ .../src/dashboard/components/Header/index.jsx | 49 +------------------ .../components/DataTablesPane/index.tsx | 2 +- .../components/ExploreChartHeader/index.jsx | 31 +----------- .../src/reports/actions/reports.js | 12 ++--- 6 files changed, 55 insertions(+), 87 deletions(-) diff --git a/superset-frontend/src/components/ReportModal/HeaderReportActionsDropdown/index.tsx b/superset-frontend/src/components/ReportModal/HeaderReportActionsDropdown/index.tsx index 716bafe72820..8d74e748ec1c 100644 --- a/superset-frontend/src/components/ReportModal/HeaderReportActionsDropdown/index.tsx +++ b/superset-frontend/src/components/ReportModal/HeaderReportActionsDropdown/index.tsx @@ -16,8 +16,8 @@ * 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'; @@ -25,10 +25,11 @@ import { AlertObject } from 'src/views/CRUD/alert/types'; import { Menu } from 'src/components/Menu'; import { NoAnimationDropdown } from 'src/components/Dropdown'; 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}; @@ -38,11 +39,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 = useSelector( state => state.reports, ); @@ -87,6 +91,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 = () => ( @@ -120,6 +137,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 c9f113a1519d..328061358385 100644 --- a/superset-frontend/src/components/ReportModal/index.tsx +++ b/superset-frontend/src/components/ReportModal/index.tsx @@ -37,11 +37,14 @@ import withToasts from 'src/components/MessageToasts/withToasts'; import { CronError } from 'src/components/CronPicker'; import { RadioChangeEvent } from 'src/components'; import { ChartState } from 'src/explore/types'; +<<<<<<< HEAD import { ReportCreationMethod, ReportRecipientType, ReportScheduleType, } from 'src/reports/types'; +======= +>>>>>>> code dry (#16358) import { antDErrorAlertStyles, StyledModal, @@ -131,6 +134,7 @@ const ReportModal: FunctionComponent = ({ chart, userId, userEmail, +<<<<<<< HEAD creationMethod, ...props }) => { @@ -169,6 +173,22 @@ const ReportModal: FunctionComponent = ({ reportReducer, initialState, ); +======= + props, +}) => { + const vizType = chart?.sliceFormData?.viz_type; + const isChart = !!chart; + const defaultNotificationFormat = + vizType && TEXT_BASED_VISUALIZATION_TYPES.includes(vizType) + ? NOTIFICATION_FORMATS.TEXT + : NOTIFICATION_FORMATS.PNG; + const [currentReport, setCurrentReport] = useReducer< + Reducer | null, ReportActionType> + >(reportReducer, null); + const onReducerChange = useCallback((type: any, payload: any) => { + setCurrentReport({ type, payload }); + }, []); +>>>>>>> code dry (#16358) const [cronError, setCronError] = useState(); const dispatch = useDispatch(); @@ -265,7 +285,11 @@ const ReportModal: FunctionComponent = ({ }} value={currentReport.report_format || defaultNotificationFormat} > +<<<<<<< HEAD {isTextBasedChart && ( +======= + {vizType && TEXT_BASED_VISUALIZATION_TYPES.includes(vizType) && ( +>>>>>>> code dry (#16358) {t('Text embedded in email')} diff --git a/superset-frontend/src/dashboard/components/Header/index.jsx b/superset-frontend/src/dashboard/components/Header/index.jsx index 251a03c9e127..d90488a7b064 100644 --- a/superset-frontend/src/dashboard/components/Header/index.jsx +++ b/superset-frontend/src/dashboard/components/Header/index.jsx @@ -22,14 +22,12 @@ import React from 'react'; import PropTypes from 'prop-types'; import { styled, t, getSharedLabelColor } from '@superset-ui/core'; import ButtonGroup from 'src/components/ButtonGroup'; - +import { isFeatureEnabled, FeatureFlag } from 'src/featureFlags'; import { LOG_ACTIONS_PERIODIC_RENDER_DASHBOARD, 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'; @@ -168,19 +166,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. - if (Object.entries(dashboardInfo).length) { - this.props.fetchUISpecificReport( - user.userId, - 'dashboard_id', - 'dashboards', - dashboardInfo.id, - ); - } - } } componentDidUpdate(prevProps) { @@ -191,7 +178,6 @@ class Header extends React.PureComponent { } UNSAFE_componentWillReceiveProps(nextProps) { - const { user } = this.props; if ( UNDO_LIMIT - nextProps.undoLength <= 0 && !this.state.didNotifyMaxUndoHistoryToast @@ -205,19 +191,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, - user?.email, - ); - } } componentWillUnmount() { @@ -410,24 +383,6 @@ class Header extends React.PureComponent { this.setState({ showingPropertiesModal: false }); } - canAddReports() { - if (!isFeatureEnabled(FeatureFlag.ALERT_REPORTS)) { - return false; - } - const { user } = this.props; - if (!user?.userId) { - // 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 22f39328013c..0eef298d5d3a 100644 --- a/superset-frontend/src/explore/components/DataTablesPane/index.tsx +++ b/superset-frontend/src/explore/components/DataTablesPane/index.tsx @@ -336,7 +336,7 @@ export const DataTablesPane = ({ }, [queryFormData, columnNames], ); - + console.log(queryFormData); useEffect(() => { setItem(LocalStorageKeys.is_datapanel_open, panelOpen); }, [panelOpen]); diff --git a/superset-frontend/src/explore/components/ExploreChartHeader/index.jsx b/superset-frontend/src/explore/components/ExploreChartHeader/index.jsx index 1be9dd77a2be..d996e259bd73 100644 --- a/superset-frontend/src/explore/components/ExploreChartHeader/index.jsx +++ b/superset-frontend/src/explore/components/ExploreChartHeader/index.jsx @@ -26,12 +26,12 @@ import { SupersetClient, t, } from '@superset-ui/core'; +import { Tooltip } from 'src/components/Tooltip'; import { fetchUISpecificReport, toggleActive, deleteActiveReport, } from 'src/reports/actions/reports'; -import { isFeatureEnabled, FeatureFlag } from 'src/featureFlags'; import { chartPropShape } from 'src/dashboard/util/propShapes'; import AlteredSliceTag from 'src/components/AlteredSliceTag'; import FaveStar from 'src/components/FaveStar'; @@ -40,7 +40,6 @@ import Icons from 'src/components/Icons'; import PropertiesModal from 'src/explore/components/PropertiesModal'; import { sliceUpdated } from 'src/explore/actions/exploreActions'; import CertifiedBadge from 'src/components/CertifiedBadge'; -import { Tooltip } from 'src/components/Tooltip'; import ExploreAdditionalActionsMenu from '../ExploreAdditionalActionsMenu'; import { ChartEditableTitle } from './ChartEditableTitle'; @@ -124,16 +123,6 @@ export class ExploreChartHeader extends React.PureComponent { componentDidMount() { const { dashboardId } = this.props; - 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, - ); - } if (dashboardId) { this.fetchChartDashboardData(); } @@ -201,24 +190,6 @@ export class ExploreChartHeader extends React.PureComponent { }); } - canAddReports() { - if (!isFeatureEnabled(FeatureFlag.ALERT_REPORTS)) { - return false; - } - const { user } = this.props; - if (!user?.userId) { - // 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 { actions, diff --git a/superset-frontend/src/reports/actions/reports.js b/superset-frontend/src/reports/actions/reports.js index eababecbca4e..d3f2b35118a7 100644 --- a/superset-frontend/src/reports/actions/reports.js +++ b/superset-frontend/src/reports/actions/reports.js @@ -29,23 +29,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',