mirror of
https://github.com/shlinkio/shlink-web-client.git
synced 2026-03-03 06:11:48 +00:00
Created ShortUrlsRow test
This commit is contained in:
@@ -14,7 +14,7 @@ import './ShortUrlsList.scss';
|
||||
const SORTABLE_FIELDS = {
|
||||
dateCreated: 'Created at',
|
||||
shortCode: 'Short URL',
|
||||
originalUrl: 'Long URL',
|
||||
longUrl: 'Long URL',
|
||||
visits: 'Visits',
|
||||
};
|
||||
|
||||
@@ -142,9 +142,9 @@ const ShortUrlsList = (ShortUrlsRow) => class ShortUrlsList extends React.Compon
|
||||
</th>
|
||||
<th
|
||||
className="short-urls-list__header-cell short-urls-list__header-cell--with-action"
|
||||
onClick={this.orderByColumn('originalUrl')}
|
||||
onClick={this.orderByColumn('longUrl')}
|
||||
>
|
||||
{this.renderOrderIcon('originalUrl')}
|
||||
{this.renderOrderIcon('longUrl')}
|
||||
Long URL
|
||||
</th>
|
||||
<th className="short-urls-list__header-cell">Tags</th>
|
||||
|
||||
@@ -43,7 +43,6 @@ const ShortUrlsRow = (
|
||||
|
||||
render() {
|
||||
const { shortUrl, selectedServer } = this.props;
|
||||
const completeShortUrl = !selectedServer ? shortUrl.shortCode : `${selectedServer.url}/${shortUrl.shortCode}`;
|
||||
|
||||
return (
|
||||
<tr className="short-urls-row">
|
||||
@@ -51,10 +50,10 @@ const ShortUrlsRow = (
|
||||
<Moment format="YYYY-MM-DD HH:mm">{shortUrl.dateCreated}</Moment>
|
||||
</td>
|
||||
<td className="short-urls-row__cell" data-th="Short URL: ">
|
||||
<ExternalLink href={completeShortUrl}>{completeShortUrl}</ExternalLink>
|
||||
<ExternalLink href={shortUrl.shortUrl} />
|
||||
</td>
|
||||
<td className="short-urls-row__cell short-urls-row__cell--break" data-th="Long URL: ">
|
||||
<ExternalLink href={shortUrl.originalUrl}>{shortUrl.originalUrl}</ExternalLink>
|
||||
<ExternalLink href={shortUrl.longUrl} />
|
||||
</td>
|
||||
<td className="short-urls-row__cell" data-th="Tags: ">{this.renderTags(shortUrl.tags)}</td>
|
||||
<td className="short-urls-row__cell text-md-right" data-th="Visits: ">{shortUrl.visitsCount}</td>
|
||||
@@ -66,7 +65,6 @@ const ShortUrlsRow = (
|
||||
Copied short URL!
|
||||
</small>
|
||||
<ShortUrlsRowMenu
|
||||
completeShortUrl={completeShortUrl}
|
||||
selectedServer={selectedServer}
|
||||
shortUrl={shortUrl}
|
||||
onCopyToClipboard={() => stateFlagTimeout(this.setState.bind(this), 'copiedToClipboard')}
|
||||
|
||||
@@ -20,7 +20,6 @@ import './ShortUrlsRowMenu.scss';
|
||||
|
||||
const ShortUrlsRowMenu = (DeleteShortUrlModal, EditTagsModal) => class ShortUrlsRowMenu extends React.Component {
|
||||
static propTypes = {
|
||||
completeShortUrl: PropTypes.string,
|
||||
onCopyToClipboard: PropTypes.func,
|
||||
selectedServer: serverType,
|
||||
shortUrl: shortUrlType,
|
||||
@@ -36,7 +35,8 @@ const ShortUrlsRowMenu = (DeleteShortUrlModal, EditTagsModal) => class ShortUrls
|
||||
toggle = () => this.setState(({ isOpen }) => ({ isOpen: !isOpen }));
|
||||
|
||||
render() {
|
||||
const { completeShortUrl, onCopyToClipboard, selectedServer, shortUrl } = this.props;
|
||||
const { onCopyToClipboard, selectedServer, shortUrl } = this.props;
|
||||
const completeShortUrl = shortUrl && shortUrl.shortUrl ? shortUrl.shortUrl : '';
|
||||
const serverId = selectedServer ? selectedServer.id : '';
|
||||
const toggleModal = (prop) => () => this.setState((prevState) => ({ [prop]: !prevState[prop] }));
|
||||
const toggleQrCode = toggleModal('isQrModalOpen');
|
||||
|
||||
@@ -10,9 +10,10 @@ export const LIST_SHORT_URLS = 'shlink/shortUrlsList/LIST_SHORT_URLS';
|
||||
/* eslint-enable padding-line-between-statements, newline-after-var */
|
||||
|
||||
export const shortUrlType = PropTypes.shape({
|
||||
tags: PropTypes.arrayOf(PropTypes.string),
|
||||
shortCode: PropTypes.string,
|
||||
originalUrl: PropTypes.string,
|
||||
shortUrl: PropTypes.string,
|
||||
longUrl: PropTypes.string,
|
||||
tags: PropTypes.arrayOf(PropTypes.string),
|
||||
});
|
||||
|
||||
const initialState = {
|
||||
|
||||
@@ -34,13 +34,7 @@ export function VisitsHeader({ shortUrlDetail, shortUrlVisits }) {
|
||||
Visit stats for <ExternalLink href={shortLink} />
|
||||
</h2>
|
||||
<hr />
|
||||
{shortUrl.dateCreated && (
|
||||
<div>
|
||||
Created:
|
||||
|
||||
{renderDate()}
|
||||
</div>
|
||||
)}
|
||||
<div>Created: {renderDate()}</div>
|
||||
<div>
|
||||
Long URL:
|
||||
|
||||
|
||||
Reference in New Issue
Block a user