From 833207edf4e9c50a109aa7273e7c023d3891d1b8 Mon Sep 17 00:00:00 2001 From: rimar1337 <132627503+rimar1337@users.noreply.github.com> Date: Tue, 14 Oct 2025 08:36:56 +0700 Subject: [PATCH] bye bye weird providers --- src/components/UniversalPostRenderer.tsx | 109 ++++++++-------- src/providers/PassAuthProvider.tsx | 149 ---------------------- src/providers/PersistentStoreProvider.tsx | 61 --------- src/routes/__root.tsx | 22 ++-- src/routes/index.tsx | 121 +++++++++--------- src/routes/notifications.tsx | 43 ++++--- src/utils/oauthClient.ts | 8 +- src/utils/useHydrated.ts | 66 +++------- 8 files changed, 168 insertions(+), 411 deletions(-) delete mode 100644 src/providers/PassAuthProvider.tsx delete mode 100644 src/providers/PersistentStoreProvider.tsx diff --git a/src/components/UniversalPostRenderer.tsx b/src/components/UniversalPostRenderer.tsx index 7e2e329..fba2ed8 100644 --- a/src/components/UniversalPostRenderer.tsx +++ b/src/components/UniversalPostRenderer.tsx @@ -1,5 +1,5 @@ import { useNavigate } from "@tanstack/react-router"; -import { useAtom } from 'jotai'; +import { useAtom } from "jotai"; import * as React from "react"; import { type SVGProps } from "react"; @@ -146,8 +146,9 @@ export function UniversalPostRendererATURILoader({ // >(null); //const router = useRouter(); - const parsed = React.useMemo(() => parseAtUri(atUri), [atUri]); - const did = parsed?.did; + //const parsed = React.useMemo(() => parseAtUri(atUri), [atUri]); + const parsed = new AtUri(atUri); + const did = parsed?.host; const rkey = parsed?.rkey; // /*mass comment*/ console.log("did", did); // /*mass comment*/ console.log("rkey", rkey); @@ -387,7 +388,7 @@ export function UniversalPostRendererATURILoader({ // }; if (!postQuery?.value) { // deleted post more often than a non-resolvable post - return (<>) + return <>; } return ( @@ -409,6 +410,12 @@ export function UniversalPostRendererATURILoader({ ); } +function getAvatarUrl(opProfile: any, did: string) { + const link = opProfile?.value?.avatar?.ref?.["$link"]; + if (!link) return null; + return `https://cdn.bsky.app/img/avatar/plain/${did}/${link}@jpeg`; +} + export function UniversalPostRendererRawRecordShim({ postRecord, profileRecord, @@ -442,12 +449,6 @@ export function UniversalPostRendererRawRecordShim({ const navigate = useNavigate(); //const { get, set } = usePersistentStore(); - function getAvatarUrl(opProfile: any) { - const link = opProfile?.value?.avatar?.ref?.["$link"]; - if (!link) return null; - return `https://cdn.bsky.app/img/avatar/plain/${resolved?.did}/${link}@jpeg`; - } - // const [hydratedEmbed, setHydratedEmbed] = useState(undefined); // useEffect(() => { @@ -519,7 +520,7 @@ export function UniversalPostRendererRawRecordShim({ error: embedError, } = useHydratedEmbed(postRecord?.value?.embed, resolved?.did); - const parsedaturi = parseAtUri(aturi); + const parsedaturi = new AtUri(aturi); //parseAtUri(aturi); const fakepost = React.useMemo( () => ({ @@ -530,7 +531,7 @@ export function UniversalPostRendererRawRecordShim({ did: resolved?.did || "", handle: resolved?.handle || "", displayName: profileRecord?.value?.displayName || "", - avatar: getAvatarUrl(profileRecord) || "", + avatar: getAvatarUrl(profileRecord, resolved?.did) || "", viewer: undefined, labels: profileRecord?.labels || undefined, verification: undefined, @@ -548,13 +549,16 @@ export function UniversalPostRendererRawRecordShim({ }), [ aturi, - postRecord, + postRecord?.cid, + postRecord?.value, + postRecord?.labels, + resolved?.did, + resolved?.handle, profileRecord, hydratedEmbed, repliesCount, repostsCount, likesCount, - resolved, ] ); @@ -595,8 +599,7 @@ export function UniversalPostRendererRawRecordShim({ ); const feedviewpostreplyhandle = replyhookvalue?.data?.handle; - - const aturirepostbydid = repostedby ? new AtUri(repostedby).host : undefined + const aturirepostbydid = repostedby ? new AtUri(repostedby).host : undefined; const repostedbyhookvalue = useQueryIdentity( repostedby ? aturirepostbydid : undefined ); @@ -612,7 +615,7 @@ export function UniversalPostRendererRawRecordShim({ parsedaturi && navigate({ to: "/profile/$did/post/$rkey", - params: { did: parsedaturi.did, rkey: parsedaturi.rkey }, + params: { did: parsedaturi.host, rkey: parsedaturi.rkey }, }) } // onProfileClick={() => parsedaturi && navigate({to: "/profile/$did", @@ -623,7 +626,7 @@ export function UniversalPostRendererRawRecordShim({ if (parsedaturi) { navigate({ to: "/profile/$did", - params: { did: parsedaturi.did }, + params: { did: parsedaturi.host }, }); } }} @@ -640,28 +643,28 @@ export function UniversalPostRendererRawRecordShim({ ); } -export function parseAtUri( - atUri: string -): { did: string; collection: string; rkey: string } | null { - const PREFIX = "at://"; - if (!atUri.startsWith(PREFIX)) { - return null; - } +// export function parseAtUri( +// atUri: string +// ): { did: string; collection: string; rkey: string } | null { +// const PREFIX = "at://"; +// if (!atUri.startsWith(PREFIX)) { +// return null; +// } - const parts = atUri.slice(PREFIX.length).split("/"); +// const parts = atUri.slice(PREFIX.length).split("/"); - if (parts.length !== 3) { - return null; - } +// if (parts.length !== 3) { +// return null; +// } - const [did, collection, rkey] = parts; +// const [did, collection, rkey] = parts; - if (!did || !collection || !rkey) { - return null; - } +// if (!did || !collection || !rkey) { +// return null; +// } - return { did, collection, rkey }; -} +// return { did, collection, rkey }; +// } export function MdiCommentOutline(props: SVGProps) { return ( @@ -1102,7 +1105,7 @@ function UniversalPostRenderer({ post.viewer?.repost ? true : false ); const [hasLiked, setHasLiked] = useState( - (post.uri in likedPosts) || post.viewer?.like ? true : false + post.uri in likedPosts || post.viewer?.like ? true : false ); const { agent } = useAuth(); const [likeUri, setLikeUri] = useState(post.viewer?.like); @@ -1132,7 +1135,7 @@ function UniversalPostRenderer({ setHasLiked(true); newLikedPosts[post.uri] = uri; } - setLikedPosts(newLikedPosts) + setLikedPosts(newLikedPosts); }; const repostOrUnrepostPost = async () => { @@ -1152,11 +1155,13 @@ function UniversalPostRenderer({ } }; - const isRepost = repostedby ? repostedby : extraOptionalItemInfo - ? AppBskyFeedDefs.isReasonRepost(extraOptionalItemInfo.reason) - ? extraOptionalItemInfo.reason?.by.displayName - : undefined - : undefined; + const isRepost = repostedby + ? repostedby + : extraOptionalItemInfo + ? AppBskyFeedDefs.isReasonRepost(extraOptionalItemInfo.reason) + ? extraOptionalItemInfo.reason?.by.displayName + : undefined + : undefined; const isReply = extraOptionalItemInfo ? extraOptionalItemInfo.reply : undefined; @@ -1224,7 +1229,8 @@ function UniversalPostRenderer({ {!isQuote && (
@@ -1455,6 +1461,9 @@ function UniversalPostRenderer({ /> ) : null} {post.embed && depth > 0 && ( + /* pretty bad hack imo. its trying to sync up with how the embed shim doesnt + hydrate embeds this deep but the connection here is implicit + todo: idk make this a real part of the embed shim so its not implicit */ <>
(there is an embed here thats too deep to render) @@ -1716,11 +1725,11 @@ function PostEmbeds({ salt={salt} onPostClick={(e) => { e.stopPropagation(); - const parsed = parseAtUri(post.uri); + const parsed = new AtUri(post.uri); //parseAtUri(post.uri); if (parsed) { navigate({ to: "/profile/$did/post/$rkey", - params: { did: parsed.did, rkey: parsed.rkey }, + params: { did: parsed.host, rkey: parsed.rkey }, }); } }} @@ -1833,11 +1842,11 @@ function PostEmbeds({ salt={salt} onPostClick={(e) => { e.stopPropagation(); - const parsed = parseAtUri(post.uri); + const parsed = new AtUri(post.uri); //parseAtUri(post.uri); if (parsed) { navigate({ to: "/profile/$did/post/$rkey", - params: { did: parsed.did, rkey: parsed.rkey }, + params: { did: parsed.host, rkey: parsed.rkey }, }); } }} @@ -2296,7 +2305,7 @@ function getByteToCharMap(text: string): number[] { for (let i = 0; i < bytes.length; i++) { map[byteIndex++] = charIndex; } - charIndex+=char.length; + charIndex += char.length; } return map; @@ -2389,7 +2398,7 @@ function renderTextWithFacets({ navigate({ to: "/profile/$did", // @ts-expect-error i didnt bother with the correct types here sorry. bsky api types are cursed - params: { did: feature.did}, + params: { did: feature.did }, }); }} > diff --git a/src/providers/PassAuthProvider.tsx b/src/providers/PassAuthProvider.tsx deleted file mode 100644 index 5e9624b..0000000 --- a/src/providers/PassAuthProvider.tsx +++ /dev/null @@ -1,149 +0,0 @@ -import React, { createContext, useState, useEffect, useContext } from "react"; -import { AtpAgent, type AtpSessionData } from "@atproto/api"; - -interface AuthContextValue { - agent: AtpAgent | null; - loginStatus: boolean; - login: (user: string, password: string, service?: string) => Promise; - logout: () => Promise; - loading: boolean; - authed: boolean | undefined; -} - -const AuthContext = createContext({} as AuthContextValue); - -export const AuthProvider = ({ children }: { children: React.ReactNode }) => { - const [agent, setAgent] = useState(null); - const [loginStatus, setLoginStatus] = useState(false); - const [loading, setLoading] = useState(true); - const [increment, setIncrement] = useState(0); - const [authed, setAuthed] = useState(undefined); - - useEffect(() => { - const initialize = async () => { - try { - const service = localStorage.getItem("service"); - // const user = await AsyncStorage.getItem('user'); - // const password = await AsyncStorage.getItem('password'); - const session = localStorage.getItem("sess"); - - if (service && session) { - // /*mass comment*/ console.log("Auto-login service is:", service); - const apiAgent = new AtpAgent({ service }); - try { - if (!apiAgent) { - // /*mass comment*/ console.log("Agent is null or undefined"); - return; - } - let sess: AtpSessionData = JSON.parse(session); - // /*mass comment*/ console.log("resuming session is:", sess); - const { data } = await apiAgent.resumeSession(sess); - // /*mass comment*/ console.log("!!!8!!! agent resume session"); - setAgent(apiAgent); - setLoginStatus(true); - setLoading(false); - setAuthed(true); - } catch (e) { - // /*mass comment*/ console.log("Failed to resume session" + e); - setLoginStatus(true); - localStorage.removeItem("sess"); - localStorage.removeItem("service"); - const apiAgent = new AtpAgent({ service: "https://api.bsky.app" }); - setAgent(apiAgent); - setLoginStatus(true); - setLoading(false); - setAuthed(false); - return; - } - } else { - const apiAgent = new AtpAgent({ service: "https://api.bsky.app" }); - setAgent(apiAgent); - setLoginStatus(true); - setLoading(false); - setAuthed(false); - } - } catch (e) { - // /*mass comment*/ console.log("Failed to auto-login:", e); - } finally { - setLoading(false); - } - }; - - initialize(); - }, [increment]); - - const login = async ( - user: string, - password: string, - service: string = "https://bsky.social", - ) => { - try { - let sessionthing; - const apiAgent = new AtpAgent({ - service: service, - persistSession: (evt, sess) => { - sessionthing = sess; - }, - }); - await apiAgent.login({ identifier: user, password }); - // /*mass comment*/ console.log("!!!8!!! agent logged on"); - - localStorage.setItem("service", service); - // await AsyncStorage.setItem('user', user); - // await AsyncStorage.setItem('password', password); - if (sessionthing) { - localStorage.setItem("sess", JSON.stringify(sessionthing)); - } else { - localStorage.setItem("sess", "{}"); - } - - setAgent(apiAgent); - setLoginStatus(true); - setAuthed(true); - } catch (e) { - console.error("Login failed:", e); - } - }; - - const logout = async () => { - if (!agent) { - console.error("Agent is null or undefined"); - return; - } - setLoading(true); - try { - // check if its even in async storage before removing - if (localStorage.getItem("service") && localStorage.getItem("sess")) { - localStorage.removeItem("service"); - localStorage.removeItem("sess"); - } - await agent.logout(); - // /*mass comment*/ console.log("!!!8!!! agent logout"); - setLoginStatus(false); - setAuthed(undefined); - await agent.com.atproto.server.deleteSession(); - // /*mass comment*/ console.log("!!!8!!! agent deltesession"); - //setAgent(null); - setIncrement(increment + 1); - } catch (e) { - console.error("Logout failed:", e); - } finally { - setLoading(false); - } - }; - - // why the hell are we doing this - /*if (loading) { - return
Laoding...ae
; - }*/ - - return ( - - {children} - - ); -}; - -export const useAuth = () => useContext(AuthContext); diff --git a/src/providers/PersistentStoreProvider.tsx b/src/providers/PersistentStoreProvider.tsx deleted file mode 100644 index 489d38c..0000000 --- a/src/providers/PersistentStoreProvider.tsx +++ /dev/null @@ -1,61 +0,0 @@ -import React, { createContext, useContext, useCallback } from "react"; -import { get as idbGet, set as idbSet, del as idbDel } from "idb-keyval"; - -type PersistentValue = { - value: string; - time: number; -}; - -type PersistentStoreContextType = { - get: (key: string) => Promise; - set: (key: string, value: string) => Promise; - remove: (key: string) => Promise; -}; - -const PersistentStoreContext = createContext( - null, -); - -export const PersistentStoreProvider: React.FC<{ - children: React.ReactNode; -}> = ({ children }) => { - const get = useCallback( - async (key: string): Promise => { - if (typeof window === "undefined") return null; - const raw = await idbGet(key); - if (!raw) return null; - try { - return JSON.parse(raw) as PersistentValue; - } catch { - return null; - } - }, - [], - ); - - const set = useCallback(async (key: string, value: string) => { - if (typeof window === "undefined") return; - const entry: PersistentValue = { value, time: Date.now() }; - await idbSet(key, JSON.stringify(entry)); - }, []); - - const remove = useCallback(async (key: string) => { - if (typeof window === "undefined") return; - await idbDel(key); - }, []); - - return ( - - {children} - - ); -}; - -export const usePersistentStore = (): PersistentStoreContextType => { - const context = useContext(PersistentStoreContext); - if (!context) - throw new Error( - "usePersistentStore must be used within a PersistentStoreProvider", - ); - return context; -}; diff --git a/src/routes/__root.tsx b/src/routes/__root.tsx index 407c8f0..6574fd3 100644 --- a/src/routes/__root.tsx +++ b/src/routes/__root.tsx @@ -3,28 +3,24 @@ // dont forget to run this // npx @tanstack/router-cli generate -import { useState, type SVGProps } from "react"; +import type { QueryClient } from "@tanstack/react-query"; import { - HeadContent, + createRootRouteWithContext, Link, Outlet, Scripts, - createRootRoute, - createRootRouteWithContext, useLocation, useNavigate, } from "@tanstack/react-router"; import { TanStackRouterDevtools } from "@tanstack/react-router-devtools"; +import { type SVGProps,useState } from "react"; import * as React from "react"; + import { DefaultCatchBoundary } from "~/components/DefaultCatchBoundary"; import Login from "~/components/Login"; import { NotFound } from "~/components/NotFound"; -import appCss from "~/styles/app.css?url"; -import { seo } from "~/utils/seo"; import { UnifiedAuthProvider, useAuth } from "~/providers/UnifiedAuthProvider"; -import { PersistentStoreProvider } from "~/providers/PersistentStoreProvider"; -import type Agent from "@atproto/api"; -import type { QueryClient } from "@tanstack/react-query"; +import { seo } from "~/utils/seo"; export const Route = createRootRouteWithContext<{ queryClient: QueryClient; @@ -79,11 +75,9 @@ export const Route = createRootRouteWithContext<{ function RootComponent() { return ( - - - - - + + + ); } diff --git a/src/routes/index.tsx b/src/routes/index.tsx index a7cc504..03e030b 100644 --- a/src/routes/index.tsx +++ b/src/routes/index.tsx @@ -1,34 +1,27 @@ import { createFileRoute } from "@tanstack/react-router"; -import { - CACHE_TIMEOUT, - //cachedGetRecord, - //cachedResolveIdentity, - UniversalPostRendererATURILoader, -} from "~/components/UniversalPostRenderer"; +import { useAtom } from "jotai"; import * as React from "react"; +import { useEffect, useLayoutEffect } from "react"; + +import { InfiniteCustomFeed } from "~/components/InfiniteCustomFeed"; import { useAuth } from "~/providers/UnifiedAuthProvider"; +import { + agentAtom, + authedAtom, + feedScrollPositionsAtom, + selectedFeedUriAtom, + store, +} from "~/utils/atoms"; //import { usePersistentStore } from "~/providers/PersistentStoreProvider"; import { - useQueryIdentity, - useQueryPost, - useQueryFeedSkeleton, - useQueryPreferences, - useQueryArbitrary, - constructInfiniteFeedSkeletonQuery, constructArbitraryQuery, constructIdentityQuery, + constructInfiniteFeedSkeletonQuery, constructPostQuery, + useQueryArbitrary, + useQueryIdentity, + useQueryPreferences, } from "~/utils/useQuery"; -import { InfiniteCustomFeed } from "~/components/InfiniteCustomFeed"; -import { useAtom, useSetAtom } from "jotai"; -import { - selectedFeedUriAtom, - store, - agentAtom, - authedAtom, - feedScrollPositionsAtom, -} from "~/utils/atoms"; -import { useEffect, useLayoutEffect } from "react"; export const Route = createFileRoute("/")({ loader: async ({ context }) => { @@ -116,7 +109,8 @@ function Home() { }, [status, agent, authed]); useEffect(() => { if (agent) { - // is it just me or is the type really weird here it should be Agent not AtpAgent + // eslint-disable-next-line @typescript-eslint/ban-ts-comment + // @ts-ignore is it just me or is the type really weird here it should be Agent not AtpAgent store.set(agentAtom, agent); } else { store.set(agentAtom, null); @@ -330,7 +324,7 @@ function Home() { setRestoringScrollPosition(true); const savedPosition = scrollPositions[selectedFeed ?? "null"] ?? 0; - let raf = requestAnimationFrame(() => { + const raf = requestAnimationFrame(() => { // setRestoringScrollPosition(true); // raf = requestAnimationFrame(() => { // window.scrollTo({ top: savedPosition, behavior: "instant" }); @@ -428,52 +422,53 @@ function Home() { Select a feed to get started.
)} - {false && restoringScrollPosition && ( + {/* {false && restoringScrollPosition && (
restoringScrollPosition
- )} + )} */}
); } +// not even used lmaooo -export async function cachedResolveDIDWEBDOC({ - didweb, - cacheTimeout = CACHE_TIMEOUT, - get, - set, -}: { - didweb: string; - cacheTimeout?: number; - get: (key: string) => any; - set: (key: string, value: string) => void; -}): Promise { - const isDidInput = didweb.startsWith("did:web:"); - const cacheKey = `didwebdoc:${didweb}`; - const now = Date.now(); - const cached = get(cacheKey); - if ( - cached && - cached.value && - cached.time && - now - cached.time < cacheTimeout - ) { - try { - return JSON.parse(cached.value); - } catch {} - } - const url = `https://free-fly-24.deno.dev/resolve-did-web?did=${encodeURIComponent( - didweb - )}`; - const res = await fetch(url); - if (!res.ok) throw new Error("Failed to resolve didwebdoc"); - const data = await res.json(); - set(cacheKey, JSON.stringify(data)); - if (!isDidInput && data.did) { - set(`didwebdoc:${data.did}`, JSON.stringify(data)); - } - return data; -} +// export async function cachedResolveDIDWEBDOC({ +// didweb, +// cacheTimeout = CACHE_TIMEOUT, +// get, +// set, +// }: { +// didweb: string; +// cacheTimeout?: number; +// get: (key: string) => any; +// set: (key: string, value: string) => void; +// }): Promise { +// const isDidInput = didweb.startsWith("did:web:"); +// const cacheKey = `didwebdoc:${didweb}`; +// const now = Date.now(); +// const cached = get(cacheKey); +// if ( +// cached && +// cached.value && +// cached.time && +// now - cached.time < cacheTimeout +// ) { +// try { +// return JSON.parse(cached.value); +// } catch (_e) {/* whatever*/ } +// } +// const url = `https://free-fly-24.deno.dev/resolve-did-web?did=${encodeURIComponent( +// didweb +// )}`; +// const res = await fetch(url); +// if (!res.ok) throw new Error("Failed to resolve didwebdoc"); +// const data = await res.json(); +// set(cacheKey, JSON.stringify(data)); +// if (!isDidInput && data.did) { +// set(`didwebdoc:${data.did}`, JSON.stringify(data)); +// } +// return data; +// } // export async function cachedGetPrefs({ // did, diff --git a/src/routes/notifications.tsx b/src/routes/notifications.tsx index f572cda..c5d4791 100644 --- a/src/routes/notifications.tsx +++ b/src/routes/notifications.tsx @@ -1,7 +1,7 @@ import { createFileRoute } from "@tanstack/react-router"; -import React, { useEffect, useState, useRef } from "react"; -import { useAuth } from "~/providers/PassAuthProvider"; -import { usePersistentStore } from "~/providers/PersistentStoreProvider"; +import React, { useEffect, useRef,useState } from "react"; + +import { useAuth } from "~/providers/UnifiedAuthProvider"; const HANDLE_DID_CACHE_TIMEOUT = 60 * 60 * 1000; // 1 hour @@ -11,8 +11,9 @@ export const Route = createFileRoute("/notifications")({ function NotificationsComponent() { // /*mass comment*/ console.log("NotificationsComponent render"); - const { agent, authed, loading: authLoading } = useAuth(); - const { get, set } = usePersistentStore(); + const { agent, status } = useAuth(); + const authed = !!agent?.did; + const authLoading = status === "loading"; const [did, setDid] = useState(null); const [resolving, setResolving] = useState(false); const [error, setError] = useState(null); @@ -41,26 +42,26 @@ function NotificationsComponent() { setResolving(true); const cacheKey = `handleDid:${value}`; const now = Date.now(); - const cached = await get(cacheKey); - if ( - cached && - cached.value && - cached.time && - now - cached.time < HANDLE_DID_CACHE_TIMEOUT - ) { - try { - const data = JSON.parse(cached.value); - setDid(data.did); - setResolving(false); - return; - } catch {} - } + const cached = undefined // await get(cacheKey); + // if ( + // cached && + // cached.value && + // cached.time && + // now - cached.time < HANDLE_DID_CACHE_TIMEOUT + // ) { + // try { + // const data = JSON.parse(cached.value); + // setDid(data.did); + // setResolving(false); + // return; + // } catch {} + // } try { const url = `https://free-fly-24.deno.dev/?handle=${encodeURIComponent(value)}`; const res = await fetch(url); if (!res.ok) throw new Error("Failed to resolve handle"); const data = await res.json(); - set(cacheKey, JSON.stringify(data)); + //set(cacheKey, JSON.stringify(data)); setDid(data.did); } catch (e: any) { setError("Failed to resolve handle: " + (e?.message || e)); @@ -94,7 +95,7 @@ function NotificationsComponent() { } catch (e: any) { return { error: e?.message || String(e) }; } - }), + }) ) .then((results) => { if (!ignore) setResponses(results); diff --git a/src/utils/oauthClient.ts b/src/utils/oauthClient.ts index 45ce2f8..2f017db 100644 --- a/src/utils/oauthClient.ts +++ b/src/utils/oauthClient.ts @@ -1,12 +1,10 @@ -// src/helpers/oauthClient.ts import { BrowserOAuthClient, type ClientMetadata } from '@atproto/oauth-client-browser'; -// This is your app's PDS for resolving handles if not provided. -// You might need to host your own or use a public one. +// i tried making this https://pds-nd.whey.party but cors is annoying as fuck const handleResolverPDS = 'https://bsky.social'; -// This assumes your client-metadata.json is in the /public folder -// and will be served at the root of your domain. +// eslint-disable-next-line @typescript-eslint/ban-ts-comment +// @ts-ignore this should be fine ? the vite plugin should generate this before errors import clientMetadata from '../../public/client-metadata.json' with { type: 'json' }; export const oauthClient = new BrowserOAuthClient({ diff --git a/src/utils/useHydrated.ts b/src/utils/useHydrated.ts index aff98f4..be738b2 100644 --- a/src/utils/useHydrated.ts +++ b/src/utils/useHydrated.ts @@ -9,7 +9,7 @@ import { AppBskyFeedPost, AtUri, } from "@atproto/api"; -import { useEffect, useMemo,useState } from "react"; +import { useMemo } from "react"; import { useQueryIdentity,useQueryPost, useQueryProfile } from "./useQuery"; @@ -151,16 +151,11 @@ export function useHydratedEmbed( postAuthorDid: string | undefined, ) { const recordInfo = useMemo(() => { - if ( - AppBskyEmbedRecordWithMedia.isMain(embed) - ) { + if (AppBskyEmbedRecordWithMedia.isMain(embed)) { const recordUri = embed.record.record.uri; const quotedAuthorDid = new AtUri(recordUri).hostname; return { recordUri, quotedAuthorDid, isRecordType: true }; - } else - if ( - AppBskyEmbedRecord.isMain(embed) - ) { + } else if (AppBskyEmbedRecord.isMain(embed)) { const recordUri = embed.record.uri; const quotedAuthorDid = new AtUri(recordUri).hostname; return { recordUri, quotedAuthorDid, isRecordType: true }; @@ -171,17 +166,14 @@ export function useHydratedEmbed( isRecordType: false, }; }, [embed]); - const { isRecordType, recordUri, quotedAuthorDid } = recordInfo; + const { isRecordType, recordUri, quotedAuthorDid } = recordInfo; const usequerypostresults = useQueryPost(recordUri); - // const { - // data: quotedPost, - // isLoading: isLoadingPost, - // error: postError, - // } = usequerypostresults - const profileUri = quotedAuthorDid ? `at://${quotedAuthorDid}/app.bsky.actor.profile/self` : undefined; + const profileUri = quotedAuthorDid + ? `at://${quotedAuthorDid}/app.bsky.actor.profile/self` + : undefined; const { data: quotedProfile, @@ -190,38 +182,23 @@ export function useHydratedEmbed( } = useQueryProfile(profileUri); const queryidentityresult = useQueryIdentity(quotedAuthorDid); - // const { - // data: quotedIdentity, - // isLoading: isLoadingIdentity, - // error: identityError, - // } = queryidentityresult - const [hydratedEmbed, setHydratedEmbed] = useState< - HydratedEmbedView | undefined - >(undefined); - - useEffect(() => { - if (!embed || !postAuthorDid) { - setHydratedEmbed(undefined); - return; - } + const hydratedEmbed: HydratedEmbedView | undefined = (() => { + if (!embed || !postAuthorDid) return undefined; if (isRecordType && (!usequerypostresults?.data || !quotedProfile || !queryidentityresult?.data)) { - setHydratedEmbed(undefined); - return; + return undefined; } try { - let result: HydratedEmbedView | undefined; - if (AppBskyEmbedImages.isMain(embed)) { - result = hydrateEmbedImages(embed, postAuthorDid); + return hydrateEmbedImages(embed, postAuthorDid); } else if (AppBskyEmbedExternal.isMain(embed)) { - result = hydrateEmbedExternal(embed, postAuthorDid); + return hydrateEmbedExternal(embed, postAuthorDid); } else if (AppBskyEmbedVideo.isMain(embed)) { - result = hydrateEmbedVideo(embed, postAuthorDid); + return hydrateEmbedVideo(embed, postAuthorDid); } else if (AppBskyEmbedRecord.isMain(embed)) { - result = hydrateEmbedRecord( + return hydrateEmbedRecord( embed, usequerypostresults?.data, quotedProfile, @@ -243,7 +220,7 @@ export function useHydratedEmbed( } if (hydratedMedia) { - result = hydrateEmbedRecordWithMedia( + return hydrateEmbedRecordWithMedia( embed, hydratedMedia, usequerypostresults?.data, @@ -252,23 +229,16 @@ export function useHydratedEmbed( ); } } - setHydratedEmbed(result); } catch (e) { console.error("Error hydrating embed", e); - setHydratedEmbed(undefined); + return undefined; } - }, [ - embed, - postAuthorDid, - isRecordType, - usequerypostresults?.data, - quotedProfile, - queryidentityresult?.data, - ]); + })(); const isLoading = isRecordType ? usequerypostresults?.isLoading || isLoadingProfile || queryidentityresult?.isLoading : false; + const error = usequerypostresults?.error || profileError || queryidentityresult?.error; return { data: hydratedEmbed, isLoading, error }; -- 2.51.2