diff --git a/src/common/ShlinkVersions.js b/src/common/ShlinkVersions.js index 44afc1c4..ae083806 100644 --- a/src/common/ShlinkVersions.js +++ b/src/common/ShlinkVersions.js @@ -2,10 +2,12 @@ import React from 'react'; import PropTypes from 'prop-types'; import classNames from 'classnames'; import { pipe } from 'ramda'; +import { ExternalLink } from 'react-external-link'; import { serverType } from '../servers/prop-types'; import { versionToPrintable, versionToSemVer } from '../utils/helpers/version'; const SHLINK_WEB_CLIENT_VERSION = '%_VERSION_%'; +const normalizeVersion = pipe(versionToSemVer(), versionToPrintable); const propTypes = { selectedServer: serverType, @@ -13,13 +15,27 @@ const propTypes = { clientVersion: PropTypes.string, }; +const versionLinkPropTypes = { + project: PropTypes.oneOf([ 'shlink', 'shlink-web-client' ]).isRequired, + version: PropTypes.string.isRequired, +}; + +const VersionLink = ({ project, version }) => ( + + {version} + +); + +VersionLink.propTypes = versionLinkPropTypes; + const ShlinkVersions = ({ selectedServer, className, clientVersion = SHLINK_WEB_CLIENT_VERSION }) => { const { printableVersion: serverVersion } = selectedServer; - const normalizedClientVersion = pipe(versionToSemVer(), versionToPrintable)(clientVersion); + const normalizedClientVersion = normalizeVersion(clientVersion); return ( - Client: {normalizedClientVersion} - Server: {serverVersion} + Client: - + Server: ); }; diff --git a/test/common/ShlinkVersions.test.js b/test/common/ShlinkVersions.test.js index 685158b0..020f50dd 100644 --- a/test/common/ShlinkVersions.test.js +++ b/test/common/ShlinkVersions.test.js @@ -13,14 +13,20 @@ describe('', () => { afterEach(() => wrapper && wrapper.unmount()); it.each([ - [ '1.2.3', 'foo', 'Client: v1.2.3 - Server: foo' ], - [ 'foo', '1.2.3', 'Client: latest - Server: 1.2.3' ], - [ 'latest', 'latest', 'Client: latest - Server: latest' ], - [ '5.5.0', '0.2.8', 'Client: v5.5.0 - Server: 0.2.8' ], - [ 'not-semver', 'something', 'Client: latest - Server: something' ], - ])('displays expected versions', (clientVersion, printableVersion, expected) => { + [ '1.2.3', 'foo', 'v1.2.3', 'foo' ], + [ 'foo', '1.2.3', 'latest', '1.2.3' ], + [ 'latest', 'latest', 'latest', 'latest' ], + [ '5.5.0', '0.2.8', 'v5.5.0', '0.2.8' ], + [ 'not-semver', 'something', 'latest', 'something' ], + ])('displays expected versions', (clientVersion, printableVersion, expectedClientVersion, expectedServerVersion) => { const wrapper = createWrapper({ clientVersion, selectedServer: { printableVersion } }); + const links = wrapper.find('VersionLink'); + const clientLink = links.at(0); + const serverLink = links.at(1); - expect(wrapper.text()).toEqual(expected); + expect(clientLink.prop('project')).toEqual('shlink-web-client'); + expect(clientLink.prop('version')).toEqual(expectedClientVersion); + expect(serverLink.prop('project')).toEqual('shlink'); + expect(serverLink.prop('version')).toEqual(expectedServerVersion); }); });