Replace time and size with URL in history dropdown (#677) (#721)

packages/insomnia-app/app/ui/components/dropdowns/response-history-dropdown.js

@@ -2,9 +2,8 @@ import React, {PureComponent} from 'react';
 import PropTypes from 'prop-types';
 import autobind from 'autobind-decorator';
 import {Dropdown, DropdownButton, DropdownDivider, DropdownItem} from '../base/dropdown';
-import SizeTag from '../tags/size-tag';
 import StatusTag from '../tags/status-tag';
-import TimeTag from '../tags/time-tag';
+import URLTag from '../tags/url-tag';
 import PromptButton from '../base/prompt-button';
 import {trackEvent} from '../../../common/analytics';
 import KeydownBinder from '../keydown-binder';
@@ -60,8 +59,7 @@ class ResponseHistoryDropdown extends PureComponent {
           statusCode={response.statusCode}
           statusMessage={response.statusMessage || null}
         />
-        <TimeTag milliseconds={response.elapsedTime} small/>
-        <SizeTag bytesRead={response.bytesRead} bytesContent={response.bytesContent} small/>
+        <URLTag small url={response.url} />
         {!response.requestVersionId && <i className="icon fa fa-info-circle" title={message}/>}
       </DropdownItem>
     );

packages/insomnia-app/app/ui/components/tags/url-tag.js

@@ -0,0 +1,38 @@
+// @flow
+import * as React from 'react';
+import classnames from 'classnames';
+import Tooltip from '../tooltip';
+
+type Props = {
+  url: string,
+
+  // Optional
+  small?: boolean,
+  className?: string
+};
+
+class URLTag extends React.PureComponent<Props> {
+  render () {
+    const {
+      url,
+      small,
+      className
+    } = this.props;
+
+    let shortUrl = url;
+
+    if (url.length > 40) {
+      shortUrl = url.slice(0, 37) + '...';
+    }
+
+    return (
+      <div className={classnames('tag', {'tag--small': small}, className)}>
+        <Tooltip message={url} position="bottom">
+          <strong>URL</strong> {shortUrl}
+        </Tooltip>
+      </div>
+    );
+  }
+}
+
+export default URLTag;