0
Fork 0
mirror of https://github.com/verdaccio/verdaccio.git synced 2024-12-23 22:27:34 -05:00

refactor: removed list

This commit is contained in:
Priscila Oliveira 2019-01-20 16:44:51 +01:00
parent 108936a6e4
commit 593f1c09f8
2 changed files with 17 additions and 21 deletions

View file

@ -7,11 +7,10 @@
import React, { Component, Fragment } from 'react';
import { withRouter } from 'react-router-dom';
import CardContent from '@material-ui/core/CardContent';
import { DetailContextConsumer } from '../../pages/version';
import Chip from '@material-ui/core/Chip';
import { Content, CardWrap, Heading, ListItem, CardContent } from './styles';
import List from '@material-ui/core/List';
import { Content, CardWrap, Heading, Tags, Tag } from './styles';
class DepDetail extends Component<any, any> {
constructor(props: any) {
@ -27,11 +26,7 @@ class DepDetail extends Component<any, any> {
render() {
const { name, version } = this.state;
const tagText = `${name}@${version}`;
return (
<ListItem>
<Chip clickable={true} component={'div'} label={tagText} onClick={this.handleOnClick} />
</ListItem>
);
return <Tag clickable={true} component={'div'} label={tagText} onClick={this.handleOnClick} />;
}
handleOnClick = () => {
@ -46,7 +41,7 @@ class DepDetail extends Component<any, any> {
const WrappDepDetail = withRouter(DepDetail);
class DependencyBlock extends Component<any, any> {
renderList = (deps: object, enableLoading: boolean) =>
renderTags = (deps: object, enableLoading: boolean) =>
deps.map(dep => {
const [name, version] = dep;
@ -65,7 +60,7 @@ class DependencyBlock extends Component<any, any> {
<CardWrap>
<CardContent>
<Heading variant={'subheading'}>{title}</Heading>
<List>{this.renderList(deps, enableLoading)}</List>
<Tags>{this.renderTags(deps, enableLoading)}</Tags>
</CardContent>
</CardWrap>
);

View file

@ -6,8 +6,7 @@
import styled from 'react-emotion';
import Card from '@material-ui/core/Card';
import Typography from '@material-ui/core/Typography';
import { default as MuiListItem } from '@material-ui/core/ListItem';
import { default as MuiCardContent } from '@material-ui/core/CardContent';
import Chip from '@material-ui/core/Chip';
export const Content = styled.div`
&& {
@ -15,12 +14,6 @@ export const Content = styled.div`
}
`;
export const CardContent = styled(MuiCardContent)`
&& {
padding-bottom: 0;
}
`;
export const CardWrap = styled(Card)`
&& {
margin: 0 0 25px;
@ -33,9 +26,17 @@ export const Heading = styled(Typography)`
}
`;
export const ListItem = styled(MuiListItem)`
export const Tags = styled('div')`
&& {
padding-left: 0;
padding-right: 0;
display: flex;
justify-content: start;
flex-wrap: wrap;
margin: 0 -5px;
}
`;
export const Tag = styled(Chip)`
&& {
margin: 5px;
}
`;