From 4c7836abc75d734078ed29bb791408c5755e4123 Mon Sep 17 00:00:00 2001
From: Sinclair Chen <abc.sinclair@gmail.com>
Date: Thu, 19 May 2022 17:34:08 -0700
Subject: [PATCH] Show embed view of normal market links in iframes (#254)

---
 web/hooks/use-is-iframe.ts              | 15 +++++++++++++++
 web/pages/[username]/[contractSlug].tsx |  7 +++++++
 2 files changed, 22 insertions(+)
 create mode 100644 web/hooks/use-is-iframe.ts

diff --git a/web/hooks/use-is-iframe.ts b/web/hooks/use-is-iframe.ts
new file mode 100644
index 00000000..2ce7eda3
--- /dev/null
+++ b/web/hooks/use-is-iframe.ts
@@ -0,0 +1,15 @@
+import { useEffect, useState } from 'react'
+
+function inIframe() {
+  try {
+    return window.self !== window.top
+  } catch (e) {
+    return true
+  }
+}
+
+export function useIsIframe() {
+  const [is, setIs] = useState(false)
+  useEffect(() => setIs(inIframe()), []) // useEffect so this happens client side
+  return is
+}
diff --git a/web/pages/[username]/[contractSlug].tsx b/web/pages/[username]/[contractSlug].tsx
index efe0e149..31295b62 100644
--- a/web/pages/[username]/[contractSlug].tsx
+++ b/web/pages/[username]/[contractSlug].tsx
@@ -44,6 +44,8 @@ import { NumericBetPanel } from '../../components/numeric-bet-panel'
 import { NumericResolutionPanel } from '../../components/numeric-resolution-panel'
 import { FeedComment } from 'web/components/feed/feed-comments'
 import { FeedBet } from 'web/components/feed/feed-bets'
+import { useIsIframe } from 'web/hooks/use-is-iframe'
+import ContractEmbedPage from '../embed/[username]/[contractSlug]'
 
 export const getStaticProps = fromPropz(getStaticPropz)
 export async function getStaticPropz(props: {
@@ -113,6 +115,11 @@ export function ContractPageContent(props: FirstArgument<typeof ContractPage>) {
     setShowConfetti(shouldSeeConfetti)
   }, [contract, user])
 
+  const inIframe = useIsIframe()
+  if (inIframe) {
+    return <ContractEmbedPage {...props} />
+  }
+
   // Sort for now to see if bug is fixed.
   comments.sort((c1, c2) => c1.createdTime - c2.createdTime)
   bets.sort((bet1, bet2) => bet1.createdTime - bet2.createdTime)