diff --git a/client/src/components/Draftail/decorators/Document.js b/client/src/components/Draftail/decorators/Document.js
index 977d890887..e3d5f02590 100644
--- a/client/src/components/Draftail/decorators/Document.js
+++ b/client/src/components/Draftail/decorators/Document.js
@@ -8,11 +8,13 @@ import TooltipEntity from '../decorators/TooltipEntity';
const Document = props => {
const { entityKey, contentState } = props;
const { url } = contentState.getEntity(entityKey).getData();
+ const filename = url.split('/')[3];
+
return (
}
- label={url}
+ label={filename}
url={url}
/>
);
diff --git a/client/src/components/Draftail/decorators/Link.js b/client/src/components/Draftail/decorators/Link.js
index 60fe054f35..83eee0f5d3 100644
--- a/client/src/components/Draftail/decorators/Link.js
+++ b/client/src/components/Draftail/decorators/Link.js
@@ -13,19 +13,15 @@ const Link = props => {
const data = contentState.getEntity(entityKey).getData();
let icon;
let label;
- let tooltipURL;
if (data.id) {
icon = 'link';
- tooltipURL = data.url;
label = data.url;
} else if (data.url.startsWith('mailto:')) {
icon = 'mail';
- tooltipURL = getEmailAddress(data.url);
- label = data.url;
+ label = getEmailAddress(data.url);
} else {
icon = 'link';
- tooltipURL = data.url;
label = getDomainName(data.url);
}
@@ -34,7 +30,7 @@ const Link = props => {
{...props}
icon={}
label={label}
- url={tooltipURL}
+ url={data.url}
/>
);
};
diff --git a/client/src/components/Draftail/decorators/TooltipEntity.js b/client/src/components/Draftail/decorators/TooltipEntity.js
index 62256143a5..4acf60723c 100644
--- a/client/src/components/Draftail/decorators/TooltipEntity.js
+++ b/client/src/components/Draftail/decorators/TooltipEntity.js
@@ -5,6 +5,15 @@ import { Icon } from 'draftail';
import Tooltip from '../Tooltip/Tooltip';
import Portal from '../../Portal/Portal';
+const shortenLabel = (label) => {
+ let shortened = label;
+ if (shortened.length > 25) {
+ shortened = `${shortened.slice(0, 20)}…`;
+ }
+
+ return shortened;
+};
+
class TooltipEntity extends Component {
constructor(props) {
super(props);
@@ -59,7 +68,7 @@ class TooltipEntity extends Component {
rel="noopener noreferrer"
className="Tooltip__link"
>
- {label}
+ {shortenLabel(label)}