diff --git a/src/models/chart.model.ts b/src/models/chart.model.ts
index 1d5ff3a41420c3cd599c7cc3236e4ae92c8714e6..fc1d53fbc84a4befffbda2506cd4b34233a7a499 100644
--- a/src/models/chart.model.ts
+++ b/src/models/chart.model.ts
@@ -1,9 +1,12 @@
 import { TimeStep } from 'enum/timeStep.enum'
 import { DateTime } from 'luxon'
+import { Datachart } from 'models'
 
 export interface ChartState {
   selectedDate: DateTime
   currentTimeStep: TimeStep
   currentIndex: number
+  currentDatachart: Datachart
+  currentDatachartIndex: number
   loading: boolean
 }
diff --git a/src/store/chart/chart.action.spec.ts b/src/store/chart/chart.action.spec.ts
index afaeb52ebbaa3939af229d48a536d26eadd07612..c0607c540b9fd23c1fb10b8b997ae7fd67f141f8 100644
--- a/src/store/chart/chart.action.spec.ts
+++ b/src/store/chart/chart.action.spec.ts
@@ -4,12 +4,17 @@ import {
   SET_CURRENT_TIMESTEP,
   SET_SELECTED_DATE,
   SET_CURRENT_INDEX,
+  SET_CURRENT_DATACHART,
   SET_LOADING,
   setCurrentTimeStep,
   setSelectedDate,
   setCurrentIndex,
+  setCurrentDatachart,
+  setCurrentDatachartIndex,
   setLoading,
+  SET_CURRENT_DATACHART_INDEX,
 } from './chart.actions'
