@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
43 lines • 2.25 kB
JavaScript
import { __assign } from "tslib";
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { useEffect } from 'react';
import { toast } from 'react-toastify';
import { useAppSelector } from '../../redux/store';
import { CreateProjectModal } from '../../components/project/create-project';
import { useGetAllProjectsQuery } from '../../redux/api/project-api';
import { Container, CreateProjectContainer } from './home.page.styles';
import { Button, List, Typography } from 'antd';
import { ProjectItem } from '../../components/project/project.component';
import { FullScreenLoader } from '../../components/full-screen-loader';
var HomePage = function () {
var companyId = useAppSelector(function (state) { return state.companyState; }).companyId;
var _a = useGetAllProjectsQuery(undefined, {
skip: !companyId
}), isLoading = _a.isLoading, isError = _a.isError, error = _a.error, projects = _a.data;
useEffect(function () {
if (isError) {
if (Array.isArray(error.data.error)) {
error.data.error.forEach(function (el) {
return toast.error(el.message, {
position: 'top-right'
});
});
}
else {
toast.error(error.data.message, {
position: 'top-right'
});
}
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [isLoading]);
if (isLoading) {
return _jsx(FullScreenLoader, {});
}
return (_jsxs(Container, { children: [_jsx(CreateProjectModal, { Trigger: function (_a) {
var onClick = _a.onClick;
return (_jsx(CreateProjectContainer, { children: _jsx(Button, __assign({ onClick: onClick }, { children: "Create project" })) }));
} }), (projects === null || projects === void 0 ? void 0 : projects.length) === 0 ? (_jsx(Typography.Paragraph, { children: "No projects at the moment" })) : (_jsx(List, { itemLayout: "horizontal", dataSource: projects, renderItem: function (project) { return (_jsx(ProjectItem, { project: project }, project.id)); } }))] }));
};
export { HomePage };
//# sourceMappingURL=home.page.js.map