From 30685d61021d393e0cc648a9ed65dc2a18581c3e Mon Sep 17 00:00:00 2001
From: Alexander Zinchuk <alx.zinchuk@gmail.com>
Date: Sun, 30 May 2021 20:26:23 +0300
Subject: [PATCH] More external URL safety

---
 src/components/middle/message/InlineButtons.scss |  9 +++++++++
 src/components/middle/message/InlineButtons.tsx  |  1 +
 src/components/middle/message/Photo.tsx          |  4 +++-
 src/components/middle/message/WebPage.tsx        | 12 +++++-------
 src/modules/actions/api/bots.ts                  |  2 +-
 5 files changed, 19 insertions(+), 9 deletions(-)

diff --git a/src/components/middle/message/InlineButtons.scss b/src/components/middle/message/InlineButtons.scss
index 1a3954175..4320176c9 100644
--- a/src/components/middle/message/InlineButtons.scss
+++ b/src/components/middle/message/InlineButtons.scss
@@ -46,6 +46,15 @@
     &:last-of-type {
       margin-right: 0;
     }
+
+    i {
+      font-size: 0.75rem;
+      position: absolute;
+      right: 0.125rem;
+      top: 0.125rem;
+      display: block;
+      transform: rotate(-45deg);
+    }
   }
 
   .row:first-of-type .Button {
diff --git a/src/components/middle/message/InlineButtons.tsx b/src/components/middle/message/InlineButtons.tsx
index 9466ed72f..010955041 100644
--- a/src/components/middle/message/InlineButtons.tsx
+++ b/src/components/middle/message/InlineButtons.tsx
@@ -24,6 +24,7 @@ const InlineButtons: FC<OwnProps> = ({ message, onClick }) => {
               onClick={() => onClick({ button })}
             >
               {button.text}
+              {button.type === 'url' && <i className="icon-arrow-right" />}
             </Button>
           ))}
         </div>
diff --git a/src/components/middle/message/Photo.tsx b/src/components/middle/message/Photo.tsx
index e3fcfc627..6b181a6a4 100644
--- a/src/components/middle/message/Photo.tsx
+++ b/src/components/middle/message/Photo.tsx
@@ -35,6 +35,7 @@ export type OwnProps = {
   size?: 'inline' | 'pictogram';
   shouldAffectAppendix?: boolean;
   dimensions?: IMediaDimensions & { isSmall?: boolean };
+  nonInteractive?: boolean;
   onClick?: (id: number) => void;
   onCancelUpload?: (message: ApiMessage) => void;
 };
@@ -51,6 +52,7 @@ const Photo: FC<OwnProps> = ({
   uploadProgress,
   size = 'inline',
   dimensions,
+  nonInteractive,
   shouldAffectAppendix,
   onClick,
   onCancelUpload,
@@ -117,7 +119,7 @@ const Photo: FC<OwnProps> = ({
 
   const className = buildClassName(
     'media-inner',
-    !isUploading && 'interactive',
+    !isUploading && !nonInteractive && 'interactive',
     isSmall && 'small-image',
     width === height && 'square-image',
   );
diff --git a/src/components/middle/message/WebPage.tsx b/src/components/middle/message/WebPage.tsx
index ea9a0dabd..5ceebdd85 100644
--- a/src/components/middle/message/WebPage.tsx
+++ b/src/components/middle/message/WebPage.tsx
@@ -42,12 +42,8 @@ const WebPage: FC<OwnProps> = ({
   }
 
   const handleMediaClick = useCallback(() => {
-    if (webPage && (isSquarePhoto || webPage.hasDocument)) {
-      window.open(webPage.url);
-    } else if (onMediaClick) {
-      onMediaClick();
-    }
-  }, [webPage, isSquarePhoto, onMediaClick]);
+    onMediaClick!();
+  }, [onMediaClick]);
 
   if (!webPage) {
     return undefined;
@@ -62,6 +58,7 @@ const WebPage: FC<OwnProps> = ({
     photo,
   } = webPage;
 
+  const isMediaInteractive = photo && onMediaClick && !isSquarePhoto && !webPage.hasDocument;
   const truncatedDescription = trimText(description, MAX_TEXT_LENGTH);
 
   const className = buildClassName(
@@ -82,7 +79,8 @@ const WebPage: FC<OwnProps> = ({
           observeIntersection={observeIntersection}
           shouldAutoLoad={shouldAutoLoad}
           size={isSquarePhoto ? 'pictogram' : 'inline'}
-          onClick={handleMediaClick}
+          nonInteractive={!isMediaInteractive}
+          onClick={isMediaInteractive ? handleMediaClick : undefined}
           onCancelUpload={onCancelMediaTransfer}
         />
       )}
diff --git a/src/modules/actions/api/bots.ts b/src/modules/actions/api/bots.ts
index 1b63430e3..436fda331 100644
--- a/src/modules/actions/api/bots.ts
+++ b/src/modules/actions/api/bots.ts
@@ -17,7 +17,7 @@ addReducer('clickInlineButton', (global, actions, payload) => {
       if (button.value.match(RE_TME_INVITE_LINK) || button.value.match(RE_TME_LINK)) {
         actions.openTelegramLink({ url: button.value });
       } else {
-        window.open(button.value);
+        actions.toggleSafeLinkModal({ url: button.value });
       }
       break;
     case 'callback': {