Fetch link previews from RQ (#5608)

Co-authored-by: Mary <git@mary.my.id>
Co-authored-by: Hailey <me@haileyok.com>

src/state/shell/composer/index.tsx

@@ -7,9 +7,12 @@ import {
 } from '@atproto/api'
 import {msg} from '@lingui/macro'
 import {useLingui} from '@lingui/react'
+import {useQueryClient} from '@tanstack/react-query'
 
 import {useNonReactiveCallback} from '#/lib/hooks/useNonReactiveCallback'
+import {postUriToRelativePath, toBskyAppUrl} from '#/lib/strings/url-helpers'
 import {purgeTemporaryImageFiles} from '#/state/gallery'
+import {precacheResolveLinkQuery} from '#/state/queries/resolve-link'
 import * as Toast from '#/view/com/util/Toast'
 
 export interface ComposerOptsPostRef {
@@ -58,8 +61,28 @@ const controlsContext = React.createContext<ControlsContext>({
 export function Provider({children}: React.PropsWithChildren<{}>) {
   const {_} = useLingui()
   const [state, setState] = React.useState<StateContext>()
+  const queryClient = useQueryClient()
 
   const openComposer = useNonReactiveCallback((opts: ComposerOpts) => {
+    if (opts.quote) {
+      const path = postUriToRelativePath(opts.quote.uri)
+      if (path) {
+        const appUrl = toBskyAppUrl(path)
+        precacheResolveLinkQuery(queryClient, appUrl, {
+          type: 'record',
+          kind: 'post',
+          record: {
+            cid: opts.quote.cid,
+            uri: opts.quote.uri,
+          },
+          meta: {
+            author: opts.quote.author,
+            indexedAt: opts.quote.indexedAt,
+            text: opts.quote.text,
+          },
+        })
+      }
+    }
     const author = opts.replyTo?.author || opts.quote?.author
     const isBlocked = Boolean(
       author &&

src/state/shell/index.tsx

@@ -1,22 +1,22 @@
 import React from 'react'
-import {Provider as ShellLayoutProvder} from './shell-layout'
+
+import {Provider as ColorModeProvider} from './color-mode'
 import {Provider as DrawerOpenProvider} from './drawer-open'
 import {Provider as DrawerSwipableProvider} from './drawer-swipe-disabled'
 import {Provider as MinimalModeProvider} from './minimal-mode'
-import {Provider as ColorModeProvider} from './color-mode'
 import {Provider as OnboardingProvider} from './onboarding'
-import {Provider as ComposerProvider} from './composer'
+import {Provider as ShellLayoutProvder} from './shell-layout'
 import {Provider as TickEveryMinuteProvider} from './tick-every-minute'
 
+export {useSetThemePrefs, useThemePrefs} from './color-mode'
+export {useComposerControls, useComposerState} from './composer'
 export {useIsDrawerOpen, useSetDrawerOpen} from './drawer-open'
 export {
   useIsDrawerSwipeDisabled,
   useSetDrawerSwipeDisabled,
 } from './drawer-swipe-disabled'
 export {useMinimalShellMode, useSetMinimalShellMode} from './minimal-mode'
-export {useThemePrefs, useSetThemePrefs} from './color-mode'
-export {useOnboardingState, useOnboardingDispatch} from './onboarding'
-export {useComposerState, useComposerControls} from './composer'
+export {useOnboardingDispatch, useOnboardingState} from './onboarding'
 export {useTickEveryMinute} from './tick-every-minute'
 
 export function Provider({children}: React.PropsWithChildren<{}>) {
@@ -27,9 +27,7 @@ export function Provider({children}: React.PropsWithChildren<{}>) {
           <MinimalModeProvider>
             <ColorModeProvider>
               <OnboardingProvider>
-                <ComposerProvider>
-                  <TickEveryMinuteProvider>{children}</TickEveryMinuteProvider>
-                </ComposerProvider>
+                <TickEveryMinuteProvider>{children}</TickEveryMinuteProvider>
               </OnboardingProvider>
             </ColorModeProvider>
           </MinimalModeProvider>