From 4895ded8b5120c4fc52b43ae85c9a01ea0b1a733 Mon Sep 17 00:00:00 2001 From: Hailey Date: Wed, 27 Dec 2023 22:23:54 -0800 Subject: [PATCH] Revert "remove links that can't produce a thumb" This reverts commit 985b92b4e622db936bb0c79fdf324099b9c8fcd8. --- __tests__/lib/string.test.ts | 92 ++++++++++++++++++++++++++++++++- src/lib/strings/embed-player.ts | 75 ++++++++++++++++++++++++++- 2 files changed, 165 insertions(+), 2 deletions(-) diff --git a/__tests__/lib/string.test.ts b/__tests__/lib/string.test.ts index b9a76de67d..372f4527bb 100644 --- a/__tests__/lib/string.test.ts +++ b/__tests__/lib/string.test.ts @@ -426,10 +426,34 @@ describe('parseEmbedPlayerFromUrl', () => { 'https://giphy.com/gif/some-random-gif-name-gifId', 'https://giphy.com/gifs/', + 'https://media.giphy.com/media/gifId/giphy.gif', + 'https://media0.giphy.com/media/gifId/giphy.gif', + 'https://media1.giphy.com/media/gifId/giphy.gif', + 'https://media2.giphy.com/media/gifId/giphy.gif', + 'https://media3.giphy.com/media/gifId/giphy.gif', + 'https://media4.giphy.com/media/gifId/giphy.gif', + 'https://media5.giphy.com/media/gifId/giphy.gif', + 'https://media1.google.com/media/gifId/giphy.gif', + + 'https://media.giphy.com/media/trackingId/gifId/giphy.gif', + + 'https://i.giphy.com/media/gifId/giphy.gif', + 'https://i.giphy.com/media/gifId/giphy.gif', + 'https://i.giphy.com/gifId.gif', + 'https://i.giphy.com/gifId.gif', + + 'https://media1.tenor.com/m/gifId/someName.gif', + 'https://media.tenor.com/m/gifId/someName.mp4', + 'https://media1.tenor.com/m/gifId', + 'https://tenor.com/view/gifId', 'https://tenor.com/notView/gifId', 'https://tenor.com/view', 'https://tenor.com/view/gifId.gif', + + 'https://c.tenor.com/gifId/tenor.gif', + 'https://c.tenor.com/gifId/tenor.webp', + 'https://c.tenor.com/gifId/tenor.mp4', ] const outputs = [ @@ -556,7 +580,63 @@ describe('parseEmbedPlayerFromUrl', () => { { type: 'gif', - playerUri: 'https://i.giphy.com/media/gifId/giphy.webp', + playerUri: 'https://i.giphy.com/media/gifId/giphy.gif', + }, + undefined, + undefined, + + { + type: 'gif', + playerUri: 'https://i.giphy.com/media/gifId/giphy.gif', + }, + { + type: 'gif', + playerUri: 'https://i.giphy.com/media/gifId/giphy.gif', + }, + { + type: 'gif', + playerUri: 'https://i.giphy.com/media/gifId/giphy.gif', + }, + { + type: 'gif', + playerUri: 'https://i.giphy.com/media/gifId/giphy.gif', + }, + { + type: 'gif', + playerUri: 'https://i.giphy.com/media/gifId/giphy.gif', + }, + { + type: 'gif', + playerUri: 'https://i.giphy.com/media/gifId/giphy.gif', + }, + undefined, + undefined, + + { + type: 'gif', + playerUri: 'https://i.giphy.com/media/gifId/giphy.gif', + }, + + { + type: 'gif', + playerUri: 'https://i.giphy.com/media/gifId/giphy.gif', + }, + { + type: 'gif', + playerUri: 'https://i.giphy.com/media/gifId/giphy.gif', + }, + { + type: 'gif', + playerUri: 'https://i.giphy.com/media/gifId/giphy.gif', + }, + { + type: 'gif', + playerUri: 'https://i.giphy.com/media/gifId/giphy.gif', + }, + + { + type: 'gif', + playerUri: 'https://media1.tenor.com/m/gifId/someName.gif', }, undefined, undefined, @@ -571,6 +651,16 @@ describe('parseEmbedPlayerFromUrl', () => { type: 'gif', playerUri: 'https://tenor.com/view/gifId.gif', }, + + { + type: 'gif', + playerUri: 'https://c.tenor.com/gifId/tenor.gif', + }, + { + type: 'gif', + playerUri: 'https://c.tenor.com/gifId/tenor.webp', + }, + undefined, ] it('correctly grabs the correct id from uri', () => { diff --git a/src/lib/strings/embed-player.ts b/src/lib/strings/embed-player.ts index f271f354a8..d624c75ede 100644 --- a/src/lib/strings/embed-player.ts +++ b/src/lib/strings/embed-player.ts @@ -174,23 +174,81 @@ export function parseEmbedPlayerFromUrl( if (urlp.hostname === 'giphy.com' || urlp.hostname === 'www.giphy.com') { const [_, gifs, nameAndId] = urlp.pathname.split('/') + /* * nameAndId is a string that consists of the name (dash separated) and the id of the gif (the last part of the name) * We want to get the id of the gif, then direct to media.giphy.com/media/{id}/giphy.gif so we can * use it in an component */ + if (gifs === 'gifs' && nameAndId) { const id = nameAndId.split('-').pop() if (id) { return { type: 'gif', - playerUri: `https://i.giphy.com/media/${id}/giphy.webp`, + playerUri: `https://i.giphy.com/media/${id}/giphy.gif`, } } } } + // There are five possible hostnames that also can be giphy urls: media.giphy.com and media0-4.giphy.com + // These can include (presumably) a tracking id in the path name, so we have to check for that as well + if (/media(?:[0-4]\.giphy\.com|\.giphy\.com)/gm.test(urlp.hostname)) { + // We can link directly to the gif, if its a proper link + const [_, media, trackingOrId, idOrFilename, filename] = + urlp.pathname.split('/') + + if (media === 'media') { + if (idOrFilename === 'giphy.gif' || idOrFilename === 'giphy.gif') { + return { + type: 'gif', + playerUri: `https://i.giphy.com/media/${trackingOrId}/giphy.gif`, + } + } else if (filename === 'giphy.gif' || filename === 'giphy.gif') { + return { + type: 'gif', + playerUri: `https://i.giphy.com/media/${idOrFilename}/giphy.gif`, + } + } + } + } + + // Finally, we should see if it is a link to i.giphy.com. These links don't necessarily end in .gif but can also + // be .webp + if (urlp.hostname === 'i.giphy.com' || urlp.hostname === 'www.i.giphy.com') { + const [_, mediaOrFilename, filename] = urlp.pathname.split('/') + + if (mediaOrFilename === 'media' && filename) { + return { + type: 'gif', + playerUri: `https://i.giphy.com/media/${ + filename.split('.')[0] + }/giphy.gif`, + } + } else if (mediaOrFilename) { + return { + type: 'gif', + playerUri: `https://i.giphy.com/media/${ + mediaOrFilename.split('.')[0] + }/giphy.gif`, + } + } + } + + if (urlp.hostname === 'media1.tenor.com') { + const parts = urlp.pathname.split('/') + const filename = parts[3] + + if (parts.length === 4 && filename?.split('.').pop() === 'gif') { + return { + type: 'gif', + playerUri: url, + } + } + } + if (urlp.hostname === 'tenor.com' || urlp.hostname === 'www.tenor.com') { const [_, path, filename] = urlp.pathname.split('/') @@ -203,6 +261,21 @@ export function parseEmbedPlayerFromUrl( } } } + + if (urlp.host === 'c.tenor.com') { + const [_, id, filename] = urlp.pathname.split('/') + + if (id && filename) { + const ext = filename.split('.').pop() + + if (ext === 'gif' || ext === 'webp') { + return { + type: 'gif', + playerUri: url, + } + } + } + } } export function getPlayerHeight({