refactor(Admin): Removed vuex store

frontend/src/components/modals/ViewReport.vue

@@ -5,6 +5,7 @@ import Toast from "toasters";
 import { useWebsocketsStore } from "@/stores/websockets";
 import { useModalState } from "@/vuex_helpers";
 import ws from "@/ws";
+import admin from "@/api/admin/index";
 
 const SongItem = defineAsyncComponent(
 	() => import("@/components/SongItem.vue")
@@ -25,10 +26,6 @@ const { reportId } = useModalState("modals/viewReport/MODAL_UUID", {
 	modalUuid: props.modalUuid
 });
 
-const resolveReport = payload =>
-	store.dispatch("admin/reports/resolveReport", payload);
-const removeReport = payload =>
-	store.dispatch("admin/reports/removeReport", payload);
 const openModal = payload =>
 	store.dispatch("modalVisibility/openModal", payload);
 const closeCurrentModal = () =>
@@ -97,14 +94,16 @@ const init = () => {
 };
 
 const resolve = value =>
-	resolveReport({ reportId, value })
+	admin.reports
+		.resolve({ reportId, value })
 		.then(res => {
 			if (res.status !== "success") new Toast(res.message);
 		})
 		.catch(err => new Toast(err.message));
 
 const remove = () =>
-	removeReport(reportId)
+	admin.reports
+		.remove(reportId)
 		.then(res => {
 			if (res.status === "success") closeCurrentModal();
 		})

frontend/src/pages/Admin/Reports.vue

@@ -1,8 +1,8 @@
 <script setup lang="ts">
 import { defineAsyncComponent, ref } from "vue";
 import { useStore } from "vuex";
-
 import Toast from "toasters";
+import admin from "@/api/admin/index";
 
 const AdvancedTable = defineAsyncComponent(
 	() => import("@/components/AdvancedTable.vue")
@@ -147,11 +147,10 @@ const events = ref({
 
 const openModal = payload =>
 	store.dispatch("modalVisibility/openModal", payload);
-const resolveReport = payload =>
-	store.dispatch("admin/reports/resolveReport", payload);
 
 const resolve = (reportId, value) =>
-	resolveReport({ reportId, value })
+	admin.reports
+		.resolve({ reportId, value })
 		.then(res => {
 			if (res.status !== "success") new Toast(res.message);
 		})

frontend/src/pages/Admin/index.vue

@@ -2,12 +2,10 @@
 import {
 	defineAsyncComponent,
 	ref,
-	computed,
 	watch,
 	onMounted,
 	onBeforeUnmount
 } from "vue";
-import { useStore } from "vuex";
 import { useRoute, useRouter } from "vue-router";
 import { useWebsocketsStore } from "@/stores/websockets";
 import keyboardShortcuts from "@/keyboardShortcuts";
@@ -16,7 +14,6 @@ const FloatingBox = defineAsyncComponent(
 	() => import("@/components/FloatingBox.vue")
 );
 
-const store = useStore();
 const route = useRoute();
 const router = useRouter();
 
@@ -30,11 +27,18 @@ const siteSettings = ref({
 const sidebarActive = ref(true);
 const sidebarPadding = ref(0);
 const keyboardShortcutsHelper = ref();
+const childrenActive = ref({
+	songs: false,
+	users: false,
+	youtube: false
+});
 
-const childrenActive = computed(() => store.state.admin.childrenActive);
-
-const toggleChildren = payload =>
-	store.dispatch("admin/toggleChildren", payload);
+const toggleChildren = payload => {
+	if (typeof payload.force === "undefined")
+		childrenActive.value[payload.child] =
+			!childrenActive.value[payload.child];
+	else childrenActive.value[payload.child] = payload.force;
+};
 
 const getTabFromPath = (path?) => {
 	const localPath = path || route.path;

frontend/src/store/index.ts

@@ -3,7 +3,6 @@ import { createStore } from "vuex";
 
 import user from "./modules/user";
 import modalVisibility from "./modules/modalVisibility";
-import admin from "./modules/admin";
 
 const emptyModule = {
 	namespaced: true
@@ -12,7 +11,6 @@ const emptyModule = {
 export default createStore({
 	modules: {
 		user,
-		admin,
 		modalVisibility,
 		modals: {
 			namespaced: true,

frontend/src/store/modules/admin.ts

@@ -1,92 +0,0 @@
-/* eslint no-param-reassign: 0 */
-/* eslint-disable import/no-cycle */
-
-import admin from "@/api/admin/index";
-
-const modules = {
-	songs: {
-		namespaced: true,
-		state: {},
-		getters: {},
-		actions: {},
-		mutations: {}
-	},
-	stations: {
-		namespaced: true,
-		state: {},
-		getters: {},
-		actions: {},
-		mutations: {}
-	},
-	reports: {
-		namespaced: true,
-		state: {},
-		getters: {},
-		actions: {
-			/* eslint-disable-next-line */
-			resolveReport: ({ commit }, { reportId, value }) =>
-				new Promise((resolve, reject) => {
-					admin.reports
-						.resolve({ reportId, value })
-						.then(res => resolve(res))
-						.catch(err => reject(new Error(err.message)));
-				}),
-			/* eslint-disable-next-line */
-			removeReport: ({ commit }, reportId) =>
-				new Promise((resolve, reject) => {
-					admin.reports
-						.remove(reportId)
-						.then(res => resolve(res))
-						.catch(err => reject(new Error(err.message)));
-				})
-		},
-		mutations: {}
-	},
-	users: {
-		namespaced: true,
-		state: {},
-		getters: {},
-		actions: {},
-		mutations: {}
-	},
-	news: {
-		namespaced: true,
-		state: {},
-		getters: {},
-		actions: {},
-		mutations: {}
-	},
-	playlists: {
-		namespaced: true,
-		state: {},
-		getters: {},
-		actions: {},
-		mutations: {}
-	}
-};
-
-export default {
-	namespaced: true,
-	state: {
-		childrenActive: {
-			songs: false,
-			users: false,
-			youtube: false
-		}
-	},
-	getters: {},
-	actions: {
-		toggleChildren({ commit }, payload) {
-			commit("toggleChildren", payload);
-		}
-	},
-	mutations: {
-		toggleChildren(state, payload) {
-			if (typeof payload.force === "undefined")
-				state.childrenActive[payload.child] =
-					!state.childrenActive[payload.child];
-			else state.childrenActive[payload.child] = payload.force;
-		}
-	},
-	modules
-};