- },
- headerContainer: {
- color: colorLightGray,
- margin: `${theme.spacing.unit}px 0`
- },
- tabsIndicator: {
- backgroundColor: colorPurple
- },
- tabRoot: {
- color: colorGray,
- '&$tabSelected': {
- fontWeight: 700,
- color: colorPurple
- }
- },
- tabContainer: {
- padding: theme.spacing.unit * 3
- },
- tabSelected: {},
- gridLabel: {
- color: colorVeryLightGray,
- }
+ },
+ headerContainer: {
+ color: theme.palette.grey["600"],
+ margin: `${theme.spacing.unit}px 0`,
+ textAlign: 'center'
+ },
+ headerIcon: {
+ fontSize: "34px"
+ },
+ tabContainer: {
+ padding: theme.spacing.unit * 3
+ }
+});
+
+
+export type DetailsPanelResource = ProjectResource | CollectionResource | ProcessResource | EmptyResource;
+
+const getItem = (res: DetailsPanelResource) => {
+ return DetailsPanelFactory.createItem(res);
+};
+
+const getDefaultItem = () => {
+ return DetailsPanelFactory.createItem({ kind: undefined, name: 'Projects' });
+};
+
+const mapStateToProps = ({ detailsPanel }: RootState) => {
+ const { isOpened, item } = detailsPanel;
+ return {
+ isOpened,
+ item: item ? getItem(item as DetailsPanelResource) : getDefaultItem()
+ };
+};
+
+const mapDispatchToProps = (dispatch: Dispatch) => ({
+ onCloseDrawer: () => {
+ dispatch(actions.TOGGLE_DETAILS_PANEL());
+ }