feat: introduce dependency injection framework (#4091)

* feat: migrate frontend notifications to dependency injection based notificaton manager

* fix: lint

* fix: issues

* fix: compile error + notif binding issue

* refactor: move org context to new DI setup

* feat: migrate app notifications to DI + frontend styling

* fix: sidebar issues

* fix: dont use delete in computed

* fix: import and prop issue

* refactor: move handleError to main notification manager class

* fix: lint & build

* fix: merge issues

* fix: lint issues

* fix: lint issues

---------

Signed-off-by: IMB11 <hendersoncal117@gmail.com>
Signed-off-by: Cal H. <hendersoncal117@gmail.com>

apps/app-frontend/src/pages/instance/Worlds.vue

@@ -121,55 +121,55 @@
   </div>
 </template>
 <script setup lang="ts">
-import { ref, computed, onUnmounted, watch } from 'vue'
-import { useRoute } from 'vue-router'
-import type { GameInstance } from '@/helpers/types'
-import {
-  Button,
-  ButtonStyled,
-  RadialHeader,
-  FilterBar,
-  type FilterBarOption,
-  type GameVersion,
-  GAME_MODES,
-} from '@modrinth/ui'
-import { PlusIcon, SpinnerIcon, UpdatedIcon, SearchIcon, XIcon } from '@modrinth/assets'
-import {
-  type ProtocolVersion,
-  type SingleplayerWorld,
-  type World,
-  type ServerWorld,
-  type ServerData,
-  type ProfileEvent,
-  get_profile_protocol_version,
-  remove_server_from_profile,
-  delete_world,
-  start_join_server,
-  start_join_singleplayer_world,
-  getWorldIdentifier,
-  refreshServerData,
-  refreshWorld,
-  sortWorlds,
-  refreshServers,
-  hasWorldQuickPlaySupport,
-  refreshWorlds,
-  handleDefaultProfileUpdateEvent,
-  showWorldInFolder,
-  hasServerQuickPlaySupport,
-} from '@/helpers/worlds.ts'
+import type ContextMenu from '@/components/ui/ContextMenu.vue'
+import ConfirmModalWrapper from '@/components/ui/modal/ConfirmModalWrapper.vue'
 import AddServerModal from '@/components/ui/world/modal/AddServerModal.vue'
 import EditServerModal from '@/components/ui/world/modal/EditServerModal.vue'
 import EditWorldModal from '@/components/ui/world/modal/EditSingleplayerWorldModal.vue'
 import WorldItem from '@/components/ui/world/WorldItem.vue'
-
-import ConfirmModalWrapper from '@/components/ui/modal/ConfirmModalWrapper.vue'
-import { handleError } from '@/store/notifications'
-import type ContextMenu from '@/components/ui/ContextMenu.vue'
-import type { Version } from '@modrinth/utils'
 import { profile_listener } from '@/helpers/events'
 import { get_game_versions } from '@/helpers/tags'
+import type { GameInstance } from '@/helpers/types'
+import {
+  type ProfileEvent,
+  type ProtocolVersion,
+  type ServerData,
+  type ServerWorld,
+  type SingleplayerWorld,
+  type World,
+  delete_world,
+  getWorldIdentifier,
+  get_profile_protocol_version,
+  handleDefaultProfileUpdateEvent,
+  hasServerQuickPlaySupport,
+  hasWorldQuickPlaySupport,
+  refreshServerData,
+  refreshServers,
+  refreshWorld,
+  refreshWorlds,
+  remove_server_from_profile,
+  showWorldInFolder,
+  sortWorlds,
+  start_join_server,
+  start_join_singleplayer_world,
+} from '@/helpers/worlds.ts'
+import { PlusIcon, SearchIcon, SpinnerIcon, UpdatedIcon, XIcon } from '@modrinth/assets'
+import {
+  Button,
+  ButtonStyled,
+  FilterBar,
+  type FilterBarOption,
+  GAME_MODES,
+  type GameVersion,
+  RadialHeader,
+  injectNotificationManager,
+} from '@modrinth/ui'
+import type { Version } from '@modrinth/utils'
 import { defineMessages } from '@vintl/vintl'
+import { computed, onUnmounted, ref, watch } from 'vue'
+import { useRoute } from 'vue-router'
 
+const { handleError } = injectNotificationManager()
 const route = useRoute()
 
 const addServerModal = ref<InstanceType<typeof AddServerModal>>()
@@ -282,7 +282,7 @@ async function editServer(server: ServerWorld) {
       await refreshServer(server.address)
     }
   } else {
-    handleError(`Error refreshing server, refreshing all worlds`)
+    handleError(new Error(`Error refreshing server, refreshing all worlds`))
     await refreshAllWorlds()
   }
 }
@@ -301,7 +301,7 @@ async function editWorld(path: string, name: string, removeIcon: boolean) {
     }
     sortWorlds(worlds.value)
   } else {
-    handleError(`Error finding world in list, refreshing all worlds`)
+    handleError(new Error(`Error finding world in list, refreshing all worlds`))
     await refreshAllWorlds()
   }
 }
@@ -311,7 +311,7 @@ async function deleteWorld(world: SingleplayerWorld) {
   worlds.value = worlds.value.filter((w) => w.type !== 'singleplayer' || w.path !== world.path)
 }
 
-function handleJoinError(err: unknown) {
+function handleJoinError(err: Error) {
   handleError(err)
   startingInstance.value = false
   worldPlaying.value = undefined
@@ -436,7 +436,7 @@ function promptToRemoveWorld(world: World): boolean {
 
 async function proceedRemoveServer() {
   if (!serverToRemove.value) {
-    handleError(`Error removing server, no server marked for removal.`)
+    handleError(new Error(`Error removing server, no server marked for removal.`))
     return
   }
   await removeServer(serverToRemove.value)
@@ -445,7 +445,7 @@ async function proceedRemoveServer() {
 
 async function proceedDeleteWorld() {
   if (!worldToDelete.value) {
-    handleError(`Error deleting world, no world marked for removal.`)
+    handleError(new Error(`Error deleting world, no world marked for removal.`))
     return
   }
   await deleteWorld(worldToDelete.value)