[Onboarding] Add starterpacks step (#9007)

* add onboarding starterpacks step

* tweak starter pack cards

* fix web styling

* use new API

* add screen transitions to onboarding

* skip host account

* bump limit to 6

* tweak font weight

* rm commented out code

* fix yarn.lock

* limit starter packs experiment to english speakers

src/state/queries/useSuggestedStarterPacksQuery.ts

@@ -9,11 +9,18 @@ import {STALE} from '#/state/queries'
 import {usePreferencesQuery} from '#/state/queries/preferences'
 import {useAgent} from '#/state/session'
 
-export const createSuggestedStarterPacksQueryKey = () => [
+export const createSuggestedStarterPacksQueryKey = (interests?: string[]) => [
   'suggested-starter-packs',
+  interests?.join(','),
 ]
 
-export function useSuggestedStarterPacksQuery({enabled}: {enabled?: boolean}) {
+export function useSuggestedStarterPacksQuery({
+  enabled,
+  overrideInterests,
+}: {
+  enabled?: boolean
+  overrideInterests?: string[]
+}) {
   const agent = useAgent()
   const {data: preferences} = usePreferencesQuery()
   const contentLangs = getContentLanguages().join(',')
@@ -21,13 +28,17 @@ export function useSuggestedStarterPacksQuery({enabled}: {enabled?: boolean}) {
   return useQuery({
     enabled: !!preferences && enabled !== false,
     staleTime: STALE.MINUTES.THREE,
-    queryKey: createSuggestedStarterPacksQueryKey(),
-    async queryFn() {
+    queryKey: createSuggestedStarterPacksQueryKey(overrideInterests),
+    queryFn: async () => {
       const {data} = await agent.app.bsky.unspecced.getSuggestedStarterPacks(
         undefined,
         {
           headers: {
-            ...createBskyTopicsHeader(aggregateUserInterests(preferences)),
+            ...createBskyTopicsHeader(
+              overrideInterests
+                ? overrideInterests.join(',')
+                : aggregateUserInterests(preferences),
+            ),
             'Accept-Language': contentLangs,
           },
         },