@planningcenter/chat-react-native 3.29.0 → 3.30.0-rc.1

package/src/__tests__/contexts/session_context.tsx

@@ -1,16 +1,16 @@
-import { renderHook, act } from '@testing-library/react-hooks'
+import AsyncStorage from '@react-native-async-storage/async-storage'
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
+import { renderHook, act } from '@testing-library/react-hooks'
 import React, { useContext, Suspense } from 'react'
 import {
   SessionContext,
   SessionContextProvider,
   SessionContextConfig,
 } from '../../contexts/session_context'
-import { StorageAdapter } from '../../utils/native_adapters/storage_adapter'
 import { OAuthToken, FailedResponse } from '../../types'
-import AsyncStorage from '@react-native-async-storage/async-storage'
-import { SessionManager } from '../../utils/session_manager'
+import { StorageAdapter } from '../../utils/native_adapters/storage_adapter'
 import { Session } from '../../utils/session'
+import { SessionManager } from '../../utils/session_manager'
 
 jest.mock('@react-native-async-storage/async-storage')
 

package/src/__tests__/event-polyfill.test.ts

@@ -2,11 +2,10 @@
  * Tests for Event/CustomEvent/EventTarget polyfills
  */
 
-import Event from '../polyfills/events/Event'
-import EventTarget from '../polyfills/events/EventTarget'
 import { CustomEvent } from '../polyfills/events/CustomEvent'
-
 // Set up global polyfill for tests
+import Event from '../polyfills/events/Event'
+import EventTarget from '../polyfills/events/EventTarget'
 ;(global as any).Event = Event
 ;(global as any).CustomEvent = CustomEvent
 

package/src/__tests__/hooks/useTheme.tsx

@@ -1,8 +1,8 @@
-import { renderHook } from '@testing-library/react-native'
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
-import { useTheme } from '../../hooks'
-import { ChatProvider, CreateChatThemeProps } from '../../contexts/chat_context'
+import { renderHook } from '@testing-library/react-native'
 import React from 'react'
