Add paragraphs and bugfix

src/embed/status.ts

@@ -75,7 +75,7 @@ export const handleStatus = async (
   }
 
   /* Catch direct media request (d.fxtwitter.com, or .mp4 / .jpg) */
-  if (flags?.direct && tweet.media) {
+  if (flags?.direct && !flags?.textOnly && tweet.media) {
     let redirectUrl: string | null = null;
     const all = tweet.media.all || [];
     // if (tweet.media.videos) {
@@ -98,16 +98,6 @@ export const handleStatus = async (
     }
   }
 
-  /* Use quote media if there is no media in this Tweet */
-  if (!tweet.media && tweet.quote?.media) {
-    tweet.media = tweet.quote.media;
-    tweet.twitter_card = tweet.quote.twitter_card;
-  }
-
-  if (flags?.textOnly) {
-    tweet.media = undefined;
-  }
-
   /* At this point, we know we're going to have to create a
      regular embed because it's not an API or direct media request */
 
@@ -121,7 +111,9 @@ export const handleStatus = async (
   const headers = [
     `<link rel="canonical" href="https://twitter.com/${tweet.author.screen_name}/status/${tweet.id}"/>`,
     `<meta property="theme-color" content="${tweet.color}"/>`,
-    `<meta property="twitter:card" content="${tweet.twitter_card}"/>`,
+    `<meta property="twitter:card" content="${
+      tweet.quote?.twitter_card || tweet.twitter_card
+    }"/>`,
     `<meta property="twitter:site" content="@${tweet.author.screen_name}"/>`,
     `<meta property="twitter:creator" content="@${tweet.author.screen_name}"/>`,
     `<meta property="twitter:title" content="${tweet.author.name} (@${tweet.author.screen_name})"/>`
@@ -165,6 +157,8 @@ export const handleStatus = async (
 
   console.log('overrideMedia', JSON.stringify(overrideMedia));
 
+  if (!flags?.textOnly) {
+    const media = tweet.media || tweet.quote?.media;
     if (overrideMedia) {
       let instructions: ResponseInstructions;
 
@@ -204,7 +198,7 @@ export const handleStatus = async (
           /* This Tweet has a video to render. */
           break;
       }
-  } else if (tweet.media?.mosaic) {
+    } else if (media?.mosaic) {
       const instructions = renderPhoto(
         {
           tweet: tweet,
@@ -212,13 +206,13 @@ export const handleStatus = async (
           engagementText: engagementText,
           userAgent: userAgent
         },
-      tweet.media?.mosaic
+        media.mosaic
       );
       headers.push(...instructions.addHeaders);
-  } else if (tweet.media?.videos) {
+    } else if (media?.videos) {
       const instructions = renderVideo(
         { tweet: tweet, userAgent: userAgent, text: newText },
-      tweet.media?.videos[0]
+        media.videos[0]
       );
       headers.push(...instructions.addHeaders);
       if (instructions.authorText) {
@@ -227,7 +221,7 @@ export const handleStatus = async (
       if (instructions.siteName) {
         siteName = instructions.siteName;
       }
-  } else if (tweet.media?.photos) {
+    } else if (media?.photos) {
       const instructions = renderPhoto(
         {
           tweet: tweet,
@@ -235,11 +229,11 @@ export const handleStatus = async (
           engagementText: engagementText,
           userAgent: userAgent
         },
-      tweet.media?.photos[0]
+        media.photos[0]
       );
       headers.push(...instructions.addHeaders);
-  } else if (tweet.media?.external) {
+    } else if (media?.external) {
-    const { external } = tweet.media;
+      const { external } = media;
       authorText = newText || '';
       headers.push(
         `<meta property="twitter:player" content="${external.url}">`,
@@ -252,6 +246,7 @@ export const handleStatus = async (
         `<meta property="og:video:height" content="${external.height}">`
       );
     }
+  }
 
   /* This Tweet contains a poll, so we'll render it */
   if (tweet.poll) {
@@ -292,7 +287,13 @@ export const handleStatus = async (
   }
 
   /* If we have no media to display, instead we'll display the user profile picture in the embed */
-  if (!tweet.media?.videos && !tweet.media?.photos && !flags?.textOnly) {
+  if (
+    !tweet.media?.videos &&
+    !tweet.media?.photos &&
+    !tweet.quote?.media?.photos &&
+    !tweet.quote?.media?.videos &&
+    !flags?.textOnly
+  ) {
     /* Use a slightly higher resolution image for profile pics */
     const avatar = tweet.author.avatar_url;
     if (!useIV) {

src/render/instantview.ts

@@ -58,34 +58,50 @@ const htmlifyHashtags = (input: string): string => {
   });
 };
 
+function paragraphify(text: string, isQuote = false): string {
+  const tag = isQuote ? 'blockquote' : 'p';
+  return text
+    .split('\n')
+    .map(line => line.trim())
+    .filter(line => line.length > 0)
+    .map(line => `<${tag}>${line}</${tag}>`)
+    .join('\n');
+}
+
 /* TODO: maybe refactor so all tweets pull from this */
 const generateTweet = (tweet: APITweet, isQuote = false): string => {
-  let text = sanitizeText(tweet.text).replace(/\n/g, '<br>');
+  let text = paragraphify(sanitizeText(tweet.text));
   text = htmlifyLinks(text);
   text = htmlifyHashtags(text);
   text = populateUserLinks(tweet, text);
 
   return `
   <!-- Embed profile picture, display name, and screen name in table -->
-  ${!isQuote ? `<table>
+  ${
+    !isQuote
+      ? `<table>
     <img src="${tweet.author.avatar_url}" alt="${tweet.author.name}'s profile picture" />
     <h2>${tweet.author.name}</h2>
     <p>@${tweet.author.screen_name}</p>
     <p>${getSocialTextIV(tweet)}</p>
-  </table>` : ''}
+  </table>`
-  ${isQuote ? `
+      : ''
+  }
+  ${
+    isQuote
+      ? `
     <h4>Quoting <a href="${Constants.TWITTER_ROOT}/${tweet.author.screen_name}">${tweet.author.name}</a> (@${tweet.author.screen_name})</h4>
-  ` : ''}
+  `
+      : ''
+  }
 
   <!-- Embed Tweet text -->
-  ${isQuote ? '<blockquote>' : ''}
   ${text}
-  ${isQuote ? '</blockquote>' : ''}
   ${generateTweetMedia(tweet)} 
-  ${(!isQuote && tweet.quote) ? generateTweet(tweet.quote, true) : ''}
+  ${!isQuote && tweet.quote ? generateTweet(tweet.quote, true) : ''}
-  <br>${(!isQuote ? `<a href="${tweet.url}">View original</a>` : '')}
+  <br>${!isQuote ? `<a href="${tweet.url}">View original</a>` : ''}
-  `
+  `;
-}
+};
 
 export const renderInstantView = (properties: RenderProperties): ResponseInstructions => {
   console.log('Generating Instant View...');