cubetiq/verdaccio-ui
1
0
Fork 0
forked from sombochea/verdaccio-ui
Code Issues Pull Requests Releases Wiki Activity

feat: add browser features to browse by version (#125)

Browse Source 
* feat: add browser features to browse by version

* chore: verify whether version exist

* chore: add link on versions

* chore: udpate imports

* chore: use mui links

* test: add unit test

* chore: Add todo list

* chore: remove imports
This commit is contained in:
Juan Picado @jotadeveloper
2019-09-01 04:09:23 -07:00
committed by GitHub
parent bbec54d602
commit 1904179af3
10 changed files with 6567 additions and 58 deletions
Download Patch File Download Diff File Expand all files Collapse all files

52
src/components/Versions/Versions.tsx
View File

@@ -1,57 +1,85 @@
import React, { ReactElement } from 'react';
import List from '@material-ui/core/List';
import { Link as RouterLink } from 'react-router-dom';
import Link from '@material-ui/core/Link';
import ListItem from '@material-ui/core/ListItem';
import { DetailContextConsumer } from '../../pages/Version';
import { formatDateDistance } from '../../utils/package';
import { DIST_TAGS } from '../../../lib/constants';
import { Heading, Spacer, ListItemText } from './styles';
const NOT_AVAILABLE = 'Not available';
export const NOT_AVAILABLE = 'Not available';
export const LABEL_CURRENT_TAGS = 'Current Tags';
export const LABEL_VERSION_HISTORY = 'Version History';
class Versions extends React.PureComponent {
public render(): ReactElement<HTMLDivElement> {
return (
<DetailContextConsumer>
{context => {
return context && context.packageMeta && this.renderContent(context.packageMeta);
const { packageMeta, packageName } = context;
if (!packageMeta) {
return null;
}
return this.renderContent(packageMeta, packageName);
}}
</DetailContextConsumer>
);
}
public renderPackageList = (packages: {}, isVersion: boolean = false, timeMap: Record<string, {}> = {}): ReactElement<HTMLDivElement> => {
public renderPackageList = (packages: {}, timeMap: Record<string, {}>, packageName): ReactElement<HTMLDivElement> => {
return (
<List>
<List dense={true}>
{Object.keys(packages)
.reverse()
.map(version => (
<ListItem className="version-item" key={version}>
<ListItemText>{version}</ListItemText>
<Link component={RouterLink} to={`/-/web/detail/${packageName}/v/${version}`}>
<ListItemText>{version}</ListItemText>
</Link>
<Spacer />
{isVersion && <ListItemText>{timeMap[version] ? `${formatDateDistance(timeMap[version])} ago` : NOT_AVAILABLE}</ListItemText>}
{isVersion === false && <ListItemText>{packages[version]}</ListItemText>}
<ListItemText>{timeMap[version] ? `${formatDateDistance(timeMap[version])} ago` : NOT_AVAILABLE}</ListItemText>
</ListItem>
))}
</List>
);
};
public renderContent(packageMeta): ReactElement<HTMLDivElement> {
public renderTagList = (packages: {}): ReactElement<HTMLDivElement> => {
return (
<List dense={true}>
{Object.keys(packages)
.reverse()
.map(tag => (
<ListItem className="version-item" key={tag}>
<ListItemText>{tag}</ListItemText>
<Spacer />
<ListItemText>{packages[tag]}</ListItemText>
</ListItem>
))}
</List>
);
};
public renderContent(packageMeta, packageName): ReactElement<HTMLDivElement> {
const { versions = {}, time: timeMap = {}, [DIST_TAGS]: distTags = {} } = packageMeta;
return (
<>
{distTags && (
<>
<Heading variant="subtitle1">{'Current Tags'}</Heading>
{this.renderPackageList(distTags, false, timeMap)}
<Heading variant="subtitle1">{LABEL_CURRENT_TAGS}</Heading>
{this.renderTagList(distTags)}
</>
)}
{versions && (
<>
<Heading variant="subtitle1">{'Version History'}</Heading>
{this.renderPackageList(versions, true, timeMap)}
<Heading variant="subtitle1">{LABEL_VERSION_HISTORY}</Heading>
{this.renderPackageList(versions, timeMap, packageName)}
</>
)}
</>