about summary refs log tree commit diff
path: root/bskyembed/src/container.tsx
diff options
context:
space:
mode:
authorSamuel Newman <mozzius@protonmail.com>2024-04-13 02:07:39 +0100
committerGitHub <noreply@github.com>2024-04-13 02:07:39 +0100
commit8e29b1f63309ef9ac2da21f62e03b66d477244e9 (patch)
treed363e6f54eb6d5effdc0d6b1e68176f8025c0361 /bskyembed/src/container.tsx
parent93731e6d6bd345d8f45cd560e8185a60472cdf25 (diff)
downloadvoidsky-8e29b1f63309ef9ac2da21f62e03b66d477244e9.tar.zst
[Embeds] Embed for single post (#3450)
* add bskyembed vite app

* create build script (temp until embedr is ready)

* add build output to web build

* simplify post-build step by copying everything at once

* add simple post viewer

* add butterfly logo

* add vite plugin legacy

* proper error screen

* add image embed

* add url embed

* record embed + embedwithmedia

* add list+feed embeds

* add labeller embed (just to be safe)

* fix curatelist and modlist being the wrong way around

* Add PWI opt-out

* add favicon

* improve wording of PWI

* remove padding I used for screenshots

* add disabled state to embed

* improve PWI styles by adding an icon

* remove unused prop

* rm open proxy

* [Embeds] Add CTA and add general polish - input needed! (#3454)

* add CTA, colourful icons, and bigger logo

* make hover effect smaller + add to cta

* more responsive + preserve whitespace

* add trailing newsline to deploy script

* add repost indicator

* Make butterfly link to content

* More consistent error text wording

---------

Co-authored-by: Dan Abramov <dan.abramov@gmail.com>
Diffstat (limited to 'bskyembed/src/container.tsx')
-rw-r--r--bskyembed/src/container.tsx32
1 files changed, 32 insertions, 0 deletions
diff --git a/bskyembed/src/container.tsx b/bskyembed/src/container.tsx
new file mode 100644
index 000000000..0d120e1b7
--- /dev/null
+++ b/bskyembed/src/container.tsx
@@ -0,0 +1,32 @@
+import {ComponentChildren, h} from 'preact'
+import {useRef} from 'preact/hooks'
+
+import {Link} from './link'
+
+export function Container({
+  children,
+  href,
+}: {
+  children: ComponentChildren
+  href: string
+}) {
+  const ref = useRef<HTMLDivElement>(null)
+  return (
+    <div
+      ref={ref}
+      className="w-full bg-white hover:bg-neutral-50 relative transition-colors max-w-[550px] min-w-[300px] flex border rounded-xl px-4 pt-3 pb-2.5"
+      onClick={() => {
+        if (ref.current) {
+          // forwardRef requires preact/compat - let's keep it simple
+          // to keep the bundle size down
+          const anchor = ref.current.querySelector('a')
+          if (anchor) {
+            anchor.click()
+          }
+        }
+      }}>
+      <Link href={href} />
+      {children}
+    </div>
+  )
+}