From f4f15804f0a5fc154e550c3f64e8ecfb841f2453 Mon Sep 17 00:00:00 2001
From: Pavel Prichodko <14926950+prichodko@users.noreply.github.com>
Date: Fri, 1 Jul 2022 15:19:15 +0200
Subject: [PATCH] remove relative paths from status-react

---
 packages/status-react/package.json            |  2 +-
 .../chat-menu/edit-group-chat-dialog.tsx      |  2 +-
 .../src/components/chat-menu/index.tsx        |  8 ++---
 .../create-profile-dialog/index.tsx           |  2 +-
 .../src/components/loading/index.tsx          |  4 +--
 .../components/channels/channel-group.tsx     |  8 ++---
 .../components/channels/channel-item.tsx      |  5 ++-
 .../components/channels/index.tsx             |  5 ++-
 .../community-info/community-dialog.tsx       |  4 +--
 .../components/community-info/index.tsx       |  7 ++--
 .../get-started/connect-wallet-dialog.tsx     |  4 +--
 .../components/get-started/index.tsx          | 14 ++++----
 .../sync-status-profile-dialog.tsx            |  4 +--
 .../throwaway-profile-found-dialog.tsx        | 11 +++++--
 .../components/messages/chat-item.tsx         | 23 -------------
 .../components/messages/index.tsx             | 33 -------------------
 .../components/sidebar-item/index.tsx         |  4 +--
 .../src/components/main-sidebar/index.tsx     | 13 +++-----
 .../member-sidebar/disconnect-dialog.tsx      |  6 ++--
 .../src/components/member-sidebar/index.tsx   |  7 ++--
 .../member-sidebar/member-group.tsx           |  2 +-
 .../components/member-sidebar/member-item.tsx |  6 ++--
 .../components/member-sidebar/user-item.tsx   |  7 ++--
 .../src/components/reaction-popover/index.tsx |  8 ++---
 .../components/user-profile-dialog/index.tsx  |  4 +--
 .../src/components/welcome-dialog/index.tsx   |  4 +--
 .../status-react/src/protocol/provider.tsx    |  2 +-
 .../status-react/src/protocol/use-members.tsx |  2 +-
 .../chat/components/chat-info/index.tsx       |  6 ++--
 .../chat-info/pinned-messages-dialog.tsx      |  2 +-
 .../chat/components/chat-input/index.tsx      | 15 ++++-----
 .../components/chat-input/input-reply.tsx     | 10 +++---
 .../chat/components/chat-message/actions.tsx  | 20 +++++------
 .../chat/components/chat-message/index.tsx    | 17 +++++-----
 .../components/chat-message/message-reply.tsx |  6 ++--
 .../components/chat-message/reactions.tsx     | 15 +++++----
 .../routes/chat/components/navbar/index.tsx   | 20 +++++------
 .../status-react/src/routes/chat/index.tsx    | 15 ++++-----
 packages/status-react/src/routes/index.tsx    | 17 +++++-----
 .../status-react/src/system/avatar/styles.tsx |  4 +--
 packages/status-react/src/system/box/box.tsx  |  2 +-
 .../src/system/button-group/styles.tsx        |  2 +-
 .../status-react/src/system/button/styles.tsx |  4 +--
 .../src/system/checkbox/styles.tsx            |  2 +-
 .../src/system/copy-input/styles.tsx          |  2 +-
 .../src/system/dialog/alert-dialog.tsx        |  5 ++-
 .../status-react/src/system/dialog/dialog.tsx |  5 ++-
 .../status-react/src/system/dialog/styles.tsx |  5 ++-
 .../src/system/emoji-hash/styles.tsx          |  2 +-
 .../status-react/src/system/flex/flex.tsx     |  3 +-
 .../status-react/src/system/grid/grid.tsx     |  3 +-
 .../src/system/heading/heading.tsx            |  2 +-
 .../src/system/icon-button/styles.tsx         |  4 +--
 .../status-react/src/system/image/styles.tsx  |  4 +--
 .../status-react/src/system/menu/menu.tsx     |  5 ++-
 .../src/system/popover/styles.tsx             |  4 +--
 .../src/system/separator/separator.tsx        |  2 +-
 .../src/system/text-input/styles.tsx          |  2 +-
 .../status-react/src/system/text/text.tsx     |  2 +-
 .../src/system/tooltip/styles.tsx             |  2 +-
 packages/status-react/tsconfig.json           |  6 +---
 61 files changed, 171 insertions(+), 245 deletions(-)
 delete mode 100644 packages/status-react/src/components/main-sidebar/components/messages/chat-item.tsx
 delete mode 100644 packages/status-react/src/components/main-sidebar/components/messages/index.tsx

