From 8ae6980f59d22a4f03556b362a9ab8845cfe3592 Mon Sep 17 00:00:00 2001
From: GeckoEidechse <40122905+GeckoEidechse@users.noreply.github.com>
Date: Thu, 4 Jul 2024 20:02:57 +0200
Subject: feat: Filter NSFW mods by default (#964)

Add an option to filter out NSFW mods from Thunderstore and filter them out by default.
---
 src-vue/src/plugins/modules/search.ts           |  1 +
 src-vue/src/views/SettingsView.vue              | 16 ++++++++++++++++
 src-vue/src/views/mods/ThunderstoreModsView.vue | 14 ++++++++++----
 3 files changed, 27 insertions(+), 4 deletions(-)

(limited to 'src-vue/src')

diff --git a/src-vue/src/plugins/modules/search.ts b/src-vue/src/plugins/modules/search.ts
index e590b94b..9614b0be 100644
--- a/src-vue/src/plugins/modules/search.ts
+++ b/src-vue/src/plugins/modules/search.ts
@@ -9,6 +9,7 @@ export const searchModule = {
         // Selected mod categories
         selectedCategories: [],
         showDeprecatedMods: false,
+        showNsfwMods: false,
         sortValue: {label: '', value: ''}
     }),
     getters: {
diff --git a/src-vue/src/views/SettingsView.vue b/src-vue/src/views/SettingsView.vue
index 16b894d5..5ead665b 100644
--- a/src-vue/src/views/SettingsView.vue
+++ b/src-vue/src/views/SettingsView.vue
@@ -112,6 +112,14 @@
                     </el-button>
                 </div>
 
+                <div class="fc_parameter__panel">
+                    <h3>{{ $t('settings.show_nsfw_mods') }}</h3>
+                    <span>
+                        {{ $t('settings.show_nsfw_mods') }}
+                        <el-switch v-model="showNsfwMods"></el-switch>
+                    </span>
+                </div>
+
                 <!-- About section -->
                 <div class="fc_parameter__panel">
                     <h3>{{ $t('settings.about') }}</h3>
@@ -157,6 +165,14 @@ export default defineComponent({
         }
     },
     computed: {
+        showNsfwMods: {
+            get(): boolean {
+                return this.$store.state.search.showNsfwMods;
+            },
+            set(value: boolean) {
+                this.$store.state.search.showNsfwMods = value;
+            }
+        },
         showDeprecatedMods: {
             get(): boolean {
                 return this.$store.state.search.showDeprecatedMods;
diff --git a/src-vue/src/views/mods/ThunderstoreModsView.vue b/src-vue/src/views/mods/ThunderstoreModsView.vue
index 1221f85f..1ec684a6 100644
--- a/src-vue/src/views/mods/ThunderstoreModsView.vue
+++ b/src-vue/src/views/mods/ThunderstoreModsView.vue
@@ -66,6 +66,9 @@ export default defineComponent({
         showDeprecatedMods(): boolean {
             return this.$store.state.search.showDeprecatedMods;
         },
+        showNsfwMods(): boolean {
+            return this.$store.state.search.showNsfwMods;
+        },
         searchValue(): string {
             return this.$store.getters.searchWords;
         },
@@ -95,22 +98,25 @@ export default defineComponent({
                 // Filter out deprecated mods
                 const showDeprecated = !mod.is_deprecated || this.showDeprecatedMods;
 
+                // Filter out NSFW mods
+                const showNsfw = !mod.has_nsfw_content || this.showNsfwMods;
+
                 // Filter with categories (only if some categories are selected)
                 const categoriesMatch: boolean = this.selectedCategories.length === 0
                     || mod.categories
                         .filter((category: string) => this.selectedCategories.includes(category))
                         .length === this.selectedCategories.length;
 
-                return inputMatches && categoriesMatch && showDeprecated;
+                return inputMatches && categoriesMatch && showDeprecated && showNsfw;
             });
         },
         modsList(): ThunderstoreMod[] {
             // Use filtered mods if user is searching, vanilla list otherwise.
             const mods: ThunderstoreMod[] = this.searchValue.length !== 0 || this.selectedCategories.length !== 0
                 ? this.filteredMods
-                : this.showDeprecatedMods
-                    ? this.mods
-                    : this.mods.filter(mod => !mod.is_deprecated);
+                : this.mods
+                    .filter(mod => this.showDeprecatedMods || !mod.is_deprecated)
+                    .filter(mod => this.showNsfwMods || !mod.has_nsfw_content);
 
             // Sort mods regarding user selected algorithm.
             let compare: (a: ThunderstoreMod, b: ThunderstoreMod) => number;
-- 
cgit v1.2.3