remove relative paths from status-react

packages/status-react/package.json

@@ -24,7 +24,7 @@
     "postbuild": "yarn typegen",
     "#test": "vitest",
     "typecheck": "tsc",
-    "typegen": "tsc --noEmit false --emitDeclarationOnly --paths null || true",
+    "typegen": "tsc --noEmit false --emitDeclarationOnly || true",
     "lint": "eslint src",
     "format": "prettier --write src",
     "clean": "rm -rf dist node_modules .turbo"

packages/status-react/src/components/chat-menu/edit-group-chat-dialog.tsx

@@ -1,6 +1,6 @@
 import React from 'react'
 
-import { Avatar, Dialog, TextInput } from '~/src/system'
+import { Avatar, Dialog, TextInput } from '../../system'
 
 export const EditGroupChatDialog = () => {
   return (

packages/status-react/src/components/chat-menu/index.tsx

@@ -1,9 +1,9 @@
 import React from 'react'
 
-import { BellIcon } from '~/src/icons/bell-icon'
-import { ContextMenu, DropdownMenu } from '~/src/system'
-// import { useAlertDialog } from '~/src/system/dialog/alert-dialog'
-// import { useDialog } from '~/src/system/dialog/dialog'
+import { BellIcon } from '../../icons/bell-icon'
+import { ContextMenu, DropdownMenu } from '../../system'
+// import { useAlertDialog } from '../../system/dialog/alert-dialog'
+// import { useDialog } from '../../system/dialog/dialog'
 
 // import { UserProfileDialog } from '../user-profile-dialog'
 // import { EditGroupChatDialog } from './edit-group-chat-dialog'

packages/status-react/src/components/create-profile-dialog/index.tsx

@@ -8,7 +8,7 @@ import {
   Heading,
   Text,
   TextInput,
-} from '~/src/system'
+} from '../../system'
 
 export const CreateProfileDialog = () => {
   return (

packages/status-react/src/components/loading/index.tsx

@@ -2,8 +2,8 @@ import React from 'react'
 
 import ContentLoader from 'react-content-loader'
 
-import { styled } from '~/src/styles/config'
-import { Box } from '~/src/system'
+import { styled } from '../../styles/config'
+import { Box } from '../../system'
 
 const CommunityInfoLoader = () => (
   <ContentLoader

packages/status-react/src/components/main-sidebar/components/channels/channel-group.tsx

@@ -2,10 +2,10 @@ import React from 'react'
 
 import * as Collapsible from '@radix-ui/react-collapsible'
 
-import { BellIcon } from '~/src/icons/bell-icon'
-import { ChevronDownIcon } from '~/src/icons/chevron-down-icon'
-import { styled } from '~/src/styles/config'
-import { ContextMenu, ContextMenuTrigger, Text } from '~/src/system'
+import { BellIcon } from '../../../../icons/bell-icon'
+import { ChevronDownIcon } from '../../../../icons/chevron-down-icon'
+import { styled } from '../../../../styles/config'
+import { ContextMenu, ContextMenuTrigger, Text } from '../../../../system'
 
 interface Props {
   name: string

packages/status-react/src/components/main-sidebar/components/channels/channel-item.tsx

@@ -1,8 +1,7 @@
 import React from 'react'
 
-import { ChatMenu } from '~/src/components/chat-menu'
-import { ContextMenuTrigger } from '~/src/system'
-
+import { ChatMenu } from '../../../../components/chat-menu'
+import { ContextMenuTrigger } from '../../../../system'
 import { SidebarItem } from '../sidebar-item'
 
 import type { SidebarItemProps } from '../sidebar-item'

packages/status-react/src/components/main-sidebar/components/channels/index.tsx

@@ -1,8 +1,7 @@
 import React from 'react'
 
-import { useChats } from '~/src/protocol'
-import { Box } from '~/src/system'
-
+import { useChats } from '../../../../protocol'
+import { Box } from '../../../../system'
 // import { ChannelGroup } from './channel-group'
 import { ChannelItem } from './channel-item'
 

packages/status-react/src/components/main-sidebar/components/community-info/community-dialog.tsx

@@ -1,7 +1,7 @@
 import React from 'react'
 
-import { useProtocol } from '~/src/protocol'
-import { Button, CopyInput, Dialog, Flex, Grid, Text } from '~/src/system'
+import { useProtocol } from '../../../../protocol'
+import { Button, CopyInput, Dialog, Flex, Grid, Text } from '../../../../system'
 
 export const CommunityDialog = () => {
   const { client, community } = useProtocol()

packages/status-react/src/components/main-sidebar/components/community-info/index.tsx

@@ -1,9 +1,8 @@
 import React from 'react'
 
-import { useMembers, useProtocol } from '~/src/protocol'
-import { styled } from '~/src/styles/config'
-import { Avatar, DialogTrigger, Text } from '~/src/system'
-
+import { useMembers, useProtocol } from '../../../../protocol'
+import { styled } from '../../../../styles/config'
+import { Avatar, DialogTrigger, Text } from '../../../../system'
 import { CommunityDialog } from './community-dialog'
 
 export const CommunityInfo = () => {

packages/status-react/src/components/main-sidebar/components/get-started/connect-wallet-dialog.tsx

@@ -1,7 +1,7 @@
 import React, { useState } from 'react'
 
-import { styled } from '~/src/styles/config'
-import { Dialog, Grid, Text } from '~/src/system'
+import { styled } from '../../../../styles/config'
+import { Dialog, Grid, Text } from '../../../../system'
 
 // TODO: Add wallet integration
 export const ConnectWalletDialog = () => {

packages/status-react/src/components/main-sidebar/components/get-started/index.tsx

@@ -1,12 +1,12 @@
 import React from 'react'
 
-// import { CreateProfileDialog } from '~/src/components/create-profile-dialog'
-// import { useLocalStorage } from '~/src/hooks/use-local-storage'
-import { useAccount } from '~/src/protocol'
-import { Button, Flex } from '~/src/system'
-// import { DialogTrigger } from '~/src/system/dialog'
-import { Grid } from '~/src/system/grid'
-import { Heading } from '~/src/system/heading'
+// import { CreateProfileDialog } from '../../../../components/create-profile-dialog'
+// import { useLocalStorage } from '../../../../hooks/use-local-storage'
+import { useAccount } from '../../../../protocol'
+import { Button, Flex } from '../../../../system'
+// import { DialogTrigger } from '../../../../system/dialog'
+import { Grid } from '../../../../system/grid'
+import { Heading } from '../../../../system/heading'
 
 // import { ConnectWalletDialog } from './connect-wallet-dialog'
 // import { SyncStatusProfileDialog } from './sync-status-profile-dialog'

packages/status-react/src/components/main-sidebar/components/get-started/sync-status-profile-dialog.tsx

@@ -2,8 +2,8 @@ import React, { useState } from 'react'
 
 import { QRCodeSVG } from 'qrcode.react'
 
-import { styled } from '~/src/styles/config'
-import { Box, ButtonGroup, Dialog, Text, TextInput } from '~/src/system'
+import { styled } from '../../../../styles/config'
+import { Box, ButtonGroup, Dialog, Text, TextInput } from '../../../../system'
 
 export const SyncStatusProfileDialog = () => {
   const [platform, setPlatform] = useState<'mobile' | 'desktop'>('mobile')

packages/status-react/src/components/main-sidebar/components/get-started/throwaway-profile-found-dialog.tsx

@@ -1,7 +1,14 @@
 import React from 'react'
 
-import { useAccount } from '~/src/protocol'
-import { Avatar, Dialog, EmojiHash, Flex, Heading, Text } from '~/src/system'
+import { useAccount } from '../../../../protocol'
+import {
+  Avatar,
+  Dialog,
+  EmojiHash,
+  Flex,
+  Heading,
+  Text,
+} from '../../../../system'
 
 interface Props {
   onSkip: () => void

packages/status-react/src/components/main-sidebar/components/messages/chat-item.tsx

@@ -1,23 +0,0 @@
-import React from 'react'
-
-import { ChatMenu } from '~/src/components/chat-menu'
-import { ContextMenuTrigger } from '~/src/system'
-
-import { SidebarItem } from '../sidebar-item'
-
-import type { SidebarItemProps } from '../sidebar-item'
-
-interface Props extends SidebarItemProps {
-  children: string
-}
-
-export const ChatItem = (props: Props) => {
-  const { children, ...sidebarItemProps } = props
-
-  return (
-    <ContextMenuTrigger>
-      <SidebarItem {...sidebarItemProps}>{children}</SidebarItem>
-      <ChatMenu type="context" />
-    </ContextMenuTrigger>
-  )
-}

packages/status-react/src/components/main-sidebar/components/messages/index.tsx

@@ -1,33 +0,0 @@
-// eslint-disable-next-line @typescript-eslint/ban-ts-comment
-// @ts-nocheck
-import React from 'react'
-
-import { EditIcon } from '~/src/icons/edit-icon'
-import { Box, Grid, Heading, IconButton } from '~/src/system'
-
-import { ChatItem } from './chat-item'
-
-export const Messages = () => {
-  const chats = []
-
-  return (
-    <Box>
-      <Grid
-        flow="column"
-        align="center"
-        justify="between"
-        css={{ marginBottom: 16 }}
-      >
-        <Heading weight="600">Messages</Heading>
-        <IconButton label="New Chat" to="/new">
-          <EditIcon />
-        </IconButton>
-      </Grid>
-      {chats.map(chat => (
-        <ChatItem key={chat} to={`/${chat}`} unread={false} muted={false}>
-          {chat}
-        </ChatItem>
-      ))}
-    </Box>
-  )
-}

packages/status-react/src/components/main-sidebar/components/sidebar-item/index.tsx

@@ -2,8 +2,8 @@ import React, { forwardRef } from 'react'
 
 import { NavLink } from 'react-router-dom'
 
-import { styled } from '~/src/styles/config'
-import { Avatar } from '~/src/system'
+import { styled } from '../../../../styles/config'
+import { Avatar } from '../../../../system'
 
 import type { Ref } from 'react'
 

packages/status-react/src/components/main-sidebar/index.tsx

@@ -1,14 +1,12 @@
 import React from 'react'
 
-import { useAppState } from '~/src/contexts/app-context'
-import { useAccount } from '~/src/protocol'
-import { styled } from '~/src/styles/config'
-import { Separator } from '~/src/system'
-
+import { useAppState } from '../../contexts/app-context'
+import { useAccount } from '../../protocol'
+import { styled } from '../../styles/config'
+import { Separator } from '../../system'
 import { Channels } from './components/channels'
 import { CommunityInfo } from './components/community-info'
 import { GetStarted } from './components/get-started'
-// import { Messages } from './components/messages'
 
 export const MainSidebar = () => {
   const { options } = useAppState()
@@ -22,8 +20,7 @@ export const MainSidebar = () => {
     <Wrapper>
       <CommunityInfo />
       <Channels />
-      {/* <Separator css={{ margin: '16px 0' }} />
-      <Messages /> */}
+
       {!account && (
         <>
           <Separator />

packages/status-react/src/components/member-sidebar/disconnect-dialog.tsx

@@ -1,9 +1,9 @@
 import React from 'react'
 
-import { useAccount } from '~/src/protocol'
-import { Avatar, Dialog, EmojiHash, Flex, Heading, Text } from '~/src/system'
+import { useAccount } from '../../protocol'
+import { Avatar, Dialog, EmojiHash, Flex, Heading, Text } from '../../system'
 
-import type { Account } from '~/src/protocol'
+import type { Account } from '../../protocol'
 
 interface Props {
   account: Account

packages/status-react/src/components/member-sidebar/index.tsx

@@ -1,9 +1,8 @@
 import React from 'react'
 
-import { useAccount, useMembers } from '~/src/protocol'
-import { styled } from '~/src/styles/config'
-import { Grid, Heading } from '~/src/system'
-
+import { useAccount, useMembers } from '../../protocol'
+import { styled } from '../../styles/config'
+import { Grid, Heading } from '../../system'
 import { MemberGroup } from './member-group'
 import { MemberItem } from './member-item'
 import { UserItem } from './user-item'

packages/status-react/src/components/member-sidebar/member-group.tsx

@@ -1,6 +1,6 @@
 import React from 'react'
 
-import { Text } from '~/src/system'
+import { Text } from '../../system'
 
 interface Props {
   label: string

packages/status-react/src/components/member-sidebar/member-item.tsx

@@ -1,9 +1,9 @@
 import React from 'react'
 
-import { Avatar, EthAddress, Flex, Text } from '~/src/system'
+import { Avatar, EthAddress, Flex, Text } from '../../system'
 
-import type { Member } from '~/src/protocol'
-import type { AvatarProps } from '~/src/system/avatar'
+import type { Member } from '../../protocol'
+import type { AvatarProps } from '../../system/avatar'
 
 interface Props {
   verified: boolean

packages/status-react/src/components/member-sidebar/user-item.tsx

@@ -1,11 +1,10 @@
 import React from 'react'
 
-import { styled } from '~/src/styles/config'
-import { Avatar, DialogTrigger, EthAddress, Flex, Text } from '~/src/system'
-
+import { styled } from '../../styles/config'
+import { Avatar, DialogTrigger, EthAddress, Flex, Text } from '../../system'
 import { DisconnectDialog } from './disconnect-dialog'
 
-import type { Account } from '~/src/protocol'
+import type { Account } from '../../protocol'
 
 interface Props {
   account: Account

packages/status-react/src/components/reaction-popover/index.tsx

@@ -1,10 +1,10 @@
 import React from 'react'
 
-import { useAccount } from '~/src/protocol'
-import { styled } from '~/src/styles/config'
-import { Flex, Image, Popover, PopoverTrigger } from '~/src/system'
+import { useAccount } from '../../protocol'
+import { styled } from '../../styles/config'
+import { Flex, Image, Popover, PopoverTrigger } from '../../system'
 
-import type { Reaction, Reactions } from '~/src/protocol'
+import type { Reaction, Reactions } from '../../protocol'
 
 interface Props {
   children: React.ReactElement

packages/status-react/src/components/user-profile-dialog/index.tsx

@@ -1,8 +1,8 @@
 import React from 'react'
 
-import { Avatar, Dialog, EmojiHash, Heading, Text } from '~/src/system'
+import { Avatar, Dialog, EmojiHash, Heading, Text } from '../../system'
 
-import type { Member } from '~/src/protocol'
+import type { Member } from '../../protocol'
 
 interface Props {
   member: Member

packages/status-react/src/components/welcome-dialog/index.tsx

@@ -1,7 +1,7 @@
 import React, { useState } from 'react'
 
-import { useProtocol } from '~/src/protocol'
-import { Avatar, Checkbox, Dialog, Flex, Text } from '~/src/system'
+import { useProtocol } from '../../protocol'
+import { Avatar, Checkbox, Dialog, Flex, Text } from '../../system'
 
 export const WelcomeDialog = () => {
   const { community } = useProtocol()

packages/status-react/src/protocol/provider.tsx

@@ -2,7 +2,7 @@ import React, { createContext, useContext, useEffect, useReducer } from 'react'
 
 import { createClient } from '@status-im/js'
 
-import { Loading } from '~/src/components/loading'
+import { Loading } from '../components/loading'
 
 import type { Account, Client, ClientOptions, Community } from '@status-im/js'
 

packages/status-react/src/protocol/use-members.tsx

@@ -1,4 +1,4 @@
-import { useProtocol } from '~/src/protocol'
+import { useProtocol } from './provider'
 
 import type { Member } from '@status-im/js'
 

packages/status-react/src/routes/chat/components/chat-info/index.tsx

@@ -1,10 +1,10 @@
 import React from 'react'
 
-// import { PinIcon } from '~/src/icons/pin-icon'
-import { Avatar, Flex, Text } from '~/src/system'
+// import { PinIcon } from '../../../../icons/pin-icon'
+import { Avatar, Flex, Text } from '../../../../system'
 
 // import { PinnedMessagesDialog } from './pinned-messages-dialog'
-import type { Chat } from '~/src/protocol'
+import type { Chat } from '../../../../protocol'
 
 interface Props {
   chat: Chat

packages/status-react/src/routes/chat/components/chat-info/pinned-messages-dialog.tsx

@@ -1,6 +1,6 @@
 import React from 'react'
 
-import { Dialog } from '~/src/system'
+import { Dialog } from '../../../../system'
 
 export const PinnedMessagesDialog = () => {
   return (

packages/status-react/src/routes/chat/components/chat-input/index.tsx

@@ -1,13 +1,12 @@
 import React, { useEffect, useRef, useState } from 'react'
 
-import { useChatContext } from '~/src/contexts/chat-context'
-// import { EmojiIcon } from '~/src/icons/emoji-icon'
-// import { GifIcon } from '~/src/icons/gif-icon'
-// import { ImageIcon } from '~/src/icons/image-icon'
-// import { StickerIcon } from '~/src/icons/sticker-icon'
-import { styled } from '~/src/styles/config'
-
-// import { Box, Flex, IconButton } from '~/src/system'
+import { useChatContext } from '../../../../contexts/chat-context'
+// import { EmojiIcon } from '../../../../icons/emoji-icon'
+// import { GifIcon } from '../../../../icons/gif-icon'
+// import { ImageIcon } from '../../../../icons/image-icon'
+// import { StickerIcon } from '../../../../icons/sticker-icon'
+import { styled } from '../../../../styles/config'
+// import { Box, Flex, IconButton } from '../../../../system'
 import { InputReply } from './input-reply'
 
 interface Props {

packages/status-react/src/routes/chat/components/chat-input/input-reply.tsx

@@ -1,11 +1,11 @@
 import React from 'react'
 
-import { useChatContext } from '~/src/contexts/chat-context'
-import { CrossIcon } from '~/src/icons/cross-icon'
-import { styled } from '~/src/styles/config'
-import { Flex, IconButton, Text } from '~/src/system'
+import { useChatContext } from '../../../../contexts/chat-context'
+import { CrossIcon } from '../../../../icons/cross-icon'
+import { styled } from '../../../../styles/config'
+import { Flex, IconButton, Text } from '../../../../system'
 
-import type { Member, Message } from '~/src/protocol'
+import type { Member, Message } from '../../../../protocol'
 
 interface Props {
   reply: {

packages/status-react/src/routes/chat/components/chat-message/actions.tsx

@@ -1,21 +1,21 @@
 import React from 'react'
 
-import { ReactionPopover } from '~/src/components/reaction-popover'
-import { PencilIcon } from '~/src/icons/pencil-icon'
-// import { PinIcon } from '~/src/icons/pin-icon'
-import { ReactionIcon } from '~/src/icons/reaction-icon'
-import { ReplyIcon } from '~/src/icons/reply-icon'
-import { TrashIcon } from '~/src/icons/trash-icon'
-// import { UnpinIcon } from '~/src/icons/unpin-icon'
-import { styled } from '~/src/styles/config'
+import { ReactionPopover } from '../../../../components/reaction-popover'
+import { PencilIcon } from '../../../../icons/pencil-icon'
+// import { PinIcon } from '../../../../icons/pin-icon'
+import { ReactionIcon } from '../../../../icons/reaction-icon'
+import { ReplyIcon } from '../../../../icons/reply-icon'
+import { TrashIcon } from '../../../../icons/trash-icon'
+// import { UnpinIcon } from '../../../../icons/unpin-icon'
+import { styled } from '../../../../styles/config'
 import {
   AlertDialog,
   AlertDialogTrigger,
   IconButton,
   Tooltip,
-} from '~/src/system'
+} from '../../../../system'
 
-import type { Reaction, Reactions } from '~/src/protocol'
+import type { Reaction, Reactions } from '../../../../protocol'
 
 interface Props {
   owner: boolean

packages/status-react/src/routes/chat/components/chat-message/index.tsx

@@ -2,12 +2,12 @@ import React, { useState } from 'react'
 
 import { useMatch } from 'react-router-dom'
 
-// import { UserProfileDialog } from '~/src/components/user-profile-dialog'
-import { useChatContext } from '~/src/contexts/chat-context'
-// import { BellIcon } from '~/src/icons/bell-icon'
-// import { PinIcon } from '~/src/icons/pin-icon'
-import { useProtocol } from '~/src/protocol'
-import { styled } from '~/src/styles/config'
+// import { UserProfileDialog } from '../../../../components/user-profile-dialog'
+import { useChatContext } from '../../../../contexts/chat-context'
+// import { BellIcon } from '../../../../icons/bell-icon'
+// import { PinIcon } from '../../../../icons/pin-icon'
+import { useProtocol } from '../../../../protocol'
+import { styled } from '../../../../styles/config'
 import {
   Avatar,
   Box,
@@ -21,14 +21,13 @@ import {
   Image,
   Text,
   // useDialog,
-} from '~/src/system'
-
+} from '../../../../system'
 import { ChatInput } from '../chat-input'
 import { Actions } from './actions'
 import { MessageReply } from './message-reply'
 import { MessageReactions } from './reactions'
 
-import type { Message, Reaction } from '~/src/protocol'
+import type { Message, Reaction } from '../../../../protocol'
 
 interface Props {
   message: Message

packages/status-react/src/routes/chat/components/chat-message/message-reply.tsx

@@ -2,9 +2,9 @@ import React from 'react'
 
 import { useMatch } from 'react-router-dom'
 
-import { useProtocol } from '~/src/protocol'
-import { styled } from '~/src/styles/config'
-import { Avatar, Box, Flex, Image, Text } from '~/src/system'
+import { useProtocol } from '../../../../protocol'
+import { styled } from '../../../../styles/config'
+import { Avatar, Box, Flex, Image, Text } from '../../../../system'
 
 interface Props {
   messageId: string

packages/status-react/src/routes/chat/components/chat-message/reactions.tsx

@@ -1,12 +1,15 @@
 import React, { useState } from 'react'
 
-import { emojis, ReactionPopover } from '~/src/components/reaction-popover'
-import { ReactionIcon } from '~/src/icons/reaction-icon'
-import { useAccount } from '~/src/protocol'
-import { styled } from '~/src/styles/config'
-import { Flex, Image, Text } from '~/src/system'
+import {
+  emojis,
+  ReactionPopover,
+} from '../../../../components/reaction-popover'
+import { ReactionIcon } from '../../../../icons/reaction-icon'
+import { useAccount } from '../../../../protocol'
+import { styled } from '../../../../styles/config'
+import { Flex, Image, Text } from '../../../../system'
 
-import type { Reaction, Reactions } from '~/src/protocol'
+import type { Reaction, Reactions } from '../../../../protocol'
 
 interface Props {
   reactions: Reactions

packages/status-react/src/routes/chat/components/navbar/index.tsx

@@ -2,18 +2,14 @@ import React from 'react'
 
 import { useMatch } from 'react-router-dom'
 
-// import { ChatMenu } from '~/src/components/chat-menu'
-import { useAppState } from '~/src/contexts/app-context'
-// import { BellIcon } from '~/src/icons/bell-icon'
-// import { DotsIcon } from '~/src/icons/dots-icon'
-import { GroupIcon } from '~/src/icons/group-icon'
-import { useChat } from '~/src/protocol'
-import { styled } from '~/src/styles/config'
-import {
-  /*DropdownMenuTrigger,*/ Flex,
-  IconButton /*,Separator*/,
-} from '~/src/system'
-
+// import { ChatMenu } from '../../../../components/chat-menu'
+import { useAppState } from '../../../../contexts/app-context'
+// import { BellIcon } from '../../../../icons/bell-icon'
+// import { DotsIcon } from '../../../../icons/dots-icon'
+import { GroupIcon } from '../../../../icons/group-icon'
+import { useChat } from '../../../../protocol'
+import { styled } from '../../../../styles/config'
+import { Flex, IconButton } from '../../../../system'
 import { ChatInfo } from '../chat-info'
 
 interface Props {

packages/status-react/src/routes/chat/index.tsx

@@ -1,16 +1,13 @@
-// TODO: handle non-existing chat ID
-
 import React, { useEffect, useRef } from 'react'
 
 import { useMatch } from 'react-router-dom'
 
-import { MemberSidebar } from '~/src/components/member-sidebar'
-import { useAppState } from '~/src/contexts/app-context'
-import { ChatProvider, useChatContext } from '~/src/contexts/chat-context'
-import { useAccount, useChat, useMessages, useProtocol } from '~/src/protocol'
-import { styled } from '~/src/styles/config'
-import { Avatar, Flex, Heading, Text } from '~/src/system'
-
+import { MemberSidebar } from '../../components/member-sidebar'
+import { useAppState } from '../../contexts/app-context'
+import { ChatProvider, useChatContext } from '../../contexts/chat-context'
+import { useAccount, useChat, useMessages, useProtocol } from '../../protocol'
+import { styled } from '../../styles/config'
+import { Avatar, Flex, Heading, Text } from '../../system'
 import { ChatInput } from './components/chat-input'
 import { ChatMessage } from './components/chat-message'
 import { Navbar } from './components/navbar'

packages/status-react/src/routes/index.tsx

@@ -8,17 +8,16 @@ import {
   useMatch,
 } from 'react-router-dom'
 
-import { MainSidebar } from '~/src/components/main-sidebar'
-import { AppProvider } from '~/src/contexts/app-context'
-import { DialogProvider } from '~/src/contexts/dialog-context'
-import { ProtocolProvider, useProtocol } from '~/src/protocol'
-import { Chat } from '~/src/routes/chat'
-import { styled } from '~/src/styles/config'
-import { GlobalStyle } from '~/src/styles/GlobalStyle'
-
+import { MainSidebar } from '../components/main-sidebar'
+import { AppProvider } from '../contexts/app-context'
+import { DialogProvider } from '../contexts/dialog-context'
 import { useTheme } from '../hooks/use-theme'
+import { ProtocolProvider, useProtocol } from '../protocol'
+import { Chat } from '../routes/chat'
+import { styled } from '../styles/config'
+import { GlobalStyle } from '../styles/GlobalStyle'
 
-import type { Config } from '~/src/types/config'
+import type { Config } from '../types/config'
 
 interface Props extends Config {
   meta?: string

packages/status-react/src/system/avatar/styles.tsx

@@ -1,6 +1,6 @@
-import { styled } from '~/src/styles/config'
+import { styled } from '../../styles/config'
 
-import type { VariantProps } from '~/src/styles/config'
+import type { VariantProps } from '../../styles/config'
 
 export type Variants = VariantProps<typeof Base>
 

packages/status-react/src/system/box/box.tsx

@@ -1,4 +1,4 @@
-import { styled } from '~/src/styles/config'
+import { styled } from '../../styles/config'
 
 const Box = styled('div', {
   boxSizing: 'border-box',

packages/status-react/src/system/button-group/styles.tsx

@@ -1,6 +1,6 @@
 import { Item, Root } from '@radix-ui/react-toggle-group'
 
-import { styled } from '~/src/styles/config'
+import { styled } from '../../styles/config'
 
 export const Group = styled(Root, {
   backgroundColor: '$primary-3',

packages/status-react/src/system/button/styles.tsx

@@ -1,6 +1,6 @@
-import { styled } from '~/src/styles/config'
+import { styled } from '../../styles/config'
 
-import type { VariantProps } from '~/src/styles/config'
+import type { VariantProps } from '../../styles/config'
 
 export type Variants = VariantProps<typeof Base>
 

packages/status-react/src/system/checkbox/styles.tsx

@@ -1,7 +1,7 @@
 import * as Checkbox from '@radix-ui/react-checkbox'
 import { Label } from '@radix-ui/react-label'
 
-import { styled, theme } from '~/src/styles/config'
+import { styled, theme } from '../../styles/config'
 
 export const Wrapper = styled(Label, {
   cursor: 'pointer',

packages/status-react/src/system/copy-input/styles.tsx

@@ -1,4 +1,4 @@
-import { styled } from '~/src/styles/config'
+import { styled } from '../../styles/config'
 
 export const Wrapper = styled('div', {
   position: 'relative',

packages/status-react/src/system/dialog/alert-dialog.tsx

@@ -2,9 +2,8 @@ import React, { cloneElement, useCallback, useRef } from 'react'
 
 import * as Primitive from '@radix-ui/react-alert-dialog'
 
-import { useDialogContext } from '~/src/contexts/dialog-context'
-import { CrossIcon } from '~/src/icons/cross-icon'
-
+import { useDialogContext } from '../../contexts/dialog-context'
+import { CrossIcon } from '../../icons/cross-icon'
 import { Button } from '../button'
 import { Heading } from '../heading'
 import { IconButton } from '../icon-button'

packages/status-react/src/system/dialog/dialog.tsx

@@ -2,9 +2,8 @@ import React, { useCallback, useRef, useState } from 'react'
 
 import * as Primitive from '@radix-ui/react-dialog'
 
-import { useDialogContext } from '~/src/contexts/dialog-context'
-import { CrossIcon } from '~/src/icons/cross-icon'
-
+import { useDialogContext } from '../../contexts/dialog-context'
+import { CrossIcon } from '../../icons/cross-icon'
 import { Button } from '../button'
 import { Heading } from '../heading'
 import { IconButton } from '../icon-button'

packages/status-react/src/system/dialog/styles.tsx

@@ -1,8 +1,7 @@
-import { keyframes, styled } from '~/src/styles/config'
-
+import { keyframes, styled } from '../../styles/config'
 import { Flex } from '../flex'
 
-import type { VariantProps } from '~/src/styles/config'
+import type { VariantProps } from '../../styles/config'
 
 export type Variants = VariantProps<typeof Content>
 

packages/status-react/src/system/emoji-hash/styles.tsx

@@ -1,4 +1,4 @@
-import { styled } from '~/src/styles/config'
+import { styled } from '../../styles/config'
 
 export const Base = styled('div', {
   position: 'relative',

packages/status-react/src/system/flex/flex.tsx

@@ -1,5 +1,4 @@
-import { styled } from '~/src/styles/config'
-
+import { styled } from '../../styles/config'
 import { Box } from '../box'
 
 const Flex = styled(Box, {

packages/status-react/src/system/grid/grid.tsx

@@ -1,5 +1,4 @@
-import { styled } from '~/src/styles/config'
-
+import { styled } from '../../styles/config'
 import { Box } from '../box'
 
 const Grid = styled(Box, {

packages/status-react/src/system/heading/heading.tsx

@@ -1,4 +1,4 @@
-import { styled, theme } from '~/src/styles/config'
+import { styled, theme } from '../../styles/config'
 
 import type React from 'react'
 

packages/status-react/src/system/icon-button/styles.tsx

@@ -1,6 +1,6 @@
-import { styled } from '~/src/styles/config'
+import { styled } from '../../styles/config'
 
-import type { VariantProps } from '~/src/styles/config'
+import type { VariantProps } from '../../styles/config'
 
 export type Variants = VariantProps<typeof Base>
 

packages/status-react/src/system/image/styles.tsx

@@ -1,6 +1,6 @@
-import { styled } from '~/src/styles/config'
+import { styled } from '../../styles/config'
 
-import type { VariantProps } from '~/src/styles/config'
+import type { VariantProps } from '../../styles/config'
 
 export type Variants = VariantProps<typeof Base>
 

packages/status-react/src/system/menu/menu.tsx

@@ -1,8 +1,7 @@
 import React, { cloneElement } from 'react'
 
-import { ChevronRightIcon } from '~/src/icons/chevron-right-icon'
-import { styled, theme } from '~/src/styles/config'
-
+import { ChevronRightIcon } from '../../icons/chevron-right-icon'
+import { styled, theme } from '../../styles/config'
 import { Box } from '../box'
 import { Icon } from '../icon'
 

packages/status-react/src/system/popover/styles.tsx

@@ -1,6 +1,6 @@
-import { styled } from '~/src/styles/config'
+import { styled } from '../../styles/config'
 
-import type { VariantProps } from '~/src/styles/config'
+import type { VariantProps } from '../../styles/config'
 
 export type Variants = VariantProps<typeof Content>
 

packages/status-react/src/system/separator/separator.tsx

@@ -1,6 +1,6 @@
 import { Root } from '@radix-ui/react-separator'
 
-import { styled } from '~/src/styles/config'
+import { styled } from '../../styles/config'
 
 export const Separator = styled(Root, {
   border: 'none',

packages/status-react/src/system/text-input/styles.tsx

@@ -1,4 +1,4 @@
-import { styled } from '~/src/styles/config'
+import { styled } from '../../styles/config'
 
 export const Base = styled('input', {
   fontFamily: '$sans',

packages/status-react/src/system/text/text.tsx

@@ -1,4 +1,4 @@
-import { styled, theme } from '~/src/styles/config'
+import { styled, theme } from '../../styles/config'
 
 import type React from 'react'
 

packages/status-react/src/system/tooltip/styles.tsx

@@ -1,6 +1,6 @@
 import * as Primitive from '@radix-ui/react-tooltip'
 
-import { keyframes, styled, theme } from '~/src/styles/config'
+import { keyframes, styled, theme } from '../../styles/config'
 
 export const slideUpAndFade = keyframes({
   '0%': { opacity: 0, transform: 'translateY(2px)' },

packages/status-react/tsconfig.json

@@ -4,10 +4,6 @@
   "compilerOptions": {
     "outDir": "./dist",
     "declarationDir": "dist/types",
-    "resolveJsonModule": true,
-    "baseUrl": ".",
-    "paths": {
-      "~/*": ["./*"]
-    }
+    "resolveJsonModule": true
   }
 }