How to use ellipsize - 8 common examples

const songUri = `spotify:track:${track.id}`;
		const songLink = `https://open.spotify.com/track/${track.id}`;

		const copyAndNotify = url => {
			copy(url);
			notify.show('Link copied to clipboard', {type: 'success'});
		};

		if (album) {
			const albumUri = `spotify:album:${album.id}`;
			const albumLink = `https://open.spotify.com/album/${album.id}`;

			albumMenu = (
				
					<menuitem disabled="{true}">
						{trigger &amp;&amp; ellipsize(`${album.name}`, 40)}
					</menuitem>
					<menuitem>
					<menuitem> {
								  console.log(track);
								  notify.show('Sorry, feature not ready yet');
							  }}&gt;
						Browse in Soundbounce
					</menuitem>

					<menuitem> {
								  document.location = albumUri;
							  }}&gt;
						View in Spotify
					</menuitem></menuitem>

export function clean(content, $, maxLength = 200) {
  content = content.replace(/[\s\n]+/g, ' ').trim();
  return ellipsize(content, maxLength, { ellipse: '…' });
}

export function ellipsizeBreadcrumbLabel(label) {
    return ellipsize(label, 40)
}

export function sendNewCommentNotification(args) {
  const result = Joi.validate(args, SendNewCommentNotificationArgSchema);
  if (result.error) {
    throw result.error;
  }

  let subject = `New comments under "${args.opTitle}"`;
  if (args.opComment) {
    subject = `Replies to your comment "${ellipsize(
      args.opComment.content,
      20
    )}"`;
  }

  const msg = {
    to: args.opEmail,
    from: config.blog["comments-noreply-email"],
    subject,
    html: `
    <div>      
      ${
        args.opComment
          ? `<h3>New reply to your comment on <a href="${args.opUrl}">blog post</a>:</h3>` +
            renderComment(args.opComment)
          : `<h3>New reply to your post <a href="${args.opUrl}">${args.opTitle}</a></h3>`</div>

render() {
    const { job, open, colour } = this.props;
    const classes = classnames('job-item', {
      open: open,
      loading: open && !this.getLoadedState()
    });
    return <li style="{{">
      <h4>
        <div>{get(job, 'title')}</div>
        {this.renderLocation()}
        {this.renderStatus()}
      </h4>
      <div>
        <p>
          {ellipsize(get(job, 'description'), 400)}
        </p>
        <a style="{{" href="{get(job,">
          Read full description
        </a>
      </div>
    </li>;
  }
});

<menuitem>
					<menuitem> copyAndNotify(albumLink)}&gt;
						Copy Album Link
					</menuitem>
					<menuitem> copyAndNotify(albumUri)}&gt;
						Copy Spotify URI
					</menuitem>
				
			);
		}
		return (
			
				<menuitem disabled="{true}">
					<span title="{title}">{trigger &amp;&amp; ellipsize(title, 40)}</span>
				</menuitem>
				<menuitem>
				{albumMenu}
				<menuitem>
				{myPlaylists &amp;&amp; (
					
						{
							myPlaylists.map(playlist =&gt; (
								<menuitem> {
											  handleClickSaveToPlaylist(e, data);
											  notify.show(`Track added to ${playlist.name}`, {type: 'success'});
										  }}&gt;
									{ellipsize(playlist.name, 50)}
								</menuitem></menuitem></menuitem></menuitem>

myPlaylists.map(playlist => (
								<menuitem> {
											  handleClickSaveToPlaylist(e, data);
											  notify.show(`Track added to ${playlist.name}`, {type: 'success'});
										  }}&gt;
									{ellipsize(playlist.name, 50)}
								</menuitem>
							))
						}