UNPKG

@fakel/rest-admin

Version:

An application that makes it easier to work with your API

41 lines (40 loc) 2.33 kB
import React, { useEffect } from 'react'; import { observer } from 'mobx-react'; import { toJS } from 'mobx'; import Space from 'antd/lib/space'; import Col from 'antd/lib/col'; import Row from 'antd/lib/row'; import DefaultListActions from './DefaultListActions'; import ListView from './ListView'; import { useListStore } from '../../hooks/useListStore'; import { useResourceStore } from '../../hooks/useResourceStore'; import { useDataProviderStore } from '../../hooks/useDataProviderStore'; import { useFiltersStore } from '../../hooks/useFiltersStore'; import { mapToAntColumn } from '../../utils/List'; var List = observer(function (_a) { var columns = _a.columns, filters = _a.filters, actions = _a.actions, perPage = _a.perPage, view = _a.view, viewOptions = _a.viewOptions, withReferences = _a.withReferences, reference = _a.reference; var dataProviderStore = useDataProviderStore(); var resourceStore = useResourceStore(); var listStore = useListStore(); var filtersStore = useFiltersStore(); var tableColumns = mapToAntColumn(columns); useEffect(function () { var _a; if (((_a = resourceStore.current) === null || _a === void 0 ? void 0 : _a.length) && resourceStore.isRegistred(resourceStore.current)) { listStore.getData(dataProviderStore.dataProvider, resourceStore.current, { pagination: { page: 1, perPage: perPage || 10, }, }, { withReferences: withReferences, reference: reference }); } }, [resourceStore.current, filtersStore.displayFilters]); return (React.createElement(Space, { direction: "vertical" }, React.createElement(Row, { justify: "space-between", align: "top" }, React.createElement(Col, { span: "4" }, actions || React.createElement(DefaultListActions, null), " "), React.createElement(Col, { style: { display: 'flex', justifyContent: 'flex-end' }, span: "20" }, filters)), React.createElement(ListView, { viewOptions: viewOptions, loading: toJS(listStore.loading), view: view, listStore: listStore, dataSource: toJS(listStore.dataSource), ids: listStore.ids, perPage: perPage || 20, resource: resourceStore.current, columns: tableColumns }))); }); export default List;