diff --git a/packages/status-react/package.json b/packages/status-react/package.json
index 1acbd92..5f3ae23 100644
--- a/packages/status-react/package.json
+++ b/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"
diff --git a/packages/status-react/src/components/chat-menu/edit-group-chat-dialog.tsx b/packages/status-react/src/components/chat-menu/edit-group-chat-dialog.tsx
index 45492a0..d67def3 100644
--- a/packages/status-react/src/components/chat-menu/edit-group-chat-dialog.tsx
+++ b/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 (
diff --git a/packages/status-react/src/components/chat-menu/index.tsx b/packages/status-react/src/components/chat-menu/index.tsx
index 9b55317..b5f0aa2 100644
--- a/packages/status-react/src/components/chat-menu/index.tsx
+++ b/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'
diff --git a/packages/status-react/src/components/create-profile-dialog/index.tsx b/packages/status-react/src/components/create-profile-dialog/index.tsx
index 4176ca0..b863bab 100644
--- a/packages/status-react/src/components/create-profile-dialog/index.tsx
+++ b/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 (
diff --git a/packages/status-react/src/components/loading/index.tsx b/packages/status-react/src/components/loading/index.tsx
index eb90ae8..93fb2f0 100644
--- a/packages/status-react/src/components/loading/index.tsx
+++ b/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
diff --git a/packages/status-react/src/components/main-sidebar/components/channels/channel-group.tsx b/packages/status-react/src/components/main-sidebar/components/channels/channel-group.tsx
index 048077f..fbe8986 100644
--- a/packages/status-react/src/components/main-sidebar/components/channels/channel-group.tsx
+++ b/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
diff --git a/packages/status-react/src/components/main-sidebar/components/channels/channel-item.tsx b/packages/status-react/src/components/main-sidebar/components/channels/channel-item.tsx
index 4b86557..230bb45 100644
--- a/packages/status-react/src/components/main-sidebar/components/channels/channel-item.tsx
+++ b/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'
diff --git a/packages/status-react/src/components/main-sidebar/components/channels/index.tsx b/packages/status-react/src/components/main-sidebar/components/channels/index.tsx
index 3f0424a..7e28d9a 100644
--- a/packages/status-react/src/components/main-sidebar/components/channels/index.tsx
+++ b/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'
 
diff --git a/packages/status-react/src/components/main-sidebar/components/community-info/community-dialog.tsx b/packages/status-react/src/components/main-sidebar/components/community-info/community-dialog.tsx
index 078f9f3..f54a17a 100644
--- a/packages/status-react/src/components/main-sidebar/components/community-info/community-dialog.tsx
+++ b/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()
diff --git a/packages/status-react/src/components/main-sidebar/components/community-info/index.tsx b/packages/status-react/src/components/main-sidebar/components/community-info/index.tsx
index d0a43ab..9a3a460 100644
--- a/packages/status-react/src/components/main-sidebar/components/community-info/index.tsx
+++ b/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 = () => {
diff --git a/packages/status-react/src/components/main-sidebar/components/get-started/connect-wallet-dialog.tsx b/packages/status-react/src/components/main-sidebar/components/get-started/connect-wallet-dialog.tsx
index 75ef17b..18d5014 100644
--- a/packages/status-react/src/components/main-sidebar/components/get-started/connect-wallet-dialog.tsx
+++ b/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 = () => {
diff --git a/packages/status-react/src/components/main-sidebar/components/get-started/index.tsx b/packages/status-react/src/components/main-sidebar/components/get-started/index.tsx
index 85633d5..e32ddce 100644
--- a/packages/status-react/src/components/main-sidebar/components/get-started/index.tsx
+++ b/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'
diff --git a/packages/status-react/src/components/main-sidebar/components/get-started/sync-status-profile-dialog.tsx b/packages/status-react/src/components/main-sidebar/components/get-started/sync-status-profile-dialog.tsx
index 7d7ccce..bb60594 100644
--- a/packages/status-react/src/components/main-sidebar/components/get-started/sync-status-profile-dialog.tsx
+++ b/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')
diff --git a/packages/status-react/src/components/main-sidebar/components/get-started/throwaway-profile-found-dialog.tsx b/packages/status-react/src/components/main-sidebar/components/get-started/throwaway-profile-found-dialog.tsx
index 2174705..67673b9 100644
--- a/packages/status-react/src/components/main-sidebar/components/get-started/throwaway-profile-found-dialog.tsx
+++ b/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
diff --git a/packages/status-react/src/components/main-sidebar/components/messages/chat-item.tsx b/packages/status-react/src/components/main-sidebar/components/messages/chat-item.tsx
deleted file mode 100644
index a3ce065..0000000
--- a/packages/status-react/src/components/main-sidebar/components/messages/chat-item.tsx
+++ /dev/null
@@ -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>
-  )
-}
diff --git a/packages/status-react/src/components/main-sidebar/components/messages/index.tsx b/packages/status-react/src/components/main-sidebar/components/messages/index.tsx
deleted file mode 100644
index fe09e49..0000000
--- a/packages/status-react/src/components/main-sidebar/components/messages/index.tsx
+++ /dev/null
@@ -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>
-  )
-}
diff --git a/packages/status-react/src/components/main-sidebar/components/sidebar-item/index.tsx b/packages/status-react/src/components/main-sidebar/components/sidebar-item/index.tsx
index 955ee38..ce0822c 100644
--- a/packages/status-react/src/components/main-sidebar/components/sidebar-item/index.tsx
+++ b/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'
 
