Merge pull request #221 from gmsgowtham/fix/tweet-embed

fix: tweet embed
gmsgowtham · Sep 9, 2023 · 2ad6f38 · 2ad6f38
2 parents cb1b94a + 7ea6aca
commit 2ad6f38
Show file tree

Hide file tree

Showing 4 changed files with 32 additions and 4 deletions.
diff --git a/src/components/Appbar/HomeAppbar.tsx b/src/components/Appbar/HomeAppbar.tsx
@@ -1,6 +1,6 @@
 import { NavigationProp, useNavigation } from "@react-navigation/native";
 import { Fragment, FunctionComponent, memo, useState } from "react";
-import { Appbar, Avatar, Menu, Tooltip, useTheme } from "react-native-paper";
+import { Appbar, Avatar, Menu, Tooltip } from "react-native-paper";
 import { StackParamList } from "../../router/types";
 
 type props = {
@@ -45,7 +45,7 @@ const HomeAppbar: FunctionComponent<props> = ({
 					/>
 				)}
 			/>
-			<Appbar.Content title="" />
+			<Appbar.Content title="UDev" />
 			{!isVideoListScreen ? (
 				<Fragment>
 					<Tooltip title="Search posts">

diff --git a/src/components/Markdown/tokenizer.ts b/src/components/Markdown/tokenizer.ts
@@ -1,5 +1,9 @@
 import { type CustomToken, MarkedTokenizer } from "react-native-marked";
-import { getStackoverflowEmbedURL, getYoutubeEmbedURL } from "../../utils/url";
+import {
+	getStackoverflowEmbedURL,
+	getTweetEmbedURL,
+	getYoutubeEmbedURL,
+} from "../../utils/url";
 
 class MDTokenizer extends MarkedTokenizer<CustomToken> {
 	paragraph(this: MarkedTokenizer<CustomToken>, src: string) {
@@ -110,6 +114,21 @@ class MDTokenizer extends MarkedTokenizer<CustomToken> {
 			return token;
 		}
 
+		const twitterMatch = src.match(/^[*]?{% (tweet)[*]? (.*?)[*]?%}[*]?/);
+		if (twitterMatch && twitterMatch.length > 2) {
+			const url = getTweetEmbedURL(twitterMatch[2]);
+			const token: CustomToken = {
+				identifier: "embed",
+				type: "custom",
+				raw: twitterMatch[0],
+				tokens: [],
+				args: {
+					text: url,
+				},
+			};
+			return token;
+		}
+
 		return super.paragraph(src);
 	}
 }

diff --git a/src/utils/const.ts b/src/utils/const.ts
@@ -31,3 +31,4 @@ export const VIDEO_UI_HIDE_TIMEOUT = 5000; // 5 seconds
 export const NETWORK_TIMEOUT_MS = 10000;
 export const YOUTUBE_HOST = "https://www.youtube.com";
 export const STACKOVERFLOW_HOST = "https://stackoverflow.com";
+export const TWITTER_URL = "https://www.twitter.com";
diff --git a/src/utils/url.ts b/src/utils/url.ts
@@ -1,5 +1,5 @@
 import Url from "url-parse";
-import { STACKOVERFLOW_HOST, YOUTUBE_HOST } from "./const";
+import { STACKOVERFLOW_HOST, TWITTER_URL, YOUTUBE_HOST } from "./const";
 
 export const buildURLParams = (
 	params: Record<string, string | number | boolean | undefined | null>,
@@ -32,3 +32,11 @@ export const getStackoverflowEmbedURL = (str: string) => {
 	}
 	return `${STACKOVERFLOW_HOST}/questions/${str}`;
 };
+
+export const getTweetEmbedURL = (id: string) => {
+	const parsed = new Url(id, {});
+	if (parsed.host) {
+		return parsed.toString();
+	}
+	return `${TWITTER_URL}/i/web/status/${id}`;
+};