fix: remove media except images

heiseonline · Sep 5, 2024 · 2216382 · 2216382
1 parent fc89488
commit 2216382
Show file tree

Hide file tree

Showing 4 changed files with 48 additions and 30 deletions.
diff --git a/embetty/src/embed/tweet.ts b/embetty/src/embed/tweet.ts
@@ -20,20 +20,21 @@ const template = `
       </header>
       <article>
         <p>{{{ fullText }}}</p>
-        {{#hasMedia}}
-          <section class="media-{{media.length}}" id="media">
-            {{#media}}
+        {{#hasImages}}
+          <section class="media-{{images.length}}" id="media">
+            {{#images}}
               <a target="_blank" href="{{imageUrl}}"><img src="{{imageUrl}}"></a>
-            {{/media}}
+            {{/images}}
           </section>
-        {{/hasMedia}}
+        {{/hasImages}}
 
         {{#hasLinks}}
           <a href="{{link.url}}" target="_blank" rel="noopener" id="links">
             <img src="{{linkImageUrl}}">
             <section id="link-body">
               <h3>{{link.title}}</h3>
               {{#link.description}}<p>{{link.description}}</p>{{/link.description}}
+              <p>{{#hasAdditionalMedia}}Weitere Inhalte des Posts auf x.com{{/hasAdditionalMedia}}</p>
               <span>{{linkHostname}}</span>
             </section>
           </a>
@@ -166,11 +167,16 @@ export class Tweet extends Embed<EmbettyTweet> {
   }
 
   get fullText() {
-    return this._data?.data.text
-      .replace(/#([^\s-]+)/g, (hashTag: string, word: string) => {
+    const text = this._data?.data.note_tweet
+      ? // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
+        this._data?.data.note_tweet.text
+      : this._data?.data.text
+
+    return (text ?? '')
+      .replaceAll(/#([^\s-]+)/g, (hashTag: string, word: string) => {
         return `<a href="https://twitter.com/hashtag/${word}">${hashTag}</a>`
       })
-      .replace(/@(\w+)/g, (name: string, word: string) => {
+      .replaceAll(/@(\w+)/g, (name: string, word: string) => {
         return `<a href="https://twitter.com/${word}">${name}</a>`
       })
     // .replace(/(https:\/\/\S+)$/, (link: string) => {
@@ -204,16 +210,30 @@ export class Tweet extends Embed<EmbettyTweet> {
     return this.user?.username
   }
 
-  get media() {
-    return (this._data?.data.attachments?.media_keys ?? []).map(
-      (_key, index) => ({
-        imageUrl: `${this.url}/images/${index}`,
-      }),
+  get images() {
+    const images = (this._data?.includes.media ?? []).filter(
+      (include) => include.type === 'photo',
     )
+
+    return (images ?? []).map((_key, index) => ({
+      imageUrl: `${this.url}/images/${index}`,
+    }))
   }
 
-  get hasMedia() {
-    return this.media.length > 0
+  get hasAdditionalMedia() {
+    console.log(
+      'hasAdditionalMedia',
+      this.images.length,
+      this._data?.data.attachments?.media_keys.length,
+    )
+    return (
+      this.images.length <
+      (this._data?.data.attachments?.media_keys.length ?? 0)
+    )
+  }
+
+  get hasImages() {
+    return this.images.length > 0
   }
 
   get links() {
@@ -247,6 +267,7 @@ export class Tweet extends Embed<EmbettyTweet> {
     await super.becomesVisible()
 
     const linkImage = this.shadowRoot!.querySelector('#links img')
+
     if (linkImage) {
       linkImage.addEventListener('error', () => {
         linkImage.remove()

diff --git a/embetty/tsconfig.json b/embetty/tsconfig.json
@@ -5,19 +5,9 @@
     "outDir": "./dist",
     "importHelpers": false,
     "target": "ES2015",
-    "lib": [
-      "DOM",
-      "DOM.Iterable",
-      "ES2016",
-      "ES2020"
-    ]
+    "lib": ["DOM", "DOM.Iterable", "ES2016", "ES2020", "ES2021.String"]
   },
-  "include": [
-    "src/**/*"
-  ],
-  "exclude": [
-    "dist",
-    "node_modules"
-  ],
+  "include": ["src/**/*"],
+  "exclude": ["dist", "node_modules"],
   "references": []
 }
diff --git a/libs/base/src/twitter/tweet.ts b/libs/base/src/twitter/tweet.ts
@@ -54,7 +54,7 @@ export class Tweet extends Embed<TweetResponse, EmbettyTweet> {
       params: {
         // tweet_mode: 'extended',
         'tweet.fields':
-          'attachments,author_id,context_annotations,conversation_id,created_at,entities,geo,id,in_reply_to_user_id,lang,possibly_sensitive,public_metrics,referenced_tweets,reply_settings,source,text,withheld,edit_history_tweet_ids,edit_controls',
+          'attachments,author_id,context_annotations,conversation_id,created_at,entities,geo,id,in_reply_to_user_id,lang,possibly_sensitive,public_metrics,referenced_tweets,reply_settings,source,text,withheld,edit_history_tweet_ids,edit_controls,note_tweet',
         expansions:
           'attachments.poll_ids,attachments.media_keys,author_id,geo.place_id,in_reply_to_user_id,referenced_tweets.id,entities.mentions.username,referenced_tweets.id.author_id,edit_history_tweet_ids',
         'user.fields': 'id,name,username,profile_image_url',
@@ -106,7 +106,9 @@ export class Tweet extends Embed<TweetResponse, EmbettyTweet> {
   get media() {
     return (this.tweetData?.data.attachments?.media_keys ?? [])
       .map((key) =>
-        this.tweetData?.includes.media.find((media) => media.media_key === key),
+        this.tweetData?.includes.media.find(
+          (media) => media.media_key === key && media.type === 'photo',
+        ),
       )
       .filter(isDefined)
   }

diff --git a/libs/types/src/tweet.interfaces.ts b/libs/types/src/tweet.interfaces.ts
@@ -34,6 +34,7 @@ export interface Data {
   reply_settings: string
   possibly_sensitive: boolean
   edit_controls: EditControls
+  note_tweet?: NoteTweet
   conversation_id: string
   lang: string
   author_id: string
@@ -43,6 +44,10 @@ export interface Data {
   referenced_tweets?: ReferencedTweet[]
 }
 
+export interface NoteTweet {
+  text: string
+}
+
 export interface ReferencedTweet {
   type: 'replied_to' | unknown
   id: string