@planningcenter/chat-react-native 3.30.0-rc.0 → 3.30.0-rc.2

package/src/components/conversation/reply_connectors.tsx

@@ -1,11 +1,11 @@
 import { StyleSheet, View, ViewStyle } from 'react-native'
 import Svg, { Path } from 'react-native-svg'
-import { useTheme } from '../../hooks'
-import { MessageResource } from '../../types'
+import { useTheme } from '@/hooks'
+import { MessageResource } from '@/types'
 import {
   CONVERSATION_MESSAGE_LIST_PADDING_HORIZONTAL,
   MESSAGE_AUTHOR_AVATAR_COLUMN_WIDTH,
-} from '../../utils/styles'
+} from '@/utils/styles'
 
 const MY_REPLY_CONNECTOR_WIDTH = 38
 const CONNECTOR_BORDER_WIDTH = 4

package/src/components/conversation/reply_shadow_message.tsx

@@ -1,32 +1,32 @@
+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 { TheirReplyConnector, MyReplyConnector } from './reply_connectors'
+import { Avatar, Icon, IconProps, Image, Text } from '@/components/display'
 import {
   useAnimatedMessageBackgroundColor,
   useFontScale,
   useScalableNumberOfLines,
   useTheme,
-} from '../../hooks'
-import { MessageResource } from '../../types'
+} from '@/hooks'
+import { useConversationMessage } from '@/hooks/use_conversation_message'
+import { useLiveRelativeTime } from '@/hooks/use_live_relative_time'
+import { MessageResource } from '@/types'
 import {
   DenormalizedAttachmentResource,
   DenormalizedGiphyAttachmentResource,
   DenormalizedExpandedLinkAttachmentResource,
   DenormalizedMessageAttachmentResource,
-} from '../../types/resources/denormalized_attachment_resource'
+} 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 { 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'
+} from '@/utils/styles'
 
 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 '@/components/display'
