From 69a978468cc9233d51497505433831a66b635dd5 Mon Sep 17 00:00:00 2001
From: Vincenzo Scamporlino <vincenzos@spotify.com>
Date: Thu, 19 Mar 2026 12:02:21 +0100
Subject: [PATCH] fix for raw diff button

Signed-off-by: Vincenzo Scamporlino <vincenzos@spotify.com>
---
 src/components/common/CopyFileButton.tsx     | 13 +++++++++----
 src/components/common/DownloadFileButton.tsx |  9 +++++++--
 src/components/common/RawDiffLinkButton.js   |  8 +++++++-
 src/components/common/ViewFileButton.tsx     |  9 +++++++--
 src/utils.ts                                 |  5 +++--
 5 files changed, 33 insertions(+), 11 deletions(-)

diff --git a/src/components/common/CopyFileButton.tsx b/src/components/common/CopyFileButton.tsx
index d49e3d54..8a90485b 100644
--- a/src/components/common/CopyFileButton.tsx
+++ b/src/components/common/CopyFileButton.tsx
@@ -2,8 +2,9 @@ import React, { useState } from 'react'
 import styled from '@emotion/styled'
 import { Button, Popover } from 'antd'
 import type { ButtonProps } from 'antd'
-import { getBinaryFileURL } from '../../utils'
+import { getBinaryFileURL, USE_YARN_PLUGIN } from '../../utils'
 import { CopyOutlined } from '@ant-design/icons'
+import { useSettings } from '../../SettingsProvider'
 
 const popoverContentOpts = {
   default: 'Copy raw contents',
@@ -33,10 +34,14 @@ const CopyFileButton = styled(
       popoverContentOpts.default
     )
 
+    const {
+      settings: { [USE_YARN_PLUGIN]: useYarnPlugin },
+    } = useSettings()
+
     const fetchContent = () =>
-      fetch(getBinaryFileURL({ packageName, version, path })).then((response) =>
-        response.text()
-      )
+      fetch(
+        getBinaryFileURL({ packageName, version, path, useYarnPlugin })
+      ).then((response) => response.text())
     // .then((content) => replaceAppDetails(content, appName, appPackage))
 
     const copyContent = () => {
diff --git a/src/components/common/DownloadFileButton.tsx b/src/components/common/DownloadFileButton.tsx
index 508498f4..98746c74 100644
--- a/src/components/common/DownloadFileButton.tsx
+++ b/src/components/common/DownloadFileButton.tsx
@@ -1,7 +1,8 @@
 import React from 'react'
 import { Button, ButtonProps } from 'antd'
 import { DownloadOutlined } from '@ant-design/icons'
-import { getBinaryFileURL } from '../../utils'
+import { getBinaryFileURL, USE_YARN_PLUGIN } from '../../utils'
+import { useSettings } from '../../SettingsProvider'
 
 interface DownloadFileButtonProps extends ButtonProps {
   open: boolean
@@ -16,13 +17,17 @@ const DownloadFileButton = ({
   packageName,
   ...props
 }: DownloadFileButtonProps) => {
+  const {
+    settings: { [USE_YARN_PLUGIN]: useYarnPlugin },
+  } = useSettings()
+
   return open ? (
     <Button
       {...props}
       shape="circle"
       icon={<DownloadOutlined />}
       target="_blank"
-      href={getBinaryFileURL({ packageName, version, path })}
+      href={getBinaryFileURL({ packageName, version, path, useYarnPlugin })}
     />
   ) : null
 }
diff --git a/src/components/common/RawDiffLinkButton.js b/src/components/common/RawDiffLinkButton.js
index 216f9b8f..b5b20d3b 100644
--- a/src/components/common/RawDiffLinkButton.js
+++ b/src/components/common/RawDiffLinkButton.js
@@ -1,7 +1,8 @@
 import React from 'react'
 import styled from '@emotion/styled'
 import { Button as AntdButton } from 'antd'
-import { getDiffURL } from '../../utils'
+import { getDiffURL, USE_YARN_PLUGIN } from '../../utils'
+import { useSettings } from '../../SettingsProvider'
 
 const Container = styled.div`
   display: flex;
@@ -23,6 +24,10 @@ const RawDiffLinkButton = ({
   fromVersion,
   toVersion,
 }) => {
+  const {
+    settings: { [USE_YARN_PLUGIN]: useYarnPlugin },
+  } = useSettings()
+
   if (fromVersion === '') {
     return null
   }
@@ -31,6 +36,7 @@ const RawDiffLinkButton = ({
     language,
     fromVersion,
     toVersion,
+    useYarnPlugin,
   })
   return (
     <Container>
diff --git a/src/components/common/ViewFileButton.tsx b/src/components/common/ViewFileButton.tsx
index 732ee121..20a9730f 100644
--- a/src/components/common/ViewFileButton.tsx
+++ b/src/components/common/ViewFileButton.tsx
@@ -1,7 +1,8 @@
 import React from 'react'
 import styled from '@emotion/styled'
 import { Button, ButtonProps } from 'antd'
-import { getBinaryFileURL } from '../../utils'
+import { getBinaryFileURL, USE_YARN_PLUGIN } from '../../utils'
+import { useSettings } from '../../SettingsProvider'
 
 interface ViewFileButtonProps extends ButtonProps {
   open: boolean
@@ -15,12 +16,16 @@ const ViewFileButton = styled(
       return null
     }
 
+    const {
+      settings: { [USE_YARN_PLUGIN]: useYarnPlugin },
+    } = useSettings()
+
     return (
       <Button
         {...props}
         target="_blank"
         size="small"
-        href={getBinaryFileURL({ packageName, version, path })}
+        href={getBinaryFileURL({ packageName, version, path, useYarnPlugin })}
       >
         Raw
       </Button>
diff --git a/src/utils.ts b/src/utils.ts
index e0d97305..24d5d029 100644
--- a/src/utils.ts
+++ b/src/utils.ts
@@ -92,12 +92,13 @@ export const getBinaryFileURL = ({
   language,
   version,
   path,
-}: GetBinaryFileURLProps) => {
+  useYarnPlugin,
+}: GetBinaryFileURLProps & { useYarnPlugin: boolean }) => {
   const branch = getBranch({ packageName, language, version })
 
   return `https://raw.githubusercontent.com/${getRNDiffRepository({
     packageName,
-  })}/release/${branch}/${path}`
+  })}/release/${useYarnPlugin ? 'yarn-plugin/' : ''}${branch}/${path}`
 }
 
 export const removeAppPathPrefix = (path: string, appName = DEFAULT_APP_NAME) =>