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

24
src/components/DetailSidebar/DetailSidebar.tsx
View File

@@ -16,6 +16,15 @@ import { DetailContext } from '../../pages/Version';
import { TitleListItem, TitleListItemText } from './styles';
const renderLatestDescription = (description, version, isLatest: boolean = true) => {
return (
<span>
<div>{description}</div>
{version ? <small>{`${isLatest ? 'Latest v' : 'v'}${version}`}</small> : null}
</span>
);
};
const renderCopyCLI = () => <Install />;
const renderMaintainers = () => <Developers type="maintainers" />;
const renderContributors = () => <Developers type="contributors" />;
@@ -24,22 +33,25 @@ const renderAuthor = () => <Author />;
const renderEngine = () => <Engine />;
const renderDist = () => <Dist />;
const renderActionBar = () => <ActionBar />;
const renderTitle = (packageName, packageMeta) => {
const renderTitle = (packageName, packageVersion, packageMeta) => {
const version = packageVersion ? packageVersion : packageMeta.latest.version;
const isLatest = typeof packageVersion === 'undefined';
return (
<List className="detail-info">
<TitleListItem alignItems="flex-start" button={true}>
<TitleListItemText primary={<b>{packageName}</b>} secondary={packageMeta.latest.description} />
<TitleListItemText primary={<b>{packageName}</b>} secondary={renderLatestDescription(packageMeta.latest.description, version, isLatest)} />
</TitleListItem>
</List>
);
};
function renderSideBar(packageName, packageMeta): ReactElement<HTMLElement> {
function renderSideBar(packageName, packageVersion, packageMeta): ReactElement<HTMLElement> {
return (
<div className={'sidebar-info'}>
<Card>
<CardContent>
{renderTitle(packageName, packageMeta)}
{renderTitle(packageName, packageVersion, packageMeta)}
{renderActionBar()}
{renderCopyCLI()}
{renderRepository()}
@@ -55,9 +67,9 @@ function renderSideBar(packageName, packageMeta): ReactElement<HTMLElement> {
}
const DetailSidebar = () => {
const { packageName, packageMeta } = React.useContext(DetailContext);
const { packageName, packageMeta, packageVersion } = React.useContext(DetailContext);
return renderSideBar(packageName, packageMeta);
return renderSideBar(packageName, packageVersion, packageMeta);
};
export default DetailSidebar;