WA-238 Adapting dailyLimit in safes to store the amount spent

src/routes/safe/component/Safe/DailyLimit.jsx

@@ -7,13 +7,17 @@ import Button from '~/components/layout/Button'
 import ListItemText from '~/components/List/ListItemText'
 
 type Props = {
-  limit: number,
+  dailyLimit: number,
   onWithdrawn: () => void,
 }
 
 export const WITHDRAWN_BUTTON_TEXT = 'Withdrawn'
 
-const DailyLimit = ({ limit, onWithdrawn }: Props) => (
+const DailyLimit = ({ dailyLimit, onWithdrawn }: Props) => {
+  const limit = dailyLimit.get('value')
+  const disabled = dailyLimit.get('todaySpent') > limit
+
+  return (
     <ListItem>
       <Avatar>
         <NotificationsPaused />
@@ -23,10 +27,12 @@ const DailyLimit = ({ limit, onWithdrawn }: Props) => (
         variant="raised"
         color="primary"
         onClick={onWithdrawn}
+        disabled={disabled}
       >
         {WITHDRAWN_BUTTON_TEXT}
       </Button>
     </ListItem>
-)
+  )
+}
 
 export default DailyLimit

src/routes/safe/component/Safe/index.jsx

@@ -55,7 +55,7 @@ class GnoSafe extends React.PureComponent<SafeProps, State> {
             <Owners owners={safe.owners} />
             <Confirmations confirmations={safe.get('confirmations')} />
             <Address address={safe.get('address')} />
-            <DailyLimit limit={safe.get('dailyLimit')} onWithdrawn={this.onWithdrawn} />
+            <DailyLimit dailyLimit={safe.dailyLimit} onWithdrawn={this.onWithdrawn} />
           </List>
         </Col>
         <Col sm={12} center="xs" md={7} margin="xl" layout="column">

src/routes/safe/store/actions/addSafe.js

@@ -1,7 +1,7 @@
 // @flow
 import { List } from 'immutable'
 import { createAction } from 'redux-actions'
-import { type SafeProps } from '~/routes/safe/store/model/safe'
+import { makeDailyLimit, type DailyLimit, type SafeProps } from '~/routes/safe/store/model/safe'
 import { makeOwner, type Owner } from '~/routes/safe/store/model/owner'
 
 export const ADD_SAFE = 'ADD_SAFE'
@@ -12,14 +12,18 @@ export const buildOwnersFrom = (names: string[], addresses: string[]) => {
   return List(owners)
 }
 
+export const buildDailyLimitFrom = (dailyLimit: number): DailyLimit =>
+  makeDailyLimit({ value: dailyLimit, spentToday: 0 })
+
 const addSafe = createAction(
   ADD_SAFE,
   (
     name: string, address: string,
-    confirmations: number, dailyLimit: number,
+    confirmations: number, limit: number,
     ownersName: string[], ownersAddress: string[],
   ): SafeProps => {
     const owners: List<Owner> = buildOwnersFrom(ownersName, ownersAddress)
+    const dailyLimit: DailyLimit = buildDailyLimitFrom(limit)
 
     return ({
       address, name, confirmations, owners, dailyLimit,

src/routes/safe/store/model/safe.js

@@ -3,6 +3,18 @@ import { List, Record } from 'immutable'
 import type { RecordFactory, RecordOf } from 'immutable'
 import type { Owner } from '~/routes/safe/store/model/owner'
 
+export type DailyLimitProps = {
+  value: number,
+  spentToday: number,
+}
+
+export const makeDailyLimit: RecordFactory<DailyLimitProps> = Record({
+  value: 0,
+  spentToday: 0,
+})
+
+export type DailyLimit = RecordOf<DailyLimitProps>
+
 export type SafeProps = {
   name: string,
   address: string,
@@ -16,7 +28,7 @@ export const makeSafe: RecordFactory<SafeProps> = Record({
   address: '',
   confirmations: 0,
   owners: List([]),
-  dailyLimit: 0,
+  dailyLimit: makeDailyLimit(),
 })
 
 export type Safe = RecordOf<SafeProps>

src/routes/safe/store/test/builder/safe.builder.js

@@ -1,6 +1,6 @@
 // @flow
 import { makeSafe, type Safe } from '~/routes/safe/store/model/safe'
-import { buildOwnersFrom } from '~/routes/safe/store/actions'
+import { buildOwnersFrom, buildDailyLimitFrom } from '~/routes/safe/store/actions'
 
 class SafeBuilder {
   safe: Safe
@@ -25,7 +25,8 @@ class SafeBuilder {
   }
 
   withDailyLimit(limit: number) {
-    this.safe = this.safe.set('dailyLimit', limit)
+    const dailyLimit = buildDailyLimitFrom(limit)
+    this.safe = this.safe.set('dailyLimit', dailyLimit)
     return this
   }