From 18aa2f61697c3816adb90790c32b919a18610c04 Mon Sep 17 00:00:00 2001 From: Lyndsi Kay Williams <55605634+lyndsiWilliams@users.noreply.github.com> Date: Thu, 19 Aug 2021 12:19:33 -0500 Subject: [PATCH] refactor progress (#16339) --- .../HeaderReportActionsDropdown/index.tsx | 97 +++++++++++-------- .../src/components/ReportModal/index.tsx | 19 ++-- .../src/dashboard/components/Header/index.jsx | 17 +--- .../src/reports/actions/reports.js | 4 +- 4 files changed, 74 insertions(+), 63 deletions(-) diff --git a/superset-frontend/src/components/ReportModal/HeaderReportActionsDropdown/index.tsx b/superset-frontend/src/components/ReportModal/HeaderReportActionsDropdown/index.tsx index 4d9ceb86fc5d3..bbc30c80a26a4 100644 --- a/superset-frontend/src/components/ReportModal/HeaderReportActionsDropdown/index.tsx +++ b/superset-frontend/src/components/ReportModal/HeaderReportActionsDropdown/index.tsx @@ -26,6 +26,7 @@ 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 { UserWithPermissionsAndRoles } from 'src/types/bootstrapTypes'; const deleteColor = (theme: SupersetTheme) => css` @@ -33,13 +34,13 @@ const deleteColor = (theme: SupersetTheme) => css` `; export default function HeaderReportActionsDropDown({ - showReportModal, toggleActive, deleteActiveReport, + dashboardId, }: { - showReportModal: () => void; toggleActive: (data: AlertObject, checked: boolean) => void; deleteActiveReport: (data: AlertObject) => void; + dashboardId?: number; }) { const reports: Record = useSelector( state => state.reports, @@ -55,6 +56,7 @@ export default function HeaderReportActionsDropDown({ setCurrentReportDeleting, ] = useState(null); const theme = useTheme(); + const [showModal, setShowModal] = useState(false); const toggleActiveKey = async (data: AlertObject, checked: boolean) => { if (data?.id) { @@ -96,7 +98,9 @@ export default function HeaderReportActionsDropDown({ css={{ marginLeft: theme.gridUnit * 2 }} /> - {t('Edit email report')} + setShowModal(true)}> + {t('Edit email report')} + setCurrentReportDeleting(report)} css={deleteColor} @@ -106,48 +110,59 @@ export default function HeaderReportActionsDropDown({ ); - return canAddReports() ? ( - report ? ( + return ( + canAddReports() && ( <> - - triggerNode.closest('.action-button') - } - > - + setShowModal(false)} + userId={user.userId} + userEmail={user.email} + dashboardId={dashboardId} + /> + {report ? ( + <> + + triggerNode.closest('.action-button') + } + > + + + + + {currentReportDeleting && ( + { + if (currentReportDeleting) { + handleReportDelete(currentReportDeleting); + } + }} + onHide={() => setCurrentReportDeleting(null)} + open + title={t('Delete Report?')} + /> + )} + + ) : ( + setShowModal(true)} + > - - {currentReportDeleting && ( - { - if (currentReportDeleting) { - handleReportDelete(currentReportDeleting); - } - }} - onHide={() => setCurrentReportDeleting(null)} - open - title={t('Delete Report?')} - /> )} - ) : ( - - - ) - ) : null; + ); } diff --git a/superset-frontend/src/components/ReportModal/index.tsx b/superset-frontend/src/components/ReportModal/index.tsx index 240d3176ccec9..79c2e196faeaf 100644 --- a/superset-frontend/src/components/ReportModal/index.tsx +++ b/superset-frontend/src/components/ReportModal/index.tsx @@ -98,7 +98,6 @@ interface ReportProps { userEmail: string; dashboardId?: number; chart?: ChartObject; - creationMethod: string; props: any; } @@ -182,10 +181,14 @@ const ReportModal: FunctionComponent = ({ onReportAdd, onHide, show = false, + dashboardId, + chart, + userId, + userEmail, ...props }) => { - const vizType = props.props.chart?.sliceFormData?.viz_type; - const isChart = !!props.props.chart; + const vizType = chart?.sliceFormData?.viz_type; + const isChart = !!chart; const defaultNotificationFormat = isChart && TEXT_BASED_VISUALIZATION_TYPES.includes(vizType) ? NOTIFICATION_FORMATS.TEXT @@ -221,19 +224,19 @@ const ReportModal: FunctionComponent = ({ // Create new Report const newReportValues: Partial = { crontab: currentReport?.crontab, - dashboard: props.props.dashboardId, - chart: props.props.chart?.id, + dashboard: dashboardId, + chart: chart?.id, description: currentReport?.description, name: currentReport?.name, - owners: [props.props.userId], + owners: [userId], recipients: [ { - recipient_config_json: { target: props.props.userEmail }, + recipient_config_json: { target: userEmail }, type: 'Email', }, ], type: 'Report', - creation_method: props.props.creationMethod, + creation_method: dashboardId ? 'dashboards' : 'charts', active: true, report_format: currentReport?.report_format || defaultNotificationFormat, timezone: currentReport?.timezone, diff --git a/superset-frontend/src/dashboard/components/Header/index.jsx b/superset-frontend/src/dashboard/components/Header/index.jsx index 516359a9c42f7..00feb09a0a917 100644 --- a/superset-frontend/src/dashboard/components/Header/index.jsx +++ b/superset-frontend/src/dashboard/components/Header/index.jsx @@ -163,8 +163,6 @@ class Header extends React.PureComponent { this.overwriteDashboard = this.overwriteDashboard.bind(this); this.showPropertiesModal = this.showPropertiesModal.bind(this); this.hidePropertiesModal = this.hidePropertiesModal.bind(this); - this.showReportModal = this.showReportModal.bind(this); - this.hideReportModal = this.hideReportModal.bind(this); } componentDidMount() { @@ -178,7 +176,6 @@ class Header extends React.PureComponent { 'dashboard_id', 'dashboards', dashboardInfo.id, - user.email, ); } } @@ -215,8 +212,12 @@ class Header extends React.PureComponent { user?.userId, 'dashboard_id', 'dashboards', +<<<<<<< HEAD nextProps?.dashboardInfo?.id, user?.email, +======= + nextProps.dashboardInfo.id, +>>>>>>> refactor progress (#16339) ); } } @@ -402,14 +403,6 @@ class Header extends React.PureComponent { this.setState({ showingPropertiesModal: false }); } - showReportModal() { - this.setState({ showingReportModal: true }); - } - - hideReportModal() { - this.setState({ showingReportModal: false }); - } - canAddReports() { if (!isFeatureEnabled(FeatureFlag.ALERT_REPORTS)) { return false; @@ -596,9 +589,9 @@ class Header extends React.PureComponent { )} )} diff --git a/superset-frontend/src/reports/actions/reports.js b/superset-frontend/src/reports/actions/reports.js index 8f23e283522df..26a16319f44fe 100644 --- a/superset-frontend/src/reports/actions/reports.js +++ b/superset-frontend/src/reports/actions/reports.js @@ -33,14 +33,14 @@ export function fetchUISpecificReport( userId, filter_field, creation_method, - dashboardId, + resourceId, ) { const queryParams = rison.encode({ filters: [ { col: filter_field, opr: 'eq', - value: dashboardId, + value: resourceId, }, { col: 'creation_method',