diff --git a/superset-frontend/src/components/ReportModal/index.tsx b/superset-frontend/src/components/ReportModal/index.tsx index 7ec4681912c43..3770aadeda1f4 100644 --- a/superset-frontend/src/components/ReportModal/index.tsx +++ b/superset-frontend/src/components/ReportModal/index.tsx @@ -125,7 +125,6 @@ type ReportActionType = type: ActionType.reset; }; -const DEFAULT_NOTIFICATION_FORMAT = 'TEXT'; const TEXT_BASED_VISUALIZATION_TYPES = [ 'pivot_table', 'pivot_table_v2', @@ -133,13 +132,18 @@ const TEXT_BASED_VISUALIZATION_TYPES = [ 'paired_ttest', ]; +const NOTIFICATION_FORMATS = { + TEXT: 'TEXT', + PNG: 'PNG', + CSV: 'CSV', +}; + const reportReducer = ( state: Partial | null, action: ReportActionType, ): Partial | null => { const initialState = { name: state?.name || 'Weekly Report', - report_format: state?.report_format || DEFAULT_NOTIFICATION_FORMAT, ...(state || {}), }; @@ -167,9 +171,14 @@ const ReportModal: FunctionComponent = ({ ...props }) => { const vizType = props.props.chart?.sliceFormData?.viz_type; + const isChart = !!props.props.chart; + const defaultNotificationFormat = + isChart && TEXT_BASED_VISUALIZATION_TYPES.includes(vizType) + ? NOTIFICATION_FORMATS.TEXT + : NOTIFICATION_FORMATS.PNG; const [currentReport, setCurrentReport] = useReducer< Reducer | null, ReportActionType> - >(reportReducer, null); + >(reportReducer, { report_format: defaultNotificationFormat }); const onChange = useCallback((type: any, payload: any) => { setCurrentReport({ type, payload }); }, []); @@ -179,6 +188,7 @@ const ReportModal: FunctionComponent = ({ // Report fetch logic const reports = useSelector(state => state.reports); const isEditMode = reports && Object.keys(reports).length; + useEffect(() => { if (isEditMode) { const reportsIds = Object.keys(reports); @@ -271,17 +281,17 @@ const ReportModal: FunctionComponent = ({ value: event.target.value, }); }} - value={currentReport?.report_format || DEFAULT_NOTIFICATION_FORMAT} + value={currentReport?.report_format || defaultNotificationFormat} > {TEXT_BASED_VISUALIZATION_TYPES.includes(vizType) && ( - + {t('Text embedded in email')} )} - + {t('Image (PNG) embedded in email')} - + {t('Formatted CSV attached in email')} @@ -375,7 +385,7 @@ const ReportModal: FunctionComponent = ({ }} timezone={currentReport?.timezone} /> - {props.props.chart && renderMessageContentSection} + {isChart && renderMessageContentSection} );