diff --git a/app/Classes/ApiManager/MediaFilesApi.ts b/app/Classes/ApiManager/MediaFilesApi.ts
index a50299b41d..f5e27c7bb6 100644
--- a/app/Classes/ApiManager/MediaFilesApi.ts
+++ b/app/Classes/ApiManager/MediaFilesApi.ts
@@ -6,8 +6,9 @@ import {
 } from "~/pages/PageEnigma/models";
 import { ApiManager, ApiResponse } from "./ApiManager";
 import { authentication } from "~/signals";
-import { Property } from "csstype";
-import Visibility = Property.Visibility;
+import type { Property } from "csstype";
+type Visibility = Property.Visibility;
+
 import {
   FilterEngineCategories,
   FilterMediaClasses,
diff --git a/app/hooks/useBackgroundLoadingMedia/utilities.ts b/app/hooks/useBackgroundLoadingMedia/utilities.ts
index 776e9e1b06..9cc54b1de2 100644
--- a/app/hooks/useBackgroundLoadingMedia/utilities.ts
+++ b/app/hooks/useBackgroundLoadingMedia/utilities.ts
@@ -1,63 +1,53 @@
-import { MediaFileType } from "~/pages/PageEnigma/enums";
+import { FilterMediaClasses, ToastTypes } from "~/enums";
 
-import { ToastTypes } from "~/enums";
-
-import {
-  GetMediaByUser,
-  GetMediaListResponse,
-} from "~/api/media_files/GetMediaByUser";
+import { MediaFilesApi } from "~/Classes/ApiManager/MediaFilesApi";
 
 import {
   addToast,
   authentication,
   setUserAudioItems,
   setUserMovies,
-  userMovies,
   isRetreivingAudioItems,
 } from "~/signals";
 const { userInfo } = authentication;
 
-export function PollUserMovies() {
+export async function PollUserMovies() {
   if (!userInfo.value) {
     //do nothing return if login info does not exist
     return;
   }
-  return GetMediaByUser(
-    userInfo.value.username,
-    {},
-    {
-      filter_media_type: MediaFileType.Video,
-    },
-  )
-    .then((res: GetMediaListResponse) => {
-      if (userMovies.value && res.results.length !== userMovies.value.length) {
-        setUserMovies(res.results);
-      }
-    })
-    .catch(() => {
-      addToast(ToastTypes.ERROR, "Unknown Error in Loading My Movies");
-    });
+
+  const mediaFilesApi = new MediaFilesApi();
+  const response = await mediaFilesApi.ListUserMediaFiles({
+    filter_media_classes: [FilterMediaClasses.VIDEO],
+  });
+  if (response.success && response.data) {
+    setUserMovies(response.data);
+    return;
+  }
+  addToast(
+    ToastTypes.ERROR,
+    response.errorMessage || "Unknown Error in Loading My Movies",
+  );
 }
 
-export function PollUserAudioItems() {
+export async function PollUserAudioItems() {
   if (!userInfo.value) {
     //do nothing return if login info does not exist
     return;
   }
   isRetreivingAudioItems.value = true;
-  return GetMediaByUser(
-    userInfo.value.username,
-    {},
-    {
-      filter_media_type: MediaFileType.Audio,
-    },
-  )
-    .then((res: GetMediaListResponse) => {
-      isRetreivingAudioItems.value = false;
-      setUserAudioItems(res.results);
-    })
-    .catch(() => {
-      isRetreivingAudioItems.value = false;
-      addToast(ToastTypes.ERROR, "Unknown Error in Loading My Audio Items");
-    });
+  const mediaFilesApi = new MediaFilesApi();
+  const response = await mediaFilesApi.ListUserMediaFiles({
+    filter_media_classes: [FilterMediaClasses.AUDIO],
+  });
+  isRetreivingAudioItems.value = false;
+  if (response.success && response.data) {
+    setUserAudioItems(response.data);
+    return;
+  }
+  addToast(
+    ToastTypes.ERROR,
+    response.errorMessage || "Unknown Error in Loading My Audio Items",
+  );
 }
diff --git a/package-lock.json b/package-lock.json
index 95b3257a5b..b67748c489 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -27,6 +27,7 @@
         "@tweenjs/tween.js": "^18.6.4",
         "ccapture.js": "github:aceslowman/ccapture.js#npm-fix",
         "common": "file:common",
+        "csstype": "^3.1.3",
         "dayjs": "^1.11.10",
         "isbot": "^4.1.0",
         "react": "^18.2.0",
@@ -12058,8 +12059,7 @@
     "node_modules/csstype": {
       "version": "3.1.3",
       "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz",
-      "integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==",
-      "dev": true
+      "integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw=="
     },
     "node_modules/damerau-levenshtein": {
       "version": "1.0.8",
diff --git a/package.json b/package.json
index 9bbf68a3d2..db8f847ff9 100644
--- a/package.json
+++ b/package.json
@@ -39,6 +39,7 @@
     "@tweenjs/tween.js": "^18.6.4",
     "ccapture.js": "github:aceslowman/ccapture.js#npm-fix",
     "common": "file:common",
+    "csstype": "^3.1.3",
     "dayjs": "^1.11.10",
     "isbot": "^4.1.0",
     "react": "^18.2.0",