+import { useTheme } from '@/hooks'
+import { useTypingIndicators, getTypingIndicatorText } from '@/hooks/use_typing_indicators'
 
 /**
  * Animated dots to indicate typing

package/src/components/conversations/conversation_actions.tsx

@@ -11,16 +11,13 @@ import {
 import ReanimatedSwipeable, {
   SwipeableMethods,
 } from 'react-native-gesture-handler/ReanimatedSwipeable'
-import { useConversationsContext } from '../../contexts/conversations_context'
-import { useTheme, useCreateAndroidRippleColor } from '../../hooks'
-import {
-  useConversationsMarkRead,
-  useConversationsMute,
-} from '../../hooks/use_conversations_actions'
-import { ConversationResource } from '../../types'
-import { platformPressedOpacityStyle } from '../../utils'
-import { tokens } from '../../vendor/tapestry/tokens'
 import { SwipeableToggleButton } from './swipeable_toggle_button'
+import { useConversationsContext } from '@/contexts/conversations_context'
+import { useTheme, useCreateAndroidRippleColor } from '@/hooks'
+import { useConversationsMarkRead, useConversationsMute } from '@/hooks/use_conversations_actions'
+import { ConversationResource } from '@/types'
+import { platformPressedOpacityStyle } from '@/utils'
+import { tokens } from '@/vendor/tapestry/tokens'
 
 export function ConversationActions({
   children,

package/src/components/conversations/conversation_preview.tsx

@@ -1,17 +1,12 @@
 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 { ConversationActions } from './conversation_actions'
 import { MuteIndicator } from './mute_indicator'
+import { UnreadCountBadge } from './unread_count_badge'
+import { AvatarGroup, Heading, Text, Badge, type BadgeProps } from '@/components/display'
+import { useTheme, useAtFontScaleBreakpoint, useFontScale, useScalableNumberOfLines } from '@/hooks'
+import { ConversationResource } from '@/types'
+import { formatDatePreview } from '@/utils/date'
 
 const EMPTY_CONVERSATION_PREVIEW_TEXT = 'Send your first message'
 

package/src/components/conversations/conversations.tsx

@@ -1,13 +1,13 @@
 import { useNavigation } from '@react-navigation/native'
 import React, { useMemo } from 'react'
 import { FlatList, StyleSheet, View } from 'react-native'
-import { useConversationsContext } from '../../contexts/conversations_context'
-import { useTheme } from '../../hooks'
-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'
+import BlankState from '@/components/primitive/blank_state_primitive'
+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'
 
 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 '@/components/display'
+import { useTheme } from '@/hooks'
+import { MAX_FONT_SIZE_MULTIPLIER } from '@/utils'
 
 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 { Icon, IconString, Spinner, Text } from '@/components/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'
+} from '@/utils/styles'
+import { tokens } from '@/vendor/tapestry/tokens'
 
 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 '@/components/display'
+import { useFontScale, useTheme } from '@/hooks'
+import { MAX_FONT_SIZE_MULTIPLIER, platformFontWeightBold } from '@/utils'
 
 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 { Button } from './button'
 import { IconString } from './icon'
-import { MAX_FONT_SIZE_MULTIPLIER_LANDMARK } from '../../utils'
+import { Text } from './text'
+import { useTheme } from '@/hooks'
+import { MAX_FONT_SIZE_MULTIPLIER_LANDMARK } from '@/utils'
 
 export const ActionButton = ({
   visible = true,

package/src/components/display/avatar.tsx

@@ -1,10 +1,10 @@
 import React from 'react'
+import { type IconString } from './icon'
 import AvatarPrimitive, {
   type AvatarImageProps,
   type AvatarPresenceProps,
   type AvatarRootProps,
-} from '../primitive/avatar_primitive'
-import { type IconString } from './icon'
+} from '@/components/primitive/avatar_primitive'
 
 interface AvatarProps {
   sourceUri: AvatarImageProps['sourceUri']

package/src/components/display/avatar_group.tsx

@@ -1,9 +1,9 @@
 import React from 'react'
+import { type IconString } from './icon'
 import AvatarPrimitive, {
   type AvatarGroupProps,
   type AvatarRootProps,
-} from '../primitive/avatar_primitive'
-import { type IconString } from './icon'
+} from '@/components/primitive/avatar_primitive'
 
 interface AvatarGroupDisplayProps {
   sourceUris: AvatarGroupProps['sourceUris']

package/src/components/display/badge.tsx

@@ -2,12 +2,12 @@ import React, { JSX } from 'react'
 import type { TextStyle, ViewProps, ViewStyle } from 'react-native'
 import { Pressable, StyleSheet, View } from 'react-native'
 import Svg, { Defs, LinearGradient, Path, Stop } from 'react-native-svg'
-import { useFontScale, useTheme } from '../../hooks'
-import { platformFontWeightMedium } from '../../utils'
-import { tokens } from '../../vendor/tapestry/tokens'
 import { Icon, IconString } from './icon'
 import { Text } from './text'
 import { useStatusColorAppearanceMap, type StatusAppearanceUnion } from './utils/status_colors'
+import { useFontScale, useTheme } from '@/hooks'
+import { platformFontWeightMedium } from '@/utils'
+import { tokens } from '@/vendor/tapestry/tokens'
 
 // =================================
 // ====== Constants ================

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'
+} from '@/components/primitive/banner_primitive'
 
 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 BannerPrimitive from '@/components/primitive/banner_primitive'
 
 // =================================
 // ====== Component ================

package/src/components/display/button.tsx

@@ -3,12 +3,12 @@ import { Pressable, StyleSheet, Text, View } from 'react-native'
 import type { PressableProps, ViewStyle } from 'react-native'
 import LinearGradient from 'react-native-linear-gradient'
 import { Icon, IconString } from './icon'
-import { useTheme, useFontScale, useCreateAndroidRippleColor } from '../../hooks'
-import { tokens } from '../../vendor/tapestry/tokens'
-import { platformFontWeightBold, platformPressedOpacityStyle } from '../../utils'
 import { Spinner } from './spinner'
 import { getColorKey, useButtonColorOptionMap, useGradientColorMap } from './utils/button_colors'
 import type { ButtonAppearanceUnion } from './utils/button_colors'
+import { useTheme, useFontScale, useCreateAndroidRippleColor } from '@/hooks'
+import { platformFontWeightBold, platformPressedOpacityStyle } from '@/utils'
+import { tokens } from '@/vendor/tapestry/tokens'
 
 // =================================
 // ====== Constants ================

package/src/components/display/child_notice.tsx

@@ -1,11 +1,11 @@
 import React from 'react'
-import { MemberResource } from '../../types'
-import { BannerCollapsible } from './banner_collapsible'
-import BannerPrimitive from '../primitive/banner_primitive'
 import { View, StyleSheet, type ViewStyle } from 'react-native'
 import { Avatar } from './avatar'
-import { platformFontWeightMedium, pluralize } from '../../utils'
+import { BannerCollapsible } from './banner_collapsible'
 import { Text } from './text'
+import BannerPrimitive from '@/components/primitive/banner_primitive'
+import { MemberResource } from '@/types'
+import { platformFontWeightMedium, pluralize } from '@/utils'
 
 // =================================
 // ====== Component ================

package/src/components/display/heading.tsx

@@ -1,4 +1,3 @@
-import { useTheme } from '../../hooks'
 import React from 'react'
 import {
   Platform,
@@ -6,8 +5,9 @@ import {
   Text as ReactNativeText,
   TextProps as ReactNativeTextProps,
 } from 'react-native'
-import { tokens } from '../../vendor/tapestry/tokens'
-import { platformFontWeightBold } from '../../utils/styles'
+import { useTheme } from '@/hooks'
+import { platformFontWeightBold } from '@/utils/styles'
+import { tokens } from '@/vendor/tapestry/tokens'
 
 // =================================
 // ====== Component ================

package/src/components/display/icon.tsx

@@ -1,10 +1,3 @@
-import React from 'react'
-import { StyleSheet, View } from 'react-native'
-import type { ColorValue, StyleProp, ViewStyle } from 'react-native'
-import { SvgXml } from 'react-native-svg'
-import type { XmlProps } from 'react-native-svg'
-import { useFontScale, useTheme } from '../../hooks'
-
 import * as accounts from '@planningcenter/icons/paths/accounts'
 import * as api from '@planningcenter/icons/paths/api'
 import * as brand from '@planningcenter/icons/paths/brand'
@@ -15,9 +8,15 @@ import * as general from '@planningcenter/icons/paths/general'
 import * as groups from '@planningcenter/icons/paths/groups'
 import * as logomark from '@planningcenter/icons/paths/logomark'
 import * as people from '@planningcenter/icons/paths/people'
-import * as services from '@planningcenter/icons/paths/services'
 import * as publishing from '@planningcenter/icons/paths/publishing'
 import * as registrations from '@planningcenter/icons/paths/registrations'
+import * as services from '@planningcenter/icons/paths/services'
+import React from 'react'
+import type { ColorValue, StyleProp, ViewStyle } from 'react-native'
+import { StyleSheet, View } from 'react-native'
+import type { XmlProps } from 'react-native-svg'
+import { SvgXml } from 'react-native-svg'
+import { useFontScale, useTheme } from '@/hooks'
 
 // =================================
 // ====== Constants ================

package/src/components/display/icon_button.tsx

@@ -3,11 +3,11 @@ import { Pressable, StyleSheet, type StyleProp } from 'react-native'
 import type { PressableProps, ViewStyle } from 'react-native'
 import { Icon } from './icon'
 import type { IconProps, IconString } from './icon'
-import { useTheme, useFontScale, useCreateAndroidRippleColor } from '../../hooks'
-import { platformPressedOpacityStyle } from '../../utils'
 import { Spinner } from './spinner'
 import { getColorKey, useIconButtonColorOptionMap } from './utils/button_colors'
 import type { IconButtonAppearanceUnion } from './utils/button_colors'
+import { useTheme, useFontScale, useCreateAndroidRippleColor } from '@/hooks'
+import { platformPressedOpacityStyle } from '@/utils'
 
 // =================================
 // ====== Constants ================

package/src/components/display/image.tsx

@@ -11,8 +11,8 @@ import {
   ViewStyle,
 } from 'react-native'
 import Animated, { AnimatedStyle } from 'react-native-reanimated'
-import { useTheme } from '../../hooks'
 import { Spinner } from './spinner'
+import { useTheme } from '@/hooks'
 
 // =================================
 // ====== Component ================

package/src/components/display/image_attachment_preview.tsx

@@ -1,9 +1,9 @@
 import { View, StyleSheet } from 'react-native'
-import { Image } from './image'
-import { IconButton } from './icon_button'
 import { Icon } from './icon'
-import { useTheme } from '../../hooks'
-import { tokens } from '../../vendor/tapestry/tokens'
+import { IconButton } from './icon_button'
+import { Image } from './image'
+import { useTheme } from '@/hooks'
+import { tokens } from '@/vendor/tapestry/tokens'
 
 const SIZES = {
   sm: 'sm',

package/src/components/display/keyboard_view.tsx

@@ -9,7 +9,7 @@ import {
   ViewProps,
 } from 'react-native'
 import { useSafeAreaInsets } from 'react-native-safe-area-context'
-import { useChatContext } from '../../contexts/chat_context'
+import { useChatContext } from '@/contexts/chat_context'
 
 export function KeyboardView({ children }: Pick<ViewProps, 'children'>) {
   const styles = useStyles()

package/src/components/display/person.tsx

@@ -1,10 +1,10 @@
 import React from 'react'
 import { StyleSheet, View, type ViewStyle } from 'react-native'
-import { platformFontWeightMedium } from '../../utils/styles'
-import { MemberResource } from '../../types'
 import { Avatar } from './avatar'
-import { Text } from './text'
 import { Badge } from './badge'
+import { Text } from './text'
+import { MemberResource } from '@/types'
+import { platformFontWeightMedium } from '@/utils/styles'
 
 // =================================
 // ====== Components ===============

package/src/components/display/platform_modal_header_buttons.tsx

@@ -1,9 +1,9 @@
-import { ColorValue, Platform, StyleSheet } from 'react-native'
-import { TextButton } from './text_button'
 import { HeaderButton } from '@react-navigation/elements'
-import { Icon } from './icon'
-import { useTheme } from '../../hooks'
 import type { NativeStackHeaderRightProps } from '@react-navigation/native-stack'
+import { ColorValue, Platform, StyleSheet } from 'react-native'
+import { Icon } from './icon'
+import { TextButton } from './text_button'
+import { useTheme } from '@/hooks'
 
 interface HeaderTextButtonProps {
   onPress: () => void

package/src/components/display/pressable_row.tsx

@@ -1,9 +1,9 @@
 import { PlatformPressable } from '@react-navigation/elements'
 import { PropsWithChildren } from 'react'
 import { StyleSheet, View, ViewStyle } from 'react-native'
-import { useTheme } from '../../hooks'
 import { Icon, IconProps } from './icon'
 import { Text } from './text'
+import { useTheme } from '@/hooks'
 
 export interface PressableRowProps extends PropsWithChildren {
   isActive?: boolean

package/src/components/display/spinner.tsx

@@ -7,7 +7,7 @@ import Animated, {
   withTiming,
   Easing,
 } from 'react-native-reanimated'
-import { useFontScale, useTheme } from '../../hooks'
+import { useFontScale, useTheme } from '@/hooks'
 
 // =================================
 // ====== Constants ================

package/src/components/display/switch.tsx

@@ -1,7 +1,7 @@
 import React from 'react'
 import { Platform, Switch as ReactNativeSwitch } from 'react-native'
 import type { SwitchProps } from 'react-native'
-import { useTheme } from '../../hooks'
+import { useTheme } from '@/hooks'
 
 // =================================
 // ====== Component ================

package/src/components/display/tabs.tsx

@@ -1,7 +1,7 @@
 import { PlatformPressable } from '@react-navigation/elements'
 import React, { useEffect, useRef, useState } from 'react'
 import { Animated, Easing, StyleSheet, View, ViewStyle } from 'react-native'
-import { useTheme } from '../../hooks'
+import { useTheme } from '@/hooks'
 
 // =================================
 // ====== Component ================

package/src/components/display/text.tsx

@@ -1,4 +1,3 @@
-import { useTheme } from '../../hooks'
 import React from 'react'
 import { StyleSheet, Text as ReactNativeText, Platform } from 'react-native'
 import type {
@@ -6,7 +5,8 @@ import type {
   TextProps as ReactNativeTextProps,
   StyleProp,
 } from 'react-native'
-import { tokens } from '../../vendor/tapestry/tokens'
+import { useTheme } from '@/hooks'
+import { tokens } from '@/vendor/tapestry/tokens'
 
 // =================================
 // ====== Constants ================

package/src/components/display/text_button.tsx

@@ -1,12 +1,12 @@
 import React from 'react'
 import { Pressable, StyleSheet } from 'react-native'
 import type { PressableProps } from 'react-native'
-import { useTheme } from '../../hooks'
-import { platformFontWeightMedium } from '../../utils'
 import { Text } from './text'
 import type { TextProps } from './text'
 import { getColorKey, useButtonColorOptionMap } from './utils/button_colors'
 import type { ButtonAppearanceUnion } from './utils/button_colors'
+import { useTheme } from '@/hooks'
+import { platformFontWeightMedium } from '@/utils'
 
 // =================================
 // ====== Component ================

package/src/components/display/text_inline_button.tsx

@@ -1,12 +1,12 @@
+import colorFunction from 'color'
 import React, { useState } from 'react'
 import { Platform, StyleSheet } from 'react-native'
-import { useTheme } from '../../hooks'
 import { Text } from './text'
 import type { TextProps } from './text'
-import { platformFontWeightMedium } from '../../utils'
-import colorFunction from 'color'
 import { getColorKey, useButtonColorOptionMap } from './utils/button_colors'
 import type { ButtonAppearanceUnion } from './utils/button_colors'
+import { useTheme } from '@/hooks'
+import { platformFontWeightMedium } from '@/utils'
 
 // =================================
 // ====== Component ================

package/src/components/display/toggle_button.tsx

@@ -1,21 +1,21 @@
 import React from 'react'
 import { Pressable, StyleSheet } from 'react-native'
 import type { PressableProps, GestureResponderEvent } from 'react-native'
+import { Icon, IconString } from './icon'
 import { Text } from './text'
 import {
   useTheme,
   useFontScale,
   useCreateAndroidRippleColor,
   useInteractionGhostBackgroundColor,
-} from '../../hooks'
+} from '@/hooks'
 import {
   MAX_FONT_SIZE_MULTIPLIER_LANDMARK,
   platformFontWeightBold,
   platformPressedOpacityStyle,
-} from '../../utils'
-import { Icon, IconString } from './icon'
-import { tokens } from '../../vendor/tapestry/tokens'
-import { Haptic } from '../../utils/native_adapters/configuration'
+} from '@/utils'
+import { Haptic } from '@/utils/native_adapters/configuration'
+import { tokens } from '@/vendor/tapestry/tokens'
 
 // =================================
 // ====== Constants ================

package/src/components/display/utils/button_colors.ts

@@ -1,4 +1,4 @@
-import { useTheme } from '../../../hooks'
+import { useTheme } from '@/hooks'
 
 // =================================
 // ====== Exports ==================

package/src/components/display/utils/status_colors.ts

@@ -1,4 +1,4 @@
-import { useTheme } from '../../../hooks'
+import { useTheme } from '@/hooks'
 
 // =================================
 // ====== Exports ==================

package/src/components/display/video_attachment_preview.tsx

@@ -1,11 +1,11 @@
 import { View, StyleSheet } from 'react-native'
-import { IconButton } from './icon_button'
-import { useTheme } from '../../hooks'
 import { Icon } from './icon'
-import { Text } from './text'
-import { platformFontWeightMedium } from '../../utils'
+import { IconButton } from './icon_button'
 import { Spinner } from './spinner'
-import { tokens } from '../../vendor/tapestry/tokens'
+import { Text } from './text'
+import { useTheme } from '@/hooks'
+import { platformFontWeightMedium } from '@/utils'
+import { tokens } from '@/vendor/tapestry/tokens'
 
 interface VideoAttachmentPreviewProps {
   name: string

package/src/components/group_conversation_list.tsx

@@ -1,13 +1,13 @@
 import React, { useEffect } from 'react'
 import { StyleSheet, View, ViewStyle } from 'react-native'
 import { ConversationPreview } from './conversations/conversation_preview'
-import { ConversationRequestArgs } from '../utils/request/conversation'
-import { useTheme } from '../hooks'
 import { Icon, Text } from './display'
 import {
   ConversationsContextProvider,
   useConversationsContext,
-} from '../contexts/conversations_context'
+} from '@/contexts/conversations_context'
+import { useTheme } from '@/hooks'
+import { ConversationRequestArgs } from '@/utils/request/conversation'
 
 interface GroupConversationsProps extends Partial<ConversationRequestArgs> {
   limit?: number

package/src/components/page/error_boundary.tsx

@@ -1,8 +1,8 @@
 import { useNavigation } from '@react-navigation/native'
 import { useQueryErrorResetBoundary } from '@tanstack/react-query'
 import React, { PropsWithChildren, useEffect, useMemo } from 'react'
-import { ResponseError } from '../../utils/response_error'
-import BlankState from '../primitive/blank_state_primitive'
+import BlankState from '@/components/primitive/blank_state_primitive'
+import { ResponseError } from '@/utils/response_error'
 
 type ErrorBoundaryState = {
   error: ResponseError | Error | TypeError | null

package/src/components/page/loading.tsx

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