Make links to grill render only plain a

dappforce · Mar 4, 2024 · c391091 · c391091
1 parent 5415bad
commit c391091
Show file tree

Hide file tree

Showing 3 changed files with 24 additions and 4 deletions.
diff --git a/src/components/referral/CustomLink.tsx b/src/components/referral/CustomLink.tsx
@@ -2,6 +2,11 @@ import Link, { LinkProps } from 'next/link'
 import urlJoin from 'src/utils/url-join'
 import { useReferralId } from './ReferralUrlChanger'
 
+function getCurrentUrlOrigin() {
+  if (typeof window === 'undefined') return ''
+  return window.location.origin
+}
+
 export default function CustomLink(props: React.PropsWithChildren<LinkProps>) {
   const refId = useReferralId()
   if (refId) {
@@ -12,6 +17,11 @@ export default function CustomLink(props: React.PropsWithChildren<LinkProps>) {
     }
   }
 
+  // If url starts with /c, it will be in a separate app (grill app), so need to give full url
+  if (typeof props.href === 'string' && props.href.match(/\/c(\/.*|(\?.*|#.*)?)$/)) {
+    return <a {...props} href={urlJoin(getCurrentUrlOrigin(), props.href, `?ref=${refId}`)} />
+  }
+
   return <Link {...props} />
 }
 

diff --git a/src/layout/SideMenu.tsx b/src/layout/SideMenu.tsx
@@ -8,7 +8,7 @@ import { buildAuthorizedMenu, isDivider, PageLink } from './SideMenuItems'
 import styles from './Sider.module.sass'
 
 const renderPageLink = (item: PageLink) => {
-  const { icon, openInNewTab } = item
+  const { icon, openInNewTab, toExternalLink } = item
 
   if (item.hidden) {
     return null
@@ -24,12 +24,19 @@ const renderPageLink = (item: PageLink) => {
 
   return (
     <Menu.Item className='DfMenuItem' key={item.href}>
-      <CustomLink href={item.href} passHref>
-        <a {...anchorProps}>
+      {toExternalLink ? (
+        <a {...anchorProps} href={item.href}>
           <span className='MenuItemIcon'>{icon}</span>
           <span className='MenuItemName'>{item.name}</span>
         </a>
-      </CustomLink>
+      ) : (
+        <CustomLink href={item.href} passHref>
+          <a {...anchorProps} href={item.href}>
+            <span className='MenuItemIcon'>{icon}</span>
+            <span className='MenuItemName'>{item.name}</span>
+          </a>
+        </CustomLink>
+      )}
     </Menu.Item>
   )
 }

diff --git a/src/layout/SideMenuItems.tsx b/src/layout/SideMenuItems.tsx
@@ -17,6 +17,7 @@ export type PageLink = {
   icon: React.ReactNode
   hidden?: boolean
   openInNewTab?: boolean
+  toExternalLink?: boolean
 
   // Helpers
   isNotifications?: boolean
@@ -39,6 +40,7 @@ export const buildAuthorizedMenu = (myAddress?: string): MenuItem[] => {
       name: 'Chat',
       icon: <SubIcon Icon={BiChat} />,
       href: '/c/chats',
+      toExternalLink: true,
     },
     ...(myAddress
       ? [
@@ -54,6 +56,7 @@ export const buildAuthorizedMenu = (myAddress?: string): MenuItem[] => {
       name: 'Content Staking',
       icon: <SubIcon Icon={TbCoins} />,
       href: '/c/staking',
+      toExternalLink: true,
     },
     {
       name: 'Leaderboard',