diff --git a/packages/status-react/src/components/main-sidebar/index.tsx b/packages/status-react/src/components/main-sidebar/index.tsx
index e91cba8..4f8ecd6 100644
--- a/packages/status-react/src/components/main-sidebar/index.tsx
+++ b/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 />
diff --git a/packages/status-react/src/components/member-sidebar/disconnect-dialog.tsx b/packages/status-react/src/components/member-sidebar/disconnect-dialog.tsx
index c29ac6b..1dd04d9 100644
--- a/packages/status-react/src/components/member-sidebar/disconnect-dialog.tsx
+++ b/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
diff --git a/packages/status-react/src/components/member-sidebar/index.tsx b/packages/status-react/src/components/member-sidebar/index.tsx
index 415250f..ad6f1ea 100644
--- a/packages/status-react/src/components/member-sidebar/index.tsx
+++ b/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'
diff --git a/packages/status-react/src/components/member-sidebar/member-group.tsx b/packages/status-react/src/components/member-sidebar/member-group.tsx
index 451b277..797fc26 100644
--- a/packages/status-react/src/components/member-sidebar/member-group.tsx
+++ b/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
diff --git a/packages/status-react/src/components/member-sidebar/member-item.tsx b/packages/status-react/src/components/member-sidebar/member-item.tsx
index 5b91285..5c1dfdd 100644
--- a/packages/status-react/src/components/member-sidebar/member-item.tsx
+++ b/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
diff --git a/packages/status-react/src/components/member-sidebar/user-item.tsx b/packages/status-react/src/components/member-sidebar/user-item.tsx
index a432445..46c892f 100644
--- a/packages/status-react/src/components/member-sidebar/user-item.tsx
+++ b/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
diff --git a/packages/status-react/src/components/reaction-popover/index.tsx b/packages/status-react/src/components/reaction-popover/index.tsx
index dd78218..52af43b 100644
--- a/packages/status-react/src/components/reaction-popover/index.tsx
+++ b/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
diff --git a/packages/status-react/src/components/user-profile-dialog/index.tsx b/packages/status-react/src/components/user-profile-dialog/index.tsx
index fc9446f..6544db4 100644
--- a/packages/status-react/src/components/user-profile-dialog/index.tsx
+++ b/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
diff --git a/packages/status-react/src/components/welcome-dialog/index.tsx b/packages/status-react/src/components/welcome-dialog/index.tsx
index 4a1a0a8..96e14c2 100644
--- a/packages/status-react/src/components/welcome-dialog/index.tsx
+++ b/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()
diff --git a/packages/status-react/src/protocol/provider.tsx b/packages/status-react/src/protocol/provider.tsx
index 629f798..b32023c 100644
--- a/packages/status-react/src/protocol/provider.tsx
+++ b/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'
 
diff --git a/packages/status-react/src/protocol/use-members.tsx b/packages/status-react/src/protocol/use-members.tsx
index 4137e98..e3f1cac 100644
--- a/packages/status-react/src/protocol/use-members.tsx
+++ b/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'
 
