From 75a97089f9d13e3ae88eec8f82a07645c0b46678 Mon Sep 17 00:00:00 2001
From: Julia Friesel <julia.friesel@gmail.com>
Date: Sat, 9 Jun 2018 15:06:13 +0200
Subject: [PATCH] Remove listener when component unmounts
---
bleeding.js | 1 -
calendar.js | 13 +++++++++----
2 files changed, 9 insertions(+), 5 deletions(-)
diff --git a/bleeding.js b/bleeding.js
index fd38fd93..6501246d 100644
--- a/bleeding.js
+++ b/bleeding.js
@@ -11,7 +11,6 @@ import { saveBleeding } from './db'
import { formatDateForViewHeader } from './format'
import { bleeding as labels } from './labels'
import getCycleDay from './get-cycle-day'
-import { bleedingDaysSortedByDate } from './db'
export default class Bleeding extends Component {
constructor(props) {
diff --git a/calendar.js b/calendar.js
index 2cb6f949..4fdbd2fb 100644
--- a/calendar.js
+++ b/calendar.js
@@ -9,10 +9,11 @@ export default class DatePickView extends Component {
super(props)
this.state = { bleedingDaysInCalFormat: getBleedingDaysInCalFormat(bleedingDaysSortedByDate) }
- // so we rerender the calendar when there are new bleeding days
- bleedingDaysSortedByDate.addListener(() => {
- this.setState({ bleedingDaysInCalFormat: getBleedingDaysInCalFormat(bleedingDaysSortedByDate) })
- })
+ bleedingDaysSortedByDate.addListener(setStateWithCalendarFormattedDays.bind(this))
+ }
+
+ componentWillUnmount() {
+ bleedingDaysSortedByDate.removeListener(setStateWithCalendarFormattedDays)
}
passDateToDayView(result) {
@@ -43,4 +44,8 @@ function getBleedingDaysInCalFormat(bleedingDaysSortedByDate) {
acc[dateString] = { startingDay: true, endingDay: true, color: shadesOfRed[day.bleeding.value] }
return acc
}, {})
+}
+
+function setStateWithCalendarFormattedDays() {
+ this.setState({ bleedingDaysInCalFormat: getBleedingDaysInCalFormat(bleedingDaysSortedByDate) })
}
\ No newline at end of file
--
GitLab