From 60bc0f4fb5edd494ea9311711a84733ae65115a8 Mon Sep 17 00:00:00 2001
From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com>
Date: Tue, 21 Apr 2026 12:11:06 +0000
Subject: [PATCH 1/2] Initial plan


From 7d773d2079b48572f602434c44678745935f6c5f Mon Sep 17 00:00:00 2001
From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com>
Date: Tue, 21 Apr 2026 12:13:39 +0000
Subject: [PATCH 2/2] feat: add X.com support and fix deprecated string refs in
 Twitter embed

Agent-Logs-Url: https://github.com/streamich/react-embed/sessions/b5ab0b0f-3758-4e0c-8874-1acbf81e7c8d

Co-authored-by: streamich <9773803+streamich@users.noreply.github.com>
---
 src/blocks/tweet/index.tsx         | 5 +++--
 src/routeToBlock.ts                | 3 +++
 src/stories/ReactEmbed.stories.tsx | 1 +
 3 files changed, 7 insertions(+), 2 deletions(-)

diff --git a/src/blocks/tweet/index.tsx b/src/blocks/tweet/index.tsx
index dfae468f5..2504bc184 100644
--- a/src/blocks/tweet/index.tsx
+++ b/src/blocks/tweet/index.tsx
@@ -13,6 +13,7 @@ const wnd = window as any;
 
 class TwitterTweet extends React.PureComponent<BlockProps, {}> {
   mounted: boolean = true;
+  ref = React.createRef<HTMLDivElement>();
 
   componentDidMount() {
     require('scriptjs')('https://platform.twitter.com/widgets.js', 'tw', () => {
@@ -22,7 +23,7 @@ class TwitterTweet extends React.PureComponent<BlockProps, {}> {
         console.error('Failed to load Twitter lib.');
         return;
       }
-      wnd.twttr.widgets.createTweet(this.props.id, this.refs.ref, {theme: this.props.isDark ? 'dark' : 'light'});
+      wnd.twttr.widgets.createTweet(this.props.id, this.ref.current, {theme: this.props.isDark ? 'dark' : 'light'});
     });
   }
 
@@ -31,7 +32,7 @@ class TwitterTweet extends React.PureComponent<BlockProps, {}> {
   }
 
   render() {
-    return this.props.renderWrap(<div ref="ref" className={blockClass} />);
+    return this.props.renderWrap(<div ref={this.ref} className={blockClass} />);
   }
 }
 
diff --git a/src/routeToBlock.ts b/src/routeToBlock.ts
index 4611693fb..ef137b28c 100644
--- a/src/routeToBlock.ts
+++ b/src/routeToBlock.ts
@@ -66,6 +66,9 @@ const routeToBlock: ReactEmbedRouter = (blocks: Blocks, parsed: ParsedUrl) => {
   const {hostname, url} = parsed;
   switch (hostname) {
     case 'twitter.com':
+    case 'www.twitter.com':
+    case 'x.com':
+    case 'www.x.com':
       return routeTwitter(blocks, parsed);
     case 'www.youtube.com':
     case 'youtu.be':
diff --git a/src/stories/ReactEmbed.stories.tsx b/src/stories/ReactEmbed.stories.tsx
index a4b31fd1c..edf2ddd0e 100644
--- a/src/stories/ReactEmbed.stories.tsx
+++ b/src/stories/ReactEmbed.stories.tsx
@@ -33,6 +33,7 @@ const urls = [
   'https://repl.it/@VadimsDaleckis/AwesomeHiddenPublisher',
   'https://soundcloud.com/user-515768487/im-a-creeper-boom-boom-boom',
   'https://twitter.com/hercuppacoffee/status/911958476678561792',
+  'https://x.com/hercuppacoffee/status/911958476678561792',
   'https://vimeo.com/54763818',
   'https://vimeo.com/12622016',
   'https://www.dropbox.com/s/u0bdwmkjmqld9l2/dbx-supporting-distributed-work.gif?dl=0',