diff --git a/apps/app-frontend/src/App.vue b/apps/app-frontend/src/App.vue
index 039d132af..64edaed39 100644
--- a/apps/app-frontend/src/App.vue
+++ b/apps/app-frontend/src/App.vue
@@ -55,6 +55,7 @@ import AppSettingsModal from '@/components/ui/modal/AppSettingsModal.vue'
 import dayjs from 'dayjs'
 import PromotionWrapper from '@/components/ui/PromotionWrapper.vue'
 import { hide_ads_window, show_ads_window } from '@/helpers/ads.js'
+import FriendsList from '@/components/ui/friends/FriendsList.vue'
 
 const themeStore = useTheming()
 
@@ -255,7 +256,7 @@ watch(
   hasPlus,
   () => {
     if (hasPlus.value) {
-      hide_ads_window()
+      hide_ads_window(true)
     } else {
       show_ads_window()
     }
@@ -428,13 +429,19 @@ async function checkUpdates() {
       >
         <ModrinthLoadingIndicator />
       </div>
-      <div v-if="themeStore.featureFlag_pagePath" class="absolute bottom-0 left-0 m-2 bg-tooltip-bg text-tooltip-text font-semibold rounded-full px-2 py-1 text-xs z-50">
+      <div
+        v-if="themeStore.featureFlag_pagePath"
+        class="absolute bottom-0 left-0 m-2 bg-tooltip-bg text-tooltip-text font-semibold rounded-full px-2 py-1 text-xs z-50"
+      >
         {{ route.fullPath }}
       </div>
       <div
-        id="background-teleport-target" class="absolute h-full -z-10 rounded-tl-[--radius-xl] overflow-hidden" :style="{
-        width: 'calc(100% - var(--right-bar-width))',
-      }"></div>
+        id="background-teleport-target"
+        class="absolute h-full -z-10 rounded-tl-[--radius-xl] overflow-hidden"
+        :style="{
+          width: 'calc(100% - var(--right-bar-width))',
+        }"
+      ></div>
       <RouterView v-slot="{ Component }">
         <template v-if="Component">
           <Suspense @pending="loading.startLoading()" @resolve="loading.stopLoading()">
@@ -460,12 +467,9 @@ async function checkUpdates() {
             </suspense>
           </div>
           <div class="p-4 border-0 border-b-[1px] border-[--brand-gradient-border] border-solid">
-            <h3 class="text-lg m-0">Friends</h3>
-            <p class="m-0">
-              You have no friends :c. <br />
-              <br />
-              <span>Sign in</span> to add friends!
-            </p>
+            <suspense>
+              <FriendsList :credentials="credentials" :sign-in="() => signIn()" />
+            </suspense>
           </div>
           <div class="pt-4 flex flex-col">
             <h3 class="px-4 text-lg m-0">News</h3>
diff --git a/apps/app-frontend/src/components/ui/InstanceIndicator.vue b/apps/app-frontend/src/components/ui/InstanceIndicator.vue
new file mode 100644
index 000000000..61adcfa2e
--- /dev/null
+++ b/apps/app-frontend/src/components/ui/InstanceIndicator.vue
@@ -0,0 +1,53 @@
+<script setup lang="ts">
+import { convertFileSrc } from '@tauri-apps/api/core'
+import { formatCategory } from '@modrinth/utils'
+import { GameIcon, LeftArrowIcon } from '@modrinth/assets'
+import { Avatar, ButtonStyled } from '@modrinth/ui'
+
+type Instance = {
+  game_version: string
+  loader: string
+  path: string
+  install_stage: string
+  icon_path?: string
+  name: string
+}
+
+defineProps<{
+  instance: Instance
+}>()
+</script>
+
+<template>
+  <div class="flex justify-between items-center border-0 border-b border-solid border-divider pb-4">
+    <router-link
+      :to="`/instance/${encodeURIComponent(instance.path)}`"
+      tabindex="-1"
+      class="flex flex-col gap-4 text-primary"
+    >
+      <span class="flex items-center gap-2">
+        <Avatar
+          :src="instance.icon_path ? convertFileSrc(instance.icon_path) : undefined"
+          :alt="instance.name"
+          size="48px"
+        />
+        <span class="flex flex-col gap-2">
+          <span class="font-extrabold bold text-contrast">
+            {{ instance.name }}
+          </span>
+          <span class="text-secondary flex items-center gap-2 font-semibold">
+            <GameIcon class="h-5 w-5 text-secondary" />
+            {{ formatCategory(instance.loader) }} {{ instance.game_version }}
+          </span>
+        </span>
+      </span>
+    </router-link>
+    <ButtonStyled>
+      <router-link :to="`/instance/${encodeURIComponent(instance.path)}`">
+        <LeftArrowIcon /> Back to instance
+      </router-link>
+    </ButtonStyled>
+  </div>
+</template>
+
+<style scoped lang="scss"></style>
diff --git a/apps/app-frontend/src/components/ui/NavTabs.vue b/apps/app-frontend/src/components/ui/NavTabs.vue
index 9bd48695b..fa739af38 100644
--- a/apps/app-frontend/src/components/ui/NavTabs.vue
+++ b/apps/app-frontend/src/components/ui/NavTabs.vue
@@ -29,7 +29,7 @@
 
 <script setup lang="ts">
 import { computed, onMounted, onUnmounted, ref, watch } from 'vue'
-import type { RouteLocationRaw } from 'vue-router';
+import type { RouteLocationRaw } from 'vue-router'
 import { useRoute, RouterLink } from 'vue-router'
 
 const route = useRoute()
@@ -69,13 +69,10 @@ function pickLink() {
   for (let i = filteredLinks.value.length - 1; i >= 0; i--) {
     const link = filteredLinks.value[i]
 
-
     if (route.path === (typeof link.href === 'string' ? link.href : link.href.path)) {
       index = i
       break
-    } else if (
-      (link.subpages && link.subpages.some((subpage) => route.path.includes(subpage)))
-    ) {
+    } else if (link.subpages && link.subpages.some((subpage) => route.path.includes(subpage))) {
       index = i
       subpageSelected.value = true
       break
diff --git a/apps/app-frontend/src/components/ui/friends/FriendsList.vue b/apps/app-frontend/src/components/ui/friends/FriendsList.vue
new file mode 100644
index 000000000..9ba4acc31
--- /dev/null
+++ b/apps/app-frontend/src/components/ui/friends/FriendsList.vue
@@ -0,0 +1,359 @@
+<script setup lang="ts">
+import { Avatar, ButtonStyled, NewModal, OverflowMenu } from '@modrinth/ui'
+import {
+  UserPlusIcon,
+  MoreVerticalIcon,
+  MailIcon,
+  SettingsIcon,
+  TrashIcon,
+  XIcon,
+} from '@modrinth/assets'
+import { ref, onUnmounted, watch, computed } from 'vue'
+import { friend_listener } from '@/helpers/events'
+import { friends, friend_statuses, add_friend, remove_friend } from '@/helpers/friends'
+import { get_user_many } from '@/helpers/cache'
+import { handleError } from '@/store/notifications.js'
+import ContextMenu from '@/components/ui/ContextMenu.vue'
+import type { Dayjs } from 'dayjs'
+import dayjs from 'dayjs'
+
+const props = defineProps<{
+  credentials: unknown | null
+  signIn: () => void2
+}>()
+
+const userCredentials = computed(() => props.credentials)
+
+const search = ref('')
+const manageFriendsModal = ref()
+const friendInvitesModal = ref()
+
+const username = ref('')
+const addFriendModal = ref()
+async function addFriendFromModal() {
+  addFriendModal.value.hide()
+  await add_friend(username.value).catch(handleError)
+  username.value = ''
+  await loadFriends()
+}
+
+const friendOptions = ref()
+async function handleFriendOptions(args) {
+  switch (args.option) {
+    case 'remove-friend':
+      await removeFriend(args.item)
+      break
+  }
+}
+
+async function addFriend(friend: Friend) {
+  await add_friend(
+    friend.id === userCredentials.value.user_id ? friend.friend_id : friend.id,
+  ).catch(handleError)
+  await loadFriends()
+}
+
+async function removeFriend(friend: Friend) {
+  await remove_friend(
+    friend.id === userCredentials.value.user_id ? friend.friend_id : friend.id,
+  ).catch(handleError)
+  await loadFriends()
+}
+
+type Friend = {
+  id: string
+  friend_id: string | null
+  status: string | null
+  last_updated: Dayjs | null
+  created: Dayjs
+  username: string
+  accepted: boolean
+  online: boolean
+  avatar: string
+}
+
+const userFriends = ref<Friend[]>([])
+const acceptedFriends = computed(() =>
+  userFriends.value
+    .filter((x) => x.accepted)
+    .toSorted((a, b) => {
+      if (a.last_updated === null && b.last_updated === null) {
+        return 0 // Both are null, equal in sorting
+      }
+      if (a.last_updated === null) {
+        return 1 // `a` is null, move it after `b`
+      }
+      if (b.last_updated === null) {
+        return -1 // `b` is null, move it after `a`
+      }
+      // Both are non-null, sort by date
+      return b.last_updated.diff(a.last_updated)
+    }),
+)
+const pendingFriends = computed(() =>
+  userFriends.value.filter((x) => !x.accepted).toSorted((a, b) => b.created.diff(a.created)),
+)
+
+const loading = ref(true)
+async function loadFriends(timeout = false) {
+  loading.value = timeout
+
+  try {
+    const friendsList = await friends()
+
+    if (friendsList.length === 0) {
+      userFriends.value = []
+    } else {
+      const friendStatuses = await friend_statuses()
+      const users = await get_user_many(
+        friendsList.map((x) => (x.id === userCredentials.value.user_id ? x.friend_id : x.id)),
+      )
+
+      userFriends.value = friendsList.map((friend) => {
+        const user = users.find((x) => x.id === friend.id || x.id === friend.friend_id)
+        const status = friendStatuses.find(
+          (x) => x.user_id === friend.id || x.user_id === friend.friend_id,
+        )
+        return {
+          id: friend.id,
+          friend_id: friend.friend_id,
+          status: status?.profile_name,
+          last_updated: status && status.last_update ? dayjs(status.last_update) : null,
+          created: dayjs(friend.created),
+          avatar: user?.avatar_url,
+          username: user?.username,
+          online: !!status,
+          accepted: friend.accepted,
+        }
+      })
+    }
+
+    loading.value = false
+  } catch (e) {
+    console.error('Error loading friends', e)
+    if (timeout) {
+      setTimeout(() => loadFriends(), 15 * 1000)
+    }
+  }
+}
+
+watch(
+  userCredentials,
+  () => {
+    console.log('watch', userCredentials.value)
+    if (userCredentials.value === undefined) {
+      userFriends.value = []
+    } else if (userCredentials.value === null) {
+      userFriends.value = []
+      loading.value = false
+    } else {
+      loadFriends(true)
+    }
+  },
+  { immediate: true },
+)
+
+const unlisten = await friend_listener(() => loadFriends())
+onUnmounted(() => {
+  unlisten()
+})
+// TODO: Remove friends menu
+</script>
+
+<template>
+  <NewModal ref="manageFriendsModal" header="Manage friends">
+    <p v-if="acceptedFriends.length === 0">You have no friends :C</p>
+    <div v-else class="flex flex-col gap-4">
+      <input type="text" placeholder="Search friends..." class="w-full" />
+      <div
+        v-for="friend in acceptedFriends.filter((x) =>
+          x.username.toLowerCase().includes(search.value),
+        )"
+        :key="friend.username"
+        class="flex gap-2 items-center min-w-[20rem]"
+      >
+        <div class="relative">
+          <Avatar :src="friend.avatar" class="w-12 h-12 rounded-full" size="2.25rem" circle />
+          <span
+            v-if="friend.online"
+            class="bottom-1 right-0 absolute w-3 h-3 bg-brand border-2 border-black border-solid rounded-full"
+          />
+        </div>
+        <div>{{ friend.username }}</div>
+        <div class="ml-auto">
+          <ButtonStyled>
+            <button @click="removeFriend(friend)">
+              <XIcon />
+              Remove
+            </button>
+          </ButtonStyled>
+        </div>
+      </div>
+    </div>
+  </NewModal>
+  <NewModal ref="friendInvitesModal" header="View friend requests">
+    <p v-if="pendingFriends.length === 0">You have no pending friend requests :C</p>
+    <div v-else class="flex flex-col gap-4">
+      <div v-for="friend in pendingFriends" :key="friend.username" class="flex gap-2">
+        <Avatar :src="friend.avatar" class="w-12 h-12 rounded-full" size="2.25rem" circle />
+        <div class="flex flex-col gap-2">
+          <div>
+            <p class="m-0">
+              <template v-if="friend.id === userCredentials.user_id">
+                <span class="font-bold">{{ friend.username }}</span> sent you a friend request
+              </template>
+              <template v-else>
+                You sent <span class="font-bold">{{ friend.username }}</span> a friend request
+              </template>
+            </p>
+            <p class="m-0 text-sm text-secondary">{{ friend.created.fromNow() }}</p>
+          </div>
+          <div class="flex gap-2">
+            <template v-if="friend.id === userCredentials.user_id">
+              <ButtonStyled color="brand">
+                <button @click="addFriend(friend)">
+                  <UserPlusIcon />
+                  Accept
+                </button>
+              </ButtonStyled>
+              <ButtonStyled>
+                <button @click="removeFriend(friend)">
+                  <XIcon />
+                  Ignore
+                </button>
+              </ButtonStyled>
+            </template>
+            <template v-else>
+              <ButtonStyled>
+                <button @click="removeFriend(friend)">
+                  <XIcon />
+                  Cancel
+                </button>
+              </ButtonStyled>
+            </template>
+          </div>
+        </div>
+      </div>
+    </div>
+  </NewModal>
+  <NewModal ref="addFriendModal" header="Add a friend">
+    <div class="mb-4">
+      <h2 class="m-0 text-xl">Username</h2>
+      <p class="m-0 mt-1 leading-tight">You can add friends with their Modrinth username.</p>
+      <input v-model="username" class="mt-2" type="text" placeholder="Enter username..." />
+    </div>
+    <ButtonStyled color="brand">
+      <button class="ml-auto" :disabled="username.length === 0" @click="addFriendFromModal">
+        <UserPlusIcon />
+        Add friend
+      </button>
+    </ButtonStyled>
+  </NewModal>
+  <div class="flex justify-between items-center">
+    <h3 class="text-lg m-0">Friends</h3>
+    <ButtonStyled type="transparent" circular>
+      <OverflowMenu
+        :options="[
+          {
+            id: 'add-friend',
+            action: () => addFriendModal.show(),
+          },
+          {
+            id: 'manage-friends',
+            action: () => manageFriendsModal.show(),
+            shown: acceptedFriends.length > 0,
+          },
+          {
+            id: 'view-requests',
+            action: () => friendInvitesModal.show(),
+            shown: pendingFriends.length > 0,
+          },
+        ]"
+        aria-label="More options"
+      >
+        <MoreVerticalIcon aria-hidden="true" />
+        <template #add-friend>
+          <UserPlusIcon aria-hidden="true" />
+          Add friend
+        </template>
+        <template #manage-friends>
+          <SettingsIcon aria-hidden="true" />
+          Manage friends
+          <div
+            v-if="acceptedFriends.length > 0"
+            class="bg-button-bg w-6 h-6 rounded-full flex items-center justify-center"
+          >
+            {{ acceptedFriends.length }}
+          </div>
+        </template>
+        <template #view-requests>
+          <MailIcon aria-hidden="true" />
+          View friend requests
+          <div
+            v-if="pendingFriends.length > 0"
+            class="bg-button-bg w-6 h-6 rounded-full flex items-center justify-center"
+          >
+            {{ pendingFriends.length }}
+          </div>
+        </template>
+      </OverflowMenu>
+    </ButtonStyled>
+  </div>
+  <div class="flex flex-col gap-2 mt-2">
+    <template v-if="loading">
+      <div v-for="n in 5" :key="n" class="flex gap-2 items-center animate-pulse">
+        <div class="min-w-9 min-h-9 bg-button-bg rounded-full"></div>
+        <div class="flex flex-col w-full">
+          <div class="h-3 bg-button-bg rounded-full w-1/2 mb-1"></div>
+          <div class="h-2.5 bg-button-bg rounded-full w-3/4"></div>
+        </div>
+      </div>
+    </template>
+    <template v-else-if="acceptedFriends.length === 0">
+      <div class="text-sm">
+        <div class="mb-2">You have no friends :C</div>
+        <div v-if="!userCredentials">
+          <span class="text-link cursor-pointer" @click="signIn">Sign in</span> to add friends!
+        </div>
+        <div v-else>
+          Why don't you
+          <span class="text-link cursor-pointer" @click="addFriendModal.show()">add one</span>?
+        </div>
+      </div>
+    </template>
+    <template v-else>
+      <ContextMenu ref="friendOptions" @option-clicked="handleFriendOptions">
+        <template #remove-friend> <TrashIcon /> Remove friend </template>
+      </ContextMenu>
+      <div
+        v-for="friend in acceptedFriends.slice(0, 5)"
+        :key="friend.username"
+        class="flex gap-2 items-center"
+        :class="{ grayscale: !friend.online }"
+        @contextmenu.prevent.stop="
+          (event) =>
+            friendOptions.showMenu(event, friend, [
+              {
+                name: 'remove-friend',
+                color: 'danger',
+              },
+            ])
+        "
+      >
+        <div class="relative">
+          <Avatar :src="friend.avatar" class="w-12 h-12 rounded-full" size="2.25rem" circle />
+          <span
+            v-if="friend.online"
+            class="bottom-1 right-0 absolute w-3 h-3 bg-brand border-2 border-black border-solid rounded-full"
+          />
+        </div>
+        <div class="flex flex-col">
+          <span class="text-md m-0 font-medium" :class="{ 'text-secondary': !friend.online }">
+            {{ friend.username }}
+          </span>
+          <span v-if="friend.status" class="m-0 text-xs">{{ friend.status }}</span>
+        </div>
+      </div>
+    </template>
+  </div>
+</template>
diff --git a/apps/app-frontend/src/components/ui/install_flow/ModInstallModal.vue b/apps/app-frontend/src/components/ui/install_flow/ModInstallModal.vue
index 00ae74dc0..70c49e879 100644
--- a/apps/app-frontend/src/components/ui/install_flow/ModInstallModal.vue
+++ b/apps/app-frontend/src/components/ui/install_flow/ModInstallModal.vue
@@ -243,7 +243,7 @@ const createInstance = async () => {
             "
           >
             <Button
-              :disabled="profile.installedMod || profile.installing || profile.linked_data?.locked"
+              :disabled="profile.installedMod || profile.installing"
               @click="install(profile)"
             >
               <DownloadIcon v-if="!profile.installedMod && !profile.installing" />
@@ -253,9 +253,7 @@ const createInstance = async () => {
                   ? 'Installing...'
                   : profile.installedMod
                     ? 'Installed'
-                    : profile.linked_data && profile.linked_data.locked
-                      ? 'Paired'
-                      : 'Install'
+                    : 'Install'
               }}
             </Button>
           </div>
diff --git a/apps/app-frontend/src/components/ui/modal/AppSettingsModal.vue b/apps/app-frontend/src/components/ui/modal/AppSettingsModal.vue
index a1763a45f..b6a23ec02 100644
--- a/apps/app-frontend/src/components/ui/modal/AppSettingsModal.vue
+++ b/apps/app-frontend/src/components/ui/modal/AppSettingsModal.vue
@@ -119,20 +119,27 @@ const osVersion = getOsVersion()
         </button>
 
         <div class="mt-auto text-secondary text-sm">
-          <p v-if="themeStore.devMode" class="text-brand font-semibold m-0 mb-2">{{ formatMessage(developerModeEnabled) }}</p>
+          <p v-if="themeStore.devMode" class="text-brand font-semibold m-0 mb-2">
+            {{ formatMessage(developerModeEnabled) }}
+          </p>
           <div class="flex items-center gap-3">
             <button
-              class="p-0 m-0 bg-transparent border-none cursor-pointer button-animation" :class="{ 'text-brand': themeStore.devMode, 'text-secondary': !themeStore.devMode }" @click="() => {
-            devModeCounter++
-            if (devModeCounter > 5) {
-              themeStore.devMode = !themeStore.devMode
-              devModeCounter = 0
+              class="p-0 m-0 bg-transparent border-none cursor-pointer button-animation"
+              :class="{ 'text-brand': themeStore.devMode, 'text-secondary': !themeStore.devMode }"
+              @click="
+                () => {
+                  devModeCounter++
+                  if (devModeCounter > 5) {
+                    themeStore.devMode = !themeStore.devMode
+                    devModeCounter = 0
 
-              if (!themeStore.devMode && tabs[selectedTab].developerOnly === true) {
-                selectedTab = 0
-              }
-            }
-          }">
+                    if (!themeStore.devMode && tabs[selectedTab].developerOnly === true) {
+                      selectedTab = 0
+                    }
+                  }
+                }
+              "
+            >
               <ModrinthIcon class="w-6 h-6" />
             </button>
             <div>
diff --git a/apps/app-frontend/src/components/ui/settings/FeatureFlagSettings.vue b/apps/app-frontend/src/components/ui/settings/FeatureFlagSettings.vue
index 5a6ea02a3..65ca0f8af 100644
--- a/apps/app-frontend/src/components/ui/settings/FeatureFlagSettings.vue
+++ b/apps/app-frontend/src/components/ui/settings/FeatureFlagSettings.vue
@@ -6,24 +6,23 @@ import type { Ref } from 'vue'
 
 const themeStore = useTheming()
 
-type ThemeStoreKeys = keyof typeof themeStore;
+type ThemeStoreKeys = keyof typeof themeStore
 
 const options: Ref<ThemeStoreKeys[]> = computed(() => {
-  return Object.keys(themeStore).filter((key) => key.startsWith('featureFlag_')) as ThemeStoreKeys[];
+  return Object.keys(themeStore).filter((key) => key.startsWith('featureFlag_')) as ThemeStoreKeys[]
 })
 
-function getStoreValue<K extends ThemeStoreKeys>(key: K): typeof themeStore[K] {
-  return themeStore[key];
+function getStoreValue<K extends ThemeStoreKeys>(key: K): (typeof themeStore)[K] {
+  return themeStore[key]
 }
 
-function setStoreValue<K extends ThemeStoreKeys>(key: K, value: typeof themeStore[K]) {
-  themeStore[key] = value;
+function setStoreValue<K extends ThemeStoreKeys>(key: K, value: (typeof themeStore)[K]) {
+  themeStore[key] = value
 }
 
 function formatFlagName(name: string) {
-  return name.replace('featureFlag_', '');
+  return name.replace('featureFlag_', '')
 }
-
 </script>
 <template>
   <div v-for="option in options" :key="option" class="mt-4 flex items-center justify-between">
diff --git a/apps/app-frontend/src/helpers/events.js b/apps/app-frontend/src/helpers/events.js
index 3bc07bcb9..0ed288365 100644
--- a/apps/app-frontend/src/helpers/events.js
+++ b/apps/app-frontend/src/helpers/events.js
@@ -93,3 +93,7 @@ export async function command_listener(callback) {
 export async function warning_listener(callback) {
   return await listen('warning', (event) => callback(event.payload))
 }
+
+export async function friend_listener(callback) {
+  return await listen('friend', (event) => callback(event.payload))
+}
diff --git a/apps/app-frontend/src/helpers/friends.js b/apps/app-frontend/src/helpers/friends.js
new file mode 100644
index 000000000..168c93837
--- /dev/null
+++ b/apps/app-frontend/src/helpers/friends.js
@@ -0,0 +1,17 @@
+import { invoke } from '@tauri-apps/api/core'
+
+export async function friends() {
+  return await invoke('plugin:friends|friends')
+}
+
+export async function friend_statuses() {
+  return await invoke('plugin:friends|friend_statuses')
+}
+
+export async function add_friend(userId) {
+  return await invoke('plugin:friends|add_friend', { userId })
+}
+
+export async function remove_friend(userId) {
+  return await invoke('plugin:friends|remove_friend', { userId })
+}
diff --git a/apps/app-frontend/src/pages/Browse.vue b/apps/app-frontend/src/pages/Browse.vue
index 929171bc5..607d7c1d5 100644
--- a/apps/app-frontend/src/pages/Browse.vue
+++ b/apps/app-frontend/src/pages/Browse.vue
@@ -1,29 +1,18 @@
 <script setup lang="ts">
 import { computed, nextTick, ref, shallowRef, watch } from 'vue'
 import type { Ref } from 'vue'
-import { GameIcon, LeftArrowIcon, SearchIcon, XIcon } from '@modrinth/assets'
-import type {
-  Category,
-  GameVersion,
-  Platform,
-  ProjectType,
-  SortType,
-  Tags
-} from '@modrinth/ui';
+import { SearchIcon, XIcon } from '@modrinth/assets'
+import type { Category, GameVersion, Platform, ProjectType, SortType, Tags } from '@modrinth/ui'
 import {
-  SearchFilterControl
-,
+  SearchFilterControl,
   SearchSidebarFilter,
-  Avatar,
   Button,
-  ButtonStyled,
   Checkbox,
   DropdownSelect,
   LoadingIndicator,
   Pagination,
   useSearch,
 } from '@modrinth/ui'
-import { formatCategory } from '@modrinth/utils'
 import { handleError } from '@/store/state'
 import { useBreadcrumbs } from '@/store/breadcrumbs'
 import { get_categories, get_game_versions, get_loaders } from '@/helpers/tags'
@@ -31,11 +20,11 @@ import type { LocationQuery } from 'vue-router'
 import { useRoute, useRouter } from 'vue-router'
 import SearchCard from '@/components/ui/SearchCard.vue'
 import { get as getInstance, get_projects as getInstanceProjects } from '@/helpers/profile.js'
-import { convertFileSrc } from '@tauri-apps/api/core'
 import { get_search_results } from '@/helpers/cache.js'
 import { debounce } from '@/helpers/utils.js'
 import NavTabs from '@/components/ui/NavTabs.vue'
 import type Instance from '@/components/ui/Instance.vue'
+import InstanceIndicator from '@/components/ui/InstanceIndicator.vue'
 import { defineMessages, useVIntl } from '@vintl/vintl'
 
 const { formatMessage } = useVIntl()
@@ -81,11 +70,11 @@ const newlyInstalled = ref([])
 
 const PERSISTENT_QUERY_PARAMS = ['i', 'ai']
 
-await updateInstanceContext();
+await updateInstanceContext()
 
 watch(route, () => {
-  updateInstanceContext();
-});
+  updateInstanceContext()
+})
 
 async function updateInstanceContext() {
   if (route.query.i) {
@@ -100,13 +89,9 @@ async function updateInstanceContext() {
     instanceHideInstalled.value = route.query.ai === 'true'
   }
 
-  if (
-    instance.value &&
-    instance.value.path !== route.query.i &&
-    route.path.startsWith("/browse")
-  ) {
-    instance.value = null;
-    instanceHideInstalled.value = false;
+  if (instance.value && instance.value.path !== route.query.i && route.path.startsWith('/browse')) {
+    instance.value = null
+    instanceHideInstalled.value = false
   }
 }
 
@@ -273,7 +258,7 @@ const searchWrapper: Ref<HTMLElement | null> = ref(null)
 async function onSearchChangeToTop() {
   await nextTick()
 
-  window.scrollTo({ top: 0, behavior: 'smooth' });
+  window.scrollTo({ top: 0, behavior: 'smooth' })
 }
 
 async function clearSearch() {
@@ -357,22 +342,22 @@ const selectableProjectTypes = computed(() => {
 
 const messages = defineMessages({
   gameVersionProvidedByInstance: {
-    id: "search.filter.locked.instance-game-version.title",
-    defaultMessage: "Game version is provided by the instance",
+    id: 'search.filter.locked.instance-game-version.title',
+    defaultMessage: 'Game version is provided by the instance',
   },
   modLoaderProvidedByInstance: {
-    id: "search.filter.locked.instance-loader.title",
-    defaultMessage: "Loader is provided by the instance",
+    id: 'search.filter.locked.instance-loader.title',
+    defaultMessage: 'Loader is provided by the instance',
   },
   providedByInstance: {
-    id: "search.filter.locked.instance",
-    defaultMessage: "Provided by the instance",
+    id: 'search.filter.locked.instance',
+    defaultMessage: 'Provided by the instance',
   },
   syncFilterButton: {
-    id: "search.filter.locked.instance.sync",
-    defaultMessage: "Sync with instance",
+    id: 'search.filter.locked.instance.sync',
+    defaultMessage: 'Sync with instance',
   },
-});
+})
 
 await refreshSearch()
 </script>
@@ -419,37 +404,7 @@ await refreshSearch()
   </Teleport>
   <div ref="searchWrapper" class="flex flex-col gap-3 p-6">
     <template v-if="instance">
-      <div
-        class="flex justify-between items-center border-0 border-b border-solid border-divider pb-4"
-      >
-        <router-link
-          :to="`/instance/${encodeURIComponent(instance.path)}`"
-          tabindex="-1"
-          class="flex flex-col gap-4 text-primary"
-        >
-          <span class="flex items-center gap-2">
-            <Avatar
-              :src="instance.icon_path ? convertFileSrc(instance.icon_path) : undefined"
-              :alt="instance.name"
-              size="48px"
-            />
-            <span class="flex flex-col gap-2">
-              <span class="font-extrabold bold text-contrast">
-                {{ instance.name }}
-              </span>
-              <span class="text-secondary flex items-center gap-2 font-semibold">
-                <GameIcon class="h-5 w-5 text-secondary" />
-                {{ formatCategory(instance.loader) }} {{ instance.game_version }}
-              </span>
-            </span>
-          </span>
-        </router-link>
-        <ButtonStyled>
-          <router-link :to="`/instance/${encodeURIComponent(instance.path)}`">
-            <LeftArrowIcon /> Back to instance
-          </router-link>
-        </ButtonStyled>
-      </div>
+      <InstanceIndicator :instance="instance" />
       <h1 class="m-0 mb-1 text-xl">Install content to instance</h1>
     </template>
     <h1 v-else class="m-0 mb-1 text-2xl">Discover content</h1>
diff --git a/apps/app-frontend/src/pages/Index.vue b/apps/app-frontend/src/pages/Index.vue
index bec117c88..501f40e92 100644
--- a/apps/app-frontend/src/pages/Index.vue
+++ b/apps/app-frontend/src/pages/Index.vue
@@ -100,7 +100,7 @@ onUnmounted(() => {
 
 <template>
   <div class="p-6 flex flex-col gap-2">
-    <h1 class="m-0 text-2xl">Welcome back, Prospector!</h1>
+    <h1 class="m-0 text-2xl">Welcome back!</h1>
     <RowDisplay
       v-if="total > 0"
       :instances="[
diff --git a/apps/app-frontend/src/pages/library/Custom.vue b/apps/app-frontend/src/pages/library/Custom.vue
index c72166bcb..619b41113 100644
--- a/apps/app-frontend/src/pages/library/Custom.vue
+++ b/apps/app-frontend/src/pages/library/Custom.vue
@@ -9,5 +9,9 @@ defineProps({
 })
 </script>
 <template>
-  <GridDisplay v-if="instances.length > 0" label="Instances" :instances="instances.filter(i => !i.linked_data)" />
+  <GridDisplay
+    v-if="instances.length > 0"
+    label="Instances"
+    :instances="instances.filter((i) => !i.linked_data)"
+  />
 </template>
diff --git a/apps/app-frontend/src/pages/library/Downloaded.vue b/apps/app-frontend/src/pages/library/Downloaded.vue
index d2239c919..4fa48812c 100644
--- a/apps/app-frontend/src/pages/library/Downloaded.vue
+++ b/apps/app-frontend/src/pages/library/Downloaded.vue
@@ -9,5 +9,9 @@ defineProps({
 })
 </script>
 <template>
-  <GridDisplay v-if="instances.length > 0" label="Instances" :instances="instances.filter(i => i.linked_data)" />
+  <GridDisplay
+    v-if="instances.length > 0"
+    label="Instances"
+    :instances="instances.filter((i) => i.linked_data)"
+  />
 </template>
diff --git a/apps/app-frontend/src/pages/library/Index.vue b/apps/app-frontend/src/pages/library/Index.vue
index e508043a5..823b20f6b 100644
--- a/apps/app-frontend/src/pages/library/Index.vue
+++ b/apps/app-frontend/src/pages/library/Index.vue
@@ -37,11 +37,17 @@ onUnmounted(() => {
 <template>
   <div class="p-6 flex flex-col gap-3">
     <h1 class="m-0 text-2xl">Library</h1>
-    <NavTabs :links="[ { label: 'All instances', href: `/library` }, { label: 'Downloaded', href: `/library/downloaded` }, { label: 'Custom', href: `/library/custom` }, { label: 'Shared with me', href: `/library/shared`, shown: false }, { label: 'Saved', href: `/library/saved`, shown: false } ]" />
+    <NavTabs
+      :links="[
+        { label: 'All instances', href: `/library` },
+        { label: 'Downloaded', href: `/library/downloaded` },
+        { label: 'Custom', href: `/library/custom` },
+        { label: 'Shared with me', href: `/library/shared`, shown: false },
+        { label: 'Saved', href: `/library/saved`, shown: false },
+      ]"
+    />
     <template v-if="instances.length > 0">
-      <RouterView
-        :instances="instances"
-      />
+      <RouterView :instances="instances" />
     </template>
     <div v-else class="no-instance">
       <div class="icon">
diff --git a/apps/app-frontend/src/pages/project/Index.vue b/apps/app-frontend/src/pages/project/Index.vue
index 9b02e1362..c707fe974 100644
--- a/apps/app-frontend/src/pages/project/Index.vue
+++ b/apps/app-frontend/src/pages/project/Index.vue
@@ -23,24 +23,7 @@
       />
     </Teleport>
     <div class="flex flex-col gap-4 p-6">
-      <Card v-if="instance" class="small-instance">
-        <router-link class="instance" :to="`/instance/${encodeURIComponent(instance.path)}`">
-          <Avatar
-            :src="instance.icon_path ? convertFileSrc(instance.icon_path) : null"
-            :alt="instance.name"
-            size="sm"
-          />
-          <div class="small-instance_info">
-            <span class="title">{{
-              instance.name.length > 20 ? instance.name.substring(0, 20) + '...' : instance.name
-            }}</span>
-            <span>
-              {{ instance.loader.charAt(0).toUpperCase() + instance.loader.slice(1) }}
-              {{ instance.game_version }}
-            </span>
-          </div>
-        </router-link>
-      </Card>
+      <InstanceIndicator v-if="instance" :instance="instance" />
       <template v-if="data">
         <Teleport v-if="themeStore.featureFlag_projectBackground" to="#background-teleport-target">
           <ProjectBackgroundGradient :project="data" />
@@ -62,33 +45,33 @@
               <OverflowMenu
                 :tooltip="`More options`"
                 :options="[
-                {
-                  id: 'follow',
-                  disabled: true,
-                  tooltip: 'Coming soon',
-                  action: () => {},
-                },
-                {
-                  id: 'save',
-                  disabled: true,
-                  tooltip: 'Coming soon',
-                  action: () => {},
-                },
-                {
-                  id: 'open-in-browser',
-                  link: `https://modrinth.com/${data.project_type}/${data.slug}`,
-                  external: true,
-                },
-                {
-                  divider: true,
-                },
-                {
-                  id: 'report',
-                  color: 'red',
-                  hoverFilled: true,
-                  link: `https://modrinth.com/report?item=project&itemID=${data.id}`,
-                },
-              ]"
+                  {
+                    id: 'follow',
+                    disabled: true,
+                    tooltip: 'Coming soon',
+                    action: () => {},
+                  },
+                  {
+                    id: 'save',
+                    disabled: true,
+                    tooltip: 'Coming soon',
+                    action: () => {},
+                  },
+                  {
+                    id: 'open-in-browser',
+                    link: `https://modrinth.com/${data.project_type}/${data.slug}`,
+                    external: true,
+                  },
+                  {
+                    divider: true,
+                  },
+                  {
+                    id: 'report',
+                    color: 'red',
+                    hoverFilled: true,
+                    link: `https://modrinth.com/report?item=project&itemID=${data.id}`,
+                  },
+                ]"
                 aria-label="More options"
               >
                 <MoreVerticalIcon aria-hidden="true" />
@@ -109,7 +92,7 @@
             {
               label: 'Versions',
               href: `/project/${$route.params.id}/versions`,
-              subpages: [ 'version' ]
+              subpages: ['version'],
             },
             {
               label: 'Gallery',
@@ -152,15 +135,14 @@ import {
   ClipboardCopyIcon,
 } from '@modrinth/assets'
 import {
-  Card,
-  Avatar,
   ProjectHeader,
   ProjectSidebarCompatibility,
   ButtonStyled,
   OverflowMenu,
   ProjectSidebarLinks,
   ProjectSidebarCreators,
-  ProjectSidebarDetails, ProjectBackgroundGradient
+  ProjectSidebarDetails,
+  ProjectBackgroundGradient,
 } from '@modrinth/ui'
 
 import { get_categories, get_game_versions, get_loaders } from '@/helpers/tags'
@@ -171,12 +153,12 @@ import { useRoute } from 'vue-router'
 import { ref, shallowRef, watch } from 'vue'
 import { useBreadcrumbs } from '@/store/breadcrumbs'
 import { handleError } from '@/store/notifications.js'
-import { convertFileSrc } from '@tauri-apps/api/core'
 import ContextMenu from '@/components/ui/ContextMenu.vue'
 import { install as installVersion } from '@/store/install.js'
 import { get_project, get_team, get_version_many } from '@/helpers/cache.js'
 import NavTabs from '@/components/ui/NavTabs.vue'
 import { useTheming } from '@/store/state.js'
+import InstanceIndicator from '@/components/ui/InstanceIndicator.vue'
 
 dayjs.extend(relativeTime)
 
@@ -439,30 +421,6 @@ const handleOptionsClick = (args) => {
   }
 }
 
-.small-instance {
-  padding: var(--gap-lg);
-  border-radius: var(--radius-md);
-  margin-bottom: var(--gap-md);
-
-  .instance {
-    display: flex;
-    gap: 0.5rem;
-    margin-bottom: 0;
-
-    .title {
-      font-weight: 600;
-      color: var(--color-contrast);
-    }
-  }
-
-  .small-instance_info {
-    display: flex;
-    flex-direction: column;
-    justify-content: space-between;
-    padding: 0.25rem 0;
-  }
-}
-
 .project-sidebar-section {
   @apply p-4 flex flex-col gap-2 border-0 border-b-[1px] border-[--brand-gradient-border] border-solid;
 }
diff --git a/apps/app-frontend/src/pages/project/Versions.vue b/apps/app-frontend/src/pages/project/Versions.vue
index ab48f3983..33f8c55dc 100644
--- a/apps/app-frontend/src/pages/project/Versions.vue
+++ b/apps/app-frontend/src/pages/project/Versions.vue
@@ -1,13 +1,20 @@
 <template>
   <div>
-    <ProjectPageVersions :loaders="loaders" :game-versions="gameVersions" :versions="versions" :project="project" :version-link="(version) => `/project/${project.id}/version/${version.id}`">
+    <ProjectPageVersions
+      :loaders="loaders"
+      :game-versions="gameVersions"
+      :versions="versions"
+      :project="project"
+      :version-link="(version) => `/project/${project.id}/version/${version.id}`"
+    >
       <template #actions="{ version }">
         <ButtonStyled circular type="transparent">
           <button
             v-tooltip="`Install`"
             :class="{
-            'group-hover:!bg-brand group-hover:[&>svg]:!text-brand-inverted': !installed || version.id !== installedVersion
-          }"
+              'group-hover:!bg-brand group-hover:[&>svg]:!text-brand-inverted':
+                !installed || version.id !== installedVersion,
+            }"
             :disabled="installing || (installed && version.id === installedVersion)"
             @click.stop="() => install(version.id)"
           >
@@ -45,30 +52,21 @@
           <a
             v-else
             v-tooltip="`Open in browser`"
-            class="group-hover:!bg-button-bg" :href="`https://modrinth.com/${project.project_type}/${project.slug}/version/${version.id}`" target="_blank"
+            class="group-hover:!bg-button-bg"
+            :href="`https://modrinth.com/${project.project_type}/${project.slug}/version/${version.id}`"
+            target="_blank"
           >
             <ExternalIcon />
           </a>
         </ButtonStyled>
-
       </template>
     </ProjectPageVersions>
   </div>
 </template>
 
 <script setup>
-import {
-  ProjectPageVersions,
-  ButtonStyled,
-  OverflowMenu
-} from '@modrinth/ui'
-import {
-  CheckIcon,
-  DownloadIcon,
-  EditIcon,
-  ExternalIcon,
-  LinkIcon, MoreVerticalIcon, ReportIcon, ShareIcon, TrashIcon
-} from '@modrinth/assets'
+import { ProjectPageVersions, ButtonStyled, OverflowMenu } from '@modrinth/ui'
+import { CheckIcon, DownloadIcon, ExternalIcon, MoreVerticalIcon } from '@modrinth/assets'
 import { ref, watch } from 'vue'
 import { SwapIcon } from '@/assets/icons/index.js'
 import { get_game_versions, get_loaders } from '@/helpers/tags.js'
@@ -105,7 +103,6 @@ const props = defineProps({
   },
 })
 
-
 const [loaders, gameVersions] = await Promise.all([
   get_loaders().catch(handleError).then(ref),
   get_game_versions().catch(handleError).then(ref),
diff --git a/apps/app-frontend/src/routes.js b/apps/app-frontend/src/routes.js
index 94ed518c2..112e24691 100644
--- a/apps/app-frontend/src/routes.js
+++ b/apps/app-frontend/src/routes.js
@@ -49,7 +49,7 @@ export default new createRouter({
           name: 'Custom',
           component: Library.Custom,
         },
-      ]
+      ],
     },
     {
       path: '/project/:id',
diff --git a/apps/app/build.rs b/apps/app/build.rs
index 62283a669..ae314cd9b 100644
--- a/apps/app/build.rs
+++ b/apps/app/build.rs
@@ -227,6 +227,19 @@ fn main() {
                     .default_permission(
                         DefaultPermissionRule::AllowAllCommands,
                     ),
+            )
+            .plugin(
+                "friends",
+                InlinedPlugin::new()
+                    .commands(&[
+                        "friends",
+                        "friend_statuses",
+                        "add_friend",
+                        "remove_friend",
+                    ])
+                    .default_permission(
+                        DefaultPermissionRule::AllowAllCommands,
+                    ),
             ),
     )
     .expect("Failed to run tauri-build");
diff --git a/apps/app/capabilities/plugins.json b/apps/app/capabilities/plugins.json
index e4a4c4e46..b864a5d19 100644
--- a/apps/app/capabilities/plugins.json
+++ b/apps/app/capabilities/plugins.json
@@ -34,6 +34,7 @@
     "settings:default",
     "tags:default",
     "utils:default",
-    "ads:default"
+    "ads:default",
+    "friends:default"
   ]
 }
diff --git a/apps/app/src/api/ads.rs b/apps/app/src/api/ads.rs
index 63f458de7..a64720e10 100644
--- a/apps/app/src/api/ads.rs
+++ b/apps/app/src/api/ads.rs
@@ -1,7 +1,7 @@
 use std::collections::HashSet;
 use std::time::{Duration, Instant};
 use tauri::plugin::TauriPlugin;
-use tauri::{Emitter, LogicalPosition, LogicalSize, Manager, Runtime};
+use tauri::{LogicalPosition, LogicalSize, Manager, Runtime};
 use tauri_plugin_shell::ShellExt;
 use theseus::settings;
 use tokio::sync::RwLock;
diff --git a/apps/app/src/api/friends.rs b/apps/app/src/api/friends.rs
new file mode 100644
index 000000000..82d1d37f6
--- /dev/null
+++ b/apps/app/src/api/friends.rs
@@ -0,0 +1,33 @@
+use tauri::plugin::TauriPlugin;
+use theseus::prelude::{UserFriend, UserStatus};
+
+pub fn init<R: tauri::Runtime>() -> TauriPlugin<R> {
+    tauri::plugin::Builder::new("friends")
+        .invoke_handler(tauri::generate_handler![
+            friends,
+            friend_statuses,
+            add_friend,
+            remove_friend
+        ])
+        .build()
+}
+
+#[tauri::command]
+pub async fn friends() -> crate::api::Result<Vec<UserFriend>> {
+    Ok(theseus::friends::friends().await?)
+}
+
+#[tauri::command]
+pub async fn friend_statuses() -> crate::api::Result<Vec<UserStatus>> {
+    Ok(theseus::friends::friend_statuses().await?)
+}
+
+#[tauri::command]
+pub async fn add_friend(user_id: &str) -> crate::api::Result<()> {
+    Ok(theseus::friends::add_friend(user_id).await?)
+}
+
+#[tauri::command]
+pub async fn remove_friend(user_id: &str) -> crate::api::Result<()> {
+    Ok(theseus::friends::remove_friend(user_id).await?)
+}
diff --git a/apps/app/src/api/mod.rs b/apps/app/src/api/mod.rs
index 46efa755e..82c33888f 100644
--- a/apps/app/src/api/mod.rs
+++ b/apps/app/src/api/mod.rs
@@ -18,6 +18,7 @@ pub mod utils;
 
 pub mod ads;
 pub mod cache;
+pub mod friends;
 
 pub type Result<T> = std::result::Result<T, TheseusSerializableError>;
 
diff --git a/apps/app/src/main.rs b/apps/app/src/main.rs
index 762e2a1b4..3cdad355c 100644
--- a/apps/app/src/main.rs
+++ b/apps/app/src/main.rs
@@ -260,6 +260,7 @@ fn main() {
         .plugin(api::utils::init())
         .plugin(api::cache::init())
         .plugin(api::ads::init())
+        .plugin(api::friends::init())
         .invoke_handler(tauri::generate_handler![
             initialize_state,
             is_dev,
diff --git a/apps/frontend/src/layouts/empty.vue b/apps/frontend/src/layouts/empty.vue
index 3b417e250..257037c03 100644
--- a/apps/frontend/src/layouts/empty.vue
+++ b/apps/frontend/src/layouts/empty.vue
@@ -1 +1,4 @@
 <template><slot id="main" /></template>
+<style lang="scss">
+@import "~/assets/styles/global.scss";
+</style>
diff --git a/apps/labrinth/src/auth/validate.rs b/apps/labrinth/src/auth/validate.rs
index 8b8769c9d..3f94a9a4d 100644
--- a/apps/labrinth/src/auth/validate.rs
+++ b/apps/labrinth/src/auth/validate.rs
@@ -146,6 +146,7 @@ where
         }
         _ => return Err(AuthenticationError::InvalidAuthMethod),
     };
+
     Ok(possible_user)
 }
 
diff --git a/apps/labrinth/src/models/v3/users.rs b/apps/labrinth/src/models/v3/users.rs
index 4fb54ec46..9bffd442f 100644
--- a/apps/labrinth/src/models/v3/users.rs
+++ b/apps/labrinth/src/models/v3/users.rs
@@ -191,8 +191,11 @@ impl Role {
 
 #[derive(Serialize, Deserialize)]
 pub struct UserFriend {
+    // The user who accepted the friend request
     pub id: UserId,
-    pub pending: bool,
+    /// THe user who sent the friend request
+    pub friend_id: UserId,
+    pub accepted: bool,
     pub created: DateTime<Utc>,
 }
 
@@ -202,7 +205,8 @@ impl UserFriend {
     ) -> Self {
         Self {
             id: data.friend_id.into(),
-            pending: data.accepted,
+            friend_id: data.user_id.into(),
+            accepted: data.accepted,
             created: data.created,
         }
     }
diff --git a/apps/labrinth/src/routes/internal/session.rs b/apps/labrinth/src/routes/internal/session.rs
index b928c70db..b7f638faf 100644
--- a/apps/labrinth/src/routes/internal/session.rs
+++ b/apps/labrinth/src/routes/internal/session.rs
@@ -61,7 +61,7 @@ pub async fn get_session_metadata(
         .headers()
         .get("user-agent")
         .and_then(|x| x.to_str().ok())
-        .ok_or_else(|| AuthenticationError::InvalidCredentials)?;
+        .unwrap_or("No user agent");
 
     let parser = Parser::new();
     let info = parser.parse(user_agent);
diff --git a/packages/app-lib/src/api/friends.rs b/packages/app-lib/src/api/friends.rs
new file mode 100644
index 000000000..e221cf56b
--- /dev/null
+++ b/packages/app-lib/src/api/friends.rs
@@ -0,0 +1,35 @@
+use crate::state::{FriendsSocket, UserFriend, UserStatus};
+
+#[tracing::instrument]
+pub async fn friends() -> crate::Result<Vec<UserFriend>> {
+    let state = crate::State::get().await?;
+    let friends =
+        FriendsSocket::friends(&state.pool, &state.api_semaphore).await?;
+
+    Ok(friends)
+}
+
+pub async fn friend_statuses() -> crate::Result<Vec<UserStatus>> {
+    let state = crate::State::get().await?;
+    let statuses = state.friends_socket.friend_statuses();
+
+    Ok(statuses)
+}
+
+#[tracing::instrument]
+pub async fn add_friend(user_id: &str) -> crate::Result<()> {
+    let state = crate::State::get().await?;
+    FriendsSocket::add_friend(user_id, &state.pool, &state.api_semaphore)
+        .await?;
+
+    Ok(())
+}
+
+#[tracing::instrument]
+pub async fn remove_friend(user_id: &str) -> crate::Result<()> {
+    let state = crate::State::get().await?;
+    FriendsSocket::remove_friend(user_id, &state.pool, &state.api_semaphore)
+        .await?;
+
+    Ok(())
+}
diff --git a/packages/app-lib/src/api/mod.rs b/packages/app-lib/src/api/mod.rs
index 3c3ecf302..643798f0f 100644
--- a/packages/app-lib/src/api/mod.rs
+++ b/packages/app-lib/src/api/mod.rs
@@ -1,5 +1,6 @@
 //! API for interacting with Theseus
 pub mod cache;
+pub mod friends;
 pub mod handler;
 pub mod jre;
 pub mod logs;
@@ -18,7 +19,7 @@ pub mod data {
         Hooks, JavaVersion, LinkedData, MemorySettings, ModLoader,
         ModrinthCredentials, Organization, ProcessMetadata, ProfileFile,
         Project, ProjectType, SearchResult, SearchResults, Settings,
-        TeamMember, Theme, User, Version, WindowSize,
+        TeamMember, Theme, User, UserFriend, UserStatus, Version, WindowSize,
     };
 }
 
diff --git a/packages/app-lib/src/api/mr_auth.rs b/packages/app-lib/src/api/mr_auth.rs
index 34bb64434..3c99d1f5b 100644
--- a/packages/app-lib/src/api/mr_auth.rs
+++ b/packages/app-lib/src/api/mr_auth.rs
@@ -19,6 +19,10 @@ pub async fn authenticate_finish_flow(
     .await?;
 
     creds.upsert(&state.pool).await?;
+    state
+        .friends_socket
+        .connect(&state.pool, &state.api_semaphore, &state.process_manager)
+        .await?;
 
     Ok(creds)
 }
@@ -30,6 +34,7 @@ pub async fn logout() -> crate::Result<()> {
 
     if let Some(current) = current {
         ModrinthCredentials::remove(&current.user_id, &state.pool).await?;
+        state.friends_socket.disconnect().await?;
     }
 
     Ok(())
diff --git a/packages/app-lib/src/config.rs b/packages/app-lib/src/config.rs
index fe4158345..bf7e47e1e 100644
--- a/packages/app-lib/src/config.rs
+++ b/packages/app-lib/src/config.rs
@@ -8,4 +8,6 @@ pub const MODRINTH_URL: &str = "https://modrinth.com/";
 pub const MODRINTH_API_URL: &str = "https://api.modrinth.com/v2/";
 pub const MODRINTH_API_URL_V3: &str = "https://api.modrinth.com/v3/";
 
+pub const MODRINTH_SOCKET_URL: &str = "wss://api.modrinth.com/";
+
 pub const META_URL: &str = "https://launcher-meta.modrinth.com/";
diff --git a/packages/app-lib/src/event/emit.rs b/packages/app-lib/src/event/emit.rs
index b237d6fad..174a06c7f 100644
--- a/packages/app-lib/src/event/emit.rs
+++ b/packages/app-lib/src/event/emit.rs
@@ -1,4 +1,4 @@
-use super::LoadingBarId;
+use super::{FriendPayload, LoadingBarId};
 use crate::event::{
     CommandPayload, EventError, LoadingBar, LoadingBarType, ProcessPayloadType,
     ProfilePayloadType,
@@ -296,6 +296,20 @@ pub async fn emit_profile(
     Ok(())
 }
 
+#[allow(unused_variables)]
+pub async fn emit_friend(payload: FriendPayload) -> crate::Result<()> {
+    #[cfg(feature = "tauri")]
+    {
+        let event_state = crate::EventState::get()?;
+        event_state
+            .app
+            .emit("friend", payload)
+            .map_err(EventError::from)?;
+    }
+
+    Ok(())
+}
+
 // loading_join! macro
 // loading_join!(key: Option<&LoadingBarId>, total: f64, message: Option<&str>; task1, task2, task3...)
 // This will submit a loading event with the given message for each task as they complete
diff --git a/packages/app-lib/src/event/mod.rs b/packages/app-lib/src/event/mod.rs
index f6e2c28cc..3fc6bd075 100644
--- a/packages/app-lib/src/event/mod.rs
+++ b/packages/app-lib/src/event/mod.rs
@@ -1,4 +1,5 @@
 //! Theseus state management system
+use crate::state::UserStatus;
 use dashmap::DashMap;
 use serde::{Deserialize, Serialize};
 use std::{path::PathBuf, sync::Arc};
@@ -256,3 +257,13 @@ pub enum EventError {
     #[error("Tauri error: {0}")]
     TauriError(#[from] tauri::Error),
 }
+
+#[derive(Serialize, Clone)]
+#[serde(rename_all = "snake_case")]
+#[serde(tag = "event")]
+pub enum FriendPayload {
+    FriendRequest { from: String },
+    UserOffline { id: String },
+    StatusUpdate { user_status: UserStatus },
+    StatusSync,
+}
diff --git a/packages/app-lib/src/launcher/mod.rs b/packages/app-lib/src/launcher/mod.rs
index 0c8f21c82..1ddb9414e 100644
--- a/packages/app-lib/src/launcher/mod.rs
+++ b/packages/app-lib/src/launcher/mod.rs
@@ -677,6 +677,11 @@ pub async fn launch_minecraft(
         .set_activity(&format!("Playing {}", profile.name), true)
         .await;
 
+    let _ = state
+        .friends_socket
+        .update_status(Some(profile.name.clone()))
+        .await;
+
     // Create Minecraft child by inserting it into the state
     // This also spawns the process and prepares the subsequent processes
     state
diff --git a/packages/app-lib/src/state/db.rs b/packages/app-lib/src/state/db.rs
index 6465898a1..387d381f2 100644
--- a/packages/app-lib/src/state/db.rs
+++ b/packages/app-lib/src/state/db.rs
@@ -1,7 +1,11 @@
 use crate::state::DirectoryInfo;
 use sqlx::migrate::MigrateDatabase;
-use sqlx::sqlite::SqlitePoolOptions;
+use sqlx::sqlite::{
+    SqliteConnectOptions, SqliteJournalMode, SqlitePoolOptions,
+};
 use sqlx::{Pool, Sqlite};
+use std::str::FromStr;
+use std::time::Duration;
 
 pub(crate) async fn connect() -> crate::Result<Pool<Sqlite>> {
     let settings_dir = DirectoryInfo::get_initial_settings_dir().ok_or(
@@ -20,9 +24,14 @@ pub(crate) async fn connect() -> crate::Result<Pool<Sqlite>> {
         Sqlite::create_database(&uri).await?;
     }
 
+    let conn_options = SqliteConnectOptions::from_str(&uri)?
+        .busy_timeout(Duration::from_secs(30))
+        .journal_mode(SqliteJournalMode::Wal)
+        .optimize_on_close(true, None);
+
     let pool = SqlitePoolOptions::new()
         .max_connections(100)
-        .connect(&uri)
+        .connect_with(conn_options)
         .await?;
 
     sqlx::migrate!().run(&pool).await?;
diff --git a/packages/app-lib/src/state/friends.rs b/packages/app-lib/src/state/friends.rs
new file mode 100644
index 000000000..299833c1e
--- /dev/null
+++ b/packages/app-lib/src/state/friends.rs
@@ -0,0 +1,316 @@
+use crate::config::{MODRINTH_API_URL_V3, MODRINTH_SOCKET_URL};
+use crate::data::ModrinthCredentials;
+use crate::event::emit::emit_friend;
+use crate::event::FriendPayload;
+use crate::state::{ProcessManager, Profile};
+use crate::util::fetch::{fetch_advanced, fetch_json, FetchSemaphore};
+use async_tungstenite::tokio::{connect_async, ConnectStream};
+use async_tungstenite::tungstenite::client::IntoClientRequest;
+use async_tungstenite::tungstenite::Message;
+use async_tungstenite::WebSocketStream;
+use chrono::{DateTime, Utc};
+use dashmap::DashMap;
+use futures::stream::SplitSink;
+use futures::{SinkExt, StreamExt};
+use reqwest::header::HeaderValue;
+use reqwest::Method;
+use serde::{Deserialize, Serialize};
+use std::sync::Arc;
+use tokio::sync::Mutex;
+
+type WriteSocket =
+    Arc<Mutex<Option<SplitSink<WebSocketStream<ConnectStream>, Message>>>>;
+
+pub struct FriendsSocket {
+    write: WriteSocket,
+    user_statuses: Arc<DashMap<String, UserStatus>>,
+}
+
+#[derive(Deserialize, Serialize)]
+pub struct UserFriend {
+    pub id: String,
+    // TODO: Remove this optional and serde alias on release
+    pub friend_id: Option<String>,
+    #[serde(alias = "pending")]
+    pub accepted: bool,
+    pub created: DateTime<Utc>,
+}
+
+#[derive(Serialize)]
+#[serde(tag = "type", rename_all = "snake_case")]
+pub enum ClientToServerMessage {
+    StatusUpdate { profile_name: Option<String> },
+}
+
+#[derive(Deserialize, Debug)]
+#[serde(tag = "type", rename_all = "snake_case")]
+pub enum ServerToClientMessage {
+    StatusUpdate { status: UserStatus },
+    UserOffline { id: String },
+    FriendStatuses { statuses: Vec<UserStatus> },
+    FriendRequest { from: String },
+}
+
+#[derive(Serialize, Deserialize, Clone, Debug)]
+pub struct UserStatus {
+    pub user_id: String,
+    pub profile_name: Option<String>,
+    pub last_update: DateTime<Utc>,
+}
+
+impl Default for FriendsSocket {
+    fn default() -> Self {
+        Self::new()
+    }
+}
+
+impl FriendsSocket {
+    pub fn new() -> Self {
+        Self {
+            write: Arc::new(Mutex::new(None)),
+            user_statuses: Arc::new(DashMap::new()),
+        }
+    }
+
+    pub async fn connect(
+        &self,
+        exec: impl sqlx::Executor<'_, Database = sqlx::Sqlite> + Copy,
+        semaphore: &FetchSemaphore,
+        process_manager: &ProcessManager,
+    ) -> crate::Result<()> {
+        let credentials =
+            ModrinthCredentials::get_and_refresh(exec, semaphore).await?;
+
+        if let Some(credentials) = credentials {
+            let mut request = format!(
+                "{MODRINTH_SOCKET_URL}_internal/launcher_heartbeat?code={}",
+                credentials.session
+            )
+            .into_client_request()?;
+
+            let user_agent = format!(
+                "modrinth/theseus/{} (support@modrinth.com)",
+                env!("CARGO_PKG_VERSION")
+            );
+            request.headers_mut().insert(
+                "User-Agent",
+                HeaderValue::from_str(&user_agent).unwrap(),
+            );
+
+            let res = connect_async(request).await;
+
+            match res {
+                Ok((socket, _)) => {
+                    tracing::info!("Connected to friends socket");
+                    let (write, read) = socket.split();
+
+                    {
+                        let mut write_lock = self.write.lock().await;
+                        *write_lock = Some(write);
+                    }
+
+                    if let Some(process) = process_manager.get_all().first() {
+                        let profile =
+                            Profile::get(&process.profile_path, exec).await?;
+
+                        if let Some(profile) = profile {
+                            let _ =
+                                self.update_status(Some(profile.name)).await;
+                        }
+                    }
+
+                    let write_handle = self.write.clone();
+                    let statuses = self.user_statuses.clone();
+
+                    tokio::spawn(async move {
+                        let mut read_stream = read;
+                        while let Some(msg_result) = read_stream.next().await {
+                            match msg_result {
+                                Ok(msg) => {
+                                    let server_message = match msg {
+                                        Message::Text(text) => {
+                                            serde_json::from_str::<
+                                                ServerToClientMessage,
+                                            >(
+                                                &text
+                                            )
+                                            .ok()
+                                        }
+                                        Message::Binary(bytes) => {
+                                            serde_json::from_slice::<
+                                                ServerToClientMessage,
+                                            >(
+                                                &bytes
+                                            )
+                                            .ok()
+                                        }
+                                        Message::Ping(_)
+                                        | Message::Pong(_)
+                                        | Message::Frame(_) => continue,
+                                        Message::Close(_) => break,
+                                    };
+
+                                    if let Some(server_message) = server_message
+                                    {
+                                        match server_message {
+                                            ServerToClientMessage::StatusUpdate { status } => {
+                                                statuses.insert(status.user_id.clone(), status.clone());
+                                                let _ = emit_friend(FriendPayload::StatusUpdate { user_status: status }).await;
+                                            },
+                                            ServerToClientMessage::UserOffline { id } => {
+                                                statuses.remove(&id);
+                                                let _ = emit_friend(FriendPayload::UserOffline { id }).await;
+                                            }
+                                            ServerToClientMessage::FriendStatuses { statuses: new_statuses } => {
+                                                statuses.clear();
+                                                new_statuses.into_iter().for_each(|status| {
+                                                    statuses.insert(status.user_id.clone(), status);
+                                                });
+                                                let _ = emit_friend(FriendPayload::StatusSync).await;
+                                            }
+                                            ServerToClientMessage::FriendRequest { from } => {
+                                                let _ = emit_friend(FriendPayload::FriendRequest { from }).await;
+                                            }
+                                        }
+                                    }
+                                }
+                                Err(e) => {
+                                    println!("WebSocket error: {:?}", e);
+                                    break;
+                                }
+                            }
+                        }
+
+                        let mut w = write_handle.lock().await;
+                        *w = None;
+
+                        Self::reconnect_task();
+                    });
+                }
+                Err(e) => {
+                    tracing::error!(
+                        "Error connecting to friends socket: {e:?}"
+                    );
+
+                    Self::reconnect_task();
+
+                    return Err(crate::Error::from(e));
+                }
+            }
+        }
+
+        Ok(())
+    }
+
+    fn reconnect_task() {
+        tokio::task::spawn(async move {
+            let res = async {
+                let state = crate::State::get().await?;
+                state
+                    .friends_socket
+                    .connect(
+                        &state.pool,
+                        &state.api_semaphore,
+                        &state.process_manager,
+                    )
+                    .await?;
+
+                Ok::<(), crate::Error>(())
+            };
+
+            if let Err(e) = res.await {
+                tracing::info!("Error reconnecting to friends socket: {e:?}");
+
+                tokio::time::sleep(std::time::Duration::from_secs(30)).await;
+                FriendsSocket::reconnect_task();
+            }
+        });
+    }
+
+    pub async fn disconnect(&self) -> crate::Result<()> {
+        let mut write_lock = self.write.lock().await;
+        if let Some(ref mut write_half) = *write_lock {
+            write_half.close().await?;
+            *write_lock = None;
+        }
+        Ok(())
+    }
+
+    pub async fn update_status(
+        &self,
+        profile_name: Option<String>,
+    ) -> crate::Result<()> {
+        let mut write_lock = self.write.lock().await;
+        if let Some(ref mut write_half) = *write_lock {
+            write_half
+                .send(Message::Text(serde_json::to_string(
+                    &ClientToServerMessage::StatusUpdate { profile_name },
+                )?))
+                .await?;
+        }
+
+        Ok(())
+    }
+
+    pub async fn friends(
+        exec: impl sqlx::Executor<'_, Database = sqlx::Sqlite> + Copy,
+        semaphore: &FetchSemaphore,
+    ) -> crate::Result<Vec<UserFriend>> {
+        fetch_json(
+            Method::GET,
+            &format!("{MODRINTH_API_URL_V3}friends"),
+            None,
+            None,
+            semaphore,
+            exec,
+        )
+        .await
+    }
+
+    pub fn friend_statuses(&self) -> Vec<UserStatus> {
+        self.user_statuses
+            .iter()
+            .map(|x| x.value().clone())
+            .collect()
+    }
+
+    pub async fn add_friend(
+        user_id: &str,
+        exec: impl sqlx::Executor<'_, Database = sqlx::Sqlite> + Copy,
+        semaphore: &FetchSemaphore,
+    ) -> crate::Result<()> {
+        fetch_advanced(
+            Method::POST,
+            &format!("{MODRINTH_API_URL_V3}friend/{user_id}"),
+            None,
+            None,
+            None,
+            None,
+            semaphore,
+            exec,
+        )
+        .await?;
+
+        Ok(())
+    }
+
+    pub async fn remove_friend(
+        user_id: &str,
+        exec: impl sqlx::Executor<'_, Database = sqlx::Sqlite> + Copy,
+        semaphore: &FetchSemaphore,
+    ) -> crate::Result<()> {
+        fetch_advanced(
+            Method::DELETE,
+            &format!("{MODRINTH_API_URL_V3}friend/{user_id}"),
+            None,
+            None,
+            None,
+            None,
+            semaphore,
+            exec,
+        )
+        .await?;
+
+        Ok(())
+    }
+}
diff --git a/packages/app-lib/src/state/mod.rs b/packages/app-lib/src/state/mod.rs
index 5359e437b..9eae019cf 100644
--- a/packages/app-lib/src/state/mod.rs
+++ b/packages/app-lib/src/state/mod.rs
@@ -31,6 +31,9 @@ pub use self::minecraft_auth::*;
 mod cache;
 pub use self::cache::*;
 
+mod friends;
+pub use self::friends::*;
+
 pub mod db;
 pub mod fs_watcher;
 mod mr_auth;
@@ -60,6 +63,9 @@ pub struct State {
     /// Process manager
     pub process_manager: ProcessManager,
 
+    /// Friends socket
+    pub friends_socket: FriendsSocket,
+
     pub(crate) pool: SqlitePool,
 
     pub(crate) file_watcher: FileWatcher,
@@ -129,13 +135,21 @@ impl State {
         let file_watcher = fs_watcher::init_watcher().await?;
         fs_watcher::watch_profiles_init(&file_watcher, &directories).await?;
 
+        let process_manager = ProcessManager::new();
+
+        let friends_socket = FriendsSocket::new();
+        friends_socket
+            .connect(&pool, &fetch_semaphore, &process_manager)
+            .await?;
+
         Ok(Arc::new(Self {
             directories,
             fetch_semaphore,
             io_semaphore,
             api_semaphore,
             discord_rpc,
-            process_manager: ProcessManager::new(),
+            process_manager,
+            friends_socket,
             pool,
             file_watcher,
         }))
diff --git a/packages/app-lib/src/state/process.rs b/packages/app-lib/src/state/process.rs
index 7d900fff1..cfce1fd90 100644
--- a/packages/app-lib/src/state/process.rs
+++ b/packages/app-lib/src/state/process.rs
@@ -206,6 +206,8 @@ impl Process {
 
         let _ = state.discord_rpc.clear_to_default(true).await;
 
+        let _ = state.friends_socket.update_status(None).await;
+
         // If in tauri, window should show itself again after process exists if it was hidden
         #[cfg(feature = "tauri")]
         {
diff --git a/turbo.json b/turbo.json
index b07e6375d..71cd9ce3b 100644
--- a/turbo.json
+++ b/turbo.json
@@ -38,6 +38,5 @@
     "fix": {
       "cache": false
     }
-  },
-  "ui": "tui"
+  }
 }