diff --git a/components/Home.js b/components/Home.js
index 0ad6949..31ab610 100644
--- a/components/Home.js
+++ b/components/Home.js
@@ -18,9 +18,11 @@ import {
 import { Colors, Fonts, Sizes, Spacing } from '../styles'
 import { LocalDate } from '@js-joda/core'
 import { useTranslation } from 'react-i18next'
+import { useDate } from '../hooks/useDate'
 
-const Home = ({ navigate, setDate }) => {
+const Home = ({ navigate }) => {
   const { t } = useTranslation()
+  const { setDate } = useDate()
 
   function navigateToCycleDayView() {
     setDate(todayDateString)
@@ -110,7 +112,6 @@ const styles = StyleSheet.create({
 
 Home.propTypes = {
   navigate: PropTypes.func,
-  setDate: PropTypes.func,
 }
 
 export default Home
diff --git a/components/app.js b/components/app.js
index 8112245..0eb53fb 100644
--- a/components/app.js
+++ b/components/app.js
@@ -2,7 +2,7 @@ import React, { useState, useEffect } from 'react'
 import { BackHandler, StyleSheet, View } from 'react-native'
 import PropTypes from 'prop-types'
 
-import { LocalDate } from '@js-joda/core'
+import { useDate } from '../hooks/useDate'
 
 import Header from './header'
 import Menu from './menu'
@@ -13,7 +13,8 @@ import setupNotifications from '../lib/notifications'
 import { closeDb } from '../db'
 
 const App = ({ restartApp }) => {
-  const [date, setDate] = useState(LocalDate.now().toString())
+  const { setDate } = useDate()
+
   const [currentPage, setCurrentPage] = useState('Home')
   const goBack = () => {
     if (currentPage === 'Home') {
@@ -43,8 +44,6 @@ const App = ({ restartApp }) => {
   const isTemperatureEditView = currentPage === 'TemperatureEditView'
   const headerProps = { navigate: setCurrentPage }
   const pageProps = {
-    date,
-    setDate,
     isTemperatureEditView,
     navigate: setCurrentPage,
   }
diff --git a/components/calendar.js b/components/calendar.js
index 02fee6a..1a89c74 100644
--- a/components/calendar.js
+++ b/components/calendar.js
@@ -3,6 +3,8 @@ import PropTypes from 'prop-types'
 import { StyleSheet, View } from 'react-native'
 import { CalendarList } from 'react-native-calendars'
 
+import { useDate } from '../hooks/useDate'
+
 import { getBleedingDaysSortedByDate } from '../db'
 import cycleModule from '../lib/cycle'
 import {
@@ -12,7 +14,8 @@ import {
   todayToCalFormat,
 } from './helpers/calendar'
 
-const CalendarView = ({ setDate, navigate }) => {
+const CalendarView = ({ navigate }) => {
+  const { setDate } = useDate()
   const bleedingDays = getBleedingDaysSortedByDate()
   const predictedMenses = cycleModule().getPredictedMenses()
 
@@ -49,7 +52,6 @@ const styles = StyleSheet.create({
 })
 
 CalendarView.propTypes = {
-  setDate: PropTypes.func.isRequired,
   navigate: PropTypes.func.isRequired,
 }
 
diff --git a/components/chart/chart.js b/components/chart/chart.js
index 3cdd364..d0c7a0a 100644
--- a/components/chart/chart.js
+++ b/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({
diff --git a/components/chart/day-column.js b/components/chart/day-column.js
index 7d9e0a0..4d22c6a 100644
--- a/components/chart/day-column.js
+++ b/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,
diff --git a/components/cycle-day/cycle-day-overview.js b/components/cycle-day/cycle-day-overview.js
index de5ab0c..17edfc5 100644
--- a/components/cycle-day/cycle-day-overview.js
+++ b/components/cycle-day/cycle-day-overview.js
@@ -9,10 +9,13 @@ import SymptomPageTitle from './symptom-page-title'
 import { getCycleDay } from '../../db'
 import { getData, nextDate, prevDate } from '../helpers/cycle-day'
 
+import { useDate } from '../../hooks/useDate'
+
 import { Spacing } from '../../styles'
 import { SYMPTOMS } from '../../config'
 
-const CycleDayOverView = ({ date, setDate, isTemperatureEditView }) => {
+const CycleDayOverView = ({ isTemperatureEditView }) => {
+  const { date, setDate } = useDate()
   const cycleDay = getCycleDay(date)
 
   const [editedSymptom, setEditedSymptom] = useState(
@@ -58,8 +61,6 @@ const CycleDayOverView = ({ date, setDate, isTemperatureEditView }) => {
 
 CycleDayOverView.propTypes = {
   cycleDay: PropTypes.object,
-  date: PropTypes.string,
-  setDate: PropTypes.func,
   isTemperatureEditView: PropTypes.bool,
 }