UNPKG

@rtbjs/use-state

Version:

`@rtbjs/use-state` is a state management tool that can act as a local state and be easily turned into a global redux state. It is an innovative approach to state management that combines the advantages of both React's useState and Redux's state management

33 lines 2.91 kB
import { __assign } from "tslib"; import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime"; import { Button, Input, Space, Tooltip, Tree } from 'antd'; import { useReduxHistorySearch } from './use-redux-history-search'; import { CreateItemModal } from './components/create-item-modal'; import { useEffect, useState } from 'react'; import { getSelectedItem } from './get-selected-item'; import { EditItemModal } from './components/edit-item-modal'; import { DeleteItemPopup } from './components/delete-item-popup'; import { useAppSelector } from '../../redux/store'; import { ImportStateButton } from './components/Import-state-button'; import { ItemDetails } from './components/item-details'; var Trigger = function (_a) { var onClick = _a.onClick, icon = _a.icon, title = _a.title; return (_jsx(Tooltip, __assign({ title: title }, { children: _jsx(Button, { icon: icon, onClick: onClick }) }))); }; var ReduxHistory = function (_a) { var root = _a.root, setParentReduxState = _a.setParentReduxState; var parentReduxState = useAppSelector(function (state) { return state.reduxHistoryState.parentReduxState; }); var defaultSelectedKey = (root === null || root === void 0 ? void 0 : root.id) || ''; var _b = useState(defaultSelectedKey), selectedKey = _b[0], setSelectedKey = _b[1]; useEffect(function () { setSelectedKey(defaultSelectedKey); }, [defaultSelectedKey]); var _c = useReduxHistorySearch(root), autoExpandParent = _c.autoExpandParent, expandedKeys = _c.expandedKeys, onChange = _c.onChange, onExpand = _c.onExpand, treeData = _c.treeData; var handleOnSelect = function (ids) { setSelectedKey(ids.length ? ids[0].toString() : defaultSelectedKey); }; var selectedItem = root ? getSelectedItem(selectedKey, [root]) : undefined; return root ? (_jsxs(_Fragment, { children: [_jsx(Space, __assign({ direction: "vertical" }, { children: _jsxs(Space, __assign({ wrap: true }, { children: [_jsx(CreateItemModal, { Trigger: Trigger, root: root, selectedItem: selectedItem }), _jsx(CreateItemModal, { Trigger: Trigger, root: root, isState: true, selectedItem: selectedItem, parentReduxState: parentReduxState }), _jsx(ImportStateButton, { Trigger: Trigger, selectedItem: selectedItem, setParentReduxState: setParentReduxState }), _jsx(EditItemModal, { Trigger: Trigger, selectedItem: selectedItem }), _jsx(ItemDetails, { Trigger: Trigger, selectedItem: selectedItem }), _jsx(DeleteItemPopup, { Trigger: Trigger, selectedItem: selectedItem })] })) })), _jsx(Input.Search, { style: { margin: '4px 0' }, placeholder: "Search", onChange: onChange }), _jsx(Tree.DirectoryTree, { selectedKeys: [selectedKey], onExpand: onExpand, expandedKeys: expandedKeys, autoExpandParent: autoExpandParent, treeData: treeData, onSelect: handleOnSelect })] })) : null; }; export { ReduxHistory }; //# sourceMappingURL=redux-history.js.map