about summary refs log tree commit diff
path: root/bskyembed/src/screens/post.tsx
diff options
context:
space:
mode:
authorSamuel Newman <mozzius@protonmail.com>2024-04-13 03:58:40 +0100
committerGitHub <noreply@github.com>2024-04-13 03:58:40 +0100
commit4b3ec5573241b9c71504dfd0bd5f181cbde19a49 (patch)
tree698c2463b389cdf6e14536610e8f96f200ddaaa3 /bskyembed/src/screens/post.tsx
parent8e29b1f63309ef9ac2da21f62e03b66d477244e9 (diff)
downloadvoidsky-4b3ec5573241b9c71504dfd0bd5f181cbde19a49.tar.zst
[Embeds] Embed subdomain landing page (#3501)
* add build output to web build

* simplify post-build step by copying everything at once

* make script that converts placeholder -> iframe

* dynamically resize iframe based on inner content

Requires the iframe content to `postMessage` its height back up to the parent

* add lang to embed

* svg explicit height -> viewBox

* add build output to web build

* simplify post-build step by copying everything at once

* attempt to fix go embed issue

* rm changes to bskyweb

* remove another bskyweb change

* embed landing page

* Drop xl breakpoint, too far down

* Remove pointer enter behavior

* Avoid button width jump

* Escape HTML

---------

Co-authored-by: Dan Abramov <dan.abramov@gmail.com>
Diffstat (limited to 'bskyembed/src/screens/post.tsx')
-rw-r--r--bskyembed/src/screens/post.tsx88
1 files changed, 88 insertions, 0 deletions
diff --git a/bskyembed/src/screens/post.tsx b/bskyembed/src/screens/post.tsx
new file mode 100644
index 000000000..76c921540
--- /dev/null
+++ b/bskyembed/src/screens/post.tsx
@@ -0,0 +1,88 @@
+import '../index.css'
+
+import {AppBskyFeedDefs, BskyAgent} from '@atproto/api'
+import {h, render} from 'preact'
+
+import logo from '../../assets/logo.svg'
+import {Container} from '../components/container'
+import {Link} from '../components/link'
+import {Post} from '../components/post'
+import {getRkey} from '../utils'
+
+const root = document.getElementById('app')
+if (!root) throw new Error('No root element')
+
+const agent = new BskyAgent({
+  service: 'https://public.api.bsky.app',
+})
+
+const uri = `at://${window.location.pathname.slice('/embed/'.length)}`
+
+console.log(uri)
+
+if (!uri) {
+  throw new Error('No uri in path')
+}
+
+agent
+  .getPostThread({
+    uri,
+    depth: 0,
+    parentHeight: 0,
+  })
+  .then(({data}) => {
+    if (!AppBskyFeedDefs.isThreadViewPost(data.thread)) {
+      throw new Error('Expected a ThreadViewPost')
+    }
+    const pwiOptOut = !!data.thread.post.author.labels?.find(
+      label => label.val === '!no-unauthenticated',
+    )
+    if (pwiOptOut) {
+      render(<PwiOptOut thread={data.thread} />, root)
+    } else {
+      render(<Post thread={data.thread} />, root)
+    }
+  })
+  .catch(err => {
+    console.error(err)
+    render(<ErrorMessage />, root)
+  })
+
+function PwiOptOut({thread}: {thread: AppBskyFeedDefs.ThreadViewPost}) {
+  const href = `/profile/${thread.post.author.did}/post/${getRkey(thread.post)}`
+  return (
+    <Container href={href}>
+      <Link
+        href={href}
+        className="transition-transform hover:scale-110 absolute top-4 right-4">
+        <img src={logo as string} className="h-6" />
+      </Link>
+      <div className="w-full py-12 gap-4 flex flex-col items-center">
+        <p className="max-w-80 text-center w-full text-textLight">
+          The author of this post has requested their posts not be displayed on
+          external sites.
+        </p>
+        <Link
+          href={href}
+          className="max-w-80 rounded-lg bg-brand text-white color-white text-center py-1 px-4 w-full mx-auto">
+          View on Bluesky
+        </Link>
+      </div>
+    </Container>
+  )
+}
+
+function ErrorMessage() {
+  return (
+    <Container href="https://bsky.app/">
+      <Link
+        href="https://bsky.app/"
+        className="transition-transform hover:scale-110 absolute top-4 right-4">
+        <img src={logo as string} className="h-6" />
+      </Link>
+      <p className="my-16 text-center w-full text-textLight">
+        Post not found, it may have been deleted.
+      </p>
+    </Container>
+  )
+}