Skip to content

Commit

Permalink
Merge pull request #606 from Cryptonomic/develop
Browse files Browse the repository at this point in the history
Merging new changes in develop into master for v080b release
  • Loading branch information
umurb authored Apr 19, 2019
2 parents 028dc83 + 6307b54 commit 9ee5eb1
Show file tree
Hide file tree
Showing 6 changed files with 130 additions and 73 deletions.
129 changes: 63 additions & 66 deletions app/components/InteractContractModal/CustomTextArea.js
Original file line number Diff line number Diff line change
@@ -1,92 +1,89 @@
import React from 'react';
import styled from 'styled-components';
import { withStyles } from '@material-ui/core/styles';
import InputLabel from '@material-ui/core/InputLabel';
import Input from '@material-ui/core/Input';
import FormControl from '@material-ui/core/FormControl';
import FormHelperText from '@material-ui/core/FormHelperText';
import themes from '../../styles/theme';

const Container = styled(FormControl)`
width: 100%;
pointer-events: ${props => (props.disabled ? 'none' : 'auto')};
`;

const TextAreaWrapper = styled(Input)`
&&& {
&[class*='focused'] {
&:after {
border-bottom-color: ${({ error, theme: { colors } }) =>
error ? colors.error1 : colors.accent};
}
}
background-color: ${({ theme: { colors } }) => colors.gray14};
border: 1px solid ${({ theme: { colors } }) => colors.gray14};
font-size: 14px;
color: ${({ theme: { colors } }) => colors.blue5};
padding: 10px 22px 5px 22px;
&:before {
border-bottom: ${({ disabled }) =>
disabled
? '1px dotted rgba(0, 0, 0, 0.32)'
: '1px solid rgba(0, 0, 0, 0.12)'} ;
}
&:hover:before {
border-bottom: solid 2px ${({ error, theme: { colors } }) =>
error ? colors.error1 : colors.accent} !important;
}
}
}`;

const LabelWrapper = styled(InputLabel)`
&&& {
&[class*='focused'] {
color: ${({ theme: { colors } }) => colors.gray3};
}
&[class*='shrink'] {
transform: translate(0, 1.5px) scale(0.75);
const styles = {
cssContainer: {
width: '100%'
},
cssLabel: {
color: themes.colors.gray15,
zIndex: 10,
fontSize: '16px',
pointerEvents: 'none',
'&$cssFocused': {
color: themes.colors.gray3
}
color: ${({ theme: { colors } }) => colors.gray15};
z-index: 10;
font-size: 16px;
pointer-events: none;
transform: translate(22px, 34px) scale(1);
},
cssFormControl: {
transform: 'translate(22px, 34px) scale(1)'
},
cssShrink: {
transform: 'translate(0, 1.5px) scale(0.75)'
},
cssFocused: {},
cssInput: {
backgroundColor: themes.colors.gray14,
border: `1px solid ${themes.colors.gray14}`,
fontSize: '14px',
color: themes.colors.blue5,
padding: '10px 22px 5px 22px'
},
cssText: {
color: themes.colors.error1,
fontSize: '12px',
marginTop: '5px',
lineHeight: '18px',
height: '18px'
}
}`;

const ErrorText = styled(FormHelperText)`
&&& {
color: ${({ theme: { colors } }) => colors.error1};
font-size: 12px;
margin-top: 5px;
line-height: 18px;
height: 18px;
}
}`;
};

type Props = {
label: string,
errorText?: string | React.Node,
disabled?: boolean,
onChange?: () => {}
onChange?: () => {},
classes: object
};

const CustomTextArea = (props: Props) => {
const { label, onChange, errorText, disabled, ...other } = props;
const { label, onChange, errorText, classes, ...other } = props;
return (
<Container disabled={disabled}>
<LabelWrapper>{label}</LabelWrapper>
<TextAreaWrapper
<FormControl className={classes.cssContainer}>
<InputLabel
classes={{
formControl: classes.cssFormControl,
shrink: classes.cssShrink
}}
FormLabelClasses={{
root: classes.cssLabel,
focused: classes.cssFocused
}}
htmlFor="micheline-input"
>
{label}
</InputLabel>
<Input
classes={{
root: classes.cssInput
}}
id="micheline-input"
key={label}
onChange={event => onChange(event.target.value)}
multiline
{...other}
/>
<ErrorText component="div">{errorText}</ErrorText>
</Container>
<FormHelperText component="div" className={classes.cssText}>
{errorText}
</FormHelperText>
</FormControl>
);
};
CustomTextArea.defaultProps = {
errorText: '',
disabled: false
errorText: ''
};