+import { graphData } from '../../../test/__mocks__/datachartData.mock'
 
 describe('chart actions', () => {
   it('should create an action to set selected date', () => {
@@ -40,6 +45,22 @@ describe('chart actions', () => {
     expect(setCurrentIndex(1)).toEqual(expectedAction)
   })
 
+  it('should create an action to set datachart', () => {
+    const expectedAction = {
+      type: SET_CURRENT_DATACHART,
+      payload: graphData,
+    }
+    expect(setCurrentDatachart(graphData)).toEqual(expectedAction)
+  })
+
+  it('should create an action to set datachart index', () => {
+    const expectedAction = {
+      type: SET_CURRENT_DATACHART_INDEX,
+      payload: 1,
+    }
+    expect(setCurrentDatachartIndex(1)).toEqual(expectedAction)
+  })
+
   it('should create an action to set loading', () => {
     const expectedAction = {
       type: SET_LOADING,
diff --git a/src/store/chart/chart.actions.ts b/src/store/chart/chart.actions.ts
index bba8fdbe3655f3b29d9baabb47a04090ea7befde..67a3932c5ae391210d6615756d0a9b254f70f484 100644
--- a/src/store/chart/chart.actions.ts
+++ b/src/store/chart/chart.actions.ts
@@ -1,9 +1,12 @@
 import { TimeStep } from 'enum/timeStep.enum'
 import { DateTime } from 'luxon'
+import { Datachart } from 'models'
 
 export const SET_CURRENT_TIMESTEP = 'SET_CURRENT_TIMESTEP'
 export const SET_SELECTED_DATE = 'SET_SELECTED_DATE'
 export const SET_CURRENT_INDEX = 'SET_CURRENT_INDEX'
+export const SET_CURRENT_DATACHART = 'SET_CURRENT_DATACHART'
+export const SET_CURRENT_DATACHART_INDEX = 'SET_CURRENT_DATACHART_INDEX'
 export const SET_LOADING = 'SET_LOADING'
 
 interface SetSelectedDate {
@@ -21,6 +24,16 @@ interface SetCurrentIndex {
   payload?: number
 }
 
+interface SetCurrentDataChart {
+  type: typeof SET_CURRENT_DATACHART
+  payload?: Datachart
+}
+
+interface SetCurrentDataChartIndex {
+  type: typeof SET_CURRENT_DATACHART_INDEX
+  payload?: number
+}
+
 interface SetLoading {
   type: typeof SET_LOADING
   payload?: boolean
@@ -30,6 +43,8 @@ export type ChartActionTypes =
   | SetSelectedDate
   | SetCurrentTimeStep
   | SetCurrentIndex
+  | SetCurrentDataChart
+  | SetCurrentDataChartIndex
   | SetLoading
 
 export function setSelectedDate(date: DateTime): ChartActionTypes {
@@ -53,6 +68,24 @@ export function setCurrentIndex(currentIndex: number): ChartActionTypes {
   }
 }
 
+export function setCurrentDatachart(
+  currentDatachart: Datachart
+): ChartActionTypes {
+  return {
+    type: SET_CURRENT_DATACHART,
+    payload: currentDatachart,
+  }
+}
+
+export function setCurrentDatachartIndex(
+  currentDatachartIndex: number
+): ChartActionTypes {
+  return {
+    type: SET_CURRENT_DATACHART_INDEX,
+    payload: currentDatachartIndex,
+  }
+}
+
 export function setLoading(isLoading: boolean): ChartActionTypes {
   return {
     type: SET_LOADING,
diff --git a/src/store/chart/chart.reducer.spec.ts b/src/store/chart/chart.reducer.spec.ts
index 94341ef55ec4464c6dd7b424e481f2c494655222..a15b816d1a589c0ac521f0918065cc8e2250eccc 100644
--- a/src/store/chart/chart.reducer.spec.ts
+++ b/src/store/chart/chart.reducer.spec.ts
@@ -3,11 +3,14 @@ import {
   SET_CURRENT_TIMESTEP,
   SET_SELECTED_DATE,
   SET_CURRENT_INDEX,
+  SET_CURRENT_DATACHART,
+  SET_CURRENT_DATACHART_INDEX,
   SET_LOADING,
 } from './chart.actions'
+import { DateTime } from 'luxon'
 import { TimeStep } from 'enum/timeStep.enum'
 import { mockInitialChartState } from '../../../test/__mocks__/store'
-import { DateTime } from 'luxon'
+import { graphData } from '../../../test/__mocks__/datachartData.mock'
 
 describe('chart reducer', () => {
   it('should return the initial state', () => {
@@ -76,6 +79,42 @@ describe('chart reducer', () => {
     expect(result).toEqual(mockInitialChartState)
   })
 
+  it('should handle SET_CURRENT_DATACHART with payload', () => {
+    const result = chartReducer(mockInitialChartState, {
+      type: SET_CURRENT_DATACHART,
+      payload: graphData,
+    })
+    expect(result).toEqual({
+      ...mockInitialChartState,
+      currentDatachart: graphData,
+    })
+  })
+
+  it('should handle SET_CURRENT_DATACHART without payload', () => {
+    const result = chartReducer(mockInitialChartState, {
+      type: SET_CURRENT_DATACHART,
+    })
+    expect(result).toEqual(mockInitialChartState)
+  })
+
+  it('should handle SET_CURRENT_DATACHART_INDEX with payload', () => {
+    const result = chartReducer(mockInitialChartState, {
+      type: SET_CURRENT_DATACHART_INDEX,
+      payload: 1,
+    })
+    expect(result).toEqual({
+      ...mockInitialChartState,
+      currentDatachartIndex: 1,
+    })
+  })
+
+  it('should handle SET_CURRENT_DATACHART_INDEX without payload', () => {
+    const result = chartReducer(mockInitialChartState, {
+      type: SET_CURRENT_DATACHART_INDEX,
+    })
+    expect(result).toEqual(mockInitialChartState)
+  })
+
   it('should handle SET_LOADING with payload', () => {
     const result = chartReducer(mockInitialChartState, {
       type: SET_LOADING,
diff --git a/src/store/chart/chart.reducer.ts b/src/store/chart/chart.reducer.ts
index 416171ec964eecc5d9f17b3dd2d443d53e28265f..9830e6568b21278bfee5d2854730a12e906e815b 100644
--- a/src/store/chart/chart.reducer.ts
+++ b/src/store/chart/chart.reducer.ts
@@ -3,6 +3,8 @@ import {
   SET_SELECTED_DATE,
   SET_CURRENT_TIMESTEP,
   SET_CURRENT_INDEX,
+  SET_CURRENT_DATACHART,
+  SET_CURRENT_DATACHART_INDEX,
   SET_LOADING,
   ChartActionTypes,
 } from 'store/chart/chart.actions'
@@ -18,6 +20,8 @@ const initialState: ChartState = {
     }),
   currentTimeStep: TimeStep.WEEK,
   currentIndex: 0,
+  currentDatachart: { actualData: [], comparisonData: null },
+  currentDatachartIndex: 0,
   loading: true,
 }
 
@@ -47,6 +51,20 @@ export const chartReducer: Reducer<ChartState> = (
             currentIndex: action.payload,
           }
         : state
+    case SET_CURRENT_DATACHART:
+      return action.payload != undefined
+        ? {
+            ...state,
+            currentDatachart: action.payload,
+          }
+        : state
+    case SET_CURRENT_DATACHART_INDEX:
+      return action.payload != undefined
+        ? {
+            ...state,
+            currentDatachartIndex: action.payload,
+          }
+        : state
     case SET_LOADING:
       return action.payload != undefined
         ? {
diff --git a/test/__mocks__/store.ts b/test/__mocks__/store.ts
index d8a268526d17d5a9410d2a6b18b62f8a956ef93e..7a422cd81757dd048c2b29f7a3cacb7aa0195c42 100644
--- a/test/__mocks__/store.ts
+++ b/test/__mocks__/store.ts
@@ -135,6 +135,8 @@ export const mockInitialChartState: ChartState = {
     }),
   currentTimeStep: TimeStep.WEEK,
   currentIndex: 0,
+  currentDatachart: { actualData: [], comparisonData: null },
+  currentDatachartIndex: 0,
   loading: true,
 }