feat: Filter NSFW mods by default (#964)

Add an option to filter out NSFW mods from Thunderstore and filter them out by default.

Author: GeckoEidechse

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: {

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;

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;