mirror of
https://github.com/verdaccio/verdaccio.git
synced 2024-11-13 03:35:52 +01:00
fix: applied jsx-max-depth
This commit is contained in:
parent
3bda0cf566
commit
d940da490e
@ -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() {
|
render() {
|
||||||
const { visibility, onCancel, error } = this.props;
|
const { visibility, onCancel, error } = this.props;
|
||||||
const { form: { username, password } } = this.state;
|
const { form: { username, password } } = this.state;
|
||||||
@ -152,44 +202,8 @@ export default class LoginModal extends Component {
|
|||||||
<DialogTitle>Login</DialogTitle>
|
<DialogTitle>Login</DialogTitle>
|
||||||
<DialogContent>
|
<DialogContent>
|
||||||
{this.renderLoginError(error)}
|
{this.renderLoginError(error)}
|
||||||
<FormControl
|
{this.renderNameField()}
|
||||||
error={!username.value && !username.pristine}
|
{this.renderPasswordField()}
|
||||||
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>
|
|
||||||
</DialogContent>
|
</DialogContent>
|
||||||
<DialogActions className={"dialog-footer"}>
|
<DialogActions className={"dialog-footer"}>
|
||||||
<Button
|
<Button
|
||||||
|
@ -37,52 +37,69 @@ const getInitialsName = (name: string) =>
|
|||||||
.reduce((accumulator, currentValue) => accumulator.charAt(0) + currentValue.charAt(0), '')
|
.reduce((accumulator, currentValue) => accumulator.charAt(0) + currentValue.charAt(0), '')
|
||||||
.toUpperCase();
|
.toUpperCase();
|
||||||
|
|
||||||
const Package = ({ name: label, version, time, author: { name, avatar }, description, license, keywords = [] }: IProps): Element<Wrapper> => (
|
const Package = ({ name: label, version, time, author: { name, avatar }, description, license, keywords = [] }: IProps): Element<Wrapper> => {
|
||||||
<Wrapper className={'package'} to={`detail/${label}`}>
|
const renderMainInfo = () => (
|
||||||
<Header>
|
<MainInfo>
|
||||||
<MainInfo>
|
<Name>{label}</Name>
|
||||||
<Name>{label}</Name>
|
<Version>{`v${version}`}</Version>
|
||||||
<Version>{`v${version}`}</Version>
|
</MainInfo>
|
||||||
</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>
|
|
||||||
<Field>
|
|
||||||
<Author>
|
|
||||||
<Avatar alt={name} src={avatar}>
|
|
||||||
{!avatar && getInitialsName(name)}
|
|
||||||
</Avatar>
|
|
||||||
<Details>
|
|
||||||
<Text text={name} weight={'bold'} />
|
|
||||||
</Details>
|
|
||||||
</Author>
|
|
||||||
</Field>
|
|
||||||
{description && (
|
|
||||||
<Field>
|
|
||||||
<Description>{description}</Description>
|
|
||||||
</Field>
|
|
||||||
)}
|
|
||||||
</Content>
|
|
||||||
{keywords.length > 0 && (
|
|
||||||
<Footer>
|
|
||||||
{keywords.sort().map((keyword, index) => (
|
|
||||||
<Tag key={index}>{keyword}</Tag>
|
|
||||||
))}
|
|
||||||
</Footer>
|
|
||||||
)}
|
|
||||||
</Wrapper>
|
|
||||||
);
|
|
||||||
|
|
||||||
|
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>
|
||||||
|
<Description>{description}</Description>
|
||||||
|
</Field>
|
||||||
|
);
|
||||||
|
|
||||||
|
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;
|
export default Package;
|
||||||
|
Loading…
Reference in New Issue
Block a user