feat(autologout): added units to edit scene

blockchain · Jul 6, 2018 · ef118b9 · ef118b9
1 parent 33d4a2e
commit ef118b9
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 5 deletions.
diff --git a/...-wallet-v4-frontend/src/scenes/Settings/Preferences/AutoLogout/Settings/EditForm/index.js b/...-wallet-v4-frontend/src/scenes/Settings/Preferences/AutoLogout/Settings/EditForm/index.js
@@ -1,4 +1,3 @@
-
 import React from 'react'
 import { connect } from 'react-redux'
 import { bindActionCreators } from 'redux'

diff --git a/...llet-v4-frontend/src/scenes/Settings/Preferences/AutoLogout/Settings/EditForm/template.js b/...llet-v4-frontend/src/scenes/Settings/Preferences/AutoLogout/Settings/EditForm/template.js
@@ -2,22 +2,38 @@ import React from 'react'
 import PropTypes from 'prop-types'
 import { FormattedMessage } from 'react-intl'
 import { Field, reduxForm } from 'redux-form'
+import styled from 'styled-components'
 
-import { Button, ButtonGroup } from 'blockchain-info-components'
+import { Button, ButtonGroup, Text } from 'blockchain-info-components'
 import { NumberBox, FormGroup, FormItem } from 'components/Form'
 import { SettingForm, SettingWrapper } from 'components/Setting'
+import { spacing } from 'services/StyleService'
 import { isValidAutoLogoutTime } from './validation'
 
+const Wrapper = styled.div`
+  display: flex;
+  flex-direction: row;
+  justify-content: flex-start;
+  align-items: center;
+
+  & > * { padding: 10px 0; }
+`
+
 const Settings = (props) => {
   const { handleToggle, handleClick, submitting, invalid } = props
 
   return (
     <SettingWrapper>
       <SettingForm onSubmit={handleClick}>
         <FormGroup>
-          <FormItem>
-            <Field name='autoLogoutTime' component={NumberBox} validate={[isValidAutoLogoutTime]} />
-          </FormItem>
+          <Wrapper>
+            <FormItem>
+              <Field name='autoLogoutTime' component={NumberBox} validate={[isValidAutoLogoutTime]} />
+            </FormItem>
+            <Text size='14' weight={300} style={spacing('pl-10')}>
+              <FormattedMessage id='scenes.settings.preferences.autologout.updateform.minutes' defaultMessage='Minutes' />
+            </Text>
+          </Wrapper>
         </FormGroup>
         <ButtonGroup>
           <Button nature='empty' capitalize onClick={handleToggle}>