diff --git a/client/src/components/breadcrumbs/breadcrumbs.component.jsx b/client/src/components/breadcrumbs/breadcrumbs.component.jsx index 4425d39af..b85e438db 100644 --- a/client/src/components/breadcrumbs/breadcrumbs.component.jsx +++ b/client/src/components/breadcrumbs/breadcrumbs.component.jsx @@ -1,19 +1,35 @@ -import { HomeFilled } from "@ant-design/icons"; -import { Breadcrumb } from "antd"; +import { HomeFilled, ClockCircleFilled } from "@ant-design/icons"; +import { Breadcrumb, Menu, Dropdown } from "antd"; import React from "react"; import { connect } from "react-redux"; import { Link } from "react-router-dom"; import { createStructuredSelector } from "reselect"; -import { selectBreadcrumbs } from "../../redux/application/application.selectors"; +import { + selectBreadcrumbs, + selectRecentItems, +} from "../../redux/application/application.selectors"; import "./breadcrumbs.styles.scss"; const mapStateToProps = createStructuredSelector({ breadcrumbs: selectBreadcrumbs, + recentItems: selectRecentItems, }); -export function BreadCrumbs({ breadcrumbs }) { +export function BreadCrumbs({ breadcrumbs, recentItems }) { + const menu = ( + + {recentItems.map((i, idx) => ( + {i.label} + ))} + + ); + return (
+ + e.preventDefault()} /> + + diff --git a/client/src/pages/jobs-detail/jobs-detail.page.container.jsx b/client/src/pages/jobs-detail/jobs-detail.page.container.jsx index f5f9f2cd7..d85d49936 100644 --- a/client/src/pages/jobs-detail/jobs-detail.page.container.jsx +++ b/client/src/pages/jobs-detail/jobs-detail.page.container.jsx @@ -11,14 +11,18 @@ import { UPDATE_JOB_STATUS, } from "../../graphql/jobs.queries"; import JobsDetailPage from "./jobs-detail.page.component"; -import { setBreadcrumbs } from "../../redux/application/application.actions"; +import { + setBreadcrumbs, + addRecentItem, +} from "../../redux/application/application.actions"; import { connect } from "react-redux"; const mapDispatchToProps = (dispatch) => ({ setBreadcrumbs: (breadcrumbs) => dispatch(setBreadcrumbs(breadcrumbs)), + addRecentItem: (item) => dispatch(setrecentItem(item)), }); -function JobsDetailPageContainer({ match, setBreadcrumbs }) { +function JobsDetailPageContainer({ match, setBreadcrumbs,addRecentItem }) { const { jobId } = match.params; const { t } = useTranslation(); @@ -70,7 +74,7 @@ function JobsDetailPageContainer({ match, setBreadcrumbs }) { }, [loading, data, t, error, setBreadcrumbs, jobId]); if (loading) return ; - if (error) return ; + if (error) return ; return data.jobs_by_pk ? ( ) : ( - + ); } export default connect(null, mapDispatchToProps)(JobsDetailPageContainer); diff --git a/client/src/redux/application/application.actions.js b/client/src/redux/application/application.actions.js index 796206185..69ebf671b 100644 --- a/client/src/redux/application/application.actions.js +++ b/client/src/redux/application/application.actions.js @@ -28,3 +28,8 @@ export const scheduleLoadFailure = (error) => ({ type: ApplicationActionTypes.CALCULATE_SCHEDULE_LOAD_FAILURE, payload: error, }); + +export const addRecentItem = (item) => ({ + type: ApplicationActionTypes.ADD_RECENT_ITEM, + payload: item, +}); diff --git a/client/src/redux/application/application.reducer.js b/client/src/redux/application/application.reducer.js index 9b9e13ef7..289d80356 100644 --- a/client/src/redux/application/application.reducer.js +++ b/client/src/redux/application/application.reducer.js @@ -3,6 +3,7 @@ import ApplicationActionTypes from "./application.types"; const INITIAL_STATE = { loading: false, breadcrumbs: [], + recentItems: [], scheduleLoad: { load: {}, calculating: false, @@ -12,6 +13,11 @@ const INITIAL_STATE = { const applicationReducer = (state = INITIAL_STATE, action) => { switch (action.type) { + case ApplicationActionTypes.ADD_RECENT_ITEM: + return { + ...state, + recentItems: [action.payload, ...state.scheduleLoad.slice(0, 9)], + }; case ApplicationActionTypes.SET_BREAD_CRUMBS: return { ...state, diff --git a/client/src/redux/application/application.selectors.js b/client/src/redux/application/application.selectors.js index 5558f2cc5..9d38e1f1d 100644 --- a/client/src/redux/application/application.selectors.js +++ b/client/src/redux/application/application.selectors.js @@ -12,6 +12,11 @@ export const selectBreadcrumbs = createSelector( (application) => application.breadcrumbs ); +export const selectRecentItems = createSelector( + [selectApplication], + (application) => application.recentItems +); + export const selectScheduleLoad = createSelector( [selectApplication], (application) => application.scheduleLoad.load diff --git a/client/src/redux/application/application.types.js b/client/src/redux/application/application.types.js index be48e6101..0f46f9545 100644 --- a/client/src/redux/application/application.types.js +++ b/client/src/redux/application/application.types.js @@ -5,5 +5,6 @@ const ApplicationActionTypes = { CALCULATE_SCHEDULE_LOAD: "CALCULATE_SCHEDULE_LOAD", CALCULATE_SCHEDULE_LOAD_SUCCESS: "CALCULATE_SCHEDULE_LOAD_SUCCESS", CALCULATE_SCHEDULE_LOAD_FAILURE: "CALCULATE_SCHEDULE_LOAD_FAILURE", + ADD_RECENT_ITEM: "ADD_RECENT_ITEM", }; export default ApplicationActionTypes;