Fixed checkmarks on channel filters.

assets/components/filters/channel-filter.vue

@@ -26,10 +26,19 @@
 					v-for="channel in channelsPerNetwork"
 					:key="`channel-${channel.id}`"
 					class="filter-item"
-					:class="{ [channel.type]: true, independent: channel.independent }"
+					:class="{
+						[channel.type]: true,
+						independent: channel.independent,
+						selected: selectedChannels.includes(channel.slug),
+					}"
 				>
 					<router-link
-						:to="{ query: { ...$route.query, channels: channel.slug, mode }, params: { pageNumber: 1 } }"
+						:to="{ query: {
+							...$route.query,
+							[channel.type === 'network' ? 'networks' : 'channels']: channel.slug,
+							[channel.type === 'network' ? 'channels' : 'networks']: undefined,
+							mode,
+						}, params: { pageNumber: 1 } }"
 						class="filter-name"
 					>
 						<img
@@ -42,9 +51,8 @@
 					</router-link>
 
 					<router-link
-						:to="{ query: { ...$route.query, ...getNewRange(channel.slug), mode }, params: { pageNumber: 1 } }"
+						:to="{ query: { ...$route.query, ...getNewRange(channel), mode }, params: { pageNumber: 1 } }"
 						class="filter-include"
-						:class="{ selected: selectedChannels.includes(channel.slug) }"
 					>
 						<Icon
 							icon="checkmark"
@@ -64,11 +72,19 @@
 
 <script>
 function getNewRange(channel) {
-	if (this.selectedChannels.includes(channel)) {
+	console.log(channel);
-		return { channels: this.selectedChannels.filter(selectedTag => selectedTag !== channel).join(',') || undefined };
+
+	if (this.selectedChannels.includes(channel.slug)) {
+		return {
+			channels: this.selectedChannels.filter(selectedTag => selectedTag !== channel.slug).join(',') || undefined,
+			networks: undefined,
+		};
 	}
 
-	return { channels: this.selectedChannels.concat(channel).join(',') };
+	return {
+		channels: this.selectedChannels.concat(channel.slug).join(','),
+		networks: undefined,
+	};
 }
 
 function selectedChannels() {

assets/components/filters/tag-filter.vue

@@ -104,8 +104,3 @@ export default {
 	},
 };
 </script>
-
-<style lang="scss" scoped>
-@import 'theme';
-
-</style>