From 06db8dd26f6b9a2ca4a96c15c6b404c6b4e38b42 Mon Sep 17 00:00:00 2001 From: bakaneko Date: Tue, 8 Aug 2023 20:42:24 +0900 Subject: [PATCH 1/5] don't render link in link; also shorten discussion urls in chat --- .../js/beatmap-discussions/renderers.tsx | 23 ++++++++++++++----- resources/js/chat/message-item.tsx | 13 +++-------- 2 files changed, 20 insertions(+), 16 deletions(-) diff --git a/resources/js/beatmap-discussions/renderers.tsx b/resources/js/beatmap-discussions/renderers.tsx index 4265bf39c9d..855d1730b24 100644 --- a/resources/js/beatmap-discussions/renderers.tsx +++ b/resources/js/beatmap-discussions/renderers.tsx @@ -14,16 +14,27 @@ export function createRenderer(ElementType: React.ElementType) { }; } -export function linkRenderer(astProps: JSX.IntrinsicElements['a']) { +export function linkRenderer(astProps: JSX.IntrinsicElements['a'], overrideShortenedUrls = true) { const props = propsFromHref(astProps.href); const href = safeReactMarkdownUrl(props.href); + const override = overrideShortenedUrls + || astProps.children instanceof Array + && astProps.children.length > 0 + && astProps.children[0] !== astProps.href; + + const content = override + ? props.children ?? astProps.children + : astProps.children; + return ( - <> - - {props.children ?? astProps.children} - - + + {({ inLink }) => ( + + {inLink ? content : {content}} + + )} + ); } diff --git a/resources/js/chat/message-item.tsx b/resources/js/chat/message-item.tsx index fb63b7b8671..6becef79baf 100644 --- a/resources/js/chat/message-item.tsx +++ b/resources/js/chat/message-item.tsx @@ -1,6 +1,7 @@ // Copyright (c) ppy Pty Ltd . Licensed under the GNU Affero General Public License v3.0. // See the LICENCE file in the repository root for full licence text. +import { linkRenderer } from 'beatmap-discussions/renderers'; import { Spinner } from 'components/spinner'; import { observer } from 'mobx-react'; import Message from 'models/chat/message'; @@ -12,22 +13,14 @@ import legacyLink from 'remark-plugins/legacy-link'; import oldLink from 'remark-plugins/old-link'; import wikiLink, { RemarkWikiLinkPlugin } from 'remark-wiki-link'; import { classWithModifiers } from 'utils/css'; -import { safeReactMarkdownUrl, wikiUrl } from 'utils/url'; +import { wikiUrl } from 'utils/url'; interface Props { message: Message; } -function linkRenderer(astProps: JSX.IntrinsicElements['a']) { - return ( - - {astProps.children} - - ); -} - const components = Object.freeze({ - a: linkRenderer, + a: (props: JSX.IntrinsicElements['a']) => linkRenderer(props, false), }); @observer From 07c5ef31533e4dc7cef68688e69d5f840bda4023 Mon Sep 17 00:00:00 2001 From: bakaneko Date: Tue, 8 Aug 2023 21:00:26 +0900 Subject: [PATCH 2/5] override existing when content is the same --- resources/js/beatmap-discussions/renderers.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/resources/js/beatmap-discussions/renderers.tsx b/resources/js/beatmap-discussions/renderers.tsx index 855d1730b24..487812eca9a 100644 --- a/resources/js/beatmap-discussions/renderers.tsx +++ b/resources/js/beatmap-discussions/renderers.tsx @@ -21,7 +21,7 @@ export function linkRenderer(astProps: JSX.IntrinsicElements['a'], overrideShort const override = overrideShortenedUrls || astProps.children instanceof Array && astProps.children.length > 0 - && astProps.children[0] !== astProps.href; + && astProps.children[0] === astProps.href; const content = override ? props.children ?? astProps.children From b09ec5434c61338a97cecdf49e65a9702e4df951 Mon Sep 17 00:00:00 2001 From: bakaneko Date: Tue, 8 Aug 2023 21:02:49 +0900 Subject: [PATCH 3/5] better param name? --- resources/js/beatmap-discussions/renderers.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/resources/js/beatmap-discussions/renderers.tsx b/resources/js/beatmap-discussions/renderers.tsx index 487812eca9a..62c3fa4ea57 100644 --- a/resources/js/beatmap-discussions/renderers.tsx +++ b/resources/js/beatmap-discussions/renderers.tsx @@ -14,11 +14,11 @@ export function createRenderer(ElementType: React.ElementType) { }; } -export function linkRenderer(astProps: JSX.IntrinsicElements['a'], overrideShortenedUrls = true) { +export function linkRenderer(astProps: JSX.IntrinsicElements['a'], alwaysShortenUrls = true) { const props = propsFromHref(astProps.href); const href = safeReactMarkdownUrl(props.href); - const override = overrideShortenedUrls + const override = alwaysShortenUrls || astProps.children instanceof Array && astProps.children.length > 0 && astProps.children[0] === astProps.href; From 16e121cc81afdf082bf8e4baf45444bdf34897ff Mon Sep 17 00:00:00 2001 From: bakaneko Date: Wed, 9 Aug 2023 18:29:40 +0900 Subject: [PATCH 4/5] move renderers --- resources/js/beatmap-discussions/discussion-message.tsx | 2 +- resources/js/beatmap-discussions/image-link.tsx | 2 +- resources/js/beatmap-discussions/plain-text-preview.tsx | 2 +- resources/js/chat/message-item.tsx | 2 +- resources/js/{beatmap-discussions => markdown}/renderers.tsx | 0 5 files changed, 4 insertions(+), 4 deletions(-) rename resources/js/{beatmap-discussions => markdown}/renderers.tsx (100%) diff --git a/resources/js/beatmap-discussions/discussion-message.tsx b/resources/js/beatmap-discussions/discussion-message.tsx index 2a00b4b9aef..9a4a67ec3f1 100644 --- a/resources/js/beatmap-discussions/discussion-message.tsx +++ b/resources/js/beatmap-discussions/discussion-message.tsx @@ -1,13 +1,13 @@ // Copyright (c) ppy Pty Ltd . Licensed under the GNU Affero General Public License v3.0. // See the LICENCE file in the repository root for full licence text. +import { createRenderer, linkRenderer, transformLinkUri } from 'markdown/renderers'; import React from 'react'; import ReactMarkdown from 'react-markdown'; import remarkBreaks from 'remark-breaks'; import autolink from 'remark-plugins/autolink'; import disableConstructs, { DisabledType } from 'remark-plugins/disable-constructs'; import ImageLink from './image-link'; -import { createRenderer, linkRenderer, transformLinkUri } from './renderers'; const components = Object.freeze({ a: linkRenderer, diff --git a/resources/js/beatmap-discussions/image-link.tsx b/resources/js/beatmap-discussions/image-link.tsx index cbf005a5baa..a4509771784 100644 --- a/resources/js/beatmap-discussions/image-link.tsx +++ b/resources/js/beatmap-discussions/image-link.tsx @@ -3,11 +3,11 @@ import { Spinner } from 'components/spinner'; import { route } from 'laroute'; +import { LinkContext } from 'markdown/renderers'; import { action, makeObservable, observable } from 'mobx'; import { observer } from 'mobx-react'; import React from 'react'; import { ReactMarkdownProps } from 'react-markdown/lib/complex-types'; -import { LinkContext } from './renderers'; type Props = ReactMarkdownProps & JSX.IntrinsicElements['img']; diff --git a/resources/js/beatmap-discussions/plain-text-preview.tsx b/resources/js/beatmap-discussions/plain-text-preview.tsx index 955e5609dc9..6c4ddd5e73a 100644 --- a/resources/js/beatmap-discussions/plain-text-preview.tsx +++ b/resources/js/beatmap-discussions/plain-text-preview.tsx @@ -1,6 +1,7 @@ // Copyright (c) ppy Pty Ltd . Licensed under the GNU Affero General Public License v3.0. // See the LICENCE file in the repository root for full licence text. +import { timestampDecorator, transformLinkUri } from 'markdown/renderers'; import React from 'react'; import ReactMarkdown from 'react-markdown'; import rehypeTruncate from 'rehype-truncate'; @@ -8,7 +9,6 @@ import autolink from 'remark-plugins/autolink'; import disableConstructs, { DisabledType } from 'remark-plugins/disable-constructs'; import { maxMessagePreviewLength, propsFromHref } from 'utils/beatmapset-discussion-helper'; import { presence } from 'utils/string'; -import { timestampDecorator, transformLinkUri } from './renderers'; const components = Object.freeze({ a: linkRenderer, diff --git a/resources/js/chat/message-item.tsx b/resources/js/chat/message-item.tsx index 6becef79baf..f965870d172 100644 --- a/resources/js/chat/message-item.tsx +++ b/resources/js/chat/message-item.tsx @@ -1,8 +1,8 @@ // Copyright (c) ppy Pty Ltd . Licensed under the GNU Affero General Public License v3.0. // See the LICENCE file in the repository root for full licence text. -import { linkRenderer } from 'beatmap-discussions/renderers'; import { Spinner } from 'components/spinner'; +import { linkRenderer } from 'markdown/renderers'; import { observer } from 'mobx-react'; import Message from 'models/chat/message'; import * as React from 'react'; diff --git a/resources/js/beatmap-discussions/renderers.tsx b/resources/js/markdown/renderers.tsx similarity index 100% rename from resources/js/beatmap-discussions/renderers.tsx rename to resources/js/markdown/renderers.tsx From 6c6b1b36feaa7fb73039a9be9219b4e384c27f40 Mon Sep 17 00:00:00 2001 From: bakaneko Date: Wed, 9 Aug 2023 22:02:24 +0900 Subject: [PATCH 5/5] use markdown link text content if available --- resources/js/chat/message-item.tsx | 2 +- resources/js/markdown/renderers.tsx | 12 ++++++------ 2 files changed, 7 insertions(+), 7 deletions(-) diff --git a/resources/js/chat/message-item.tsx b/resources/js/chat/message-item.tsx index f965870d172..54e794f64bb 100644 --- a/resources/js/chat/message-item.tsx +++ b/resources/js/chat/message-item.tsx @@ -20,7 +20,7 @@ interface Props { } const components = Object.freeze({ - a: (props: JSX.IntrinsicElements['a']) => linkRenderer(props, false), + a: linkRenderer, }); @observer diff --git a/resources/js/markdown/renderers.tsx b/resources/js/markdown/renderers.tsx index 62c3fa4ea57..75df2a51a27 100644 --- a/resources/js/markdown/renderers.tsx +++ b/resources/js/markdown/renderers.tsx @@ -14,18 +14,18 @@ export function createRenderer(ElementType: React.ElementType) { }; } -export function linkRenderer(astProps: JSX.IntrinsicElements['a'], alwaysShortenUrls = true) { +export function linkRenderer(astProps: JSX.IntrinsicElements['a']) { const props = propsFromHref(astProps.href); const href = safeReactMarkdownUrl(props.href); - const override = alwaysShortenUrls + const useLinkText = props.children == null || astProps.children instanceof Array && astProps.children.length > 0 - && astProps.children[0] === astProps.href; + && astProps.children[0] !== astProps.href; - const content = override - ? props.children ?? astProps.children - : astProps.children; + const content = useLinkText + ? astProps.children + : props.children; return (