diff --git a/src/components/MonitorList.vue b/src/components/MonitorList.vue
index 40a21bd8..f3dc1141 100644
--- a/src/components/MonitorList.vue
+++ b/src/components/MonitorList.vue
@@ -95,22 +95,6 @@ export default {
             disableSelectAllWatcher: false,
             selectedMonitors: {},
             windowTop: 0,
-            statusStates: {
-                up: 1,
-                down: 0,
-                pending: 2,
-                maintenance: 3,
-                1: "up",
-                0: "down",
-                2: "pending",
-                3: "maintenance",
-            },
-            activeStates: {
-                running: true,
-                paused: false,
-                true: "running",
-                false: "paused",
-            },
         };
     },
     computed: {
@@ -233,26 +217,27 @@ export default {
             });
         })();
 
-        const fetchedTagNames = tagParams
+        const fetchedTagIDs = tagParams
             ? tagParams
                 .split(",")
                 .map(identifier => {
                     const tagID = parseInt(identifier, 10);
-                    return tags
-                        .find(t => t.name === identifier || t.id === tagID)
-                        ?.name ?? 0;
+                    if (isNaN(tagID)) {
+                        return;
+                    }
+                    return tags.find(t => t.tag_id === tagID)?.id ?? 1;
                 })
                 .filter(tagID => tagID !== 0)
             : undefined;
 
         this.updateFilter({
             status: statusParams ? statusParams.split(",").map(
-                status => this.statusStates[this.statusStates[status.trim()]]
+                status => status.trim()
             ) : queryParams?.["status"],
             active: activeParams ? activeParams.split(",").map(
-                active => this.activeStates[this.activeStates[active.trim()]]
+                active => active.trim()
             ) : queryParams?.["active"],
-            tags: tagParams ? fetchedTagNames : queryParams?.["tags"],
+            tags: tagParams ? fetchedTagIDs : queryParams?.["tags"],
         });
     },
     beforeUnmount() {
@@ -398,7 +383,7 @@ export default {
                 if (monitor.id in this.$root.lastHeartbeatList && this.$root.lastHeartbeatList[monitor.id]) {
                     monitor.status = this.$root.lastHeartbeatList[monitor.id].status;
                 }
-                statusMatch = this.$router.currentRoute.value.query?.status.includes(this.statusStates[monitor.status]);
+                statusMatch = this.$router.currentRoute.value.query?.status.includes(monitor.status);
             }
 
             // filter by active
@@ -411,9 +396,8 @@ export default {
             let tagsMatch = true;
             const tagsInURL = this.$router.currentRoute.value.query?.tags?.split(",") || [];
             if (this.$router.currentRoute.value.query?.tags != null && this.$router.currentRoute.value.query?.tags.length > 0) {
-                tagsMatch = monitor.tags.map(tag => tag.name) // convert to array of tag names
-                    .filter(monitorTagId => tagsInURL.includes(monitorTagId)) // perform Array Intersaction between filter and monitor's tags
-                    .length > 0;
+                const monitorTagIds = monitor.tags.map(tag => tag.tag_id);
+                tagsMatch = tagsInURL.map(Number).some(tagId => monitorTagIds.includes(tagId));
             }
 
             return searchTextMatch && statusMatch && activeMatch && tagsMatch;
diff --git a/src/components/MonitorListFilter.vue b/src/components/MonitorListFilter.vue
index a0afc7c1..31570425 100644
--- a/src/components/MonitorListFilter.vue
+++ b/src/components/MonitorListFilter.vue
@@ -29,7 +29,10 @@
                             <Status :status="1" />
                             <span class="ps-3">
                                 {{ $root.stats.up }}
-                                <span v-if="$router.currentRoute.value.query?.status?.includes('up')" class="px-1 filter-active">
+                                <span
+                                    v-if="$router.currentRoute.value.query?.status?.includes('1')"
+                                    class="px-1 filter-active"
+                                >
                                     <font-awesome-icon icon="check" />
                                 </span>
                             </span>
@@ -42,7 +45,10 @@
                             <Status :status="0" />
                             <span class="ps-3">
                                 {{ $root.stats.down }}
-                                <span v-if="$router.currentRoute.value.query?.status?.includes('down')" class="px-1 filter-active">
+                                <span
+                                    v-if="$router.currentRoute.value.query?.status?.includes('0')"
+                                    class="px-1 filter-active"
+                                >
                                     <font-awesome-icon icon="check" />
                                 </span>
                             </span>
@@ -55,7 +61,10 @@
                             <Status :status="2" />
                             <span class="ps-3">
                                 {{ $root.stats.pending }}
-                                <span v-if="$router.currentRoute.value.query?.status?.includes('pending')" class="px-1 filter-active">
+                                <span
+                                    v-if="$router.currentRoute.value.query?.status?.includes('2')"
+                                    class="px-1 filter-active"
+                                >
                                     <font-awesome-icon icon="check" />
                                 </span>
                             </span>
@@ -68,7 +77,10 @@
                             <Status :status="3" />
                             <span class="ps-3">
                                 {{ $root.stats.maintenance }}
-                                <span v-if="$router.currentRoute.value.query?.status?.includes('maintenance')" class="px-1 filter-active">
+                                <span
+                                    v-if="$router.currentRoute.value.query?.status?.includes('3')"
+                                    class="px-1 filter-active"
+                                >
                                     <font-awesome-icon icon="check" />
                                 </span>
                             </span>
@@ -94,7 +106,10 @@
                             <span>{{ $t("Running") }}</span>
                             <span class="ps-3">
                                 {{ $root.stats.active }}
-                                <span v-if="$router.currentRoute.value.query?.active?.includes(true)" class="px-1 filter-active">
+                                <span
+                                    v-if="$router.currentRoute.value.query?.active?.includes(true)"
+                                    class="px-1 filter-active"
+                                >
                                     <font-awesome-icon icon="check" />
                                 </span>
                             </span>
@@ -107,7 +122,10 @@
                             <span>{{ $t("filterActivePaused") }}</span>
                             <span class="ps-3">
                                 {{ $root.stats.pause }}
-                                <span v-if="$router.currentRoute.value.query?.active?.includes(false)" class="px-1 filter-active">
+                                <span
+                                    v-if="$router.currentRoute.value.query?.active?.includes(false)"
+                                    class="px-1 filter-active"
+                                >
                                     <font-awesome-icon icon="check" />
                                 </span>
                             </span>
@@ -119,9 +137,8 @@
         <MonitorListFilterDropdown :filterActive="$router.currentRoute.value.query?.tags?.length > 0">
             <template #status>
                 <Tag
-                    v-if="$router.currentRoute.value.query?.tags?.length === 1"
-                    :item="tagsList.find(tag => tag.id === $router.currentRoute.value.query?.tags[0])"
-                    :size="'sm'"
+                    v-if="$router.currentRoute.value.query?.tags?.split?.(',')?.length === 1 && tagsList.find(tag => tag.id === +$router.currentRoute.value.query?.tags?.split?.(',')?.[0])"
+                    :item="tagsList.find(tag => tag.id === +$router.currentRoute.value.query?.tags?.split?.(',')?.[0])" :size="'sm'"
                 />
                 <span v-else>
                     {{ $t('Tags') }}
@@ -131,10 +148,15 @@
                 <li v-for="tag in tagsList" :key="tag.id">
                     <div class="dropdown-item" tabindex="0" @click.stop="toggleTagFilter(tag)">
                         <div class="d-flex align-items-center justify-content-between">
-                            <span><Tag :item="tag" :size="'sm'" /></span>
+                            <span>
+                                <Tag :item="tag" :size="'sm'" />
+                            </span>
                             <span class="ps-3">
                                 {{ getTaggedMonitorCount(tag) }}
-                                <span v-if="$router.currentRoute.value.query?.tags?.split(',').includes(tag.name)" class="px-1 filter-active">
+                                <span
+                                    v-if="$router.currentRoute.value.query?.tags?.split(',').includes(tag.id)"
+                                    class="px-1 filter-active"
+                                >
                                     <font-awesome-icon icon="check" />
                                 </span>
                             </span>
@@ -166,28 +188,13 @@ export default {
     data() {
         return {
             tagsList: [],
-            filterNames: [
-                "status",
-                "active",
-                "tags",
-            ],
         };
     },
     computed: {
         numFiltersActive() {
-            let num = 0;
-
-            Object.values(
-                Array.from(Object.entries(this.$router.currentRoute.value.query)).filter(
-                    e => this.filterNames.includes(e[0])
-                )
-            ).forEach(item => {
-                if (item != null && item.length > 0) {
-                    num += 1;
-                }
-            });
-
-            return num;
+            return this.$router.currentRoute.value.query.status?.length > 0 ? 1 : 0 +
+                this.$router.currentRoute.value.query.active?.length > 0 ? 1 : 0 +
+                this.$router.currentRoute.value.query.tags?.length > 0 ? 1 : 0;
         }
     },
     mounted() {
@@ -210,19 +217,10 @@ export default {
                 ...this.getActiveFilters(),
             };
 
-            const statusStates = {
-                1: "up",
-                0: "down",
-                2: "pending",
-                3: "maintenance",
-            };
-
-            const finalStatus = statusStates[status];
-
-            if (newFilter.status.includes("" + finalStatus)) {
-                newFilter.status = newFilter.status.filter(item => item !== "" + finalStatus);
+            if (newFilter.status.includes("" + status)) {
+                newFilter.status = newFilter.status.filter(item => item !== "" + status);
             } else {
-                newFilter.status.push(finalStatus);
+                newFilter.status.push(status);
             }
 
             this.$emit("updateFilter", newFilter);
@@ -245,10 +243,10 @@ export default {
                 ...this.getActiveFilters(),
             };
 
-            if (newFilter.tags.includes("" + tag.name)) {
-                newFilter.tags = newFilter.tags.filter(item => item !== "" + tag.name);
+            if (newFilter.tags.includes("" + tag.id)) {
+                newFilter.tags = newFilter.tags.filter(item => item !== "" + tag.id);
             } else {
-                newFilter.tags.push(tag.name);
+                newFilter.tags.push(tag.id);
             }
 
             this.$emit("updateFilter", newFilter);