Use the date from context

components/chart/chart.js

@@ -28,7 +28,7 @@ import { Spacing } from '../../styles'
 const getSymptomsFromCycleDays = (cycleDays) =>
   SYMPTOMS.filter((symptom) => cycleDays.some((cycleDay) => cycleDay[symptom]))
 
-const CycleChart = ({ navigate, setDate }) => {
+const CycleChart = ({ navigate }) => {
   const [shouldShowHint, setShouldShowHint] = useState(true)
 
   useEffect(() => {
@@ -84,7 +84,6 @@ const CycleChart = ({ navigate, setDate }) => {
   const renderColumn = ({ item }) => {
     return (
       <DayColumn
-        setDate={setDate}
         dateString={item}
         navigate={navigate}
         symptomHeight={symptomHeight}
@@ -136,7 +135,6 @@ const CycleChart = ({ navigate, setDate }) => {
 
 CycleChart.propTypes = {
   navigate: PropTypes.func,
-  setDate: PropTypes.func,
 }
 
 const styles = StyleSheet.create({

components/chart/day-column.js

@@ -8,6 +8,8 @@ import SymptomCell from './symptom-cell'
 import TemperatureColumn from './temperature-column'
 import CycleDayLabel from './cycle-day-label'
 
+import { useDate } from '../../hooks/useDate'
+
 import {
   symptomColorMethods,
   getTemperatureProps,
@@ -19,13 +21,13 @@ const DayColumn = ({
   dateString,
   chartSymptoms,
   columnHeight,
-  setDate,
   navigate,
   shouldShowTemperatureColumn,
   symptomHeight,
   symptomRowSymptoms,
   xAxisHeight,
 }) => {
+  const { setDate } = useDate()
   const cycleDayData = getCycleDay(dateString)
   let data = {}
 
@@ -105,7 +107,6 @@ DayColumn.propTypes = {
   chartSymptoms: PropTypes.array,
   columnHeight: PropTypes.number.isRequired,
   navigate: PropTypes.func.isRequired,
-  setDate: PropTypes.func.isRequired,
   shouldShowTemperatureColumn: PropTypes.bool,
   symptomHeight: PropTypes.number.isRequired,
   symptomRowSymptoms: PropTypes.array,