diff --git a/packages/status-react/src/routes/chat/components/chat-info/index.tsx b/packages/status-react/src/routes/chat/components/chat-info/index.tsx
index ba73bb7..5c93909 100644
--- a/packages/status-react/src/routes/chat/components/chat-info/index.tsx
+++ b/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
diff --git a/packages/status-react/src/routes/chat/components/chat-info/pinned-messages-dialog.tsx b/packages/status-react/src/routes/chat/components/chat-info/pinned-messages-dialog.tsx
index 198ef09..637aff1 100644
--- a/packages/status-react/src/routes/chat/components/chat-info/pinned-messages-dialog.tsx
+++ b/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 (
diff --git a/packages/status-react/src/routes/chat/components/chat-input/index.tsx b/packages/status-react/src/routes/chat/components/chat-input/index.tsx
index a0d41ca..618a575 100644
--- a/packages/status-react/src/routes/chat/components/chat-input/index.tsx
+++ b/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 {
diff --git a/packages/status-react/src/routes/chat/components/chat-input/input-reply.tsx b/packages/status-react/src/routes/chat/components/chat-input/input-reply.tsx
index c233bfe..f2ee1fe 100644
--- a/packages/status-react/src/routes/chat/components/chat-input/input-reply.tsx
+++ b/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: {
diff --git a/packages/status-react/src/routes/chat/components/chat-message/actions.tsx b/packages/status-react/src/routes/chat/components/chat-message/actions.tsx
index 2587cba..1a9e46d 100644
--- a/packages/status-react/src/routes/chat/components/chat-message/actions.tsx
+++ b/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
diff --git a/packages/status-react/src/routes/chat/components/chat-message/index.tsx b/packages/status-react/src/routes/chat/components/chat-message/index.tsx
index 6f576c2..98a1864 100644
--- a/packages/status-react/src/routes/chat/components/chat-message/index.tsx
+++ b/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
diff --git a/packages/status-react/src/routes/chat/components/chat-message/message-reply.tsx b/packages/status-react/src/routes/chat/components/chat-message/message-reply.tsx
index 3bbb001..3c33a6f 100644
--- a/packages/status-react/src/routes/chat/components/chat-message/message-reply.tsx
+++ b/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
diff --git a/packages/status-react/src/routes/chat/components/chat-message/reactions.tsx b/packages/status-react/src/routes/chat/components/chat-message/reactions.tsx
index 62b01e4..e64bf53 100644
--- a/packages/status-react/src/routes/chat/components/chat-message/reactions.tsx
+++ b/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
diff --git a/packages/status-react/src/routes/chat/components/navbar/index.tsx b/packages/status-react/src/routes/chat/components/navbar/index.tsx
index 7b45d6d..0dfe5c7 100644
--- a/packages/status-react/src/routes/chat/components/navbar/index.tsx
+++ b/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 {
diff --git a/packages/status-react/src/routes/chat/index.tsx b/packages/status-react/src/routes/chat/index.tsx
index 0e9583c..3e89949 100644
--- a/packages/status-react/src/routes/chat/index.tsx
+++ b/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'
diff --git a/packages/status-react/src/routes/index.tsx b/packages/status-react/src/routes/index.tsx
index ef0662d..69faa67 100644
--- a/packages/status-react/src/routes/index.tsx
+++ b/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
diff --git a/packages/status-react/src/system/avatar/styles.tsx b/packages/status-react/src/system/avatar/styles.tsx
index 3761a43..5ede1ed 100644
--- a/packages/status-react/src/system/avatar/styles.tsx
+++ b/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>
 
diff --git a/packages/status-react/src/system/box/box.tsx b/packages/status-react/src/system/box/box.tsx
index f34f139..82c1735 100644
--- a/packages/status-react/src/system/box/box.tsx
+++ b/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',
diff --git a/packages/status-react/src/system/button-group/styles.tsx b/packages/status-react/src/system/button-group/styles.tsx
index d78f6a1..f776007 100644
--- a/packages/status-react/src/system/button-group/styles.tsx
+++ b/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',
diff --git a/packages/status-react/src/system/button/styles.tsx b/packages/status-react/src/system/button/styles.tsx
index a6e3912..19c82c9 100644
--- a/packages/status-react/src/system/button/styles.tsx
+++ b/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>
 
diff --git a/packages/status-react/src/system/checkbox/styles.tsx b/packages/status-react/src/system/checkbox/styles.tsx
index ed73d61..48f691e 100644
--- a/packages/status-react/src/system/checkbox/styles.tsx
+++ b/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',
diff --git a/packages/status-react/src/system/copy-input/styles.tsx b/packages/status-react/src/system/copy-input/styles.tsx
index aadc193..410a15d 100644
--- a/packages/status-react/src/system/copy-input/styles.tsx
+++ b/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',
diff --git a/packages/status-react/src/system/dialog/alert-dialog.tsx b/packages/status-react/src/system/dialog/alert-dialog.tsx
index 4a43404..2f30506 100644
--- a/packages/status-react/src/system/dialog/alert-dialog.tsx
+++ b/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'
diff --git a/packages/status-react/src/system/dialog/dialog.tsx b/packages/status-react/src/system/dialog/dialog.tsx
index 939a5d5..3906d80 100644
--- a/packages/status-react/src/system/dialog/dialog.tsx
+++ b/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'
diff --git a/packages/status-react/src/system/dialog/styles.tsx b/packages/status-react/src/system/dialog/styles.tsx
index 9f3cc40..41d5d3e 100644
--- a/packages/status-react/src/system/dialog/styles.tsx
+++ b/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>
 
diff --git a/packages/status-react/src/system/emoji-hash/styles.tsx b/packages/status-react/src/system/emoji-hash/styles.tsx
index 8f4a257..20a82d7 100644
--- a/packages/status-react/src/system/emoji-hash/styles.tsx
+++ b/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',
diff --git a/packages/status-react/src/system/flex/flex.tsx b/packages/status-react/src/system/flex/flex.tsx
index c15d55e..d138c6b 100644
--- a/packages/status-react/src/system/flex/flex.tsx
+++ b/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, {
diff --git a/packages/status-react/src/system/grid/grid.tsx b/packages/status-react/src/system/grid/grid.tsx
index 1c910e7..093d1f2 100644
--- a/packages/status-react/src/system/grid/grid.tsx
+++ b/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, {
diff --git a/packages/status-react/src/system/heading/heading.tsx b/packages/status-react/src/system/heading/heading.tsx
index 6c0fdee..8d1757e 100644
--- a/packages/status-react/src/system/heading/heading.tsx
+++ b/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'
 
diff --git a/packages/status-react/src/system/icon-button/styles.tsx b/packages/status-react/src/system/icon-button/styles.tsx
index 9817da6..2000781 100644
--- a/packages/status-react/src/system/icon-button/styles.tsx
+++ b/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>
 
diff --git a/packages/status-react/src/system/image/styles.tsx b/packages/status-react/src/system/image/styles.tsx
index 121fa12..3c00ac8 100644
--- a/packages/status-react/src/system/image/styles.tsx
+++ b/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>
 
diff --git a/packages/status-react/src/system/menu/menu.tsx b/packages/status-react/src/system/menu/menu.tsx
index 2057cb5..f392d7e 100644
--- a/packages/status-react/src/system/menu/menu.tsx
+++ b/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'
 
diff --git a/packages/status-react/src/system/popover/styles.tsx b/packages/status-react/src/system/popover/styles.tsx
index ef34bb8..f762dbf 100644
--- a/packages/status-react/src/system/popover/styles.tsx
+++ b/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>
 
diff --git a/packages/status-react/src/system/separator/separator.tsx b/packages/status-react/src/system/separator/separator.tsx
index 2d7b768..96eabd6 100644
--- a/packages/status-react/src/system/separator/separator.tsx
+++ b/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',
diff --git a/packages/status-react/src/system/text-input/styles.tsx b/packages/status-react/src/system/text-input/styles.tsx
index 2b4e979..4f91533 100644
--- a/packages/status-react/src/system/text-input/styles.tsx
+++ b/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',
diff --git a/packages/status-react/src/system/text/text.tsx b/packages/status-react/src/system/text/text.tsx
index 8604af1..bd27832 100644
--- a/packages/status-react/src/system/text/text.tsx
+++ b/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'
 
diff --git a/packages/status-react/src/system/tooltip/styles.tsx b/packages/status-react/src/system/tooltip/styles.tsx
index 64d131c..d322a81 100644
--- a/packages/status-react/src/system/tooltip/styles.tsx
+++ b/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)' },
diff --git a/packages/status-react/tsconfig.json b/packages/status-react/tsconfig.json
index 73a8ae4..bbbb84f 100644
--- a/packages/status-react/tsconfig.json
+++ b/packages/status-react/tsconfig.json
@@ -4,10 +4,6 @@
   "compilerOptions": {
     "outDir": "./dist",
     "declarationDir": "dist/types",
-    "resolveJsonModule": true,
-    "baseUrl": ".",
-    "paths": {
-      "~/*": ["./*"]
-    }
+    "resolveJsonModule": true
   }
 }