From 313faab774804c633fb0d49d2da0ceeef725087e Mon Sep 17 00:00:00 2001 From: Evan Hahn <69474926+EvanHahn-Signal@users.noreply.github.com> Date: Mon, 28 Sep 2020 18:46:31 -0500 Subject: [PATCH] Outbound link previews --- .storybook/webpack.config.js | 4 + ACKNOWLEDGMENTS.md | 47 +- js/modules/link_previews.js | 180 +-- package.json | 2 +- preload.js | 12 + protos/SignalService.proto | 3 +- protos/SignalStorage.proto | 4 +- stylesheets/_modules.scss | 42 +- test/index.html | 5 + test/modules/link_previews_test.js | 274 +--- .../conversation/LinkPreviewDate.tsx | 23 + ts/components/conversation/Message.tsx | 25 +- .../StagedLinkPreview.stories.tsx | 98 +- .../conversation/StagedLinkPreview.tsx | 22 +- ts/linkPreviews/isLinkPreviewDateValid.ts | 11 + ts/linkPreviews/linkPreviewFetch.ts | 506 ++++++++ ts/test-electron/.eslintrc.js | 11 + ts/test-electron/.gitignore | 1 + .../linkPreviews/linkPreviewFetch_test.ts | 1126 +++++++++++++++++ .../isLinkPreviewDateValid_test.ts | 41 + ts/textsecure/SendMessage.ts | 21 + ts/textsecure/WebAPI.ts | 31 + ts/util/lint/exceptions.json | 34 +- ts/views/conversation_view.ts | 242 ++-- yarn.lock | 12 + 25 files changed, 2136 insertions(+), 641 deletions(-) create mode 100644 ts/components/conversation/LinkPreviewDate.tsx create mode 100644 ts/linkPreviews/isLinkPreviewDateValid.ts create mode 100644 ts/linkPreviews/linkPreviewFetch.ts create mode 100644 ts/test-electron/.eslintrc.js create mode 100644 ts/test-electron/.gitignore create mode 100644 ts/test-electron/linkPreviews/linkPreviewFetch_test.ts create mode 100644 ts/test/linkPreviews/isLinkPreviewDateValid_test.ts diff --git a/.storybook/webpack.config.js b/.storybook/webpack.config.js index 268602c5e..9d9c3cbf9 100644 --- a/.storybook/webpack.config.js +++ b/.storybook/webpack.config.js @@ -22,5 +22,9 @@ module.exports = ({ config }) => { config.resolve.extensions = ['.tsx', '.ts', '.jsx', '.js']; + config.externals = { + net: 'net', + }; + return config; }; diff --git a/ACKNOWLEDGMENTS.md b/ACKNOWLEDGMENTS.md index 70c08b0d6..5b175a13f 100644 --- a/ACKNOWLEDGMENTS.md +++ b/ACKNOWLEDGMENTS.md @@ -42,6 +42,30 @@ Signal Desktop makes use of the following open source projects. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. +## abort-controller + + MIT License + + Copyright (c) 2017 Toru Nagashima + + Permission is hereby granted, free of charge, to any person obtaining a copy + of this software and associated documentation files (the "Software"), to deal + in the Software without restriction, including without limitation the rights + to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + copies of the Software, and to permit persons to whom the Software is + furnished to do so, subject to the following conditions: + + The above copyright notice and this permission notice shall be included in all + copies or substantial portions of the Software. + + THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + SOFTWARE. + ## array-move MIT License @@ -1145,29 +1169,6 @@ Signal Desktop makes use of the following open source projects. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. -## he - - Copyright Mathias Bynens - - Permission is hereby granted, free of charge, to any person obtaining - a copy of this software and associated documentation files (the - "Software"), to deal in the Software without restriction, including - without limitation the rights to use, copy, modify, merge, publish, - distribute, sublicense, and/or sell copies of the Software, and to - permit persons to whom the Software is furnished to do so, subject to - the following conditions: - - The above copyright notice and this permission notice shall be - included in all copies or substantial portions of the Software. - - THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, - EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF - MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND - NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE - LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION - OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION - WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. - ## history MIT License diff --git a/js/modules/link_previews.js b/js/modules/link_previews.js index 2b7b8c3f9..2eefb9ddf 100644 --- a/js/modules/link_previews.js +++ b/js/modules/link_previews.js @@ -1,23 +1,16 @@ /* global URL */ const { isNumber, compact, isEmpty } = require('lodash'); -const he = require('he'); +const { isIP } = require('net'); const nodeUrl = require('url'); const LinkifyIt = require('linkify-it'); const linkify = LinkifyIt(); -const { concatenateBytes, getViewOfArrayBuffer } = require('../../ts/Crypto'); module.exports = { - assembleChunks, findLinks, - getChunkPattern, getDomain, - getTitleMetaTag, - getImageMetaTag, isLinkSafeToPreview, - isLinkInWhitelist, - isMediaLinkInWhitelist, isLinkSneaky, isStickerPack, }; @@ -32,101 +25,10 @@ function isLinkSafeToPreview(link) { return url.protocol === 'https:' && !isLinkSneaky(link); } -const SUPPORTED_DOMAINS = [ - 'youtube.com', - 'www.youtube.com', - 'm.youtube.com', - 'youtu.be', - 'reddit.com', - 'www.reddit.com', - 'm.reddit.com', - 'imgur.com', - 'www.imgur.com', - 'm.imgur.com', - 'instagram.com', - 'www.instagram.com', - 'm.instagram.com', - 'pinterest.com', - 'www.pinterest.com', - 'pin.it', - 'signal.art', -]; - -// This function will soon be removed in favor of `isLinkSafeToPreview`. It is -// currently used because outbound-from-Desktop link previews only support a -// few domains (see the list above). We will soon remove this restriction to -// allow link previews from all domains, making this function obsolete. -function isLinkInWhitelist(link) { - try { - const url = new URL(link); - - if (url.protocol !== 'https:') { - return false; - } - - if (!url.pathname || url.pathname.length < 2) { - return false; - } - - const lowercase = url.host.toLowerCase(); - if (!SUPPORTED_DOMAINS.includes(lowercase)) { - return false; - } - - return true; - } catch (error) { - return false; - } -} - function isStickerPack(link) { return (link || '').startsWith('https://signal.art/addstickers/'); } -const SUPPORTED_MEDIA_DOMAINS = /^([^.]+\.)*(ytimg\.com|cdninstagram\.com|redd\.it|imgur\.com|fbcdn\.net|pinimg\.com)$/i; - -// This function will soon be removed. See the comment in `isLinkInWhitelist` -// for more info. -function isMediaLinkInWhitelist(link) { - try { - const url = new URL(link); - - if (url.protocol !== 'https:') { - return false; - } - - if (!url.pathname || url.pathname.length < 2) { - return false; - } - - if (!SUPPORTED_MEDIA_DOMAINS.test(url.host)) { - return false; - } - - return true; - } catch (error) { - return false; - } -} - -const META_TITLE = /]+?content="([\s\S]+?)"[^>]*>/im; -const META_IMAGE = /]+?content="([\s\S]+?)"[^>]*>/im; -function _getMetaTag(html, regularExpression) { - const match = regularExpression.exec(html); - if (match && match[1]) { - return he.decode(match[1]).trim(); - } - - return null; -} - -function getTitleMetaTag(html) { - return _getMetaTag(html, META_TITLE); -} -function getImageMetaTag(html) { - return _getMetaTag(html, META_IMAGE); -} - function findLinks(text, caretLocation) { const haveCaretLocation = isNumber(caretLocation); const textLength = text ? text.length : 0; @@ -169,81 +71,6 @@ function getDomain(url) { } } -const MB = 1024 * 1024; -const KB = 1024; - -function getChunkPattern(size, initialOffset) { - if (size > MB) { - return _getRequestPattern(size, MB, initialOffset); - } - if (size > 500 * KB) { - return _getRequestPattern(size, 500 * KB, initialOffset); - } - if (size > 100 * KB) { - return _getRequestPattern(size, 100 * KB, initialOffset); - } - if (size > 50 * KB) { - return _getRequestPattern(size, 50 * KB, initialOffset); - } - if (size > 10 * KB) { - return _getRequestPattern(size, 10 * KB, initialOffset); - } - if (size > KB) { - return _getRequestPattern(size, KB, initialOffset); - } - - return { - start: { - start: initialOffset, - end: size - 1, - }, - }; -} - -function _getRequestPattern(size, increment, initialOffset) { - const results = []; - - let offset = initialOffset || 0; - while (size - offset > increment) { - results.push({ - start: offset, - end: offset + increment - 1, - overlap: 0, - }); - offset += increment; - } - - if (size - offset > 0) { - results.push({ - start: size - increment, - end: size - 1, - overlap: increment - (size - offset), - }); - } - - return results; -} - -function assembleChunks(chunkDescriptors) { - const chunks = chunkDescriptors.map((chunk, index) => { - if (index !== chunkDescriptors.length - 1) { - return chunk.data; - } - - if (!chunk.overlap) { - return chunk.data; - } - - return getViewOfArrayBuffer( - chunk.data, - chunk.overlap, - chunk.data.byteLength - ); - }); - - return concatenateBytes(...chunks); -} - const ASCII_PATTERN = new RegExp('[\\u0020-\\u007F]', 'g'); function isLinkSneaky(link) { @@ -272,6 +99,11 @@ function isLinkSneaky(link) { return true; } + // Domain cannot be an IP address. + if (isIP(domain)) { + return true; + } + // There must be at least 2 domain labels, and none of them can be empty. const labels = domain.split('.'); if (labels.length < 2 || labels.some(isEmpty)) { diff --git a/package.json b/package.json index b17938fc0..0e9653b67 100644 --- a/package.json +++ b/package.json @@ -63,6 +63,7 @@ "dependencies": { "@journeyapps/sqlcipher": "https://github.com/scottnonnenberg-signal/node-sqlcipher.git#b10f232fac62ba7f8775c9e086bb5558fe7d948b", "@sindresorhus/is": "0.8.0", + "abort-controller": "3.0.0", "array-move": "2.1.0", "backbone": "1.3.3", "blob-util": "1.3.0", @@ -88,7 +89,6 @@ "glob": "7.1.6", "google-libphonenumber": "3.2.6", "got": "8.2.0", - "he": "1.2.0", "history": "4.9.0", "intl-tel-input": "12.1.15", "jquery": "3.5.0", diff --git a/preload.js b/preload.js index db14a01b0..7660bef8d 100644 --- a/preload.js +++ b/preload.js @@ -555,8 +555,20 @@ try { }); if (config.environment === 'test') { + // This is a hack to let us run TypeScript tests in the renderer process. See the + // code in `test/index.html`. + const pendingDescribeCalls = []; + window.describe = (...args) => { + pendingDescribeCalls.push(args); + }; + /* eslint-disable global-require, import/no-extraneous-dependencies */ + require('./ts/test-electron/linkPreviews/linkPreviewFetch_test'); + + delete window.describe; + window.test = { + pendingDescribeCalls, fastGlob: require('fast-glob'), normalizePath: require('normalize-path'), fse: require('fs-extra'), diff --git a/protos/SignalService.proto b/protos/SignalService.proto index 7598c1bed..450395915 100644 --- a/protos/SignalService.proto +++ b/protos/SignalService.proto @@ -352,8 +352,9 @@ message SyncMessage { optional bool readReceipts = 1; optional bool unidentifiedDeliveryIndicators = 2; optional bool typingIndicators = 3; - optional bool linkPreviews = 4; + // 4 is reserved optional uint32 provisioningVersion = 5; + optional bool linkPreviews = 6; } message StickerPackOperation { diff --git a/protos/SignalStorage.proto b/protos/SignalStorage.proto index 8e4db5705..9b2b8e673 100644 --- a/protos/SignalStorage.proto +++ b/protos/SignalStorage.proto @@ -98,5 +98,7 @@ message AccountRecord { optional bool readReceipts = 6; optional bool sealedSenderIndicators = 7; optional bool typingIndicators = 8; - optional bool linkPreviews = 9; + optional bool proxiedLinkPreviews = 9; + optional bool noteToSelfUnread = 10; + optional bool linkPreviews = 11; } diff --git a/stylesheets/_modules.scss b/stylesheets/_modules.scss index bf6ccf4f5..40c399cf5 100644 --- a/stylesheets/_modules.scss +++ b/stylesheets/_modules.scss @@ -5048,7 +5048,7 @@ button.module-image__border-overlay:focus { position: relative; display: flex; flex-direction: row; - align-items: flex-start; + align-items: stretch; min-height: 65px; } @@ -5073,6 +5073,8 @@ button.module-image__border-overlay:focus { margin-right: 8px; } .module-staged-link-preview__content { + display: flex; + flex-direction: column; margin-right: 20px; } .module-staged-link-preview__title { @@ -5087,14 +5089,46 @@ button.module-image__border-overlay:focus { overflow: hidden; display: -webkit-box; - -webkit-line-clamp: 2; + -webkit-line-clamp: 1; -webkit-box-orient: vertical; } +.module-staged-link-preview__description { + @include font-body-1; + + overflow: hidden; + display: -webkit-box; + -webkit-line-clamp: 1; + -webkit-box-orient: vertical; +} +.module-staged-link-preview__footer { + @include font-body-2; + + display: flex; + flex-flow: row wrap; + align-items: center; + + @include light-theme { + color: $color-gray-60; + } + @include dark-theme { + color: $color-gray-25; + } + + > *:not(:first-child) { + display: flex; + + &:before { + content: '•'; + font-size: 50%; + margin-left: 0.2rem; + margin-right: 0.2rem; + } + } +} .module-staged-link-preview__location { @include font-body-2; - margin-top: 4px; - text-transform: uppercase; + text-transform: lowercase; @include light-theme { color: $color-gray-60; diff --git a/test/index.html b/test/index.html index 78c90a5e2..5b3edb471 100644 --- a/test/index.html +++ b/test/index.html @@ -395,6 +395,11 @@ diff --git a/test/modules/link_previews_test.js b/test/modules/link_previews_test.js index 29043b154..2440f3696 100644 --- a/test/modules/link_previews_test.js +++ b/test/modules/link_previews_test.js @@ -2,12 +2,8 @@ const { assert } = require('chai'); const { findLinks, - getTitleMetaTag, - getImageMetaTag, isLinkSafeToPreview, - isLinkInWhitelist, isLinkSneaky, - isMediaLinkInWhitelist, } = require('../../js/modules/link_previews'); describe('Link previews', () => { @@ -41,261 +37,6 @@ describe('Link previews', () => { }); }); - describe('#isLinkInWhitelist', () => { - it('returns true for valid links', () => { - assert.strictEqual(isLinkInWhitelist('https://youtube.com/blah'), true); - assert.strictEqual( - isLinkInWhitelist('https://www.youtube.com/blah'), - true - ); - assert.strictEqual(isLinkInWhitelist('https://m.youtube.com/blah'), true); - assert.strictEqual(isLinkInWhitelist('https://youtu.be/blah'), true); - assert.strictEqual(isLinkInWhitelist('https://reddit.com/blah'), true); - assert.strictEqual( - isLinkInWhitelist('https://www.reddit.com/blah'), - true - ); - assert.strictEqual(isLinkInWhitelist('https://m.reddit.com/blah'), true); - assert.strictEqual(isLinkInWhitelist('https://imgur.com/blah'), true); - assert.strictEqual(isLinkInWhitelist('https://www.imgur.com/blah'), true); - assert.strictEqual(isLinkInWhitelist('https://m.imgur.com/blah'), true); - assert.strictEqual(isLinkInWhitelist('https://instagram.com/blah'), true); - assert.strictEqual( - isLinkInWhitelist('https://www.instagram.com/blah'), - true - ); - assert.strictEqual( - isLinkInWhitelist('https://m.instagram.com/blah'), - true - ); - assert.strictEqual(isLinkInWhitelist('https://pinterest.com/blah'), true); - assert.strictEqual( - isLinkInWhitelist('https://www.pinterest.com/blah'), - true - ); - assert.strictEqual(isLinkInWhitelist('https://pin.it/blah'), true); - }); - - it('returns false for subdomains', () => { - assert.strictEqual( - isLinkInWhitelist('https://any.subdomain.youtube.com/blah'), - false - ); - assert.strictEqual( - isLinkInWhitelist('https://any.subdomain.instagram.com/blah'), - false - ); - }); - - it('returns false for http links', () => { - assert.strictEqual(isLinkInWhitelist('http://instagram.com/blah'), false); - assert.strictEqual(isLinkInWhitelist('http://youtube.com/blah'), false); - }); - - it('returns false for links with no protocol', () => { - assert.strictEqual(isLinkInWhitelist('instagram.com/blah'), false); - assert.strictEqual(isLinkInWhitelist('youtube.com/blah'), false); - }); - - it('returns false for link to root path', () => { - assert.strictEqual(isLinkInWhitelist('https://instagram.com'), false); - assert.strictEqual(isLinkInWhitelist('https://youtube.com'), false); - - assert.strictEqual(isLinkInWhitelist('https://instagram.com/'), false); - assert.strictEqual(isLinkInWhitelist('https://youtube.com/'), false); - }); - - it('returns false for other well-known sites', () => { - assert.strictEqual(isLinkInWhitelist('https://facebook.com/blah'), false); - assert.strictEqual(isLinkInWhitelist('https://twitter.com/blah'), false); - }); - - it('returns false for links that look like our target links', () => { - assert.strictEqual( - isLinkInWhitelist('https://evil.site.com/.instagram.com/blah'), - false - ); - assert.strictEqual( - isLinkInWhitelist('https://evil.site.com/.instagram.com/blah'), - false - ); - assert.strictEqual( - isLinkInWhitelist('https://sinstagram.com/blah'), - false - ); - }); - }); - - describe('#isMediaLinkInWhitelist', () => { - it('returns true for valid links', () => { - assert.strictEqual( - isMediaLinkInWhitelist( - 'https://i.ytimg.com/vi/bZHShcCEH3I/hqdefault.jpg' - ), - true - ); - assert.strictEqual( - isMediaLinkInWhitelist('https://random.cdninstagram.com/blah'), - true - ); - assert.strictEqual( - isMediaLinkInWhitelist('https://preview.redd.it/something'), - true - ); - assert.strictEqual( - isMediaLinkInWhitelist('https://i.imgur.com/something'), - true - ); - assert.strictEqual( - isMediaLinkInWhitelist('https://pinimg.com/something'), - true - ); - }); - - it('returns false for insecure protocol', () => { - assert.strictEqual( - isMediaLinkInWhitelist( - 'http://i.ytimg.com/vi/bZHShcCEH3I/hqdefault.jpg' - ), - false - ); - assert.strictEqual( - isMediaLinkInWhitelist('http://random.cdninstagram.com/blah'), - false - ); - assert.strictEqual( - isMediaLinkInWhitelist('http://preview.redd.it/something'), - false - ); - assert.strictEqual( - isMediaLinkInWhitelist('http://i.imgur.com/something'), - false - ); - assert.strictEqual( - isMediaLinkInWhitelist('http://pinimg.com/something'), - false - ); - }); - - it('returns false for other domains', () => { - assert.strictEqual( - isMediaLinkInWhitelist('https://www.youtube.com/something'), - false - ); - assert.strictEqual( - isMediaLinkInWhitelist('https://youtu.be/something'), - false - ); - assert.strictEqual( - isMediaLinkInWhitelist('https://www.instagram.com/something'), - false - ); - assert.strictEqual( - isMediaLinkInWhitelist('https://cnn.com/something'), - false - ); - }); - }); - - describe('#_getMetaTag', () => { - it('returns html-decoded tag contents from Youtube', () => { - const youtube = ` - - - - - - `; - - assert.strictEqual( - 'Randomness is Random - Numberphile', - getTitleMetaTag(youtube) - ); - assert.strictEqual( - 'https://i.ytimg.com/vi/tP-Ipsat90c/maxresdefault.jpg', - getImageMetaTag(youtube) - ); - }); - - it('returns html-decoded tag contents from Instagram', () => { - const instagram = ` - - - - - - - `; - - assert.strictEqual( - 'Walter "MFPallytime" on Instagram: “Lol gg”', - getTitleMetaTag(instagram) - ); - assert.strictEqual( - 'https://scontent-lax3-1.cdninstagram.com/vp/1c69aa381c2201720c29a6c28de42ffd/5CD49B5B/t51.2885-15/e35/47690175_2275988962411653_1145978227188801192_n.jpg?_nc_ht=scontent-lax3-1.cdninstagram.com', - getImageMetaTag(instagram) - ); - }); - - it('returns html-decoded tag contents from Imgur', () => { - const imgur = ` - - - - - - - - - `; - - assert.strictEqual('', getTitleMetaTag(imgur)); - assert.strictEqual( - 'https://i.imgur.com/Y3wjlwY.jpg?fb', - getImageMetaTag(imgur) - ); - }); - - it('returns html-decoded tag contents from Pinterest', () => { - const pinterest = ` - - - - - - - `; - - assert.strictEqual( - 'Inexpensive Landscaping Ideas', - getTitleMetaTag(pinterest) - ); - assert.strictEqual( - 'https://i.pinimg.com/736x/9a/9e/64/9a9e64ed6b42b0a0e480dded4579d940--yard-sale-mulches.jpg', - getImageMetaTag(pinterest) - ); - }); - - it('returns only the first tag', () => { - const html = ` - - `; - - assert.strictEqual('First Second Third', getTitleMetaTag(html)); - }); - - it('handles a newline in attribute value', () => { - const html = ` - - `; - - assert.strictEqual( - 'First thing\r\nSecond thing\nThird thing', - getTitleMetaTag(html) - ); - }); - }); - describe('#findLinks', () => { it('returns all links if no caretLocation is provided', () => { const text = @@ -434,6 +175,21 @@ describe('Link previews', () => { assert.isTrue(isLinkSneaky('https://localhost:3000')); }); + it('returns true if the domain is an IPv4 address', () => { + assert.isTrue(isLinkSneaky('https://127.0.0.1/path')); + assert.isTrue(isLinkSneaky('https://127.0.0.1:1234/path')); + assert.isTrue(isLinkSneaky('https://13.249.138.50/path')); + assert.isTrue(isLinkSneaky('https://13.249.138.50:1234/path')); + }); + + it('returns true if the domain is an IPv6 address', () => { + assert.isTrue( + isLinkSneaky('https://[2001:0db8:85a3:0000:0000:8a2e:0370:7334]/path') + ); + assert.isTrue(isLinkSneaky('https://[2001::]/path')); + assert.isTrue(isLinkSneaky('https://[::]/path')); + }); + it('returns true if the domain has any empty labels', () => { assert.isTrue(isLinkSneaky('https://example.')); assert.isTrue(isLinkSneaky('https://example.com.')); diff --git a/ts/components/conversation/LinkPreviewDate.tsx b/ts/components/conversation/LinkPreviewDate.tsx new file mode 100644 index 000000000..e9fcd94c9 --- /dev/null +++ b/ts/components/conversation/LinkPreviewDate.tsx @@ -0,0 +1,23 @@ +import * as React from 'react'; +import moment, { Moment } from 'moment'; +import { isLinkPreviewDateValid } from '../../linkPreviews/isLinkPreviewDateValid'; + +interface Props { + date: null | number; + className?: string; +} + +export const LinkPreviewDate: React.FC = ({ + date, + className = '', +}: Props) => { + const dateMoment: Moment | null = isLinkPreviewDateValid(date) + ? moment(date) + : null; + + return dateMoment ? ( + + ) : null; +}; diff --git a/ts/components/conversation/Message.tsx b/ts/components/conversation/Message.tsx index f36a590b7..70b6b54a3 100644 --- a/ts/components/conversation/Message.tsx +++ b/ts/components/conversation/Message.tsx @@ -5,7 +5,6 @@ import Measure from 'react-measure'; import { drop, groupBy, orderBy, take } from 'lodash'; import { ContextMenu, ContextMenuTrigger, MenuItem } from 'react-contextmenu'; import { Manager, Popper, Reference } from 'react-popper'; -import moment, { Moment } from 'moment'; import { Avatar } from '../Avatar'; import { Spinner } from '../Spinner'; @@ -23,6 +22,7 @@ import { } from './ReactionViewer'; import { Props as ReactionPickerProps, ReactionPicker } from './ReactionPicker'; import { Emoji } from '../emoji/Emoji'; +import { LinkPreviewDate } from './LinkPreviewDate'; import { AttachmentType, @@ -51,10 +51,8 @@ interface Trigger { // Same as MIN_WIDTH in ImageGrid.tsx const MINIMUM_LINK_PREVIEW_IMAGE_WIDTH = 200; -const MINIMUM_LINK_PREVIEW_DATE = new Date(1990, 0, 1).valueOf(); const STICKER_SIZE = 200; const SELECTED_TIMEOUT = 1000; -const ONE_DAY = 24 * 60 * 60 * 1000; interface LinkPreviewType { title: string; @@ -804,14 +802,7 @@ export class Message extends React.PureComponent { width && width >= MINIMUM_LINK_PREVIEW_IMAGE_WIDTH; - // Don't show old dates or dates too far in the future. This is predicated on the - // idea that showing an invalid dates is worse than hiding valid ones. - const maximumLinkPreviewDate = Date.now() + ONE_DAY; - const isDateValid: boolean = - typeof first.date === 'number' && - first.date > MINIMUM_LINK_PREVIEW_DATE && - first.date < maximumLinkPreviewDate; - const dateMoment: Moment | null = isDateValid ? moment(first.date) : null; + const linkPreviewDate = first.date || null; return (