Untitled

 avatar
unknown
javascript
2 years ago
32 kB
5
Indexable
/* eslint-disable react-hooks/exhaustive-deps */import React, { lazy, memo, useRef, useState, useEffect, useCallback, useMemo } from 'react'import PropTypes from 'prop-types'import { Grid, GridColumn, GridToolbar, getSelectedState } from '@progress/kendo-react-grid'import { ExcelExport, ExcelExportColumn } from '@progress/kendo-react-excel-export'import { process, groupBy } from '@progress/kendo-data-query'import { setGroupIds } from '@progress/kendo-react-data-tools'import { getTranslation, errorAlert, validateFieldAccessMode } from '../../utils'import { ToolbarItem, ToolbarSpacer, ToolbarSeparator } from '@progress/kendo-react-buttons'import { makeStyles } from '@material-ui/core/styles'import IconButton from '@material-ui/core/IconButton'import SaveIcon from '@material-ui/icons/Save'import AddIcon from '@material-ui/icons/Add'import LibraryBooksIcon from '@material-ui/icons/LibraryBooks'import { getter } from '@progress/kendo-react-common'import { loadMessages } from '@progress/kendo-react-intl'import en from '../../translations/en'import es from '../../translations/es'import { useSelector } from 'react-redux'import { pageFieldsAccessModes } from '../../redux/selectors'import { FormGroup } from '@applus/applus-components'const TableCustomKendoCommandCell = lazy(() => import('../TableCustomKendoCommandCell'))
const TableCustomKendoSpinner = lazy(() => import('../TableCustomKendoSpinner'))
const ButtonAlternative = lazy(() => import('../../components/ButtonAlternative'))
const useStyles = makeStyles(theme => ({
    textInfo: {
        color: '#ff6900'    }
}))
const TableCustomKendo = ({
    columns,
    dataEditEvaluatedValues,
    gridProps,
    height = 'auto',
    width = 'auto',
    data,
    isLoading = false,
    orderByColumns,
    onAdd = () => {},
    onUpdate = () => {},
    onCopy = () => {},
    onDelete = () => {},
    onEnterEdit = () => {},
    onShowHistory = () => {},
    onRedirect = () => {},
    onSaveSelection = () => {},
    onDownload = () => {},
    onUpload = () => {},
    onShowSignature = () => {},
    onSearch = () => {},
    language,
    translation,
    fieldsPage,
    scenario,
    exportCurrentPage = false,
    fieldPageFileName = 'exportFileName',
    exportErrorExcelMessage = '',
    customFileName = '',
    hideExportButton = false,
    hideSaveButton = false,
    textSaveIcon = '',
    minItemsPerPage = 20,
    buttonsTitlePrefix = '',
    blockFields = false,
    setSelection = () => {},
    allLocked = false,
    dataBind = false,
    customOnExpandChange,
    customUpdateDataItems,
    customToolbar}) => {
    loadMessages(language?.isoCode === 'es-ES' ? es.translation : en.translation, language?.isoCode)
    columns = columns.map(c => (!c.minResizableWidth && !c.width ? { ...c, minResizableWidth: 50 } : c))
    const initOrderBy = !!orderByColumns ? orderByColumns : [{ field: 'code', dir: 'asc' }]
    const fieldsAccessModes = useSelector(state => pageFieldsAccessModes(state))
    const classes = useStyles()
    const [collapsedState, setCollapsedState] = useState([])
    const [dataResult, setDataResult] = useState(data)
    const [dataFiltered, setDataFiltered] = useState(data)
    const [selectedState, setSelectedState] = useState({})
    const [dataState, setDataState] = useState({
        sort: initOrderBy,
        take: minItemsPerPage,
        skip: 0,
        group: gridProps?.initialGroup    })
    const [tableHeight, setTableHeight] = useState(150)
    const [tableWidth, setTableWidth] = useState(1600)
    const [disabled, setDisabled] = useState(false)
    const [selectedAll, setSelectedAll] = useState(false)
    const _export = useRef(null)
    const tableDiv = useRef(null)
    const editField = 'inEdit'    let commandCellWidth = 0    const { dataItemKey, editable = false, selectable = false, groupable = false, initialGroup = [] } = gridProps    const idGetter = getter(dataItemKey)
    const validateEditBtn = validateFieldAccessMode(
        fieldsPage,
        fieldsAccessModes,
        `${buttonsTitlePrefix}btn_edit`,
        'Hidden',
        true    )
    const validateCopyBtn = validateFieldAccessMode(
        fieldsPage,
        fieldsAccessModes,
        `${buttonsTitlePrefix}btn_copy`,
        'Hidden',
        true    )
    const validateDeleteBtn = validateFieldAccessMode(
        fieldsPage,
        fieldsAccessModes,
        `${buttonsTitlePrefix}btn_delete`,
        'Hidden',
        true    )
    const validateDownloadBtn = validateFieldAccessMode(
        fieldsPage,
        fieldsAccessModes,
        `${buttonsTitlePrefix}btn_download`,
        'Hidden',
        true    )
    const validateUploadBtn = validateFieldAccessMode(
        fieldsPage,
        fieldsAccessModes,
        `${buttonsTitlePrefix}btn_upload`,
        'Hidden',
        true    )
    const validateHistoryBtn = validateFieldAccessMode(
        fieldsPage,
        fieldsAccessModes,
        `${buttonsTitlePrefix}btn_history`,
        'Hidden',
        true    )
    const validateAddBtn = validateFieldAccessMode(
        fieldsPage,
        fieldsAccessModes,
        `${buttonsTitlePrefix}btn_add`,
        'Hidden',
        true    )
    const validateSignatureBtn = validateFieldAccessMode(
        fieldsPage,
        fieldsAccessModes,
        `${buttonsTitlePrefix}btn_signature`,
        'Hidden',
        true    )
    const validateSearchBtn = validateFieldAccessMode(
        fieldsPage,
        fieldsAccessModes,
        `${buttonsTitlePrefix}btn_search`,
        'Hidden',
        true    )
    let addRowItem = false,
        editRowItem = false,
        copyRowItem = false,
        removeRowItem = false,
        downloadRowItem = false,
        historyRowItem = false,
        addGoRedirect = false,
        uploadRowItem = false,
        signatureRowItem = false,
        searchRowItem = false    if (editable === true) {
        addRowItem = true        editRowItem = true        copyRowItem = true        removeRowItem = true        historyRowItem = true        addGoRedirect = true        downloadRowItem = true        uploadRowItem = true        signatureRowItem = true        searchRowItem = true    } else if (!!editable) {
        if (editable.addRowItem === true) addRowItem = editable.addRowItem        if (editable.addGoRedirect === true) addGoRedirect = editable.addGoRedirect        if (editable.editRowItem === true) editRowItem = editable.editRowItem        if (editable.copyRowItem === true) copyRowItem = editable.copyRowItem        if (editable.removeRowItem === true) removeRowItem = editable.removeRowItem        if (editable.historyRowItem === true) historyRowItem = editable.historyRowItem        if (editable.downloadRowItem === true) downloadRowItem = editable.downloadRowItem        if (editable.uploadRowItem === true) uploadRowItem = editable.uploadRowItem        if (editable.signatureRowItem === true) signatureRowItem = editable.signatureRowItem        if (editable.searchRowItem === true) searchRowItem = editable.searchRowItem    }
    const showEditBtn = editRowItem && validateEditBtn    const showCopyBtn = copyRowItem && validateCopyBtn    const showRemoveBtn = removeRowItem && validateDeleteBtn    const showDownloadBtn = downloadRowItem && validateDownloadBtn    const showUploadBtn = uploadRowItem && validateUploadBtn    const showHistoryBtn = historyRowItem && validateHistoryBtn    const showSelectable = selectable && validateAddBtn    const showAddRedirect = (addRowItem || addGoRedirect) && validateAddBtn    const showSignatureBtn = signatureRowItem && validateSignatureBtn    const showSearchBtn = searchRowItem && validateSearchBtn    if (showEditBtn) commandCellWidth += 50    if (showCopyBtn) commandCellWidth += 50    if (showRemoveBtn) commandCellWidth += 50    if (showDownloadBtn) commandCellWidth += 50    if (showUploadBtn) commandCellWidth += 50    if (showHistoryBtn) commandCellWidth += 50    if (showSignatureBtn) commandCellWidth += 50    if (showSearchBtn) commandCellWidth += 50    if (commandCellWidth === 50 && dataResult.some(d => d.inEdit)) commandCellWidth += 50    let result = Object.entries(selectedState).map(([k, v]) => ({ id: Number(k), checked: v }))
    let filteredData = []
    for (let i = 0; i < data.length; i++) {
        for (let j = 0; j < result.length; j++) {
            if (data[i].id === result[j].id && result[j].checked === true) {
                filteredData.push(data[i])
            }
        }
    }
    useEffect(() => {
        !!filteredData && setSelection(filteredData)
    }, [filteredData.length])
    useEffect(() => {
        !!selectable            ? setDataResult(
                  data.map(dataItem =>                      Object.assign(
                          {
                              selected: false                          },
                          dataItem                      )
                  )
              )
            : setDataResult(data)
        setDisabled(false)
    }, [data])
    useEffect(() => {
        !!selectable && setDataFiltered(process(dataResult, { ...dataState, take: null }).data)
    }, [dataState, dataResult])
    useEffect(() => {
        !!tableDiv.current.clientHeight && setTableHeight(tableDiv.current.clientHeight)
        !!tableDiv.current.clientWidth && setTableWidth(tableDiv.current.clientWidth)
        const selectionArr = Object.entries(selectedState)
        const filteredArr = selectionArr.filter(([key, value]) => value === true)
        const selectedArr = Object.fromEntries(filteredArr)
        setSelection(Object.keys(selectedArr))
    })
    const CommandCell = props => (
        <TableCustomKendoCommandCell            {...props}
            fieldsPage={fieldsPage}
            language={language}
            scenario={scenario}
            edit={enterEdit}
            editConditionsValid={editConditionsValid}
            remove={remove}
            add={add}
            discard={discard}
            update={update}
            copy={copy}
            download={download}
            cancel={cancel}
            editField={editField}
            showHistory={showHistory}
            editRowItem={showEditBtn}
            copyRowItem={showCopyBtn}
            search={search}
            searchRowItem={showSearchBtn}
            downloadRowItem={showDownloadBtn}
            removeRowItem={showRemoveBtn}
            historyRowItem={showHistoryBtn}
            dataItemKey={dataItemKey}
            buttonsTitlePrefix={buttonsTitlePrefix}
            uploadRowItem={showUploadBtn}
            signatureRowItem={showSignatureBtn}
            showSignature={showSignature}
            setFiles={upload}
            allLocked={allLocked}
        />    )
    const getUpdateDataItems = (event, dataItemKey) => {
        const inEditID = event.dataItem[dataItemKey]
        const field = event.field || ''        return function updateDataItems(old) {
            return old.map(item => (item[dataItemKey] === inEditID ? { ...item, [field]: event.value } : item))
        }
    }
    const itemChange = event => {
        const updateDataItems = customUpdateDataItems            ? customUpdateDataItems(event, dataItemKey, data)
            : getUpdateDataItems(event, dataItemKey)
        setDataResult(updateDataItems)
    }
    const addNew = e => {
        e.preventDefault()
        const newDataItem = {
            inEdit: true,
            Discontinued: false        }
        setDataResult([newDataItem, ...data])
    }
    const redirectToCreate = e => {
        e.preventDefault()
        onRedirect()
    }
    const enterEdit = (e, dataItem) => {
        e.preventDefault()
        const enterEditError = onEnterEdit(dataItem)
        if (!enterEditError) {
            const updatedDataItem = { ...dataItem, inEdit: true }
            setDataResult(old =>                old.map(item => (item[dataItemKey] === updatedDataItem[dataItemKey] ? updatedDataItem : item))
            )
        }
    }
    const update = (e, dataItem) => {
        e.preventDefault()
        const updateError = onUpdate(dataItem)
        if (!updateError) {
            const updatedDataItem = { ...dataItem, inEdit: false }
            setDataResult(old =>                old.map(item => (item[dataItemKey] === updatedDataItem[dataItemKey] ? updatedDataItem : item))
            )
        }
    }
    const copy = (e, dataItem) => {
        e.preventDefault()
        onCopy(dataItem)
    }
    const upload = (dataItem, file) => {
        onUpload(dataItem, [file], { ...dataItem, fileName: file?.name || '' })
    }
    const cancel = (e, dataItem) => {
        e.preventDefault()
        const originalItem = data.find(p => p[dataItemKey] === dataItem[dataItemKey])
        setDataResult(old => old.map(item => (item[dataItemKey] === originalItem[dataItemKey] ? originalItem : item)))
    }
    const remove = (e, dataItem) => {
        e.preventDefault()
        onDelete(dataItem)
    }
    const add = (e, dataItem) => {
        e.preventDefault()
        dataItem.inEdit = true        onAdd(dataItem)
    }
    const discard = e => {
        e.preventDefault()
        setDataResult(data)
    }
    const download = (e, dataItem) => {
        e.preventDefault()
        onDownload(dataItem)
    }
    const excelExport = e => {
        e.preventDefault()
        if (_export.current) {
            _export.current.save(exportCurrentPage ? process(dataResult, dataState) : data)
        } else {
            errorAlert(exportErrorExcelMessage)
        }
    }
    const showHistory = (e, dataItem) => {
        e.preventDefault()
        onShowHistory(dataItem)
    }
    const showSignature = (e, dataItem) => {
        e.preventDefault()
        onShowSignature(dataItem)
    }
    const search = (e, dataItem) => {
        e.preventDefault()
        onSearch(dataItem)
    }
    const saveSelection = e => {
        e.preventDefault()
        const selectionArr = Object.entries(selectedState)
        const filteredArr = selectionArr.filter(([key, value]) => value === true)
        const selectedArr = Object.fromEntries(filteredArr)
        const ids = Object.keys(selectedArr)
        if (dataBind) {
            const dataSelected = []
            ids.forEach(e => {
                const found = dataResult.find(el => el.id === e)
                if (found) dataSelected.push(found)
            })
            onSaveSelection(dataSelected)
        } else {
            onSaveSelection(ids)
            setDisabled(true)
        }
        setSelectedState({})
        setSelectedAll(false)
    }
    const onSelectionChange = useCallback(
        event => {
            const newSelectedState = getSelectedState({
                event,
                selectedState: selectedState,
                dataItemKey: dataItemKey            })
            setSelectedState(newSelectedState)
        },
        [selectedState]
    )
    const onHeaderSelectionChange = useCallback(
        event => {
            const checkboxElement = event.syntheticEvent.target            const checked = checkboxElement.checked            const newSelectedState = {}
            dataFiltered.forEach(item => {
                if (dataState?.group?.length) {
                    item?.items?.forEach(subitem => {
                        newSelectedState[idGetter(subitem)] = checked                    })
                } else {
                    newSelectedState[idGetter(item)] = checked                }
            })
            setSelectedState(newSelectedState)
            setSelectedAll(checked)
        },
        [dataFiltered]
    )
    const selectedElementsCount = useCallback(() => {
        if (!!translation) {
            const text = translation('toolbar.nRowsSelected')
            return (
                <div className={classes.textInfo}>                    {text.replace('{0}', Object.values(selectedState).filter(s => s === true).length)}
                </div>            )
        }
    })
    const onExpandChange = useCallback(
        event => {
            let index = collapsedState.indexOf(event.dataItem.value)
            if (index >= 0) {
                let changed = collapsedState.filter((e, i) => i !== index)
                setCollapsedState(changed)
            } else {
                setCollapsedState([...collapsedState, event.dataItem.value])
            }
        },
        [collapsedState]
    )
    const editConditionsValid = dataItem => {
        if (!!!dataEditEvaluatedValues || dataEditEvaluatedValues.length === 0) {
            return true        }
        const answersConditions = dataEditEvaluatedValues.map(condition => {
            let answerTmp            switch (condition.operator) {
                case '===':
                    answerTmp = dataItem[condition.field] === condition.evaluateValue                    break                case '!==':
                    answerTmp = dataItem[condition.field] !== condition.evaluateValue                    break                case '>=':
                    answerTmp = dataItem[condition.field] >= condition.evaluateValue                    break                case '<=':
                    answerTmp = dataItem[condition.field] <= condition.evaluateValue                    break                case '>':
                    answerTmp = dataItem[condition.field] > condition.evaluateValue                    break                case '<':
                    answerTmp = dataItem[condition.field] < condition.evaluateValue                    break                default:
                    answerTmp = true                    break            }
            return answerTmp        })
        let isBotonValid = answersConditions.reduce((prev, curr) => prev && curr)
        return isBotonValid    }
    const findSubGroups = e => {
        if (e.items.some(el => el.items)) {
            let newEl = e.items.find(el => el.items)
            let index = collapsedState.indexOf(newEl.value)
            index === -1 ? (newEl.expanded = true) : (newEl.expanded = false)
            if (newEl.items.find(element => element.items)) findSubGroups(newEl.items.find(element => element.items))
            return        }
    }
    const closeGroups = () => {
        dataState?.group?.length &&            process(
                !!selectable                    ? dataResult.map(item => {
                          return {
                              ...item,
                              selected: selectedState[idGetter(item)]
                          }
                      })
                    : dataResult,
                dataState            )?.data?.map((e, i) => {
                let index = collapsedState.indexOf(e.value)
                index === -1 ? (e.expanded = true) : (e.expanded = false)
                findSubGroups(e)
                return e            })
    }
    const ExportButton = () => (
        <ToolbarItem>            <IconButton                className="makeStylesIconButton"                title={
                    getTranslation(language.id, fieldsPage, `${buttonsTitlePrefix}btn_export`, scenario.id) ||                    'Export to Excel'                }                onClick={excelExport}                disabled={allLocked}            >                <LibraryBooksIcon />            </IconButton>        </ToolbarItem>    )    const getActionButtons = () => {        const actionButtons = {}        if (!hideExportButton) {            actionButtons.exportButton = ExportButton        }        return actionButtons    }    const state = useMemo(() => ({        temporalData: dataResult,        initialData: data,        selectedDataIds: Object.keys(selectedState).filter(key => !!selectedState[key]),    }), [dataResult, data, selectedState])    const getCell = (column) => {        if (!!column.cell && typeof column.cell === 'function' && column.field === 'commandCell') {            return (props) => {                const propsWithActions = {                    ...props,                    actions: {                        discard,                        enterEdit: e => enterEdit(e, props.dataItem),                        cancel: e => cancel(e, props.dataItem),                        update: e => update(e, props.dataItem),                    }                }                return column.cell.call(column.cell, propsWithActions)            }        }        return column.cell    }    return (        <div ref={tableDiv}>            {isLoading && <TableCustomKendoSpinner tableHeight={tableHeight} tableWidth={tableWidth} />}            <ExcelExport                ref={_export}                fileName={getTranslation(language.id, fieldsPage, fieldPageFileName, scenario.id) + customFileName}            >                {columns.map(                    column =>                        column.export === false || (                            <ExcelExportColumn                                key={`${column.field}-${Math.random()}`}                                field={column.field}                                title={column.title}                                width={column.filter === 'date' ? 150 : column.width}                                minResizableWidth={column.minResizableWidth}                                editable={column.editable}                                format={column.format}                                cell={column.cell}                            />                        )                )}            </ExcelExport>            <Grid                resizable={true}                style={{ height: height, width: width }}                data={process(                    !!selectable                        ? dataResult.map(item => ({                              ...item,                              selected: selectedState[idGetter(item)]                          }))                        : dataResult,                    dataState                )}                editField={editField}                {...dataState}                {...gridProps}                onItemChange={itemChange}                onDataStateChange={e => {                    setDataState(e.dataState)                }}                pageable={{                    buttonCount: 3,                    info: true,                    type: 'numeric',                    pageSizes: [10, 20, 50],                    previousNext: true                }}                dataItemKey={dataItemKey}                {...(!!selectable                    ? {                          selectedField: 'selected',                          onSelectionChange: onSelectionChange,                          selectable: {                              enabled: true,                              drag: false,                              cell: false,                              mode: 'multiple'                          },                          onHeaderSelectionChange: onHeaderSelectionChange                      }                    : {})}                groupable={groupable}                group={dataState.group}                onGroupChange={e => {                    const newDataState = groupBy(dataResult, e.group)                    setGroupIds({                        data: newDataState.data,                        group: e.group                    })                    setDataState({ ...dataState, group: e.group })                }}                onExpandChange={customOnExpandChange || onExpandChange}                expandField="expanded"            >                {!!customToolbar                    ? customToolbar(getActionButtons(), discard, classes, state)                    : (showSelectable || showAddRedirect || !hideExportButton || !hideSaveButton) && (                          <GridToolbar>                              {selectedElementsCount()}                              <ToolbarSpacer />                              {editable && showAddRedirect && (                                  <ToolbarItem>                                      <IconButton                                          className="makeStylesIconButton"                                          title={getTranslation(                                              language.id,                                              fieldsPage,                                              `${buttonsTitlePrefix}btn_add`,                                              scenario.id                                          )}                                          onClick={addGoRedirect ? redirectToCreate : addNew}                                          disabled={blockFields || allLocked}                                      >                                          <AddIcon />                                      </IconButton>                                  </ToolbarItem>                              )}                              {showSelectable && !hideSaveButton && (                                  <ToolbarItem>                                      <IconButton                                          className="makeStylesIconButton"                                          title={getTranslation(                                              language.id,                                              fieldsPage,                                              `${buttonsTitlePrefix}btn_add`,                                              scenario.id                                          )}                                          onClick={saveSelection}                                          disabled={data.length === 0 || disabled || allLocked}                                      >                                          {!textSaveIcon ? (                                              <SaveIcon />                                          ) : (                                              <FormGroup                                                  className="formContainerResponsive__responsiveButtonsCellInsideTable"                                                  id="TableSaveBtn"                                              >                                                  <ButtonAlternative                                                      className="formContainerResponsive__formButtonSubmitResponsive"                                                      title={getTranslation(                                                          language.id,                                                          fieldsPage,                                                          textSaveIcon,                                                          scenario.id                                                      )}                                                  />                                              </FormGroup>                                          )}                                      </IconButton>                                  </ToolbarItem>                              )}                              {editable && !hideExportButton && <ToolbarSeparator />}                              {!hideExportButton && <ExportButton />}                          </GridToolbar>                      )}                {editable &&                    (showEditBtn ||                        showCopyBtn ||                        showRemoveBtn ||                        showDownloadBtn ||                        showUploadBtn ||                        showHistoryBtn ||                        showSignatureBtn) && (                        <GridColumn                            cell={CommandCell}                            filterable={false}                            groupable={false}                            sortable={false}                            width={commandCellWidth}                        />                    )}                {showSelectable && (                    <GridColumn field="selected" width={40} filterable={false} headerSelectionValue={selectedAll} />                )}                {columns.map(                    column =>                        !column.hidden && (                            <GridColumn                                key={`${column.field}-${Math.random()}`}                                field={column.field}                                title={column.title}                                width={column.width}                                editable={column.editable}                                filter={column.filter}                                filterCell={column.filterCell}                                columnMenu={column.columnMenu}                                filterable={column.filterable}                                editor={column.editor}                                format={column.format}                                cell={getCell(column)}                                sortable={column.sortable}                                groupable={column.groupable}                                selectable={column.selectable}                                minResizableWidth={column.minResizableWidth}                            />                        )                )}            </Grid>        </div>    )}TableCustomKendo.propTypes = {    columns: PropTypes.array.isRequired,    gridProps: PropTypes.shape({        dataItemKey: PropTypes.string,        editable: PropTypes.oneOfType([PropTypes.bool, PropTypes.object]),        pageable: PropTypes.bool,        sortable: PropTypes.bool,        groupable: PropTypes.bool,        selectable: PropTypes.bool,        filterable: PropTypes.bool,        columnMenu: PropTypes.func    }).isRequired,    height: PropTypes.string,    data: PropTypes.array.isRequired,    isLoading: PropTypes.bool,    onAdd: PropTypes.func,    onUpdate: PropTypes.func,    onCopy: PropTypes.func,    onDelete: PropTypes.func,    onDownload: PropTypes.func,    onEnterEdit: PropTypes.func,    onShowHistory: PropTypes.func,    onSearch: PropTypes.func,    onSaveSelection: PropTypes.func,    setSelection: PropTypes.func,    onUpload: PropTypes.func,    onApprove: PropTypes.func,    onRefuse: PropTypes.func,    onDisplayApprovals: PropTypes.func,    language: PropTypes.shape({        id: PropTypes.number,        createdDate: PropTypes.string,        createdUserId: PropTypes.number,        isActive: PropTypes.bool,        isoCode: PropTypes.string,        name: PropTypes.string,        z_CreatedUser: PropTypes.arrayOf(            PropTypes.shape({                email: PropTypes.string,                id: PropTypes.number,                isAD: PropTypes.bool,                login: PropTypes.string,                name: PropTypes.string,                sapCode: PropTypes.string,                surname: PropTypes.string            })        )    }).isRequired,    fieldsPage: PropTypes.arrayOf(PropTypes.object).isRequired,    scenario: PropTypes.shape({        id: PropTypes.number,        code: PropTypes.string,        currencyId: PropTypes.number,        name: PropTypes.string,        statusId: PropTypes.number    }).isRequired,    exportCurrentPage: PropTypes.bool,    fieldPageFileName: PropTypes.string,    exportErrorExcelMessage: PropTypes.string,    customFileName: PropTypes.string,    hideExportButton: PropTypes.bool,    hideSaveButton: PropTypes.bool,    minItemsPerPage: PropTypes.number,    buttonsTitlePrefix: PropTypes.string,    allLocked: PropTypes.bool,    customToolbar: PropTypes.func,    customUpdateDataItems: PropTypes.func}export default memo(TableCustomKendo)
Editor is loading...