+import { ChatProvider, CreateChatThemeProps } from '../../contexts/chat_context'
+import { useTheme } from '../../hooks'
 
 let themeProps: CreateChatThemeProps = {
   theme: {

package/src/__tests__/hooks/use_async_storage.test.tsx

@@ -1,7 +1,7 @@
-import { renderHook, act } from '@testing-library/react-hooks'
+import AsyncStorage from '@react-native-async-storage/async-storage'
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
+import { renderHook, act } from '@testing-library/react-hooks'
 import React, { Suspense } from 'react'
-import AsyncStorage from '@react-native-async-storage/async-storage'
 import { useAsyncStorage } from '../../hooks/use_async_storage'
 
 jest.mock('@react-native-async-storage/async-storage')

package/src/__tests__/hooks/use_conversation_messages.ts

@@ -1,6 +1,6 @@
 import { renderHook } from '@testing-library/react-hooks'
-import * as useSuspenseApi from '../../hooks/use_suspense_api'
 import { useConversationMessages } from '../../hooks/use_conversation_messages'
+import * as useSuspenseApi from '../../hooks/use_suspense_api'
 
 const mockMessages = [
   {

package/src/__tests__/utils/client.ts

@@ -1,8 +1,8 @@
-import MockServer from '../../__utils__/server'
-import Client from '../../utils/client/client'
 import DefaultFixtures from '../../__utils__/fixtures/defaults'
 import { BASE_URL } from '../../__utils__/handlers'
+import MockServer from '../../__utils__/server'
 import { FailedResponse } from '../../types'
+import Client from '../../utils/client/client'
 
 const APP_BASE_URL = BASE_URL
 let client: Client

package/src/__tests__/utils/native_adapters/configuration.ts

@@ -1,6 +1,5 @@
 import * as React from 'react'
 import { Linking as RNLinking } from 'react-native'
-import { ChatAdapters, Linking, Haptic } from '../../../utils/native_adapters/configuration'
 import {
   AudioAdapter,
   Clipboard,
@@ -9,8 +8,9 @@ import {
   LinkingAdapter,
   VideoAdapter,
 } from '../../../utils/native_adapters'
-import { VideoPlayerHandle, VideoPlayerProps } from '../../../utils/native_adapters/video'
+import { ChatAdapters, Linking, Haptic } from '../../../utils/native_adapters/configuration'
 import { HapticAdapter } from '../../../utils/native_adapters/haptic'
+import { VideoPlayerHandle, VideoPlayerProps } from '../../../utils/native_adapters/video'
 
 describe('ChatAdapters', () => {
   const getStringAsync = jest.fn(async () => '')

package/src/__utils__/handlers.ts

@@ -1,6 +1,6 @@
 import { http, HttpResponse } from 'msw'
-import DefaultFixtures from './fixtures/defaults'
 import { JSONAPIResponse } from '../types'
+import DefaultFixtures from './fixtures/defaults'
 
 export const BASE_URL = 'http://api.pco.test/chat/v2'
 

package/src/components/conversation/attachments/attachment_card.tsx

@@ -1,8 +1,8 @@
 import React, { ComponentProps, ReactNode } from 'react'
 import { StyleSheet, View } from 'react-native'
-import { Text } from '../../display'
-import { tokens } from '../../../vendor/tapestry/tokens'
 import { useTheme } from '../../../hooks'
+import { tokens } from '../../../vendor/tapestry/tokens'
+import { Text } from '../../display'
 
 type AttachmentCardProps = ComponentProps<typeof View>
 

package/src/components/conversation/attachments/attachment_deleting_overlay.tsx

@@ -1,7 +1,7 @@
 import React from 'react'
 import { View, StyleSheet } from 'react-native'
-import { Spinner } from '../../display'
 import { useTheme } from '../../../hooks'
+import { Spinner } from '../../display'
 
 export function AttachmentDeletingOverlay() {
   const styles = useStyles()

package/src/components/conversation/attachments/audio_attachment.tsx

@@ -1,11 +1,11 @@
+import { PlatformPressable } from '@react-navigation/elements'
 import React from 'react'
 import { View, StyleSheet } from 'react-native'
+import { useTheme } from '../../../hooks'
 import { DenormalizedMessageAttachmentResource } from '../../../types/resources/denormalized_attachment_resource'
+import { Audio } from '../../../utils/native_adapters'
 import { IconButton, Text } from '../../display'
 import { AttachmentCard, AttachmentCardTitle } from './attachment_card'
-import { useTheme } from '../../../hooks'
-import { Audio } from '../../../utils/native_adapters'
-import { PlatformPressable } from '@react-navigation/elements'
 import { AttachmentDeletingOverlay } from './attachment_deleting_overlay'
 
 export function AudioAttachment({

package/src/components/conversation/attachments/expanded_link.tsx

@@ -1,10 +1,10 @@
+import { PlatformPressable } from '@react-navigation/elements'
 import React from 'react'
 import { Image, StyleSheet, Text, View } from 'react-native'
 import { useTheme } from '../../../hooks'
-import { tokens } from '../../../vendor/tapestry/tokens'
 import { DenormalizedExpandedLinkAttachmentResource } from '../../../types/resources/denormalized_attachment_resource'
-import { PlatformPressable } from '@react-navigation/elements'
 import { Linking } from '../../../utils'
+import { tokens } from '../../../vendor/tapestry/tokens'
 
 export function ExpandedLink({
   attachment,

package/src/components/conversation/attachments/generic_file_attachment.tsx

@@ -1,12 +1,12 @@
+import { PlatformPressable } from '@react-navigation/elements'
 import React from 'react'
 import { StyleSheet, View } from 'react-native'
-import { DenormalizedMessageAttachmentResource } from '../../../types/resources/denormalized_attachment_resource'
-import { AttachmentCard, AttachmentCardTitle } from './attachment_card'
-import { Icon } from '../../display'
 import { useTheme } from '../../../hooks'
-import { PlatformPressable } from '@react-navigation/elements'
-import { tokens } from '../../../vendor/tapestry/tokens'
+import { DenormalizedMessageAttachmentResource } from '../../../types/resources/denormalized_attachment_resource'
 import { Linking } from '../../../utils'
+import { tokens } from '../../../vendor/tapestry/tokens'
+import { Icon } from '../../display'
+import { AttachmentCard, AttachmentCardTitle } from './attachment_card'
 import { AttachmentDeletingOverlay } from './attachment_deleting_overlay'
 
 export function GenericFileAttachment({

package/src/components/conversation/attachments/giphy_attachment.tsx

@@ -1,11 +1,11 @@
+import { PlatformPressable } from '@react-navigation/elements'
 import React from 'react'
 import { Text, StyleSheet, Linking } from 'react-native'
-import { tokens } from '../../../vendor/tapestry/tokens'
 import { useTheme } from '../../../hooks'
 import { DenormalizedGiphyAttachmentResource } from '../../../types/resources/denormalized_attachment_resource'
-import { PlatformPressable } from '@react-navigation/elements'
-import { Image } from '../../display'
 import { assertKeysAreNumbers } from '../../../utils'
+import { tokens } from '../../../vendor/tapestry/tokens'
+import { Image } from '../../display'
 
 export function GiphyAttachment({
   attachment,

package/src/components/conversation/attachments/image_attachment.tsx

@@ -1,3 +1,5 @@
+import { PlatformPressable } from '@react-navigation/elements'
+import colorFunction from 'color'
 import React, { useMemo, useState, Dispatch, SetStateAction, useCallback, useRef } from 'react'
 import {
   StatusBar,
@@ -10,7 +12,6 @@ import {
   NativeScrollEvent,
   ViewToken,
 } from 'react-native'
-import { useSafeAreaInsets, SafeAreaProvider } from 'react-native-safe-area-context'
 import {
   FlatList,
   Gesture,
@@ -26,14 +27,13 @@ import Animated, {
   withDecay,
   SharedValue,
 } from 'react-native-reanimated'
-import { tokens } from '../../../vendor/tapestry/tokens'
-import { IconButton, Image, Heading, Text } from '../../display'
-import colorFunction from 'color'
-import { formatDatePreview } from '../../../utils/date'
-import { DenormalizedMessageAttachmentResource } from '../../../types/resources/denormalized_attachment_resource'
-import { PlatformPressable } from '@react-navigation/elements'
+import { useSafeAreaInsets, SafeAreaProvider } from 'react-native-safe-area-context'
 import { useTheme } from '../../../hooks'
+import { DenormalizedMessageAttachmentResource } from '../../../types/resources/denormalized_attachment_resource'
 import { Haptic, platformFontWeightMedium } from '../../../utils'
+import { formatDatePreview } from '../../../utils/date'
+import { tokens } from '../../../vendor/tapestry/tokens'
+import { IconButton, Image, Heading, Text } from '../../display'
 import { AttachmentDeletingOverlay } from './attachment_deleting_overlay'
 
 const { width: WINDOW_WIDTH, height: WINDOW_HEIGHT } = Dimensions.get('window')

package/src/components/conversation/attachments/video_attachment.tsx

@@ -1,13 +1,13 @@
+import { PlatformPressable } from '@react-navigation/elements'
 import React, { useRef, useState } from 'react'
 import { View, StyleSheet } from 'react-native'
+import { useTheme } from '../../../hooks'
 import { DenormalizedMessageAttachmentResource } from '../../../types/resources/denormalized_attachment_resource'
-import { MESSAGE_ATTACHMENT_WIDTH_SINGLE } from './constants'
-import { Icon } from '../../display'
 import { Video, VideoPlayerHandle } from '../../../utils/native_adapters'
-import { PlatformPressable } from '@react-navigation/elements'
-import { useTheme } from '../../../hooks'
 import { tokens } from '../../../vendor/tapestry/tokens'
+import { Icon } from '../../display'
 import { AttachmentDeletingOverlay } from './attachment_deleting_overlay'
+import { MESSAGE_ATTACHMENT_WIDTH_SINGLE } from './constants'
 
 export function VideoAttachment({
   attachment,

package/src/components/conversation/jump_to_bottom_button.tsx

@@ -8,8 +8,8 @@ import Animated, {
   ReduceMotion,
   withSpring,
 } from 'react-native-reanimated'
-import { platformFontWeightMedium } from '../../utils'
 import { useTheme } from '../../hooks'
+import { platformFontWeightMedium } from '../../utils'
 import { Icon, Text } from '../display'
 
 interface JumpToBottomButtonProps {

package/src/components/conversation/message.tsx

@@ -1,4 +1,5 @@
 import { useNavigation } from '@react-navigation/native'
+import { some } from 'lodash'
 import React, { useEffect } from 'react'
 import {
   AccessibilityActionEvent,
@@ -7,6 +8,7 @@ import {
   useWindowDimensions,
   View,
 } from 'react-native'
+import Animated from 'react-native-reanimated'
 import { MessageReaction } from '../../components/conversation/message_reaction'
 import { Avatar, Icon, Spinner, Text, TextButton, TextInlineButton } from '../../components/display'
 import {
@@ -14,28 +16,26 @@ import {
   useInteractionGhostBackgroundColor,
   useTheme,
 } from '../../hooks'
+import { useDeletingIds } from '../../hooks'
+import { useConversationMessage } from '../../hooks/use_conversation_message'
+import { useLiveRelativeTime } from '../../hooks/use_live_relative_time'
+import { useMessageCreateOrUpdate } from '../../hooks/use_message_create_or_update'
 import { MessageResource } from '../../types'
-import { ReactionCountResource } from '../../types/resources/reaction'
-import { MessageAttachments } from './message_attachments'
-import ErrorBoundary from '../page/error_boundary'
-import { MessageMarkdown } from './message_markdown'
 import { DenormalizedMessageAttachmentResource } from '../../types/resources/denormalized_attachment_resource'
+import { ReactionCountResource } from '../../types/resources/reaction'
+import { pluralize } from '../../utils'
+import { isNewMessage } from '../../utils/cache/messages_cache'
+import { Haptic } from '../../utils/native_adapters'
 import {
   CONVERSATION_MESSAGE_LIST_PADDING_HORIZONTAL,
   MESSAGE_AUTHOR_AVATAR_COLUMN_WIDTH,
   platformFontWeightMedium,
 } from '../../utils/styles'
-import Animated from 'react-native-reanimated'
-import { useLiveRelativeTime } from '../../hooks/use_live_relative_time'
+import ErrorBoundary from '../page/error_boundary'
+import { MessageAttachments } from './message_attachments'
+import { MessageMarkdown } from './message_markdown'
 import { MessageReadReceipts } from './message_read_receipts'
-import { useMessageCreateOrUpdate } from '../../hooks/use_message_create_or_update'
-import { Haptic } from '../../utils/native_adapters'
 import { TheirReplyConnector, MyReplyConnector, AVATAR_CONNECTOR_SPACING } from './reply_connectors'
-import { pluralize } from '../../utils'
-import { useConversationMessage } from '../../hooks/use_conversation_message'
-import { some } from 'lodash'
-import { isNewMessage } from '../../utils/cache/messages_cache'
-import { useDeletingIds } from '../../hooks'
 
 /** Message
  * Component for display of a message within a conversation list

package/src/components/conversation/message_attachments.tsx

@@ -1,16 +1,16 @@
 import React from 'react'
 import { View, StyleSheet } from 'react-native'
+import { useDeletingIds } from '../../hooks'
 import {
   DenormalizedAttachmentResource,
   DenormalizedMessageAttachmentResource,
 } from '../../types/resources/denormalized_attachment_resource'
 import { AudioAttachment } from './attachments/audio_attachment'
-import { VideoAttachment } from './attachments/video_attachment'
-import { GiphyAttachment } from './attachments/giphy_attachment'
-import { GenericFileAttachment } from './attachments/generic_file_attachment'
 import { ExpandedLink } from './attachments/expanded_link'
+import { GenericFileAttachment } from './attachments/generic_file_attachment'
+import { GiphyAttachment } from './attachments/giphy_attachment'
 import { ImageAttachment, type MetaProps } from './attachments/image_attachment'
-import { useDeletingIds } from '../../hooks'
+import { VideoAttachment } from './attachments/video_attachment'
 
 export function MessageAttachments(props: {
   attachments: DenormalizedAttachmentResource[]

package/src/components/conversation/message_form/message_form_attachment_image.tsx

@@ -1,6 +1,6 @@
 import React from 'react'
-import { ImageAttachmentPreview } from '../../display'
 import { FileAttachment } from '../../../types/resources/denormalized_attachment_resource_for_create'
+import { ImageAttachmentPreview } from '../../display'
 
 interface Props {
   uri: string

package/src/components/conversation/message_form/message_form_attachment_video.tsx

@@ -1,6 +1,6 @@
 import React from 'react'
-import { VideoAttachmentPreview } from '../../display'
 import { FileAttachment } from '../../../types/resources/denormalized_attachment_resource_for_create'
+import { VideoAttachmentPreview } from '../../display'
 
 interface Props {
   status: FileAttachment['status']

package/src/components/conversation/message_form.tsx

@@ -11,7 +11,9 @@ import {
   ViewProps,
   Keyboard,
 } from 'react-native'
+import LinearGradient from 'react-native-linear-gradient'
 import { Heading, Icon, IconButton, IconString, Text, TextButton } from '../../components'
+import { ChatContext } from '../../contexts/chat_context'
 import {
   useCreateAndroidRippleColor,
   useTheme,
@@ -19,31 +21,27 @@ import {
   useScalableNumberOfLines,
   useFontScale,
 } from '../../hooks'
-import { ConversationResource, MessageResource } from '../../types'
-
-import { ConversationScreenProps } from '../../screens/conversation_screen'
-
-import { ChatContext } from '../../contexts/chat_context'
-import { Haptic, ImagePicker, ImagePickerResult } from '../../utils/native_adapters'
-import {
-  MAX_FONT_SIZE_MULTIPLIER_LANDMARK,
-  platformFontWeightMedium,
-  platformPressedOpacityStyle,
-} from '../../utils'
 import { useAttachmentUploader } from '../../hooks/use_attachment_uploader'
+import { useBroadcastTypingStatus } from '../../hooks/use_broadcast_typing_status'
+import { useMessageCreateOrUpdate } from '../../hooks/use_message_create_or_update'
 import { useMessageDraft } from '../../hooks/use_message_draft'
+import { ConversationScreenProps } from '../../screens/conversation_screen'
+import { ConversationResource, MessageResource } from '../../types'
 import {
   DenormalizedAttachmentResourceForCreate,
   DenormalizedMessageAttachmentResourceForCreate,
 } from '../../types/resources/denormalized_attachment_resource_for_create'
-import { MessageFormAttachmentImage } from './message_form/message_form_attachment_image'
-import { useMessageCreateOrUpdate } from '../../hooks/use_message_create_or_update'
-import { useBroadcastTypingStatus } from '../../hooks/use_broadcast_typing_status'
+import {
+  MAX_FONT_SIZE_MULTIPLIER_LANDMARK,
+  platformFontWeightMedium,
+  platformPressedOpacityStyle,
+} from '../../utils'
+import { Haptic, ImagePicker, ImagePickerResult } from '../../utils/native_adapters'
 import { tokens } from '../../vendor/tapestry/tokens'
-import LinearGradient from 'react-native-linear-gradient'
-import { MessageFormAttachmentVideo } from './message_form/message_form_attachment_video'
-import BannerPrimitive from '../primitive/banner_primitive'
 import { Button } from '../display/button'
+import BannerPrimitive from '../primitive/banner_primitive'
+import { MessageFormAttachmentImage } from './message_form/message_form_attachment_image'
+import { MessageFormAttachmentVideo } from './message_form/message_form_attachment_video'
 
 export const MessageForm = {
   Root: MessageFormRoot,

package/src/components/conversation/message_markdown.tsx

@@ -1,8 +1,8 @@
 import React from 'react'
 import { StyleSheet } from 'react-native'
-import { Text, TextInlineButton } from '../display'
-import { parseSimpleMarkdown } from '../../utils/parse_simple_markdown'
 import { Linking } from '../../utils/native_adapters'
+import { parseSimpleMarkdown } from '../../utils/parse_simple_markdown'
+import { Text, TextInlineButton } from '../display'
 
 interface Props {
   text: string

package/src/components/conversation/message_reaction.tsx

@@ -4,12 +4,12 @@ import React, { useMemo } from 'react'
 import { StyleSheet } from 'react-native'
 import { Text } from '../../components/display'
 import { useInteractionGhostBackgroundColor, useTheme } from '../../hooks'
+import { useCreateAndroidRippleColor } from '../../hooks/use_create_android_ripple_color'
 import { useMessageReactionToggle } from '../../hooks/use_message_reaction_toggle'
-import { ReactionCountResource } from '../../types/resources/reaction'
 import { MessageResource } from '../../types'
-import { useCreateAndroidRippleColor } from '../../hooks/use_create_android_ripple_color'
-import { Haptic } from '../../utils/native_adapters'
+import { ReactionCountResource } from '../../types/resources/reaction'
 import { REACTION_EMOJIS } from '../../utils'
+import { Haptic } from '../../utils/native_adapters'
 
 export function MessageReaction({
   reaction,

package/src/components/conversation/message_read_receipts.tsx

@@ -1,8 +1,8 @@
 import React from 'react'
-import { MessageResource } from '../../types'
 import { StyleSheet, View } from 'react-native'
-import { Icon, Text } from '../display'
 import { useTheme } from '../../hooks'
+import { MessageResource } from '../../types'
+import { Icon, Text } from '../display'
 
 interface Props {
   message: MessageResource

package/src/components/conversation/messages_disabled_banners.tsx

@@ -1,7 +1,7 @@
 import { StyleSheet, View, type ViewStyle } from 'react-native'
+import { useSafeAreaInsets } from 'react-native-safe-area-context'
 import { useTheme } from '../../hooks'
 import { Text } from '../display'
-import { useSafeAreaInsets } from 'react-native-safe-area-context'
 
 export const LeaderMessagesDisabledBanner = () => {
   return (

package/src/components/conversation/reply_shadow_message.tsx

@@ -1,12 +1,16 @@
+import { useNavigation } from '@react-navigation/native'
+import { some } from 'lodash'
 import React from 'react'
 import { Pressable, StyleSheet, useWindowDimensions, View } from 'react-native'
-import { Avatar, Icon, IconProps, Image, Text } from '../display'
+import Animated from 'react-native-reanimated'
 import {
   useAnimatedMessageBackgroundColor,
   useFontScale,
   useScalableNumberOfLines,
   useTheme,
 } from '../../hooks'
+import { useConversationMessage } from '../../hooks/use_conversation_message'
+import { useLiveRelativeTime } from '../../hooks/use_live_relative_time'
 import { MessageResource } from '../../types'
 import {
   DenormalizedAttachmentResource,
@@ -14,19 +18,15 @@ import {
   DenormalizedExpandedLinkAttachmentResource,
   DenormalizedMessageAttachmentResource,
 } from '../../types/resources/denormalized_attachment_resource'
+import { assertKeysAreNumbers, pluralize } from '../../utils'
 import {
   CONVERSATION_MESSAGE_LIST_PADDING_HORIZONTAL,
   MAX_FONT_SIZE_MULTIPLIER,
   MESSAGE_AUTHOR_AVATAR_COLUMN_WIDTH,
   platformFontWeightMedium,
 } from '../../utils/styles'
-import Animated from 'react-native-reanimated'
+import { Avatar, Icon, IconProps, Image, Text } from '../display'
 import { TheirReplyConnector, MyReplyConnector } from './reply_connectors'
-import { assertKeysAreNumbers, pluralize } from '../../utils'
-import { useNavigation } from '@react-navigation/native'
-import { useConversationMessage } from '../../hooks/use_conversation_message'
-import { useLiveRelativeTime } from '../../hooks/use_live_relative_time'
-import { some } from 'lodash'
 
 interface ReplyShadowMessageProps extends MessageResource {
   messageId: string

package/src/components/conversation/typing_indicator.tsx

@@ -1,8 +1,8 @@
 import React, { useEffect } from 'react'
 import { StyleSheet, View, Animated } from 'react-native'
-import { Text } from '../display'
 import { useTheme } from '../../hooks'
 import { useTypingIndicators, getTypingIndicatorText } from '../../hooks/use_typing_indicators'
+import { Text } from '../display'
 
 /**
  * Animated dots to indicate typing

package/src/components/conversations/conversation_preview.tsx

@@ -1,17 +1,17 @@
 import React from 'react'
 import { StyleSheet, View, ViewStyle } from 'react-native'
-import { ConversationResource } from '../../types'
-import { AvatarGroup, Heading, Text, Badge, type BadgeProps } from '../display'
-import { formatDatePreview } from '../../utils/date'
 import {
   useTheme,
   useAtFontScaleBreakpoint,
   useFontScale,
   useScalableNumberOfLines,
 } from '../../hooks'
-import { UnreadCountBadge } from './unread_count_badge'
+import { ConversationResource } from '../../types'
+import { formatDatePreview } from '../../utils/date'
+import { AvatarGroup, Heading, Text, Badge, type BadgeProps } from '../display'
 import { ConversationActions } from './conversation_actions'
 import { MuteIndicator } from './mute_indicator'
+import { UnreadCountBadge } from './unread_count_badge'
 
 const EMPTY_CONVERSATION_PREVIEW_TEXT = 'Send your first message'
 

package/src/components/conversations/conversations.tsx

@@ -3,11 +3,11 @@ import React, { useMemo } from 'react'
 import { FlatList, StyleSheet, View } from 'react-native'
 import { useConversationsContext } from '../../contexts/conversations_context'
 import { useTheme } from '../../hooks'
+import { useConversationsJoltEvents } from '../../hooks/use_conversations_jolt_events'
 import { ConversationResource } from '../../types'
 import { throwResponseError } from '../../utils/response_error'
 import BlankState from '../primitive/blank_state_primitive'
 import { ConversationPreview, ConversationPreviewSkeleton } from './conversation_preview'
-import { useConversationsJoltEvents } from '../../hooks/use_conversations_jolt_events'
 
 interface ConversationsProps {
   ListHeaderComponent?:

package/src/components/conversations/mute_indicator.tsx

@@ -1,8 +1,8 @@
 import React from 'react'
 import { StyleSheet } from 'react-native'
-import { Icon } from '../display'
 import { useTheme } from '../../hooks'
 import { MAX_FONT_SIZE_MULTIPLIER } from '../../utils'
+import { Icon } from '../display'
 
 export const MuteIndicator = ({ muted }: { muted: boolean }) => {
   const styles = useStyles()

package/src/components/conversations/swipeable_toggle_button.tsx

@@ -1,15 +1,15 @@
 import React from 'react'
 import { StyleSheet } from 'react-native'
 import { Pressable, type PressableProps } from 'react-native-gesture-handler'
-import { Icon, IconString, Spinner, Text } from '../display'
 import { useCreateAndroidRippleColor, useTheme } from '../../hooks'
+import { Haptic } from '../../utils/native_adapters/configuration'
 import {
   MAX_FONT_SIZE_MULTIPLIER,
   platformFontWeightMedium,
   platformPressedOpacityStyle,
 } from '../../utils/styles'
 import { tokens } from '../../vendor/tapestry/tokens'
-import { Haptic } from '../../utils/native_adapters/configuration'
+import { Icon, IconString, Spinner, Text } from '../display'
 
 interface SwipeableToggleButtonProps extends PressableProps {
   backgroundColor: string

package/src/components/conversations/unread_count_badge.tsx

@@ -1,8 +1,8 @@
 import React from 'react'
 import { StyleSheet, View } from 'react-native'
-import { Text } from '../display'
 import { useFontScale, useTheme } from '../../hooks'
 import { MAX_FONT_SIZE_MULTIPLIER, platformFontWeightBold } from '../../utils'
+import { Text } from '../display'
 
 export const UnreadCountBadge = ({ count, showDot }: { count: number; showDot: boolean }) => {
   const styles = useStyles()

package/src/components/display/action_button.tsx

@@ -1,12 +1,12 @@
 import React, { useState } from 'react'
-import { Animated, LayoutAnimation, StyleSheet, useWindowDimensions, View } from 'react-native'
-import { Button } from './button'
 import { useEffect } from 'react'
+import { Animated, LayoutAnimation, StyleSheet, useWindowDimensions, View } from 'react-native'
 import { useSafeAreaInsets } from 'react-native-safe-area-context'
 import { useTheme } from '../../hooks'
-import { Text } from './text'
-import { IconString } from './icon'
 import { MAX_FONT_SIZE_MULTIPLIER_LANDMARK } from '../../utils'
+import { Button } from './button'
+import { IconString } from './icon'
+import { Text } from './text'
 
 export const ActionButton = ({
   visible = true,

package/src/components/display/banner.tsx

@@ -1,9 +1,9 @@
 import React, { isValidElement, ReactElement } from 'react'
+import { ViewStyle } from 'react-native'
 import BannerPrimitive, {
   type BannerStatusIconProps,
   type BannerRootProps,
 } from '../primitive/banner_primitive'
-import { ViewStyle } from 'react-native'
 
 type descriptionUnion = string | ReactElement | undefined
 

package/src/components/display/banner_collapsible.tsx

@@ -1,6 +1,6 @@
 import React, { ReactNode } from 'react'
-import { BannerProps, ConditionalDescription } from './banner'
 import BannerPrimitive from '../primitive/banner_primitive'
+import { BannerProps, ConditionalDescription } from './banner'
 
 // =================================
 // ====== Component ================