0
Fork 0
mirror of https://github.com/verdaccio/verdaccio.git synced 2025-02-17 23:45:29 -05:00

feat: display package peer deps (#1144)

* feat: enable overriding Dependencies title

* feat: add PeerDependencies component

* test: add PeerDependencies unit tests

* test: add unit test about Dependencies title overriding

* feat: display peer dependencies in package sidebar
This commit is contained in:
Stéphane Bachelier 2018-12-03 06:41:25 +01:00 committed by Juan Picado @jotadeveloper
parent 9d4c76153d
commit 9b52b1d396
7 changed files with 104 additions and 4 deletions

View file

@ -4,6 +4,7 @@ import get from 'lodash/get';
import LastSync from './modules/LastSync';
import Maintainers from './modules/Maintainers';
import Dependencies from './modules/Dependencies';
import PeerDependencies from './modules/PeerDependencies';
import Infos from './modules/Infos';
import {
@ -65,6 +66,7 @@ export default class PackageSidebar extends React.Component {
// Dependencies component
const dependencies = get(packageMeta, 'latest.dependencies', {});
const peerDependencies = get(packageMeta, 'latest.peerDependencies', {});
// Maintainers component
return (
@ -83,6 +85,7 @@ export default class PackageSidebar extends React.Component {
{/* TODO: Refacor later, when we decide to show only maintainers/authors */}
<Maintainers packageMeta={packageMeta} />
<Dependencies dependencies={dependencies} />
<PeerDependencies dependencies={peerDependencies} />
{/* Package management module? Help us implement it! */}
</aside>
);

View file

@ -29,10 +29,10 @@ const renderDependenciesList = (dependencies, dependenciesList) => {
);
};
const Dependencies = ({dependencies = {}}) => {
const Dependencies = ({dependencies = {}, title = 'Dependencies'}) => {
const dependenciesList = Object.keys(dependencies);
return (
<Module title="Dependencies" className={classes.dependenciesModule}>
<Module title={title} className={classes.dependenciesModule}>
{dependenciesList.length > 0 ? (
renderDependenciesList(dependencies, dependenciesList)
) : (
@ -43,7 +43,8 @@ const Dependencies = ({dependencies = {}}) => {
};
Dependencies.propTypes = {
dependencies: PropTypes.object
dependencies: PropTypes.object,
title: PropTypes.string
};
export default Dependencies;

View file

@ -0,0 +1,18 @@
import React from 'react';
import PropTypes from 'prop-types';
import Dependencies from '../Dependencies';
export const TITLE = 'Peer Dependencies'
const PeerDependencies = ({dependencies = {}, title = TITLE}) => {
return (
<Dependencies title={title} dependencies={dependencies} />
);
};
PeerDependencies.propTypes = {
dependencies: PropTypes.object,
title: PropTypes.string
};
export default PeerDependencies;

View file

@ -3,3 +3,5 @@
exports[`<PackageSidebar /> : <Dependencies /> should load dependencies 1`] = `"<div class=\\"module dependenciesModule\\"><h2 class=\\"moduleTitle\\">Dependencies</h2><div><ul><li class=\\"dependency-item\\" title=\\"Depend on version: 0.0.3\\"><a href=\\"http://localhost/#/detail/@verdaccio/file-locking\\">@verdaccio/file-locking</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: 0.0.2\\"><a href=\\"http://localhost/#/detail/@verdaccio/streams\\">@verdaccio/streams</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^1.1.1\\"><a href=\\"http://localhost/#/detail/JSONStream\\">JSONStream</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^1.1.2\\"><a href=\\"http://localhost/#/detail/apache-md5\\">apache-md5</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^2.0.1\\"><a href=\\"http://localhost/#/detail/async\\">async</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^1.15.0\\"><a href=\\"http://localhost/#/detail/body-parser\\">body-parser</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^1.8.0\\"><a href=\\"http://localhost/#/detail/bunyan\\">bunyan</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^2.0.1\\"><a href=\\"http://localhost/#/detail/chalk\\">chalk</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^2.11.0\\"><a href=\\"http://localhost/#/detail/commander\\">commander</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: 1.6.2\\"><a href=\\"http://localhost/#/detail/compression\\">compression</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^0.7.0\\"><a href=\\"http://localhost/#/detail/cookies\\">cookies</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^2.8.3\\"><a href=\\"http://localhost/#/detail/cors\\">cors</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: 4.15.3\\"><a href=\\"http://localhost/#/detail/express\\">express</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^4.3.2\\"><a href=\\"http://localhost/#/detail/global\\">global</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: 4.0.5\\"><a href=\\"http://localhost/#/detail/handlebars\\">handlebars</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^1.4.0\\"><a href=\\"http://localhost/#/detail/http-errors\\">http-errors</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: 1.0.1\\"><a href=\\"http://localhost/#/detail/js-string-escape\\">js-string-escape</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^3.6.0\\"><a href=\\"http://localhost/#/detail/js-yaml\\">js-yaml</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^7.4.1\\"><a href=\\"http://localhost/#/detail/jsonwebtoken\\">jsonwebtoken</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^1.0.1\\"><a href=\\"http://localhost/#/detail/lockfile\\">lockfile</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: 4.17.4\\"><a href=\\"http://localhost/#/detail/lodash\\">lodash</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^0.7.0\\"><a href=\\"http://localhost/#/detail/lunr\\">lunr</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: 0.3.6\\"><a href=\\"http://localhost/#/detail/marked\\">marked</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^1.3.6\\"><a href=\\"http://localhost/#/detail/mime\\">mime</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^3.0.2\\"><a href=\\"http://localhost/#/detail/minimatch\\">minimatch</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^0.5.1\\"><a href=\\"http://localhost/#/detail/mkdirp\\">mkdirp</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^0.4.0\\"><a href=\\"http://localhost/#/detail/pkginfo\\">pkginfo</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^2.72.0\\"><a href=\\"http://localhost/#/detail/request\\">request</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^5.1.0\\"><a href=\\"http://localhost/#/detail/semver\\">semver</a><span>, </span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^1.0.0\\"><a href=\\"http://localhost/#/detail/unix-crypt-td-js\\">unix-crypt-td-js</a></li></ul></div></div>"`;
exports[`<PackageSidebar /> : <Dependencies /> should load the package without dependencies 1`] = `"<div class=\\"module dependenciesModule\\"><h2 class=\\"moduleTitle\\">Dependencies</h2><div><p class=\\"emptyPlaceholder\\">Zero Dependencies!</p></div></div>"`;
exports[`<PackageSidebar /> : <Dependencies /> should permit overriding title 1`] = `"<div class=\\"module dependenciesModule\\"><h2 class=\\"moduleTitle\\">Package dependencies</h2><div><p class=\\"emptyPlaceholder\\">Zero Dependencies!</p></div></div>"`;

View file

@ -0,0 +1,5 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`<PackageSidebar /> : <PeerDependencies /> should load dependencies 1`] = `"<div class=\\"module dependenciesModule\\"><h2 class=\\"moduleTitle\\">Peer Dependencies</h2><div><ul><li class=\\"dependency-item\\" title=\\"Depend on version: 0.0.3\\"><a href=\\"http://localhost/#/detail/@verdaccio/file-locking\\">@verdaccio/file-locking</a><span>,&nbsp;</span></li><li class=\\"dependency-item\\" title=\\"Depend on version: 0.0.2\\"><a href=\\"http://localhost/#/detail/@verdaccio/streams\\">@verdaccio/streams</a><span>,&nbsp;</span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^1.1.1\\"><a href=\\"http://localhost/#/detail/JSONStream\\">JSONStream</a><span>,&nbsp;</span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^1.1.2\\"><a href=\\"http://localhost/#/detail/apache-md5\\">apache-md5</a><span>,&nbsp;</span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^2.0.1\\"><a href=\\"http://localhost/#/detail/async\\">async</a><span>,&nbsp;</span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^1.15.0\\"><a href=\\"http://localhost/#/detail/body-parser\\">body-parser</a><span>,&nbsp;</span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^1.8.0\\"><a href=\\"http://localhost/#/detail/bunyan\\">bunyan</a><span>,&nbsp;</span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^2.0.1\\"><a href=\\"http://localhost/#/detail/chalk\\">chalk</a><span>,&nbsp;</span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^2.11.0\\"><a href=\\"http://localhost/#/detail/commander\\">commander</a><span>,&nbsp;</span></li><li class=\\"dependency-item\\" title=\\"Depend on version: 1.6.2\\"><a href=\\"http://localhost/#/detail/compression\\">compression</a><span>,&nbsp;</span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^0.7.0\\"><a href=\\"http://localhost/#/detail/cookies\\">cookies</a><span>,&nbsp;</span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^2.8.3\\"><a href=\\"http://localhost/#/detail/cors\\">cors</a><span>,&nbsp;</span></li><li class=\\"dependency-item\\" title=\\"Depend on version: 4.15.3\\"><a href=\\"http://localhost/#/detail/express\\">express</a><span>,&nbsp;</span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^4.3.2\\"><a href=\\"http://localhost/#/detail/global\\">global</a><span>,&nbsp;</span></li><li class=\\"dependency-item\\" title=\\"Depend on version: 4.0.5\\"><a href=\\"http://localhost/#/detail/handlebars\\">handlebars</a><span>,&nbsp;</span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^1.4.0\\"><a href=\\"http://localhost/#/detail/http-errors\\">http-errors</a><span>,&nbsp;</span></li><li class=\\"dependency-item\\" title=\\"Depend on version: 1.0.1\\"><a href=\\"http://localhost/#/detail/js-string-escape\\">js-string-escape</a><span>,&nbsp;</span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^3.6.0\\"><a href=\\"http://localhost/#/detail/js-yaml\\">js-yaml</a><span>,&nbsp;</span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^7.4.1\\"><a href=\\"http://localhost/#/detail/jsonwebtoken\\">jsonwebtoken</a><span>,&nbsp;</span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^1.0.1\\"><a href=\\"http://localhost/#/detail/lockfile\\">lockfile</a><span>,&nbsp;</span></li><li class=\\"dependency-item\\" title=\\"Depend on version: 4.17.4\\"><a href=\\"http://localhost/#/detail/lodash\\">lodash</a><span>,&nbsp;</span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^0.7.0\\"><a href=\\"http://localhost/#/detail/lunr\\">lunr</a><span>,&nbsp;</span></li><li class=\\"dependency-item\\" title=\\"Depend on version: 0.3.6\\"><a href=\\"http://localhost/#/detail/marked\\">marked</a><span>,&nbsp;</span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^1.3.6\\"><a href=\\"http://localhost/#/detail/mime\\">mime</a><span>,&nbsp;</span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^3.0.2\\"><a href=\\"http://localhost/#/detail/minimatch\\">minimatch</a><span>,&nbsp;</span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^0.5.1\\"><a href=\\"http://localhost/#/detail/mkdirp\\">mkdirp</a><span>,&nbsp;</span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^0.4.0\\"><a href=\\"http://localhost/#/detail/pkginfo\\">pkginfo</a><span>,&nbsp;</span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^2.72.0\\"><a href=\\"http://localhost/#/detail/request\\">request</a><span>,&nbsp;</span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^5.1.0\\"><a href=\\"http://localhost/#/detail/semver\\">semver</a><span>,&nbsp;</span></li><li class=\\"dependency-item\\" title=\\"Depend on version: ^1.0.0\\"><a href=\\"http://localhost/#/detail/unix-crypt-td-js\\">unix-crypt-td-js</a></li></ul></div></div>"`;
exports[`<PackageSidebar /> : <PeerDependencies /> should load the package without dependencies 1`] = `"<div class=\\"module dependenciesModule\\"><h2 class=\\"moduleTitle\\">Peer Dependencies</h2><div><p class=\\"emptyPlaceholder\\">Zero Dependencies!</p></div></div>"`;

View file

@ -3,7 +3,7 @@
*/
import React from 'react';
import { shallow } from 'enzyme';
import { mount, shallow } from 'enzyme';
import Dependencies, {
NO_DEPENDENCIES,
DEP_ITEM_CLASS
@ -57,4 +57,11 @@ describe('<PackageSidebar /> : <Dependencies />', () => {
expect(wrapper.find(ModuleContentPlaceholder).props().text).toBe(NO_DEPENDENCIES);
expect(wrapper.html()).toMatchSnapshot();
});
test('should permit overriding title', () => {
const wrapper = mount(<Dependencies title='Package dependencies' />);
expect(wrapper.find('h2').text()).toEqual('Package dependencies');
expect(wrapper.html()).toMatchSnapshot();
});
});

View file

@ -0,0 +1,64 @@
/**
* Dependencies component
*/
import React from 'react';
import { mount } from 'enzyme';
import {
NO_DEPENDENCIES,
DEP_ITEM_CLASS
} from '../../../../../src/webui/components/PackageSidebar/modules/Dependencies/index';
import PeerDependencies, {
TITLE
} from '../../../../../src/webui/components/PackageSidebar/modules/PeerDependencies/index';
import ModuleContentPlaceholder from '../../../../../src/webui/components/PackageSidebar/ModuleContentPlaceholder';
describe('<PackageSidebar /> : <PeerDependencies />', () => {
test('should load dependencies', () => {
const peerDependencies = {
'@verdaccio/file-locking': '0.0.3',
'@verdaccio/streams': '0.0.2',
JSONStream: '^1.1.1',
'apache-md5': '^1.1.2',
async: '^2.0.1',
'body-parser': '^1.15.0',
bunyan: '^1.8.0',
chalk: '^2.0.1',
commander: '^2.11.0',
compression: '1.6.2',
cookies: '^0.7.0',
cors: '^2.8.3',
express: '4.15.3',
global: '^4.3.2',
handlebars: '4.0.5',
'http-errors': '^1.4.0',
'js-string-escape': '1.0.1',
'js-yaml': '^3.6.0',
jsonwebtoken: '^7.4.1',
lockfile: '^1.0.1',
lodash: '4.17.4',
lunr: '^0.7.0',
marked: '0.3.6',
mime: '^1.3.6',
minimatch: '^3.0.2',
mkdirp: '^0.5.1',
pkginfo: '^0.4.0',
request: '^2.72.0',
semver: '^5.1.0',
'unix-crypt-td-js': '^1.0.0'
};
const wrapper = mount(<PeerDependencies dependencies={peerDependencies} />);
expect(wrapper.find('h2').text()).toEqual(TITLE);
expect(wrapper.find(`.${DEP_ITEM_CLASS}`)).toHaveLength(Object.keys(peerDependencies).length);
expect(wrapper.html()).toMatchSnapshot();
});
test('should load the package without dependencies', () => {
const wrapper = mount(<PeerDependencies />);
expect(wrapper.find(ModuleContentPlaceholder).props().text).toBe(NO_DEPENDENCIES);
expect(wrapper.html()).toMatchSnapshot();
});
});