Change relative path to ~

apps/mobile/babel.config.js

@@ -19,7 +19,7 @@ module.exports = function (api) {
 					],
 					root: ['src'],
 					alias: {
-						'@app': './src'
+						'~': './src'
 					}
 				}
 			]

apps/mobile/src/components/animation/layout.tsx

@@ -1,9 +1,9 @@
-import Layout from '@app/constants/Layout';
-import tw from '@app/lib/tailwind';
 import { MotiView, useDynamicAnimation } from 'moti';
 import React from 'react';
 import { StyleSheet, View } from 'react-native';
 import { useDerivedValue, useSharedValue } from 'react-native-reanimated';
+import Layout from '~/constants/Layout';
+import tw from '~/lib/tailwind';
 
 // Anything wrapped with FadeIn will fade in on mount.
 export const FadeInAnimation = ({ children, delay }: { children: any; delay?: number }) => (

apps/mobile/src/components/browse/BrowseLocationItem.tsx

@@ -1,6 +1,6 @@
-import tw from '@app/lib/tailwind';
 import React from 'react';
 import { Pressable, Text, View } from 'react-native';
+import tw from '~/lib/tailwind';
 
 import FolderIcon from '../icons/FolderIcon';
 

apps/mobile/src/components/browse/BrowseTagItem.tsx

@@ -1,6 +1,6 @@
-import tw from '@app/lib/tailwind';
 import React from 'react';
 import { ColorValue, Pressable, Text, View } from 'react-native';
+import tw from '~/lib/tailwind';
 
 type BrowseTagItemProps = {
 	tagName: string;

apps/mobile/src/components/device/Device.tsx

@@ -1,9 +1,9 @@
-import tw from '@app/lib/tailwind';
-import { FilePath } from '@app/types/bindings';
 import { Cloud, Desktop, DeviceMobileCamera, Laptop } from 'phosphor-react-native';
 import React from 'react';
 import { FlatList, Text, View } from 'react-native';
 import { LockClosedIcon } from 'react-native-heroicons/solid';
+import tw from '~/lib/tailwind';
+import { FilePath } from '~/types/bindings';
 
 import FileItem from '../file/FileItem';
 

apps/mobile/src/components/drawer/DrawerContent.tsx

@@ -1,11 +1,11 @@
-import Layout from '@app/constants/Layout';
-import tw from '@app/lib/tailwind';
 import { DrawerContentScrollView } from '@react-navigation/drawer';
 import { DrawerContentComponentProps } from '@react-navigation/drawer/lib/typescript/src/types';
 import { getFocusedRouteNameFromRoute } from '@react-navigation/native';
 import React from 'react';
 import { ColorValue, Image, Platform, Pressable, Text, View } from 'react-native';
 import { CogIcon } from 'react-native-heroicons/solid';
+import Layout from '~/constants/Layout';
+import tw from '~/lib/tailwind';
 
 import CollapsibleView from '../layout/CollapsibleView';
 import Divider from '../primitive/Divider';

apps/mobile/src/components/drawer/DrawerLibraryManager.tsx

@@ -1,11 +1,11 @@
-import { useBridgeMutation } from '@app/hooks/rspc';
-import tw from '@app/lib/tailwind';
-import { useCurrentLibrary, useLibraryStore } from '@app/stores/useLibraryStore';
 import { MotiView } from 'moti';
 import React, { useEffect, useState } from 'react';
 import { Pressable, Text, View } from 'react-native';
 import { LockClosedIcon } from 'react-native-heroicons/outline';
 import { ChevronRightIcon, CogIcon, PlusIcon } from 'react-native-heroicons/solid';
+import { useBridgeMutation } from '~/hooks/rspc';
+import tw from '~/lib/tailwind';
+import { useCurrentLibrary, useLibraryStore } from '~/stores/useLibraryStore';
 
 import { AnimatedHeight } from '../animation/layout';
 import Dialog from '../layout/Dialog';

apps/mobile/src/components/drawer/DrawerLocationItem.tsx

@@ -1,6 +1,6 @@
-import tw from '@app/lib/tailwind';
 import React from 'react';
 import { Pressable, Text, View } from 'react-native';
+import tw from '~/lib/tailwind';
 
 import FolderIcon from '../icons/FolderIcon';
 

apps/mobile/src/components/drawer/DrawerTagItem.tsx

@@ -1,6 +1,6 @@
-import tw from '@app/lib/tailwind';
 import React from 'react';
 import { ColorValue, Pressable, Text, View } from 'react-native';
+import tw from '~/lib/tailwind';
 
 type DrawerTagItemProps = {
 	tagName: string;

apps/mobile/src/components/header/Header.tsx

@@ -1,4 +1,3 @@
-import tw from '@app/lib/tailwind';
 import { useDrawerStatus } from '@react-navigation/drawer';
 import { DrawerNavigationHelpers } from '@react-navigation/drawer/lib/typescript/src/types';
 import { useNavigation } from '@react-navigation/native';
@@ -7,6 +6,7 @@ import { List } from 'phosphor-react-native';
 import React from 'react';
 import { Pressable, Text, View } from 'react-native';
 import { useSafeAreaInsets } from 'react-native-safe-area-context';
+import tw from '~/lib/tailwind';
 
 const Header = () => {
 	const navigation = useNavigation<DrawerNavigationHelpers>();

apps/mobile/src/components/layout/CollapsibleView.tsx

@@ -1,8 +1,8 @@
-import tw from '@app/lib/tailwind';
 import { MotiView } from 'moti';
 import React, { useReducer } from 'react';
 import { Pressable, StyleProp, Text, TextStyle, View, ViewStyle } from 'react-native';
 import { ChevronRightIcon } from 'react-native-heroicons/solid';
+import tw from '~/lib/tailwind';
 
 import { AnimatedHeight } from '../animation/layout';
 

apps/mobile/src/components/layout/Dialog.tsx

@@ -1,7 +1,7 @@
-import tw from '@app/lib/tailwind';
 import { MotiView } from 'moti';
 import React, { useState } from 'react';
 import { KeyboardAvoidingView, Modal, Platform, Pressable, Text, View } from 'react-native';
+import tw from '~/lib/tailwind';
 
 import { Button } from '../primitive/Button';
 

apps/mobile/src/components/primitive/Button.tsx

@@ -1,8 +1,8 @@
-import tw from '@app/lib/tailwind';
 import { VariantProps, cva } from 'class-variance-authority';
 import { MotiPressable, MotiPressableProps } from 'moti/interactions';
 import React, { useMemo } from 'react';
 import { Pressable, PressableProps } from 'react-native';
+import tw from '~/lib/tailwind';
 
 const button = cva(['border rounded-md items-center shadow-sm'], {
 	variants: {

apps/mobile/src/components/primitive/Divider.tsx

@@ -1,6 +1,6 @@
-import tw from '@app/lib/tailwind';
 import React from 'react';
 import { StyleProp, Text, View, ViewStyle } from 'react-native';
+import tw from '~/lib/tailwind';
 
 type DividerProps = {
 	style?: StyleProp<ViewStyle>;

apps/mobile/src/components/primitive/Input.tsx

@@ -1,7 +1,7 @@
-import tw from '@app/lib/tailwind';
 import { VariantProps, cva } from 'class-variance-authority';
 import React from 'react';
 import { TextInput as RNTextInput, TextInputProps as RNTextInputProps } from 'react-native';
+import tw from '~/lib/tailwind';
 
 const input = cva(['text-sm rounded-md border shadow-sm'], {
 	variants: {

apps/mobile/src/navigation/DrawerNavigator.tsx

@@ -1,7 +1,7 @@
-import DrawerContent from '@app/components/drawer/DrawerContent';
 import { DrawerScreenProps, createDrawerNavigator } from '@react-navigation/drawer';
 import { CompositeScreenProps, NavigatorScreenParams } from '@react-navigation/native';
 import { StackScreenProps } from '@react-navigation/stack';
+import DrawerContent from '~/components/drawer/DrawerContent';
 
 import type { RootStackParamList } from '.';
 import type { TabParamList } from './TabNavigator';

apps/mobile/src/navigation/OnboardingNavigator.tsx

@@ -1,6 +1,6 @@
-import CreateLibraryScreen from '@app/screens/onboarding/CreateLibrary';
-import OnboardingScreen from '@app/screens/onboarding/Onboarding';
 import { StackScreenProps, createStackNavigator } from '@react-navigation/stack';
+import CreateLibraryScreen from '~/screens/onboarding/CreateLibrary';
+import OnboardingScreen from '~/screens/onboarding/Onboarding';
 
 const OnboardingStack = createStackNavigator<OnboardingStackParamList>();
 

apps/mobile/src/navigation/SharedScreens.tsx

@@ -1,11 +1,11 @@
-import LocationScreen from '@app/screens/Location';
-import TagScreen from '@app/screens/Tag';
 import { ParamListBase, StackNavigationState, TypedNavigator } from '@react-navigation/native';
 import {
 	StackNavigationEventMap,
 	StackNavigationOptions,
 	StackScreenProps
 } from '@react-navigation/stack';
+import LocationScreen from '~/screens/Location';
+import TagScreen from '~/screens/Tag';
 
 export function SharedScreens(
 	Stack: TypedNavigator<

apps/mobile/src/navigation/TabNavigator.tsx

@@ -1,8 +1,8 @@
-import tw from '@app/lib/tailwind';
 import { BottomTabScreenProps, createBottomTabNavigator } from '@react-navigation/bottom-tabs';
 import { CompositeScreenProps, NavigatorScreenParams } from '@react-navigation/native';
 import { CirclesFour, Folder, Planet } from 'phosphor-react-native';
 import { PhotographIcon } from 'react-native-heroicons/outline';
+import tw from '~/lib/tailwind';
 
 import type { HomeDrawerScreenProps } from './DrawerNavigator';
 import BrowseStack, { BrowseStackParamList } from './tabs/BrowseStack';

apps/mobile/src/navigation/index.tsx

@@ -1,9 +1,9 @@
-import tw from '@app/lib/tailwind';
-import NotFoundScreen from '@app/screens/NotFound';
-import SearchScreen from '@app/screens/modals/Search';
-import SettingsScreen from '@app/screens/modals/settings/Settings';
 import { NavigatorScreenParams } from '@react-navigation/native';
 import { StackScreenProps, createStackNavigator } from '@react-navigation/stack';
+import tw from '~/lib/tailwind';
+import NotFoundScreen from '~/screens/NotFound';
+import SearchScreen from '~/screens/modals/Search';
+import SettingsScreen from '~/screens/modals/settings/Settings';
 
 import type { DrawerNavParamList } from './DrawerNavigator';
 import DrawerNavigator from './DrawerNavigator';

apps/mobile/src/navigation/tabs/BrowseStack.tsx

@@ -1,8 +1,8 @@
-import Header from '@app/components/header/Header';
-import tw from '@app/lib/tailwind';
-import BrowseScreen from '@app/screens/Browse';
 import { CompositeScreenProps } from '@react-navigation/native';
 import { StackScreenProps, createStackNavigator } from '@react-navigation/stack';
+import Header from '~/components/header/Header';
+import tw from '~/lib/tailwind';
+import BrowseScreen from '~/screens/Browse';
 
 import { SharedScreens, SharedScreensParamList } from '../SharedScreens';
 import { TabScreenProps } from '../TabNavigator';

apps/mobile/src/navigation/tabs/OverviewStack.tsx

@@ -1,6 +1,6 @@
-import tw from '@app/lib/tailwind';
 import { CompositeScreenProps } from '@react-navigation/native';
 import { StackScreenProps, TransitionPresets, createStackNavigator } from '@react-navigation/stack';
+import tw from '~/lib/tailwind';
 
 import Header from '../../components/header/Header';
 import OverviewScreen from '../../screens/Overview';

apps/mobile/src/navigation/tabs/PhotosStack.tsx

@@ -1,6 +1,6 @@
-import tw from '@app/lib/tailwind';
 import { CompositeScreenProps } from '@react-navigation/native';
 import { StackScreenProps, TransitionPresets, createStackNavigator } from '@react-navigation/stack';
+import tw from '~/lib/tailwind';
 
 import Header from '../../components/header/Header';
 import PhotosScreen from '../../screens/Photos';

apps/mobile/src/navigation/tabs/SpacesStack.tsx

@@ -1,6 +1,6 @@
-import tw from '@app/lib/tailwind';
 import { CompositeScreenProps } from '@react-navigation/native';
 import { StackScreenProps, TransitionPresets, createStackNavigator } from '@react-navigation/stack';
+import tw from '~/lib/tailwind';
 
 import Header from '../../components/header/Header';
 import SpacesScreen from '../../screens/Spaces';

apps/mobile/src/screens/Browse.tsx

@@ -1,10 +1,10 @@
-import BrowseLocationItem from '@app/components/browse/BrowseLocationItem';
-import BrowseTagItem from '@app/components/browse/BrowseTagItem';
-import CollapsibleView from '@app/components/layout/CollapsibleView';
-import tw from '@app/lib/tailwind';
-import { BrowseStackScreenProps } from '@app/navigation/tabs/BrowseStack';
 import React from 'react';
 import { ColorValue, Text, View } from 'react-native';
+import BrowseLocationItem from '~/components/browse/BrowseLocationItem';
+import BrowseTagItem from '~/components/browse/BrowseTagItem';
+import CollapsibleView from '~/components/layout/CollapsibleView';
+import tw from '~/lib/tailwind';
+import { BrowseStackScreenProps } from '~/navigation/tabs/BrowseStack';
 
 const placeholderLocationData = [
 	{

apps/mobile/src/screens/Location.tsx

@@ -1,7 +1,7 @@
-import tw from '@app/lib/tailwind';
-import { SharedScreenProps } from '@app/navigation/SharedScreens';
 import React from 'react';
 import { Text, View } from 'react-native';
+import tw from '~/lib/tailwind';
+import { SharedScreenProps } from '~/navigation/SharedScreens';
 
 export default function LocationScreen({ navigation, route }: SharedScreenProps<'Location'>) {
 	const { id } = route.params;

apps/mobile/src/screens/NotFound.tsx

@@ -1,6 +1,6 @@
-import tw from '@app/lib/tailwind';
-import { RootStackScreenProps } from '@app/navigation';
 import { Text, TouchableOpacity, View } from 'react-native';
+import tw from '~/lib/tailwind';
+import { RootStackScreenProps } from '~/navigation';
 
 export default function NotFoundScreen({ navigation }: RootStackScreenProps<'NotFound'>) {
 	return (

apps/mobile/src/screens/Overview.tsx

@@ -1,10 +1,10 @@
-import Device from '@app/components/device/Device';
-import VirtualizedListWrapper from '@app/components/layout/VirtualizedListWrapper';
-import OverviewStats from '@app/containers/OverviewStats';
-import tw from '@app/lib/tailwind';
-import { OverviewStackScreenProps } from '@app/navigation/tabs/OverviewStack';
 import React from 'react';
 import { FlatList, View } from 'react-native';
+import Device from '~/components/device/Device';
+import VirtualizedListWrapper from '~/components/layout/VirtualizedListWrapper';
+import OverviewStats from '~/containers/OverviewStats';
+import tw from '~/lib/tailwind';
+import { OverviewStackScreenProps } from '~/navigation/tabs/OverviewStack';
 
 const placeholderOverviewStats = {
 	id: 1,

apps/mobile/src/screens/Photos.tsx

@@ -1,7 +1,7 @@
-import tw from '@app/lib/tailwind';
-import { PhotosStackScreenProps } from '@app/navigation/tabs/PhotosStack';
 import React from 'react';
 import { Text, View } from 'react-native';
+import tw from '~/lib/tailwind';
+import { PhotosStackScreenProps } from '~/navigation/tabs/PhotosStack';
 
 export default function PhotosScreen({ navigation }: PhotosStackScreenProps<'Photos'>) {
 	return (

apps/mobile/src/screens/Spaces.tsx

@@ -1,7 +1,7 @@
-import tw from '@app/lib/tailwind';
-import { SpacesStackScreenProps } from '@app/navigation/tabs/SpacesStack';
 import React from 'react';
 import { Text, View } from 'react-native';
+import tw from '~/lib/tailwind';
+import { SpacesStackScreenProps } from '~/navigation/tabs/SpacesStack';
 
 export default function SpacesScreen({ navigation }: SpacesStackScreenProps<'Spaces'>) {
 	return (

apps/mobile/src/screens/Tag.tsx

@@ -1,7 +1,7 @@
-import tw from '@app/lib/tailwind';
-import { SharedScreenProps } from '@app/navigation/SharedScreens';
 import React from 'react';
 import { Text, View } from 'react-native';
+import tw from '~/lib/tailwind';
+import { SharedScreenProps } from '~/navigation/SharedScreens';
 
 export default function TagScreen({ navigation, route }: SharedScreenProps<'Tag'>) {
 	const { id } = route.params;

apps/mobile/src/screens/modals/Search.tsx

@@ -1,10 +1,10 @@
-import { Button } from '@app/components/primitive/Button';
-import tw from '@app/lib/tailwind';
-import { RootStackScreenProps } from '@app/navigation';
 import { MagnifyingGlass } from 'phosphor-react-native';
 import React, { useState } from 'react';
 import { ActivityIndicator, Pressable, Text, TextInput, View } from 'react-native';
 import { useSafeAreaInsets } from 'react-native-safe-area-context';
+import { Button } from '~/components/primitive/Button';
+import tw from '~/lib/tailwind';
+import { RootStackScreenProps } from '~/navigation';
 
 const SearchScreen = ({ navigation }: RootStackScreenProps<'Search'>) => {
 	const { top } = useSafeAreaInsets();

apps/mobile/src/screens/modals/settings/Settings.tsx

@@ -1,7 +1,7 @@
-import tw from '@app/lib/tailwind';
-import { RootStackScreenProps } from '@app/navigation';
 import React from 'react';
 import { Text, View } from 'react-native';
+import tw from '~/lib/tailwind';
+import { RootStackScreenProps } from '~/navigation';
 
 export default function SettingsScreen({ navigation }: RootStackScreenProps<'Settings'>) {
 	return (

apps/mobile/src/screens/onboarding/CreateLibrary.tsx

@@ -1,10 +1,10 @@
-import { AnimatedButton } from '@app/components/primitive/Button';
-import { setItemToStorage } from '@app/lib/storage';
-import tw from '@app/lib/tailwind';
-import { OnboardingStackScreenProps } from '@app/navigation/OnboardingNavigator';
-import { useOnboardingStore } from '@app/stores/useOnboardingStore';
 import React from 'react';
 import { Text, View } from 'react-native';
+import { AnimatedButton } from '~/components/primitive/Button';
+import { setItemToStorage } from '~/lib/storage';
+import tw from '~/lib/tailwind';
+import { OnboardingStackScreenProps } from '~/navigation/OnboardingNavigator';
+import { useOnboardingStore } from '~/stores/useOnboardingStore';
 
 const CreateLibraryScreen = ({ navigation }: OnboardingStackScreenProps<'CreateLibrary'>) => {
 	const { hideOnboarding } = useOnboardingStore();

apps/mobile/src/screens/onboarding/Onboarding.tsx

@@ -1,9 +1,9 @@
-import { FadeInUpAnimation, LogoAnimation } from '@app/components/animation/layout';
-import { AnimatedButton } from '@app/components/primitive/Button';
-import tw from '@app/lib/tailwind';
-import { OnboardingStackScreenProps } from '@app/navigation/OnboardingNavigator';
 import React from 'react';
 import { Image, Text, View } from 'react-native';
+import { FadeInUpAnimation, LogoAnimation } from '~/components/animation/layout';
+import { AnimatedButton } from '~/components/primitive/Button';
+import tw from '~/lib/tailwind';
+import { OnboardingStackScreenProps } from '~/navigation/OnboardingNavigator';
 
 const OnboardingScreen = ({ navigation }: OnboardingStackScreenProps<'Onboarding'>) => {
 	return (

apps/mobile/src/stores/useLibraryStore.ts

@@ -1,10 +1,10 @@
-import { useBridgeQuery } from '@app/hooks/rspc';
-import { LibraryConfigWrapped } from '@app/types/bindings';
 import AsyncStorage from '@react-native-async-storage/async-storage';
 import produce from 'immer';
 import { useMemo } from 'react';
 import create from 'zustand';
 import { persist } from 'zustand/middleware';
+import { useBridgeQuery } from '~/hooks/rspc';
+import { LibraryConfigWrapped } from '~/types/bindings';
 
 interface LibraryStore {
 	_hasHydrated: boolean;

apps/mobile/tsconfig.json

@@ -3,7 +3,7 @@
 	"compilerOptions": {
 		"baseUrl": "src",
 		"paths": {
-			"@app/*": ["*"]
+			"~/*": ["*"]
 		}
 	}
 }