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/frontend/src/components/ui/moderation/ModerationReportCard.vue

@@ -135,28 +135,31 @@
 </template>
 <script setup lang="ts">
 import {
-  Avatar,
-  useRelativeTime,
-  OverflowMenu,
-  type OverflowMenuOption,
-  CollapsibleRegion,
-  ButtonStyled,
-} from "@modrinth/ui";
-import {
-  EllipsisVerticalIcon,
-  OrganizationIcon,
-  EyeIcon,
   ClipboardCopyIcon,
+  EllipsisVerticalIcon,
+  EyeIcon,
   LinkIcon,
+  OrganizationIcon,
 } from "@modrinth/assets";
 import {
   type ExtendedReport,
   reportQuickReplies,
   type ReportQuickReply,
 } from "@modrinth/moderation";
+import {
+  Avatar,
+  ButtonStyled,
+  CollapsibleRegion,
+  injectNotificationManager,
+  OverflowMenu,
+  type OverflowMenuOption,
+  useRelativeTime,
+} from "@modrinth/ui";
 import ChevronDownIcon from "../servers/icons/ChevronDownIcon.vue";
 import ReportThread from "../thread/ReportThread.vue";
 
+const { addNotification } = injectNotificationManager();
+
 const props = defineProps<{
   report: ExtendedReport;
 }>();