Skip to content

Commit

Permalink
fix: applied jsx-max-depth
Browse files Browse the repository at this point in the history
  • Loading branch information
Priscila Oliveira committed Dec 16, 2018
1 parent 3bda0cf commit d940da4
Show file tree
Hide file tree
Showing 2 changed files with 114 additions and 83 deletions.
90 changes: 52 additions & 38 deletions src/webui/components/Login/index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -137,6 +137,56 @@ export default class LoginModal extends Component {
);
}

renderNameField = () => {
const { form: { username } } = this.state;
return (
<FormControl
error={!username.value && !username.pristine}
fullWidth={true}
required={username.required}
>
<InputLabel htmlFor={"username"}>Username</InputLabel>
<Input
id={"login--form-username"}
onChange={this.setUsername}
placeholder={"Your username"}
value={username.value}
/>
{!username.value && !username.pristine && (
<FormHelperText id={"username-error"}>
{username.helperText}
</FormHelperText>
)}
</FormControl>
);
}

renderPasswordField = () => {
const { form: { password } } = this.state;
return (
<FormControl
error={!password.value && !password.pristine}
fullWidth={true}
required={password.required}
style={{ marginTop: '8px' }}
>
<InputLabel htmlFor={"password"}>Password</InputLabel>
<Input
id={"login--form-password"}
onChange={this.setPassword}
placeholder={"Your strong password"}
type={"password"}
value={password.value}
/>
{!password.value && !password.pristine && (
<FormHelperText id={"password-error"}>
{password.helperText}
</FormHelperText>
)}
</FormControl>
);
}

render() {
const { visibility, onCancel, error } = this.props;
const { form: { username, password } } = this.state;
Expand All @@ -152,44 +202,8 @@ export default class LoginModal extends Component {
<DialogTitle>Login</DialogTitle>
<DialogContent>
{this.renderLoginError(error)}
<FormControl
error={!username.value && !username.pristine}
fullWidth={true}
required={username.required}
>
<InputLabel htmlFor={"username"}>Username</InputLabel>
<Input
id={"login--form-username"}
onChange={this.setUsername}
placeholder={"Your username"}
value={username.value}
/>
{!username.value && !username.pristine && (
<FormHelperText id={"username-error"}>
{username.helperText}
</FormHelperText>
)}
</FormControl>
<FormControl
error={!password.value && !password.pristine}
fullWidth={true}
required={password.required}
style={{ marginTop: '8px' }}
>
<InputLabel htmlFor={"password"}>Password</InputLabel>
<Input
id={"login--form-password"}
onChange={this.setPassword}
placeholder={"Your strong password"}
type={"password"}
value={password.value}
/>
{!password.value && !password.pristine && (
<FormHelperText id={"password-error"}>
{password.helperText}
</FormHelperText>
)}
</FormControl>
{this.renderNameField()}
{this.renderPasswordField()}
</DialogContent>
<DialogActions className={"dialog-footer"}>
<Button
Expand Down
107 changes: 62 additions & 45 deletions src/webui/components/Package/index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -37,52 +37,69 @@ const getInitialsName = (name: string) =>
.reduce((accumulator, currentValue) => accumulator.charAt(0) + currentValue.charAt(0), '')
.toUpperCase();

const Package = ({ name: label, version, time, author: { name, avatar }, description, license, keywords = [] }: IProps): Element<Wrapper> => (
<Wrapper className={'package'} to={`detail/${label}`}>
<Header>
<MainInfo>
<Name>{label}</Name>
<Version>{`v${version}`}</Version>
</MainInfo>
<Overview>
{license && (
<OverviewItem>
<Icon modifiers={spacing('margin', '4px', '5px', '0px', '0px')} name={'license'} pointer={true} />
{license}
</OverviewItem>
)}
<OverviewItem>
<Icon name={'time'} pointer={true} />
<Published modifiers={spacing('margin', '0px', '5px', '0px', '0px')}>{`Published on ${formatDate(time)} •`}</Published>
{`${formatDateDistance(time)} ago`}
</OverviewItem>
</Overview>
</Header>
<Content>
const Package = ({ name: label, version, time, author: { name, avatar }, description, license, keywords = [] }: IProps): Element<Wrapper> => {
const renderMainInfo = () => (
<MainInfo>
<Name>{label}</Name>
<Version>{`v${version}`}</Version>
</MainInfo>
);

const renderAuthorInfo = () => (
<Author>
<Avatar alt={name} src={avatar}>
{!avatar && getInitialsName(name)}
</Avatar>
<Details>
<Text text={name} weight={'bold'} />
</Details>
</Author>
);

const renderLicenseInfo = () =>
license && (
<OverviewItem>
<Icon modifiers={spacing('margin', '4px', '5px', '0px', '0px')} name={'license'} pointer={true} />
{license}
</OverviewItem>
);

const renderPublishedInfo = () => (
<OverviewItem>
<Icon name={'time'} pointer={true} />
<Published modifiers={spacing('margin', '0px', '5px', '0px', '0px')}>{`Published on ${formatDate(time)} •`}</Published>
{`${formatDateDistance(time)} ago`}
</OverviewItem>
);

const renderDescription = () =>
description && (
<Field>
<Author>
<Avatar alt={name} src={avatar}>
{!avatar && getInitialsName(name)}
</Avatar>
<Details>
<Text text={name} weight={'bold'} />
</Details>
</Author>
<Description>{description}</Description>
</Field>
{description && (
<Field>
<Description>{description}</Description>
</Field>
)}
</Content>
{keywords.length > 0 && (
<Footer>
{keywords.sort().map((keyword, index) => (
<Tag key={index}>{keyword}</Tag>
))}
</Footer>
)}
</Wrapper>
);
);

return (
<Wrapper className={'package'} to={`detail/${label}`}>
<Header>
{renderMainInfo()}
<Overview>
{renderLicenseInfo()}
{renderPublishedInfo()}
</Overview>
</Header>
<Content>
<Field>{renderAuthorInfo()}</Field>
{renderDescription()}
</Content>
{keywords.length > 0 && (
<Footer>
{keywords.sort().map((keyword, index) => (
<Tag key={index}>{keyword}</Tag>
))}
</Footer>
)}
</Wrapper>
);
};
export default Package;

0 comments on commit d940da4

Please sign in to comment.