From 377a2c5fb2492a1df1d7706c80e3f11531772981 Mon Sep 17 00:00:00 2001 From: Zander Martineau Date: Thu, 9 Nov 2023 17:53:09 +0000 Subject: [PATCH] =?UTF-8?q?Add=20toot=20search,=20fixed=20twitter=20search?= =?UTF-8?q?.=20Think=20there=20are=20some=20bugs=20with=20this=E2=80=A6?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- app/(app)/toots/[id]/page.tsx | 17 ++++++++++++++ app/(app)/tweets/[id]/page.tsx | 17 ++++++++++++++ src/components/CmdK/CmdK.tsx | 36 ++++++++++++++++++++++++++++-- src/components/CmdK/fetchSearch.ts | 17 +++++++++++--- src/components/Feed.tsx | 7 ++---- src/utils/fetching/toots.ts | 18 +++++++++++++-- src/utils/fetching/tweets.ts | 21 +++++++++++++++-- 7 files changed, 119 insertions(+), 14 deletions(-) create mode 100644 app/(app)/toots/[id]/page.tsx create mode 100644 app/(app)/tweets/[id]/page.tsx diff --git a/app/(app)/toots/[id]/page.tsx b/app/(app)/toots/[id]/page.tsx new file mode 100644 index 0000000..5b4ed77 --- /dev/null +++ b/app/(app)/toots/[id]/page.tsx @@ -0,0 +1,17 @@ +import { getToot } from '@/src/utils/fetching/toots'; +import { createServerClient } from '@/src/utils/supabase/server'; +import { cookies } from 'next/headers'; + +import { TootFeedItem } from '../../../../src/components/TootFeedItem'; + +export default async function BookmarkPage({ + params, +}: { + params: { id: string }; +}) { + const cookieStore = cookies(); + const supabaseClient = createServerClient(cookieStore); + const { data } = await getToot({ supabaseClient, id: params.id }); + // @ts-ignore + return ; +} diff --git a/app/(app)/tweets/[id]/page.tsx b/app/(app)/tweets/[id]/page.tsx new file mode 100644 index 0000000..85cf696 --- /dev/null +++ b/app/(app)/tweets/[id]/page.tsx @@ -0,0 +1,17 @@ +import { getTweet } from '@/src/utils/fetching/tweets'; +import { createServerClient } from '@/src/utils/supabase/server'; +import { cookies } from 'next/headers'; + +import { TweetFeedItem } from '../../../../src/components/TweetFeedItem'; + +export default async function BookmarkPage({ + params, +}: { + params: { id: string }; +}) { + const cookieStore = cookies(); + const supabaseClient = createServerClient(cookieStore); + const { data } = await getTweet({ supabaseClient, id: params.id }); + // @ts-ignore + return ; +} diff --git a/src/components/CmdK/CmdK.tsx b/src/components/CmdK/CmdK.tsx index a62a4b4..3009031 100644 --- a/src/components/CmdK/CmdK.tsx +++ b/src/components/CmdK/CmdK.tsx @@ -2,7 +2,7 @@ import { Button } from '@/src/components/Button'; import { useToggle } from '@/src/hooks/useToggle'; -import { Bookmark, Tweet } from '@/src/types/db'; +import { Bookmark, Toot, Tweet } from '@/src/types/db'; import { DbMetaResponse } from '@/src/utils/fetching/meta'; import { simpleUrl } from '@/src/utils/simpleUrl'; import { @@ -74,6 +74,7 @@ export const CmdK = ({ serverDbMeta }: CmdKProps) => { const [open, toggleOpen, setOpen] = useToggle(false); const [bookmarkItems, setBookmarkItems] = useState([]); const [tweetItems, setTweetItems] = useState([]); + const [tootItems, setTootItems] = useState([]); const [searchTerm, setSearchTerm] = useState(''); const dbMeta = serverDbMeta; @@ -91,8 +92,9 @@ export const CmdK = ({ serverDbMeta }: CmdKProps) => { await fetchSearch(value).then((data) => { setBookmarkItems((data?.bookmarksSearch?.data as Bookmark[]) ?? []); setTweetItems(data?.tweetsSearch?.data ?? []); + setTootItems(data?.tootsSearch?.data ?? []); }); - }, 500); + }, 1000); useEffect(() => { const down = (event: KeyboardEvent) => { @@ -337,6 +339,36 @@ export const CmdK = ({ serverDbMeta }: CmdKProps) => { ) : null} + {/* Toots */} + {searchTerm.length && tootItems?.length ? ( + + {tootItems?.map(({ id, text, user_avatar, user_id }) => { + if (!text) { + return null; + } + + const value = [text].filter(Boolean).join(' '); + return ( + +
+ + {user_avatar ? ( + + ) : null} + {user_id} + + {text} +
+
+ ); + })} +
+ ) : null} + {/* Tweets */} {searchTerm.length && tweetItems?.length ? ( diff --git a/src/components/CmdK/fetchSearch.ts b/src/components/CmdK/fetchSearch.ts index 25800e5..eb70912 100644 --- a/src/components/CmdK/fetchSearch.ts +++ b/src/components/CmdK/fetchSearch.ts @@ -13,17 +13,28 @@ export const fetchSearch = async (searchTerm: string) => { .match({ status: 'active' }) .order('created_at', { ascending: false }) .limit(5); - const tweetsSearch = await supabaseClient .from('tweets') .select('*', { count: 'exact' }) - .or(`text.ilike.*${searchTerm}*,user_name.ilike.*${searchTerm}*`) - .match({ status: 'active' }) + .or( + `text.ilike.*${searchTerm}*,user_name.ilike.*${searchTerm}*,hashtags.cs.{${searchTerm}}`, + ) + .order('created_at', { ascending: false }) + .limit(5); + console.log(`🚀 ~ fetchSearch ~ tweetsSearch:`, tweetsSearch); + const tootsSearch = await supabaseClient + .from('toots') + .select('*', { count: 'exact' }) + .or( + `text.ilike.*${searchTerm}*,user_name.ilike.*${searchTerm}*,user_id.ilike.*${searchTerm}*,hashtags.cs.{${searchTerm}}`, + ) .order('created_at', { ascending: false }) .limit(5); + console.log(`🚀 ~ fetchSearch ~ tootsSearch:`, tootsSearch); return { bookmarksSearch, tweetsSearch, + tootsSearch, }; }; diff --git a/src/components/Feed.tsx b/src/components/Feed.tsx index 37799fe..a4e679c 100644 --- a/src/components/Feed.tsx +++ b/src/components/Feed.tsx @@ -99,11 +99,9 @@ export const Feed = memo( {groupedItem?.items?.map((item) => { if (isTweet(item)) { return ; - } - if (isToot(item)) { + } else if (isToot(item)) { return ; } - return ( { if (isTweet(item)) { return ; - } - if (isToot(item)) { + } else if (isToot(item)) { return ; } return ( diff --git a/src/utils/fetching/toots.ts b/src/utils/fetching/toots.ts index 9577581..2401f32 100644 --- a/src/utils/fetching/toots.ts +++ b/src/utils/fetching/toots.ts @@ -3,7 +3,7 @@ import { type SupabaseClient } from '@supabase/supabase-js'; import { type ApiParameters, apiParameters } from './apiParameters'; -interface TootFetchingOptions { +interface TootsFetchingOptions { supabaseClient: SupabaseClient; params: Partial>; likes: boolean; @@ -12,7 +12,7 @@ export const getToots = async ({ supabaseClient, params, likes, -}: TootFetchingOptions) => { +}: TootsFetchingOptions) => { const { limit, offset, order } = apiParameters(params); const supabaseResponse = await supabaseClient @@ -28,3 +28,17 @@ export const getToots = async ({ return supabaseResponse; }; + +interface TootFetchingOptions { + supabaseClient: SupabaseClient; + id: string; +} +export const getToot = async ({ supabaseClient, id }: TootFetchingOptions) => { + const supabaseResponse = await supabaseClient + .from('toots') + .select('*') + .match({ id }) + .single(); + + return supabaseResponse; +}; diff --git a/src/utils/fetching/tweets.ts b/src/utils/fetching/tweets.ts index 02f3075..eb6c5cf 100644 --- a/src/utils/fetching/tweets.ts +++ b/src/utils/fetching/tweets.ts @@ -3,7 +3,7 @@ import { type SupabaseClient } from '@supabase/supabase-js'; import { type ApiParameters, apiParameters } from './apiParameters'; -interface TweetFetchingOptions { +interface TweetsFetchingOptions { supabaseClient: SupabaseClient; params: Partial>; likes: boolean; @@ -12,7 +12,7 @@ export const getTweets = async ({ supabaseClient, params, likes, -}: TweetFetchingOptions) => { +}: TweetsFetchingOptions) => { const { limit, offset, order } = apiParameters(params); const supabaseResponse = await supabaseClient @@ -28,3 +28,20 @@ export const getTweets = async ({ return supabaseResponse; }; + +interface TweetFetchingOptions { + supabaseClient: SupabaseClient; + id: string; +} +export const getTweet = async ({ + supabaseClient, + id, +}: TweetFetchingOptions) => { + const supabaseResponse = await supabaseClient + .from('tweets') + .select('*') + .match({ id }) + .single(); + + return supabaseResponse; +};