From 0462b96c22379404add5b420717e15b3616116f1 Mon Sep 17 00:00:00 2001
From: meriadec <meriadec.pillet@gmail.com>
Date: Tue, 10 Apr 2018 15:45:40 +0200
Subject: [PATCH] Fix feedbacks, sync moment locale with app locale

---
 src/components/OperationsList/index.js | 39 ++++++++------------------
 src/components/SettingsPage/index.js   |  2 ++
 src/renderer/init.js                   |  3 ++
 3 files changed, 17 insertions(+), 27 deletions(-)

diff --git a/src/components/OperationsList/index.js b/src/components/OperationsList/index.js
index cd128529..65561511 100644
--- a/src/components/OperationsList/index.js
+++ b/src/components/OperationsList/index.js
@@ -1,6 +1,6 @@
 // @flow
 
-import React, { Component } from 'react'
+import React, { PureComponent } from 'react'
 import styled from 'styled-components'
 import moment from 'moment'
 import { connect } from 'react-redux'
@@ -32,12 +32,19 @@ import Defer from 'components/base/Defer'
 
 import ConfirmationCheck from './ConfirmationCheck'
 
-const today = moment()
 const DATE_COL_SIZE = 100
 const ACCOUNT_COL_SIZE = 150
 const AMOUNT_COL_SIZE = 150
 const CONFIRMATION_COL_SIZE = 44
 
+const calendarOpts = {
+  sameDay: 'LL – [Today]',
+  nextDay: 'LL – [Tomorrow]',
+  lastDay: 'LL – [Yesterday]',
+  lastWeek: 'LL',
+  sameElse: 'LL',
+}
+
 const Day = styled(Text).attrs({
   color: 'dark',
   fontSize: 3,
@@ -231,7 +238,7 @@ type Props = {
   title?: string,
 }
 
-export class OperationsList extends Component<Props> {
+export class OperationsList extends PureComponent<Props> {
   static defaultProps = {
     onAccountClick: noop,
     withAccount: false,
@@ -239,26 +246,6 @@ export class OperationsList extends Component<Props> {
     nbToShow: 20,
   }
 
-  shouldComponentUpdate(nextProps: Props) {
-    if (this.props.account !== nextProps.account) {
-      return true
-    }
-
-    if (this.props.accounts !== nextProps.accounts) {
-      return true
-    }
-
-    if (this.props.withAccount !== nextProps.withAccount) {
-      return true
-    }
-
-    if (this.props.canShowMore !== nextProps.canShowMore) {
-      return true
-    }
-
-    return false
-  }
-
   handleClickOperation = (data: Object) => this.props.openModal(MODAL_OPERATION_DETAILS, data)
 
   render() {
@@ -278,7 +265,7 @@ export class OperationsList extends Component<Props> {
       return null
     }
     const groupedOperations = accounts
-      ? groupAccountsOperationsByDay(accounts, nbToShow || 20)
+      ? groupAccountsOperationsByDay(accounts, nbToShow)
       : groupAccountOperationsByDay(account, nbToShow)
 
     const accountsMap = accounts ? keyBy(accounts, 'id') : { [account.id]: account }
@@ -293,12 +280,10 @@ export class OperationsList extends Component<Props> {
           )}
           {groupedOperations.map(group => {
             const d = moment(group.day)
-            const isToday = d.isSame(today, 'day')
-            const isYesterday = d.isSame(moment(today).subtract(1, 'day'), 'day')
             return (
               <Box flow={2} key={group.day.toISOString()}>
                 <Box ff="Open Sans|SemiBold" fontSize={4} color="grey">
-                  {isToday ? 'Today' : isYesterday ? 'Yesterday' : d.format('D MMMM YYYY')}
+                  {d.calendar(null, calendarOpts)}
                 </Box>
                 <Card p={0}>
                   {group.data.map(op => {
diff --git a/src/components/SettingsPage/index.js b/src/components/SettingsPage/index.js
index 826455a7..725549f2 100644
--- a/src/components/SettingsPage/index.js
+++ b/src/components/SettingsPage/index.js
@@ -4,6 +4,7 @@ import React, { PureComponent } from 'react'
 import { compose } from 'redux'
 import { connect } from 'react-redux'
 import { translate } from 'react-i18next'
+import moment from 'moment'
 
 import type { Settings, T } from 'types/common'
 import type { SaveSettings } from 'actions/settings'
@@ -56,6 +57,7 @@ class SettingsPage extends PureComponent<Props, State> {
 
     if (newSettings.language !== settings.language) {
       i18n.changeLanguage(newSettings.language)
+      moment.locale(newSettings.language)
     }
 
     if (newSettings.counterValue !== settings.counterValue) {
diff --git a/src/renderer/init.js b/src/renderer/init.js
index f7dae0a8..63a5acb4 100644
--- a/src/renderer/init.js
+++ b/src/renderer/init.js
@@ -5,6 +5,7 @@ import { remote } from 'electron'
 import { render } from 'react-dom'
 import { AppContainer } from 'react-hot-loader'
 import createHistory from 'history/createHashHistory'
+import moment from 'moment'
 
 import createStore from 'renderer/createStore'
 import events from 'renderer/events'
@@ -37,6 +38,8 @@ const state = store.getState() || {}
 const language = getLanguage(state)
 const locked = isLocked(state)
 
+moment.locale(language)
+
 function r(Comp) {
   if (rootNode) {
     render(<AppContainer>{Comp}</AppContainer>, rootNode)