Add displayName to contexts (#8814)

src/state/a11y.tsx

@@ -8,6 +8,7 @@ const Context = React.createContext({
   reduceMotionEnabled: false,
   screenReaderEnabled: false,
 })
+Context.displayName = 'A11yContext'
 
 export function useA11y() {
   return React.useContext(Context)

src/state/ageAssurance/index.tsx

@@ -28,11 +28,13 @@ const AgeAssuranceContext = createContext<AgeAssuranceContextType>({
   lastInitiatedAt: undefined,
   isAgeRestricted: false,
 })
+AgeAssuranceContext.displayName = 'AgeAssuranceContext'
 
 const AgeAssuranceAPIContext = createContext<AgeAssuranceAPIContextType>({
   // @ts-ignore can't be bothered to type this
   refetch: () => Promise.resolve(),
 })
+AgeAssuranceAPIContext.displayName = 'AgeAssuranceAPIContext'
 
 /**
  * Low-level provider for fetching age assurance state on app load. Do not add

src/state/cache/thread-mutes.tsx

@@ -7,9 +7,11 @@ type StateContext = Map<string, boolean>
 type SetStateContext = (uri: string, value: boolean) => void
 
 const stateContext = React.createContext<StateContext>(new Map())
+stateContext.displayName = 'ThreadMutesStateContext'
 const setStateContext = React.createContext<SetStateContext>(
   (_: string) => false,
 )
+setStateContext.displayName = 'ThreadMutesSetStateContext'
 
 export function Provider({children}: React.PropsWithChildren<{}>) {
   const [state, setState] = React.useState<StateContext>(() => new Map())

src/state/dialogs/index.tsx

@@ -26,10 +26,12 @@ interface IDialogControlContext {
 }
 
 const DialogContext = React.createContext<IDialogContext>({} as IDialogContext)
+DialogContext.displayName = 'DialogContext'
 
 const DialogControlContext = React.createContext<IDialogControlContext>(
   {} as IDialogControlContext,
 )
+DialogControlContext.displayName = 'DialogControlContext'
 
 /**
  * The number of dialogs that are fully expanded. This is used to determine the background color of the status bar
@@ -107,3 +109,4 @@ export function Provider({children}: React.PropsWithChildren<{}>) {
     </DialogContext.Provider>
   )
 }
+Provider.displayName = 'DialogsProvider'

src/state/feed-feedback.tsx

@@ -35,6 +35,7 @@ const stateContext = createContext<StateContext>({
   sendInteraction: (_interaction: AppBskyFeedDefs.Interaction) => {},
   feedDescriptor: undefined,
 })
+stateContext.displayName = 'FeedFeedbackContext'
 
 export function useFeedFeedback(
   feed: FeedDescriptor | undefined,

src/state/geolocation.tsx

@@ -154,6 +154,7 @@ type Context = {
 const context = React.createContext<Context>({
   geolocation: DEFAULT_GEOLOCATION,
 })
+context.displayName = 'GeolocationContext'
 
 export function Provider({children}: {children: React.ReactNode}) {
   const [geolocation, setGeolocation] = React.useState(() => {

src/state/global-gesture-events/index.tsx

@@ -25,6 +25,7 @@ const Context = createContext<{
   register: () => {},
   unregister: () => {},
 })
+Context.displayName = 'GlobalGestureEventsContext'
 
 export function GlobalGestureEventsProvider({
   children,

src/state/home-badge.tsx

@@ -4,7 +4,9 @@ type StateContext = boolean
 type ApiContext = (hasNew: boolean) => void
 
 const stateContext = React.createContext<StateContext>(false)
+stateContext.displayName = 'HomeBadgeStateContext'
 const apiContext = React.createContext<ApiContext>((_: boolean) => {})
+apiContext.displayName = 'HomeBadgeApiContext'
 
 export function Provider({children}: React.PropsWithChildren<{}>) {
   const [state, setState] = React.useState(false)

src/state/invites.tsx

@@ -10,9 +10,11 @@ type ApiContext = {
 const stateContext = React.createContext<StateContext>(
   persisted.defaults.invites,
 )
+stateContext.displayName = 'InvitesStateContext'
 const apiContext = React.createContext<ApiContext>({
   setInviteCopied(_: string) {},
 })
+apiContext.displayName = 'InvitesApiContext'
 
 export function Provider({children}: React.PropsWithChildren<{}>) {
   const [state, setState] = React.useState(persisted.get('invites'))

src/state/lightbox.tsx

@@ -2,7 +2,7 @@ import React from 'react'
 import {nanoid} from 'nanoid/non-secure'
 
 import {useNonReactiveCallback} from '#/lib/hooks/useNonReactiveCallback'
-import {ImageSource} from '#/view/com/lightbox/ImageViewing/@types'
+import {type ImageSource} from '#/view/com/lightbox/ImageViewing/@types'
 
 export type Lightbox = {
   id: string
@@ -15,6 +15,7 @@ const LightboxContext = React.createContext<{
 }>({
   activeLightbox: null,
 })
+LightboxContext.displayName = 'LightboxContext'
 
 const LightboxControlContext = React.createContext<{
   openLightbox: (lightbox: Omit<Lightbox, 'id'>) => void
@@ -23,6 +24,7 @@ const LightboxControlContext = React.createContext<{
   openLightbox: () => {},
   closeLightbox: () => false,
 })
+LightboxControlContext.displayName = 'LightboxControlContext'
 
 export function Provider({children}: React.PropsWithChildren<{}>) {
   const [activeLightbox, setActiveLightbox] = React.useState<Lightbox | null>(

src/state/messages/convo/index.tsx

@@ -26,6 +26,7 @@ import {useAgent} from '#/state/session'
 export * from '#/state/messages/convo/util'
 
 const ChatContext = React.createContext<ConvoState | null>(null)
+ChatContext.displayName = 'ChatContext'
 
 export function useConvo() {
   const ctx = useContext(ChatContext)

src/state/messages/current-convo-id.tsx

@@ -7,6 +7,7 @@ const CurrentConvoIdContext = React.createContext<{
   currentConvoId: undefined,
   setCurrentConvoId: () => {},
 })
+CurrentConvoIdContext.displayName = 'CurrentConvoIdContext'
 
 export function useCurrentConvoId() {
   const ctx = React.useContext(CurrentConvoIdContext)

src/state/messages/events/index.tsx

@@ -7,6 +7,7 @@ import {useAgent, useSession} from '#/state/session'
 const MessagesEventBusContext = React.createContext<MessagesEventBus | null>(
   null,
 )
+MessagesEventBusContext.displayName = 'MessagesEventBusContext'
 
 export function useMessagesEventBus() {
   const ctx = React.useContext(MessagesEventBusContext)

src/state/messages/message-drafts.tsx

@@ -6,6 +6,7 @@ const MessageDraftsContext = React.createContext<{
   state: State
   dispatch: React.Dispatch<Actions>
 } | null>(null)
+MessageDraftsContext.displayName = 'MessageDraftsContext'
 
 function useMessageDraftsContext() {
   const ctx = React.useContext(MessageDraftsContext)

src/state/modals/index.tsx

@@ -70,6 +70,7 @@ const ModalContext = React.createContext<{
   isModalActive: false,
   activeModals: [],
 })
+ModalContext.displayName = 'ModalContext'
 
 const ModalControlContext = React.createContext<{
   openModal: (modal: Modal) => void
@@ -80,6 +81,7 @@ const ModalControlContext = React.createContext<{
   closeModal: () => false,
   closeAllModals: () => false,
 })
+ModalControlContext.displayName = 'ModalControlContext'
 
 export function Provider({children}: React.PropsWithChildren<{}>) {
   const [activeModals, setActiveModals] = React.useState<Modal[]>([])

src/state/preferences/alt-text-required.tsx

@@ -8,9 +8,11 @@ type SetContext = (v: persisted.Schema['requireAltTextEnabled']) => void
 const stateContext = React.createContext<StateContext>(
   persisted.defaults.requireAltTextEnabled,
 )
+stateContext.displayName = 'AltTextRequiredStateContext'
 const setContext = React.createContext<SetContext>(
   (_: persisted.Schema['requireAltTextEnabled']) => {},
 )
+setContext.displayName = 'AltTextRequiredSetContext'
 
 export function Provider({children}: React.PropsWithChildren<{}>) {
   const [state, setState] = React.useState(

src/state/preferences/autoplay.tsx

@@ -8,7 +8,9 @@ type SetContext = (v: boolean) => void
 const stateContext = React.createContext<StateContext>(
   Boolean(persisted.defaults.disableAutoplay),
 )
+stateContext.displayName = 'AutoplayStateContext'
 const setContext = React.createContext<SetContext>((_: boolean) => {})
+setContext.displayName = 'AutoplaySetContext'
 
 export function Provider({children}: {children: React.ReactNode}) {
   const [state, setState] = React.useState(

src/state/preferences/disable-haptics.tsx

@@ -8,7 +8,9 @@ type SetContext = (v: boolean) => void
 const stateContext = React.createContext<StateContext>(
   Boolean(persisted.defaults.disableHaptics),
 )
+stateContext.displayName = 'DisableHapticsStateContext'
 const setContext = React.createContext<SetContext>((_: boolean) => {})
+setContext.displayName = 'DisableHapticsSetContext'
 
 export function Provider({children}: {children: React.ReactNode}) {
   const [state, setState] = React.useState(

src/state/preferences/external-embeds-prefs.tsx

@@ -1,6 +1,6 @@
 import React from 'react'
 
-import {EmbedPlayerSource} from '#/lib/strings/embed-player'
+import {type EmbedPlayerSource} from '#/lib/strings/embed-player'
 import * as persisted from '#/state/persisted'
 
 type StateContext = persisted.Schema['externalEmbeds']
@@ -12,7 +12,9 @@ type SetContext = (
 const stateContext = React.createContext<StateContext>(
   persisted.defaults.externalEmbeds,
 )
+stateContext.displayName = 'ExternalEmbedsPrefsStateContext'
 const setContext = React.createContext<SetContext>({} as SetContext)
+setContext.displayName = 'ExternalEmbedsPrefsSetContext'
 
 export function Provider({children}: React.PropsWithChildren<{}>) {
   const [state, setState] = React.useState(persisted.get('externalEmbeds'))

src/state/preferences/hidden-posts.tsx

@@ -14,10 +14,12 @@ type ApiContext = {
 const stateContext = React.createContext<StateContext>(
   persisted.defaults.hiddenPosts,
 )
+stateContext.displayName = 'HiddenPostsStateContext'
 const apiContext = React.createContext<ApiContext>({
   hidePost: () => {},
   unhidePost: () => {},
 })
+apiContext.displayName = 'HiddenPostsApiContext'
 
 export function Provider({children}: React.PropsWithChildren<{}>) {
   const [state, setState] = React.useState(persisted.get('hiddenPosts'))

src/state/preferences/in-app-browser.tsx

@@ -8,9 +8,11 @@ type SetContext = (v: persisted.Schema['useInAppBrowser']) => void
 const stateContext = React.createContext<StateContext>(
   persisted.defaults.useInAppBrowser,
 )
+stateContext.displayName = 'InAppBrowserStateContext'
 const setContext = React.createContext<SetContext>(
   (_: persisted.Schema['useInAppBrowser']) => {},
 )
+setContext.displayName = 'InAppBrowserSetContext'
 
 export function Provider({children}: React.PropsWithChildren<{}>) {
   const [state, setState] = React.useState(persisted.get('useInAppBrowser'))

src/state/preferences/kawaii.tsx

@@ -8,6 +8,7 @@ type StateContext = persisted.Schema['kawaii']
 const stateContext = React.createContext<StateContext>(
   persisted.defaults.kawaii,
 )
+stateContext.displayName = 'KawaiiStateContext'
 
 export function Provider({children}: React.PropsWithChildren<{}>) {
   const [state, setState] = React.useState(persisted.get('kawaii'))

src/state/preferences/label-defs.tsx

@@ -1,5 +1,8 @@
 import React from 'react'
-import {AppBskyLabelerDefs, InterpretedLabelValueDefinition} from '@atproto/api'
+import {
+  type AppBskyLabelerDefs,
+  type InterpretedLabelValueDefinition,
+} from '@atproto/api'
 
 import {useLabelDefinitionsQuery} from '../queries/preferences'
 
@@ -12,6 +15,7 @@ const stateContext = React.createContext<StateContext>({
   labelDefs: {},
   labelers: [],
 })
+stateContext.displayName = 'LabelDefsStateContext'
 
 export function Provider({children}: React.PropsWithChildren<{}>) {
   const state = useLabelDefinitionsQuery()

src/state/preferences/languages.tsx

@@ -1,6 +1,6 @@
 import React from 'react'
 
-import {AppLanguage} from '#/locale/languages'
+import {type AppLanguage} from '#/locale/languages'
 import * as persisted from '#/state/persisted'
 
 type SetStateCb = (
@@ -20,6 +20,7 @@ type ApiContext = {
 const stateContext = React.createContext<StateContext>(
   persisted.defaults.languagePrefs,
 )
+stateContext.displayName = 'LanguagePrefsStateContext'
 const apiContext = React.createContext<ApiContext>({
   setPrimaryLanguage: (_: string) => {},
   setPostLanguage: (_: string) => {},
@@ -29,6 +30,7 @@ const apiContext = React.createContext<ApiContext>({
   savePostLanguageToHistory: () => {},
   setAppLanguage: (_: AppLanguage) => {},
 })
+apiContext.displayName = 'LanguagePrefsApiContext'
 
 export function Provider({children}: React.PropsWithChildren<{}>) {
   const [state, setState] = React.useState(persisted.get('languagePrefs'))

src/state/preferences/large-alt-badge.tsx

@@ -8,9 +8,11 @@ type SetContext = (v: persisted.Schema['largeAltBadgeEnabled']) => void
 const stateContext = React.createContext<StateContext>(
   persisted.defaults.largeAltBadgeEnabled,
 )
+stateContext.displayName = 'LargeAltBadgeStateContext'
 const setContext = React.createContext<SetContext>(
   (_: persisted.Schema['largeAltBadgeEnabled']) => {},
 )
+setContext.displayName = 'LargeAltBadgeSetContext'
 
 export function Provider({children}: React.PropsWithChildren<{}>) {
   const [state, setState] = React.useState(

src/state/preferences/moderation-opts.tsx

@@ -1,5 +1,5 @@
-import React, {createContext, useContext, useMemo} from 'react'
-import {BskyAgent, ModerationOpts} from '@atproto/api'
+import {createContext, useContext, useMemo} from 'react'
+import {BskyAgent, type ModerationOpts} from '@atproto/api'
 
 import {useHiddenPosts, useLabelDefinitions} from '#/state/preferences'
 import {DEFAULT_LOGGED_OUT_LABEL_PREFERENCES} from '#/state/queries/preferences/moderation'
@@ -9,11 +9,13 @@ import {usePreferencesQuery} from '../queries/preferences'
 export const moderationOptsContext = createContext<ModerationOpts | undefined>(
   undefined,
 )
+moderationOptsContext.displayName = 'ModerationOptsContext'
 
 // used in the moderation state devtool
 export const moderationOptsOverrideContext = createContext<
   ModerationOpts | undefined
 >(undefined)
+moderationOptsOverrideContext.displayName = 'ModerationOptsOverrideContext'
 
 export function useModerationOpts() {
   return useContext(moderationOptsContext)

src/state/preferences/subtitles.tsx

@@ -8,7 +8,9 @@ type SetContext = (v: boolean) => void
 const stateContext = React.createContext<StateContext>(
   Boolean(persisted.defaults.subtitlesEnabled),
 )
+stateContext.displayName = 'SubtitlesStateContext'
 const setContext = React.createContext<SetContext>((_: boolean) => {})
+setContext.displayName = 'SubtitlesSetContext'
 
 export function Provider({children}: {children: React.ReactNode}) {
   const [state, setState] = React.useState(

src/state/preferences/trending.tsx

@@ -22,10 +22,12 @@ const StateContext = React.createContext<StateContext>({
   trendingDisabled: Boolean(persisted.defaults.trendingDisabled),
   trendingVideoDisabled: Boolean(persisted.defaults.trendingVideoDisabled),
 })
+StateContext.displayName = 'TrendingStateContext'
 const ApiContext = React.createContext<ApiContext>({
   setTrendingDisabled() {},
   setTrendingVideoDisabled() {},
 })
+ApiContext.displayName = 'TrendingApiContext'
 
 function usePersistedBooleanValue<T extends keyof persisted.Schema>(key: T) {
   const [value, _set] = React.useState(() => {

src/state/preferences/used-starter-packs.tsx

@@ -6,7 +6,9 @@ type StateContext = boolean | undefined
 type SetContext = (v: boolean) => void
 
 const stateContext = React.createContext<StateContext>(false)
+stateContext.displayName = 'UsedStarterPacksStateContext'
 const setContext = React.createContext<SetContext>((_: boolean) => {})
+setContext.displayName = 'UsedStarterPacksSetContext'
 
 export function Provider({children}: {children: React.ReactNode}) {
   const [state, setState] = React.useState<StateContext>(() =>

src/state/queries/messages/list-conversations.tsx

@@ -62,6 +62,7 @@ const ListConvosContext = createContext<{
   accepted: ChatBskyConvoDefs.ConvoView[]
   request: ChatBskyConvoDefs.ConvoView[]
 } | null>(null)
+ListConvosContext.displayName = 'ListConvosContext'
 
 export function useListConvos() {
   const ctx = useContext(ListConvosContext)

src/state/queries/notifications/unread.tsx

@@ -35,12 +35,14 @@ interface ApiContext {
 }
 
 const stateContext = React.createContext<StateContext>('')
+stateContext.displayName = 'NotificationsUnreadStateContext'
 
 const apiContext = React.createContext<ApiContext>({
   async markAllRead() {},
   async checkUnread() {},
   getCachedUnreadPage: () => undefined,
 })
+apiContext.displayName = 'NotificationsUnreadApiContext'
 
 export function Provider({children}: React.PropsWithChildren<{}>) {
   const {hasSession} = useSession()

src/state/service-config.tsx

@@ -16,8 +16,10 @@ type LiveNowContext = {
 const TrendingContext = createContext<TrendingContext>({
   enabled: false,
 })
+TrendingContext.displayName = 'TrendingContext'
 
 const LiveNowContext = createContext<LiveNowContext | null>(null)
+LiveNowContext.displayName = 'LiveNowContext'
 
 export function Provider({children}: {children: React.ReactNode}) {
   const langPrefs = useLanguagePrefs()

src/state/session/index.tsx

@@ -30,8 +30,10 @@ const StateContext = React.createContext<SessionStateContext>({
   currentAccount: undefined,
   hasSession: false,
 })
+StateContext.displayName = 'SessionStateContext'
 
 const AgentContext = React.createContext<BskyAgent | null>(null)
+AgentContext.displayName = 'SessionAgentContext'
 
 const ApiContext = React.createContext<SessionApiContext>({
   createAccount: async () => {},
@@ -42,6 +44,7 @@ const ApiContext = React.createContext<SessionApiContext>({
   removeAccount: () => {},
   partialRefreshSession: async () => {},
 })
+ApiContext.displayName = 'SessionApiContext'
 
 export function Provider({children}: React.PropsWithChildren<{}>) {
   const cancelPendingTask = useOneTaskAtATime()

src/state/shell/color-mode.tsx

@@ -15,7 +15,9 @@ const stateContext = React.createContext<StateContext>({
   colorMode: 'system',
   darkTheme: 'dark',
 })
+stateContext.displayName = 'ColorModeStateContext'
 const setContext = React.createContext<SetContext>({} as SetContext)
+setContext.displayName = 'ColorModeSetContext'
 
 export function Provider({children}: React.PropsWithChildren<{}>) {
   const [colorMode, setColorMode] = React.useState(persisted.get('colorMode'))

src/state/shell/composer/index.tsx

@@ -51,12 +51,14 @@ type ControlsContext = {
 }
 
 const stateContext = React.createContext<StateContext>(undefined)
+stateContext.displayName = 'ComposerStateContext'
 const controlsContext = React.createContext<ControlsContext>({
   openComposer(_opts: ComposerOpts) {},
   closeComposer() {
     return false
   },
 })
+controlsContext.displayName = 'ComposerControlsContext'
 
 export function Provider({children}: React.PropsWithChildren<{}>) {
   const {_} = useLingui()

src/state/shell/drawer-open.tsx

@@ -4,7 +4,9 @@ type StateContext = boolean
 type SetContext = (v: boolean) => void
 
 const stateContext = React.createContext<StateContext>(false)
+stateContext.displayName = 'DrawerOpenStateContext'
 const setContext = React.createContext<SetContext>((_: boolean) => {})
+setContext.displayName = 'DrawerOpenSetContext'
 
 export function Provider({children}: React.PropsWithChildren<{}>) {
   const [state, setState] = React.useState(false)

src/state/shell/drawer-swipe-disabled.tsx

@@ -4,7 +4,9 @@ type StateContext = boolean
 type SetContext = (v: boolean) => void
 
 const stateContext = React.createContext<StateContext>(false)
+stateContext.displayName = 'DrawerSwipeDisabledStateContext'
 const setContext = React.createContext<SetContext>((_: boolean) => {})
+setContext.displayName = 'DrawerSwipeDisabledSetContext'
 
 export function Provider({children}: React.PropsWithChildren<{}>) {
   const [state, setState] = React.useState(false)

src/state/shell/logged-out.tsx

@@ -39,12 +39,14 @@ const StateContext = React.createContext<State>({
   showLoggedOut: false,
   requestedAccountSwitchTo: undefined,
 })
+StateContext.displayName = 'LoggedOutStateContext'
 
 const ControlsContext = React.createContext<Controls>({
   setShowLoggedOut: () => {},
   requestSwitchToAccount: () => {},
   clearRequestedAccount: () => {},
 })
+ControlsContext.displayName = 'LoggedOutControlsContext'
 
 export function Provider({children}: React.PropsWithChildren<{}>) {
   const activeStarterPack = useActiveStarterPack()

src/state/shell/minimal-mode.tsx

@@ -1,5 +1,9 @@
 import React from 'react'
-import {SharedValue, useSharedValue, withSpring} from 'react-native-reanimated'
+import {
+  type SharedValue,
+  useSharedValue,
+  withSpring,
+} from 'react-native-reanimated'
 
 type StateContext = {
   headerMode: SharedValue<number>
@@ -29,7 +33,9 @@ const stateContext = React.createContext<StateContext>({
     set() {},
   },
 })
+stateContext.displayName = 'MinimalModeStateContext'
 const setContext = React.createContext<SetContext>((_: boolean) => {})
+setContext.displayName = 'MinimalModeSetContext'
 
 export function Provider({children}: React.PropsWithChildren<{}>) {
   const headerMode = useSharedValue(0)

src/state/shell/onboarding.tsx

@@ -29,7 +29,9 @@ export type DispatchContext = (action: Action) => void
 const stateContext = React.createContext<StateContext>(
   compute(persisted.defaults.onboarding),
 )
+stateContext.displayName = 'OnboardingStateContext'
 const dispatchContext = React.createContext<DispatchContext>((_: Action) => {})
+dispatchContext.displayName = 'OnboardingDispatchContext'
 
 function reducer(state: StateContext, action: Action): StateContext {
   switch (action.type) {

src/state/shell/post-progress.tsx

@@ -10,6 +10,7 @@ const PostProgressContext = React.createContext<PostProgressState>({
   progress: 0,
   status: 'idle',
 })
+PostProgressContext.displayName = 'PostProgressContext'
 
 export function Provider() {}
 

src/state/shell/progress-guide.tsx

@@ -5,7 +5,7 @@ import {useLingui} from '@lingui/react'
 import {logEvent} from '#/lib/statsig/statsig'
 import {
   ProgressGuideToast,
-  ProgressGuideToastRef,
+  type ProgressGuideToastRef,
 } from '#/components/ProgressGuide/Toast'
 import {
   usePreferencesQuery,
@@ -45,6 +45,7 @@ export type ProgressGuide =
   | undefined
 
 const ProgressGuideContext = React.createContext<ProgressGuide>(undefined)
+ProgressGuideContext.displayName = 'ProgressGuideContext'
 
 const ProgressGuideControlContext = React.createContext<{
   startProgressGuide(guide: ProgressGuideName): void
@@ -55,6 +56,7 @@ const ProgressGuideControlContext = React.createContext<{
   endProgressGuide: () => {},
   captureAction: (_action: ProgressGuideAction, _count = 1) => {},
 })
+ProgressGuideControlContext.displayName = 'ProgressGuideControlContext'
 
 export function useProgressGuide(guide: ProgressGuideName) {
   const ctx = React.useContext(ProgressGuideContext)

src/state/shell/selected-feed.tsx

@@ -2,13 +2,15 @@ import React from 'react'
 
 import {isWeb} from '#/platform/detection'
 import * as persisted from '#/state/persisted'
-import {FeedDescriptor} from '#/state/queries/post-feed'
+import {type FeedDescriptor} from '#/state/queries/post-feed'
 
 type StateContext = FeedDescriptor | null
 type SetContext = (v: FeedDescriptor) => void
 
 const stateContext = React.createContext<StateContext>(null)
+stateContext.displayName = 'SelectedFeedStateContext'
 const setContext = React.createContext<SetContext>((_: string) => {})
+setContext.displayName = 'SelectedFeedSetContext'
 
 function getInitialFeed(): FeedDescriptor | null {
   if (isWeb) {

src/state/shell/shell-layout.tsx

@@ -1,5 +1,5 @@
 import React from 'react'
-import {SharedValue, useSharedValue} from 'react-native-reanimated'
+import {type SharedValue, useSharedValue} from 'react-native-reanimated'
 
 type StateContext = {
   headerHeight: SharedValue<number>
@@ -28,6 +28,7 @@ const stateContext = React.createContext<StateContext>({
     set() {},
   },
 })
+stateContext.displayName = 'ShellLayoutContext'
 
 export function Provider({children}: React.PropsWithChildren<{}>) {
   const headerHeight = useSharedValue(0)

src/state/shell/starter-pack.tsx

@@ -9,7 +9,9 @@ type StateContext =
 type SetContext = (v: StateContext) => void
 
 const stateContext = React.createContext<StateContext>(undefined)
+stateContext.displayName = 'ActiveStarterPackStateContext'
 const setContext = React.createContext<SetContext>((_: StateContext) => {})
+setContext.displayName = 'ActiveStarterPackSetContext'
 
 export function Provider({children}: {children: React.ReactNode}) {
   const [state, setState] = React.useState<StateContext>()

src/state/shell/tick-every-minute.tsx

@@ -3,6 +3,7 @@ import React from 'react'
 type StateContext = number
 
 const stateContext = React.createContext<StateContext>(0)
+stateContext.displayName = 'TickEveryMinuteContext'
 
 export function Provider({children}: React.PropsWithChildren<{}>) {
   const [tick, setTick] = React.useState(Date.now())

src/state/threadgate-hidden-replies.tsx

@@ -14,11 +14,13 @@ const StateContext = React.createContext<StateContext>({
   uris: new Set(),
   recentlyUnhiddenUris: new Set(),
 })
+StateContext.displayName = 'ThreadgateHiddenRepliesStateContext'
 
 const ApiContext = React.createContext<ApiContext>({
   addHiddenReplyUri: () => {},
   removeHiddenReplyUri: () => {},
 })
+ApiContext.displayName = 'ThreadgateHiddenRepliesApiContext'
 
 export function Provider({children}: {children: React.ReactNode}) {
   const [uris, setHiddenReplyUris] = React.useState<Set<string>>(new Set())