UNPKG

@adaptabletools/adaptable

Version:

Powerful AG Grid extension which provides advanced, cutting-edge functionality to meet all DataGrid requirements

99 lines (98 loc) 4.07 kB
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime"; import { useReducer, useState, useEffect } from 'react'; import { prepareDataSource, prepareGridOptions } from './helper'; import ConfigurationDialog from './AdaptableConfigurationDialog'; import FileDroppable from '../../components/FileDroppable'; import { validDataSource } from './Utils'; import { Flex } from '../../components/Flex'; export const initialState = { dropped: false, }; export const reducer = (state, action) => { if (action.type === 'DROPPED') { return { ...state, adaptableOptions: action.payload.adaptableOptions, gridOptions: action.payload.gridOptions, dropped: true, error: null, }; } if (action.type === 'ERROR') { return { ...state, dropped: false, error: action.payload, }; } if (action.type === 'CANCEL') { return { ...state, error: null, dropped: false, }; } return state; }; export const Wizard = (props) => { const [state, dispatch] = useReducer(reducer, { ...initialState, adaptableOptions: props.adaptableOptions, gridOptions: props.gridOptions, }); const [droppableKey, setDroppableKey] = useState(Date.now()); const [isDataLoading, setIsDataLoading] = useState(false); const handleDataSource = (array, file) => { const dataSourceInfo = (props.prepareData || prepareDataSource)(array, file); try { validDataSource(dataSourceInfo); } catch (err) { return dispatch({ type: 'ERROR', payload: `Invalid adaptable configuration - ${err}`, }); } const gridOptions = prepareGridOptions(dataSourceInfo, props.gridOptions); const adaptableOptions = { ...props.adaptableOptions }; adaptableOptions.adaptableId = adaptableOptions.adaptableId || (file ? file.name : ''); if (dataSourceInfo.primaryKey) { adaptableOptions.primaryKey = dataSourceInfo.primaryKey; } const shouldShowWizard = props.fetchData ? Boolean(props.showFetchDataWizard) : true; if (shouldShowWizard) { dispatch({ type: 'DROPPED', payload: { adaptableOptions, gridOptions }, }); } else { props.onInit(adaptableOptions, gridOptions); } }; let wizard; if (props.skipToWizard || state.dropped) { wizard = (_jsx(ConfigurationDialog, { startSections: props.startSections, adaptableConfig: { adaptableOptions: state.adaptableOptions, gridOptions: state.gridOptions, }, onCancel: () => { setDroppableKey(Date.now()); dispatch({ type: 'CANCEL', }); }, onFinish: (adaptableConfig) => { props.onInit(adaptableConfig.adaptableOptions, adaptableConfig.gridOptions); } })); } useEffect(() => { if (props.fetchData) { setIsDataLoading(true); props.fetchData().then((data) => { handleDataSource(data); setIsDataLoading(false); }); } }, []); const ddEnabled = props.ddEnabled ?? !props.fetchData; return (_jsxs(_Fragment, { children: [ddEnabled && (_jsx(FileDroppable, { className: 'ab-NocodeWizard', toJSON: props.fileContentsToJSON, readFile: props.readFile, fileAccept: props.fileAccept, helpText: props.helpText, message: state.error, defaultText: props.defaultActionMessage, dragOverText: props.dragOverActionMessage, loadingText: props.loadingMessage, onDropSuccess: handleDataSource }, droppableKey)), isDataLoading && (_jsx(Flex, { className: 'ab-NocodeWizard', alignItems: "center", justifyContent: "center", flexDirection: "column", children: props.loadingMessage || 'Loading ...' })), wizard] })); };