export default CustomTextArea;
export default withStyles(styles)(CustomTextArea);
24 changes: 23 additions & 1 deletion app/components/InteractContractModal/InvokeContract.js
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,8 @@ import {
ViewScan,
LinkIcon,
InvokeAddressContainer,
ItemWrapper
ItemWrapper,
SelectRenderWrapper
} from './style';

const utez = 1000000;
Expand Down Expand Up @@ -204,6 +205,27 @@ class InvokeContract extends Component<Props> {
label={t('components.interactModal.invoke_from')}
value={selectedInvokeAddress}
onChange={this.onChangeInvokeAddress}
renderValue={value => {
const address = addresses.find(
address => address.pkh === value
);
return (
<SelectRenderWrapper>
<TezosAddress
address={address.pkh}
size="16px"
color="gray3"
color2="primary"
/>
<SpaceBar />
<TezosAmount
color="primary"
size={ms(0.65)}
amount={address.balance}
/>
</SelectRenderWrapper>
);
}}
>
{addresses.map(address => (
<ItemWrapper
Expand Down
8 changes: 8 additions & 0 deletions app/components/InteractContractModal/style.js
Original file line number Diff line number Diff line change
Expand Up @@ -171,3 +171,11 @@ export const MainContainer = styled.div`
display: flex;
flex-direction: column;
`;

export const SelectRenderWrapper = styled.div`
display: flex;
align-items: center;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
`;
27 changes: 27 additions & 0 deletions app/components/Invoke/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -121,6 +121,14 @@ export const InvokeButton = styled(Button)`
padding: 0;
`;

const SelectRenderWrapper = styled.div`
display: flex;
align-items: center;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
`;

const utez = 1000000;

type Props = {
Expand Down Expand Up @@ -291,6 +299,25 @@ class Invoke extends Component<Props> {
label={t('components.interactModal.invoke_from')}
value={selectedInvokeAddress}
onChange={this.onChangeInvokeAddress}
renderValue={value => {
const address = addresses.find(address => address.pkh === value);
return (
<SelectRenderWrapper>
<TezosAddress
address={address.pkh}
size="16px"
color="gray3"
color2="primary"
/>
<SpaceBar />
<TezosAmount
color="primary"
size={ms(0.65)}
amount={address.balance}
/>
</SelectRenderWrapper>
);
}}
>
{addresses.map(address => (
<ItemWrapper
Expand Down
3 changes: 2 additions & 1 deletion app/components/TextField/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -95,8 +95,9 @@ const TextField = (props: Props) => {
const { label, type, onChange, errorText, disabled, right, ...other } = props;
return (
<Container disabled={disabled}>
<LabelWrapper>{label}</LabelWrapper>
<LabelWrapper htmlFor="custom-input">{label}</LabelWrapper>
<InputWrapper
id="custom-input"
key={label}
type={type}
onChange={event => onChange(event.target.value)}
Expand Down
12 changes: 7 additions & 5 deletions app/utils/settings.js
Original file line number Diff line number Diff line change
Expand Up @@ -9,14 +9,16 @@ if (process.env.NODE_ENV === 'production') {
}

export function getWalletSettings() {
const settings = localStorage.getItem('settings');
if (settings) {
return JSON.parse(settings);
const stringSettings = localStorage.getItem('settings');
let localSettings = {};
let fileSettings = {};
if (stringSettings) {
localSettings = JSON.parse(stringSettings);
}
if (fs.existsSync(filePath)) {
return JSON.parse(fs.readFileSync(filePath));
fileSettings = JSON.parse(fs.readFileSync(filePath));
}
return {};
return {...localSettings, ...fileSettings};
}

export function setWalletSettings(nodes) {
Expand Down

0 comments on commit 9ee5eb1

Please sign in to comment.