import { isChartScriptInConsoleEnabled } from '@/feature-switch' ; import { ChartType } from '@/services/data/tuples/chart-types' ; import { ConnectedSpace } from '@/services/data/tuples/connected-space-types' ; import { Report } from '@/services/data/tuples/report-types' ; import { DropdownOption } from '@/widgets/basic/types' ; import { Lang } from '@/widgets/langs' ; import { ChartHelper } from '@/widgets/report/chart-utils' ; import React from 'react' ; import { useReportEditEventBus } from '../report-edit-event-bus' ; import { ReportEditEventTypes } from '../report-edit-event-bus-types' ; import { DropdownValue } from '../settings-widgets/dropdown-value' ; const ChartTypeOptions = [ { value : ChartType . COUNT , label : Lang . CHART . TYPES . COUNT } , { value : ChartType . BAR , label : Lang . CHART . TYPES . BAR } , { value : ChartType . LINE , label : Lang . CHART . TYPES . LINE } , { value : ChartType . SCATTER , label : Lang . CHART . TYPES . SCATTER } , { value : ChartType . PIE , label : Lang . CHART . TYPES . PIE } , { value : ChartType . DOUGHNUT , label : Lang . CHART . TYPES . DOUGHNUT } , { value : ChartType . NIGHTINGALE , label : Lang . CHART . TYPES . NIGHTINGALE } , { value : ChartType . SUNBURST , label : Lang . CHART . TYPES . SUNBURST } , { value : ChartType . TREE , label : Lang . CHART . TYPES . TREE } , { value : ChartType . TREEMAP , label : Lang . CHART . TYPES . TREEMAP } , { value : ChartType . MAP , label : Lang . CHART . TYPES . MAP } , { value : ChartType . CUSTOMIZED , label : Lang . CHART . TYPES . CUSTOMIZED } ] ; export const ChartTypeEditor = ( props ) => { const { connectedSpace , report } = props ; const { fire } = useReportEditEventBus ( ) ; const onDropdownValueChange = ( option ) => { const { value } = option ; report . chart . type = value ; ChartHelper [ report . chart . type ] . defend ( report ) ; fire ( ReportEditEventTypes . CHART_TYPE_CHANGED , report ) ; } ; let options = ChartTypeOptions ; if ( ! isChartScriptInConsoleEnabled ( ) && ! connectedSpace . isTemplate ) { if ( report . chart . type === ChartType . CUSTOMIZED ) { options = [ { value : ChartType . CUSTOMIZED , label : Lang . CHART . TYPES . CUSTOMIZED } ] ; } else { options = options . filter ( option => option . value !== ChartType . CUSTOMIZED ) ; } } return < DropdownValue label = { Lang . CHART . TYPE } options = { options } value = { report . chart . type } onValueChange = { onDropdownValueChange } / > ; } ;