From cc5f303d211085b9e7987249cd3f4a94aa68eefa Mon Sep 17 00:00:00 2001
From: Cade Ayres <ca469@kent.ac.uk>
Date: Tue, 10 Feb 2026 16:04:52 +0000
Subject: [PATCH 01/14] WIP: Added VulnerablePackageBanner and moved shared
 logic to composable. Improved background/text clarity

# Conflicts:
#	quasar.config.ts
#	src/css/scheme/dark.scss
#	src/css/scheme/light.scss
---
 quasar.config.ts                              | 14 ++++++++-
 src/components/banner/ManagerUpdateBanner.vue | 14 ++++-----
 .../banner/VulnerablePackageBanner.vue        | 13 +++++++++
 .../VulnerablePackageComposable.ts            | 29 +++++++++++++++++++
 src/components/views/LocalModList.vue         |  5 ++++
 .../views/LocalModList/LocalModCard.vue       | 19 +++++++++++-
 src/css/scheme/dark.scss                      |  3 ++
 src/css/scheme/light.scss                     |  2 ++
 src/css/v2/components/_card.scss              | 14 +++++++++
 9 files changed, 103 insertions(+), 10 deletions(-)
 create mode 100644 src/components/banner/VulnerablePackageBanner.vue
 create mode 100644 src/components/composables/VulnerablePackageComposable.ts

diff --git a/quasar.config.ts b/quasar.config.ts
index e9d7b21c7..e28148216 100644
--- a/quasar.config.ts
+++ b/quasar.config.ts
@@ -1,6 +1,7 @@
 // Configuration for your app
 // https://v2.quasar.dev/quasar-cli-vite/quasar-config-file
 
+import path from 'node:path';
 import { defineConfig } from '#q-app/wrappers';
 
 export default defineConfig((ctx) => {
@@ -47,7 +48,13 @@ export default defineConfig((ctx) => {
             typescript: {
                 strict: true,
                 vueShim: true,
-                // extendTsConfig (tsConfig) {}
+                extendTsConfig(tsConfig) {
+                    tsConfig.compilerOptions.paths = {
+                        '@r2': ['../src'],
+                        '@r2/*': ['../src/*'],
+                        ...tsConfig.compilerOptions.paths,
+                    };
+                }
             },
 
             vueRouterMode: 'history', // available values: 'hash', 'history'
@@ -71,6 +78,11 @@ export default defineConfig((ctx) => {
             extendViteConf (viteConf) {
                 // Force Vite to use esbuild for CSS, overriding any defaults
                 viteConf.build!.cssMinify = 'esbuild';
+
+                // Allow @r2 alias
+                viteConf.resolve ??= {};
+                viteConf.resolve.alias ??= {};
+                (viteConf.resolve.alias as Record<string, string>)['@r2'] = path.resolve(__dirname, 'src');
             },
             viteVuePluginOptions: {
                 template: {
diff --git a/src/components/banner/ManagerUpdateBanner.vue b/src/components/banner/ManagerUpdateBanner.vue
index 93775ab23..5a1e64ccd 100644
--- a/src/components/banner/ManagerUpdateBanner.vue
+++ b/src/components/banner/ManagerUpdateBanner.vue
@@ -34,13 +34,11 @@ onMounted(async () => {
 
 <template>
     <div class='notification margin-top margin-right' v-show="portableUpdateAvailable">
-        <div class='container'>
-            <p>
-                An {{ appName }} update is available.
-                <ExternalLink :url="`https://github.com/ebkr/r2modmanPlus/releases/tag/${updateTagName}`">
-                    Click here to go to the release page.
-                </ExternalLink>
-            </p>
-        </div>
+        <p>
+            An {{ appName }} update is available.
+            <ExternalLink :url="`https://github.com/ebkr/r2modmanPlus/releases/tag/${updateTagName}`">
+                Click here to go to the release page.
+            </ExternalLink>
+        </p>
     </div>
 </template>
diff --git a/src/components/banner/VulnerablePackageBanner.vue b/src/components/banner/VulnerablePackageBanner.vue
new file mode 100644
index 000000000..53bb3a4b6
--- /dev/null
+++ b/src/components/banner/VulnerablePackageBanner.vue
@@ -0,0 +1,13 @@
+<script setup lang="ts">
+
+</script>
+
+<template>
+    <div class="notification is-danger margin-right">
+        <span>You have potentially vulnerable packages.</span> <a href="#">Click here to review packages.</a>
+    </div>
+</template>
+
+<style scoped lang="scss">
+
+</style>
diff --git a/src/components/composables/VulnerablePackageComposable.ts b/src/components/composables/VulnerablePackageComposable.ts
new file mode 100644
index 000000000..d6e993dcd
--- /dev/null
+++ b/src/components/composables/VulnerablePackageComposable.ts
@@ -0,0 +1,29 @@
+/**
+ * Definitions are outside the composable function so that calculations are shared.
+ * We do not need to recalculate on a per-usage basis.
+ */
+import { getStore } from '@r2/providers/generic/store/StoreProvider';
+import { computed } from 'vue';
+import ManifestV2 from '@r2/model/ManifestV2';
+import ThunderstoreMod from '@r2/model/ThunderstoreMod';
+
+const store = getStore<any>();
+
+const localModList = computed<ManifestV2[]>(() => store.state.profile.modList);
+const onlineModList = computed<Map<string, ThunderstoreMod>>(() => {
+    const mods: ThunderstoreMod[] = store.state.tsMods.mods;
+    return new Map<string, ThunderstoreMod>(mods.map(value => [value.getFullName(), value]));
+});
+
+const vulnerablePackages = computed<ManifestV2[]>(() => {
+    return localModList.value.filter(value => !value.isOnlineSource() && onlineModList.value.has(value.getName()));
+});
+
+const hasVulnerablePackages = computed<boolean>(() => vulnerablePackages.value.length > 0);
+
+export function useVulnerablePackageComposable() {
+    return {
+        vulnerablePackages,
+        hasVulnerablePackages
+    }
+}
diff --git a/src/components/views/LocalModList.vue b/src/components/views/LocalModList.vue
index 2da519543..3650a41a1 100644
--- a/src/components/views/LocalModList.vue
+++ b/src/components/views/LocalModList.vue
@@ -8,6 +8,7 @@
         <AssociatedModsModal />
 
         <ManagerUpdateBanner/>
+        <VulnerablePackageBanner v-if="hasVulnerablePackages"/>
 
         <slot name="above-list"></slot>
 
@@ -37,9 +38,13 @@ import { State } from '../../store';
 import { computed, defineAsyncComponent } from 'vue';
 import SkeletonLocalModCard from './LocalModList/SkeletonLocalModCard.vue';
 import ManagerUpdateBanner from '../banner/ManagerUpdateBanner.vue';
+import VulnerablePackageBanner from '@r2/components/banner/VulnerablePackageBanner.vue';
+import { useVulnerablePackageComposable } from '@r2/components/composables/VulnerablePackageComposable';
 
 const store = getStore<State>();
 
+const { hasVulnerablePackages } = useVulnerablePackageComposable();
+
 const LocalModDraggableList = defineAsyncComponent(() => import('./LocalModList/LocalModDraggableList.vue'));
 
 const visibleModList = computed(() => store.getters['profile/visibleModList']);
diff --git a/src/components/views/LocalModList/LocalModCard.vue b/src/components/views/LocalModList/LocalModCard.vue
index 33a6af0c1..5b4d0ddc4 100644
--- a/src/components/views/LocalModList/LocalModCard.vue
+++ b/src/components/views/LocalModList/LocalModCard.vue
@@ -12,6 +12,7 @@ import { splitToNameAndVersion } from '../../../utils/DependencyUtils';
 import { computed, onMounted, ref, watch } from 'vue';
 import { getStore } from '../../../providers/generic/store/StoreProvider';
 import { State } from '../../../store';
+import { useVulnerablePackageComposable } from '@r2/components/composables/VulnerablePackageComposable';
 
 const store = getStore<State>();
 
@@ -21,6 +22,8 @@ type LocalModCardProps = {
 
 const props = defineProps<LocalModCardProps>();
 
+const { vulnerablePackages } = useVulnerablePackageComposable();
+
 const disabledDependencies = ref<ManifestV2[]>([]);
 const missingDependencies = ref<string[]>([]);
 const disableChangePending = ref<boolean>(false);
@@ -33,6 +36,7 @@ const isDeprecated = computed(() => store.state.tsMods.deprecated.get(props.mod.
 const isLatestVersion = computed(() => store.getters['tsMods/isLatestVersion'](props.mod));
 const localModList = computed(() => store.state.profile.modList);
 const tsMod = computed(() => store.getters['tsMods/tsMod'](props.mod));
+const isConcerningPackage = computed<boolean>(() => vulnerablePackages.value.findIndex(value => value.getName() === props.mod.getName()) >= 0)
 
 async function updateDependencies() {
     if (props.mod.getDependencies().length === 0) {
@@ -187,7 +191,9 @@ function dependencyStringToModName(x: string) {
         :enabled="mod.isEnabled()"
         :id="`${mod.getAuthorName()}-${mod.getName()}-${mod.getVersionNumber()}`"
         :image="mod.getIcon()"
-        :allowSorting="true">
+        :allowSorting="true"
+        :class="[{'card--is-concern': isConcerningPackage}]"
+    >
 
         <template v-slot:title>
             <span class="non-selectable">
@@ -217,10 +223,21 @@ function dependencyStringToModName(x: string) {
 
         <template v-slot:description>
             <p class='card-timestamp' v-if="mod.getInstalledAtTime() !== 0"><strong>Installed on:</strong> {{ getReadableDate(mod.getInstalledAtTime()) }}</p>
+            <div class="notification is-warning" v-if="isConcerningPackage">
+                <p>This package was originally downloaded from Thunderstore however can no longer be found.</p>
+                <p>Mods can be removed due to the author's request or due to violating Thunderstore's package policies.</p>
+                <p><strong>It is recommended to remove this mod.</strong></p>
+            </div>
         </template>
 
         <!-- Show icon button row even when card is collapsed -->
         <template v-slot:other-icons>
+            <span v-if="isConcerningPackage"
+                  class='card-header-icon'>
+                <i v-tooltip.left="`This package may be vulnerable`"
+                   class='fas fa-unlink'
+                ></i>
+            </span>
             <DonateIconButton :mod="tsMod" v-if="tsMod"/>
             <span v-if="!isLatestVersion"
                 @click.prevent.stop="updateMod()"
diff --git a/src/css/scheme/dark.scss b/src/css/scheme/dark.scss
index 6e265fe24..2f7a6b0fa 100644
--- a/src/css/scheme/dark.scss
+++ b/src/css/scheme/dark.scss
@@ -78,6 +78,9 @@
 
     --game-card-new-badge-background: rgba(18, 22, 45, 0.85);
     --game-card-new-badge-border: rgba(100, 140, 255, 0.3);
+
+    --card-concern-background-color: rgba(126, 49, 7, 0.66);
+    --card-concern-secondary-background-color: #351f15;
 }
 
 html.html--dark {
diff --git a/src/css/scheme/light.scss b/src/css/scheme/light.scss
index 8870b7134..5407b092e 100644
--- a/src/css/scheme/light.scss
+++ b/src/css/scheme/light.scss
@@ -8,6 +8,8 @@
     --ecosystem-update-error-text: #9f1239;
     --ecosystem-update-error-background: #fce7ec;
     --ecosystem-update-error-border: #f6cbd5;
+    --card-concern-background-color: rgb(241, 192, 135);
+    --card-concern-secondary-background-color: rgb(248, 213, 149)
 }
 
 // custom vars
diff --git a/src/css/v2/components/_card.scss b/src/css/v2/components/_card.scss
index 322c48a48..2f8ecd7f7 100644
--- a/src/css/v2/components/_card.scss
+++ b/src/css/v2/components/_card.scss
@@ -5,6 +5,20 @@
     color: var(--card-color,var(--text,#4a4a4a));
     max-width: 100%;
     position: relative;
+
+    &--is-concern {
+        position: relative;
+        z-index: 0;
+        &::before {
+            content: "";
+            position: absolute;
+            z-index: -1;
+            inset: 0;
+            pointer-events: none;
+            background-image: repeating-linear-gradient(45deg, var(--card-concern-background-color) 0, var(--card-concern-background-color) 1px, var(--card-concern-secondary-background-color) 1px, var(--card-concern-secondary-background-color) 20px);
+            mask-image: linear-gradient(to right, transparent 0%, black 40%);
+        }
+    }
 }
 
 .card-header-title {

From 88eef484210e9a07dcbf65a52e71ff1440931209 Mon Sep 17 00:00:00 2001
From: Cade Ayres <ca469@kent.ac.uk>
Date: Wed, 11 Feb 2026 12:25:28 +0000
Subject: [PATCH 02/14] WIP: Added remove mod support as part of the review
 process

---
 .../banner/VulnerablePackageBanner.vue        |  9 ++--
 .../composables/ModManagementComposable.ts    | 35 ++++++++++++
 .../VulnerablePackageComposable.ts            | 14 +++--
 .../modals/VulnerablePackageReviewModal.vue   | 53 +++++++++++++++++++
 .../views/LocalModList/LocalModCard.vue       | 47 ++++++----------
 src/css/scheme/dark.scss                      |  6 ++-
 src/css/scheme/light.scss                     |  8 +--
 src/pages/Manager.vue                         |  2 +
 src/store/modules/ModalsModule.ts             | 13 +++++
 9 files changed, 145 insertions(+), 42 deletions(-)
 create mode 100644 src/components/composables/ModManagementComposable.ts
 create mode 100644 src/components/modals/VulnerablePackageReviewModal.vue

diff --git a/src/components/banner/VulnerablePackageBanner.vue b/src/components/banner/VulnerablePackageBanner.vue
index 53bb3a4b6..143d8738b 100644
--- a/src/components/banner/VulnerablePackageBanner.vue
+++ b/src/components/banner/VulnerablePackageBanner.vue
@@ -3,11 +3,14 @@
 </script>
 
 <template>
-    <div class="notification is-danger margin-right">
-        <span>You have potentially vulnerable packages.</span> <a href="#">Click here to review packages.</a>
+    <div class="notification is-concern margin-right">
+        <span>You have packages that can no longer be found on Thunderstore.</span> <a href="#">Click here to review packages.</a>
     </div>
 </template>
 
 <style scoped lang="scss">
-
+.is-concern {
+    background-color: var(--notification-concern-background-color);
+    color: var(--notification-concern-text-color);
+}
 </style>
diff --git a/src/components/composables/ModManagementComposable.ts b/src/components/composables/ModManagementComposable.ts
new file mode 100644
index 000000000..7fa4520b0
--- /dev/null
+++ b/src/components/composables/ModManagementComposable.ts
@@ -0,0 +1,35 @@
+import { getStore } from '@r2/providers/generic/store/StoreProvider';
+import Dependants from '@r2/r2mm/mods/Dependants';
+import R2Error from '@r2/model/errors/R2Error';
+import { LogSeverity } from '@r2/providers/ror2/logging/LoggerProvider';
+import ManifestV2 from '@r2/model/ManifestV2';
+
+const store = getStore<any>();
+
+export function useModManagementComposable() {
+
+    async function uninstallMod(mod: ManifestV2) {
+        const dependants = Dependants.getDependantList(mod, store.state.profile.modList);
+
+        if (dependants.size > 0) {
+            store.commit('openUninstallModModal', mod);
+            return;
+        }
+
+        try {
+            await store.dispatch(
+                'profile/uninstallModsFromActiveProfile',
+                { mods: [mod] }
+            );
+        } catch (e) {
+            store.commit('error/handleError', {
+                error: R2Error.fromThrownValue(e),
+                severity: LogSeverity.ACTION_STOPPED
+            });
+        }
+    }
+
+    return {
+        uninstallMod
+    }
+}
diff --git a/src/components/composables/VulnerablePackageComposable.ts b/src/components/composables/VulnerablePackageComposable.ts
index d6e993dcd..72010a2f9 100644
--- a/src/components/composables/VulnerablePackageComposable.ts
+++ b/src/components/composables/VulnerablePackageComposable.ts
@@ -3,7 +3,7 @@
  * We do not need to recalculate on a per-usage basis.
  */
 import { getStore } from '@r2/providers/generic/store/StoreProvider';
-import { computed } from 'vue';
+import { computed, ref, watch } from 'vue';
 import ManifestV2 from '@r2/model/ManifestV2';
 import ThunderstoreMod from '@r2/model/ThunderstoreMod';
 
@@ -19,11 +19,17 @@ const vulnerablePackages = computed<ManifestV2[]>(() => {
     return localModList.value.filter(value => !value.isOnlineSource() && onlineModList.value.has(value.getName()));
 });
 
-const hasVulnerablePackages = computed<boolean>(() => vulnerablePackages.value.length > 0);
-
 export function useVulnerablePackageComposable() {
+
+    const hasVulnerablePackages = computed<boolean>(() => vulnerablePackages.value.length > 0);
+
+    function isVulnerablePackage(mod: ManifestV2) {
+        return vulnerablePackages.value.findIndex(value => value.getName() === mod.getName()) >= 0;
+    }
+
     return {
         vulnerablePackages,
-        hasVulnerablePackages
+        hasVulnerablePackages,
+        isVulnerablePackage
     }
 }
diff --git a/src/components/modals/VulnerablePackageReviewModal.vue b/src/components/modals/VulnerablePackageReviewModal.vue
new file mode 100644
index 000000000..c277051a1
--- /dev/null
+++ b/src/components/modals/VulnerablePackageReviewModal.vue
@@ -0,0 +1,53 @@
+<script setup lang="ts">
+import { computed } from 'vue';
+import ModalCard from '@r2/components/ModalCard.vue';
+import { State } from '@r2/store';
+import { getStore } from '@r2/providers/generic/store/StoreProvider';
+import ManifestV2 from '@r2/model/ManifestV2';
+import { useModManagementComposable } from 'components/composables/ModManagementComposable';
+
+const store = getStore<State>();
+
+const { uninstallMod } = useModManagementComposable();
+
+const isOpen = computed(() => store.state.modals.isVulnerableModReviewModalOpen);
+const modToReview = computed<ManifestV2 | null>(() => store.state.modals.vulnerableModToReview);
+
+function close() {
+    store.commit('closeVulnerableModReviewModal');
+}
+
+async function removeMod() {
+    await uninstallMod(modToReview.value!);
+    close();
+}
+</script>
+
+<template>
+    <ModalCard id="review-package-modal" v-if="isOpen && modToReview" :is-active="isOpen" :can-close="true" @close-modal="close">
+        <template v-slot:header>
+            <h2 class="modal-title">Review {{ modToReview.getName() }}</h2>
+        </template>
+        <template v-slot:body>
+            <p class="notification is-warning">It is generally recommended to remove mods that have been removed from Thunderstore.</p>
+            <div>
+                <hr/>
+                <p class="margin-bottom">This mod was originally downloaded using the Online section however no longer appears in the package cache.</p>
+                <p class="margin-bottom">When a mod is no longer in the package cache, it means that it has been removed from Thunderstore.</p>
+                <p>Other people will be unable to import this mod if the profile is exported.</p>
+            </div>
+        </template>
+        <template v-slot:footer>
+            <button class="button">
+                Mark version as safe
+            </button>
+            <button class="button is-danger" @click="removeMod">
+                Remove mod
+            </button>
+        </template>
+    </ModalCard>
+</template>
+
+<style scoped lang="scss">
+
+</style>
diff --git a/src/components/views/LocalModList/LocalModCard.vue b/src/components/views/LocalModList/LocalModCard.vue
index 5b4d0ddc4..da0cf872c 100644
--- a/src/components/views/LocalModList/LocalModCard.vue
+++ b/src/components/views/LocalModList/LocalModCard.vue
@@ -13,6 +13,7 @@ import { computed, onMounted, ref, watch } from 'vue';
 import { getStore } from '../../../providers/generic/store/StoreProvider';
 import { State } from '../../../store';
 import { useVulnerablePackageComposable } from '@r2/components/composables/VulnerablePackageComposable';
+import { useModManagementComposable } from '@r2/components/composables/ModManagementComposable';
 
 const store = getStore<State>();
 
@@ -22,7 +23,8 @@ type LocalModCardProps = {
 
 const props = defineProps<LocalModCardProps>();
 
-const { vulnerablePackages } = useVulnerablePackageComposable();
+const { isVulnerablePackage } = useVulnerablePackageComposable();
+const { uninstallMod } = useModManagementComposable();
 
 const disabledDependencies = ref<ManifestV2[]>([]);
 const missingDependencies = ref<string[]>([]);
@@ -36,7 +38,6 @@ const isDeprecated = computed(() => store.state.tsMods.deprecated.get(props.mod.
 const isLatestVersion = computed(() => store.getters['tsMods/isLatestVersion'](props.mod));
 const localModList = computed(() => store.state.profile.modList);
 const tsMod = computed(() => store.getters['tsMods/tsMod'](props.mod));
-const isConcerningPackage = computed<boolean>(() => vulnerablePackages.value.findIndex(value => value.getName() === props.mod.getName()) >= 0)
 
 async function updateDependencies() {
     if (props.mod.getDependencies().length === 0) {
@@ -121,27 +122,6 @@ async function enableMod(mod: ManifestV2) {
     disableChangePending.value = false;
 }
 
-async function uninstallMod() {
-    const dependants = Dependants.getDependantList(props.mod, localModList.value);
-
-    if (dependants.size > 0) {
-        store.commit('openUninstallModModal', props.mod);
-        return;
-    }
-
-    try {
-        await store.dispatch(
-            'profile/uninstallModsFromActiveProfile',
-            { mods: [props.mod] }
-        );
-    } catch (e) {
-        store.commit('error/handleError', {
-            error: R2Error.fromThrownValue(e),
-            severity: LogSeverity.ACTION_STOPPED
-        });
-    }
-}
-
 function updateMod() {
     if (tsMod.value !== undefined) {
         store.commit('openDownloadModVersionSelectModal', tsMod.value);
@@ -183,6 +163,10 @@ function getReadableDate(value: number): string {
 function dependencyStringToModName(x: string) {
     return x.substring(0, x.lastIndexOf('-'));
 }
+
+function openReviewModal() {
+    store.commit('openVulnerableModReviewModal', props.mod);
+}
 </script>
 
 <template>
@@ -192,7 +176,7 @@ function dependencyStringToModName(x: string) {
         :id="`${mod.getAuthorName()}-${mod.getName()}-${mod.getVersionNumber()}`"
         :image="mod.getIcon()"
         :allowSorting="true"
-        :class="[{'card--is-concern': isConcerningPackage}]"
+        :class="[{'card--is-concern': isVulnerablePackage(props.mod)}]"
     >
 
         <template v-slot:title>
@@ -223,18 +207,21 @@ function dependencyStringToModName(x: string) {
 
         <template v-slot:description>
             <p class='card-timestamp' v-if="mod.getInstalledAtTime() !== 0"><strong>Installed on:</strong> {{ getReadableDate(mod.getInstalledAtTime()) }}</p>
-            <div class="notification is-warning" v-if="isConcerningPackage">
+            <div class="notification is-warning" v-if="isVulnerablePackage(props.mod)">
                 <p>This package was originally downloaded from Thunderstore however can no longer be found.</p>
                 <p>Mods can be removed due to the author's request or due to violating Thunderstore's package policies.</p>
                 <p><strong>It is recommended to remove this mod.</strong></p>
+                <button v-if="isVulnerablePackage(props.mod)" class="button" @click.stop.prevent="openReviewModal">
+                    Review package
+                </button>
             </div>
         </template>
 
         <!-- Show icon button row even when card is collapsed -->
         <template v-slot:other-icons>
-            <span v-if="isConcerningPackage"
+            <span v-if="isVulnerablePackage(props.mod)"
                   class='card-header-icon'>
-                <i v-tooltip.left="`This package may be vulnerable`"
+                <i v-tooltip.left="`This package can no longer be found on Thunderstore`"
                    class='fas fa-unlink'
                 ></i>
             </span>
@@ -265,7 +252,7 @@ function dependencyStringToModName(x: string) {
         </template>
 
         <!-- Show bottom button row -->
-        <button @click="uninstallMod()" class='button'>
+        <button @click="uninstallMod(props.mod)" class='button'>
             Uninstall
         </button>
 
@@ -290,7 +277,7 @@ function dependencyStringToModName(x: string) {
         </button>
 
         <button v-if="missingDependencies.length"
-            @click="downloadDependency(missingDependencies[0])"
+            @click="downloadDependency(missingDependencies[0]!)"
             class='button'>
             Download dependency
         </button>
@@ -298,7 +285,7 @@ function dependencyStringToModName(x: string) {
         <button v-if="disabledDependencies.length"
             @click="enableMod(disabledDependencies[0])"
             class='button'>
-            Enable {{disabledDependencies[0].getDisplayName()}}
+            Enable {{disabledDependencies[0]!.getDisplayName()}}
         </button>
 
         <DonateButton v-if="tsMod" :mod="tsMod"/>
diff --git a/src/css/scheme/dark.scss b/src/css/scheme/dark.scss
index 2f7a6b0fa..56341182e 100644
--- a/src/css/scheme/dark.scss
+++ b/src/css/scheme/dark.scss
@@ -79,8 +79,10 @@
     --game-card-new-badge-background: rgba(18, 22, 45, 0.85);
     --game-card-new-badge-border: rgba(100, 140, 255, 0.3);
 
-    --card-concern-background-color: rgba(126, 49, 7, 0.66);
-    --card-concern-secondary-background-color: #351f15;
+    --card-concern-background-color: rgba(177, 120, 89, 0.66);
+    --card-concern-secondary-background-color: #7e5442;
+    --notification-concern-background-color: #9e512e;
+    --notification-concern-text-color: #eaeaea;
 }
 
 html.html--dark {
diff --git a/src/css/scheme/light.scss b/src/css/scheme/light.scss
index 5407b092e..bd61fadc4 100644
--- a/src/css/scheme/light.scss
+++ b/src/css/scheme/light.scss
@@ -8,8 +8,10 @@
     --ecosystem-update-error-text: #9f1239;
     --ecosystem-update-error-background: #fce7ec;
     --ecosystem-update-error-border: #f6cbd5;
-    --card-concern-background-color: rgb(241, 192, 135);
-    --card-concern-secondary-background-color: rgb(248, 213, 149)
+    --card-concern-background-color: rgb(255, 206, 182);
+    --card-concern-secondary-background-color: rgb(246, 221, 209);
+    --notification-concern-background-color: #f8b89d;
+    --notification-concern-text-color: #000000;
 }
 
 // custom vars
@@ -27,7 +29,7 @@ $scheme-border-hover: var(--border-hover, #b5b5b5);
 $scheme-border-active: var(--border-active, #4a4a4a);
 $code-font-color: var(--code-font-color, #d01e49);
 $card-expand-shadow-color: var(--card-expand-shadow-color, rgba(0, 0, 0, 0.1));
-$card-expand-background-color: var(--card-expand-background-color, #f6f6f8);
+$card-expand-background-color: var(--card-expand-background-color, rgba(0, 0, 0, 0.05));
 $scrollbar-background: var(--border-hover, #b5b5b5);
 $scrollbar-background-hover: var(--border, #e1e1e1);
 
diff --git a/src/pages/Manager.vue b/src/pages/Manager.vue
index 6fa87189f..0084bb4a2 100644
--- a/src/pages/Manager.vue
+++ b/src/pages/Manager.vue
@@ -119,6 +119,7 @@
         <DownloadProgressModal />
         <DownloadModVersionSelectModal />
         <UpdateAllInstalledModsModal />
+        <VulnerablePackageReviewModal/>
         <LaunchTypeModal v-if="canRenderLaunchTypeModal()" />
 
         <div class="router-view">
@@ -158,6 +159,7 @@ import LaunchTypeModal from "../components/modals/launch-type/LaunchTypeModal.vu
 import appWindow from '../providers/node/app/app_window';
 import GameInstructionParser from "../r2mm/launching/instructions/GameInstructionParser";
 import ManagerActivityBar from '../components/navigation/ManagerActivityBar.vue';
+import VulnerablePackageReviewModal from 'components/modals/VulnerablePackageReviewModal.vue';
 
 const store = getStore<State>();
 const router = useRouter();
diff --git a/src/store/modules/ModalsModule.ts b/src/store/modules/ModalsModule.ts
index 5b7e6b5aa..802e5daed 100644
--- a/src/store/modules/ModalsModule.ts
+++ b/src/store/modules/ModalsModule.ts
@@ -21,6 +21,8 @@ interface State {
     uninstallModModalMod: ManifestV2 | null;
     isProfileCodeExportModalOpen: boolean;
     isLocalFileImportModalOpen: boolean;
+    vulnerableModToReview: ManifestV2 | null;
+    isVulnerableModReviewModalOpen: boolean;
 }
 
 export default {
@@ -44,6 +46,8 @@ export default {
         uninstallModModalMod: null,
         isProfileCodeExportModalOpen: false,
         isLocalFileImportModalOpen: false,
+        vulnerableModToReview: null,
+        isVulnerableModReviewModalOpen: false,
     }),
 
     mutations: {
@@ -111,6 +115,10 @@ export default {
             state.isLocalFileImportModalOpen = false;
         },
 
+        closeVulnerableModReviewModal: function(state: State): void {
+            state.isVulnerableModReviewModalOpen = false;
+        },
+
         openAssociatedModsModal: function(state: State, mod: ManifestV2): void {
             state.associatedModsModalMod = mod;
             state.isAssociatedModsModOpen = true;
@@ -174,5 +182,10 @@ export default {
         openLocalFileImportModal: function(state: State): void {
             state.isLocalFileImportModalOpen = true;
         },
+
+        openVulnerableModReviewModal: function(state: State, mod: ManifestV2): void {
+            state.vulnerableModToReview = mod;
+            state.isVulnerableModReviewModalOpen = true;
+        },
     }
 }

From e6d515ac7d96762f9341c105a39ed4e968fd33b3 Mon Sep 17 00:00:00 2001
From: Cade Ayres <ca469@kent.ac.uk>
Date: Wed, 11 Feb 2026 13:19:58 +0000
Subject: [PATCH 03/14] WIP: Added local mod list "filter" tag to only show
 concerning packages

---
 .../banner/VulnerablePackageBanner.vue        | 10 +++++++-
 .../VulnerablePackageComposable.ts            |  1 +
 src/components/views/LocalModList.vue         | 16 +++++++++++++
 .../LocalModList/LocalModDraggableList.vue    | 23 ++++++++++++++-----
 src/store/modules/ProfileModule.ts            | 13 ++++++++++-
 5 files changed, 55 insertions(+), 8 deletions(-)

diff --git a/src/components/banner/VulnerablePackageBanner.vue b/src/components/banner/VulnerablePackageBanner.vue
index 143d8738b..7fbc1fec8 100644
--- a/src/components/banner/VulnerablePackageBanner.vue
+++ b/src/components/banner/VulnerablePackageBanner.vue
@@ -1,10 +1,18 @@
 <script setup lang="ts">
 
+import { getStore } from '@r2/providers/generic/store/StoreProvider';
+import { State } from '@r2/store';
+
+const store = getStore<State>();
+
+function addUnlinkedFilter() {
+    store.commit('profile/scopeLocalModListToUnlinkedPackages');
+}
 </script>
 
 <template>
     <div class="notification is-concern margin-right">
-        <span>You have packages that can no longer be found on Thunderstore.</span> <a href="#">Click here to review packages.</a>
+        <span>You have packages that can no longer be found on Thunderstore.</span> <a href="#" @click.stop.prevent="addUnlinkedFilter">Click here to review packages.</a>
     </div>
 </template>
 
diff --git a/src/components/composables/VulnerablePackageComposable.ts b/src/components/composables/VulnerablePackageComposable.ts
index 72010a2f9..bcee977ec 100644
--- a/src/components/composables/VulnerablePackageComposable.ts
+++ b/src/components/composables/VulnerablePackageComposable.ts
@@ -16,6 +16,7 @@ const onlineModList = computed<Map<string, ThunderstoreMod>>(() => {
 });
 
 const vulnerablePackages = computed<ManifestV2[]>(() => {
+    // TODO - Fix logic (post dev testing)
     return localModList.value.filter(value => !value.isOnlineSource() && onlineModList.value.has(value.getName()));
 });
 
diff --git a/src/components/views/LocalModList.vue b/src/components/views/LocalModList.vue
index 3650a41a1..8a1925930 100644
--- a/src/components/views/LocalModList.vue
+++ b/src/components/views/LocalModList.vue
@@ -10,6 +10,17 @@
         <ManagerUpdateBanner/>
         <VulnerablePackageBanner v-if="hasVulnerablePackages"/>
 
+        <div class="tags has-addons" v-if="filters.size > 0">
+            <span class="margin-right" v-for="filter in filters">
+                <a href="#" @click="removeFilter(filter)">
+                    <div class="tag has-addons">
+                        <span>{{ filter }}</span>
+                    </div>
+                    <span class="tag is-delete">&nbsp;</span>
+                </a>
+            </span>
+        </div>
+
         <slot name="above-list"></slot>
 
         <div class="mod-list-content">
@@ -48,6 +59,11 @@ const { hasVulnerablePackages } = useVulnerablePackageComposable();
 const LocalModDraggableList = defineAsyncComponent(() => import('./LocalModList/LocalModDraggableList.vue'));
 
 const visibleModList = computed(() => store.getters['profile/visibleModList']);
+const filters = computed(() => store.state.profile.filters);
+
+function removeFilter(filter: string) {
+    store.commit('profile/removeFilter', filter);
+}
 </script>
 
 <style lang="scss" scoped>
diff --git a/src/components/views/LocalModList/LocalModDraggableList.vue b/src/components/views/LocalModList/LocalModDraggableList.vue
index 5539dfd3a..39d87ec42 100644
--- a/src/components/views/LocalModList/LocalModDraggableList.vue
+++ b/src/components/views/LocalModList/LocalModDraggableList.vue
@@ -8,7 +8,7 @@
                :scroll-sensitivity="100"
                item-key="id">
         <template #item="{element}">
-            <local-mod-card
+            <LocalModCard
                 :mod="element" />
         </template>
     </draggable>
@@ -22,19 +22,30 @@ import { State } from '../../../store';
 import ManifestV2 from '../../../model/ManifestV2';
 import R2Error from '../../../model/errors/R2Error';
 import { ImmutableProfile } from '../../../model/Profile';
-
+import { useVulnerablePackageComposable } from '@r2/components/composables/VulnerablePackageComposable';
 
 const store = getStore<State>();
 
+const { isVulnerablePackage } = useVulnerablePackageComposable();
+
 const profile = computed<ImmutableProfile>(() => store.getters['profile/activeProfile'].asImmutableProfile());
 
 // Hack to workaround draggable issue where the VueX update is slightly delayed, which causes a jumping effect.
 const internalVisibleList = ref<ManifestV2[]>([]);
 const visibleModList = computed(() => store.getters['profile/visibleModList']);
-watch(visibleModList, (newList) => internalVisibleList.value = newList);
-onMounted(() => {
-    internalVisibleList.value = store.getters['profile/visibleModList'];
-})
+
+function applyVisibleList() {
+    const newModList = visibleModList.value;
+    const modList = store.state.profile.modList;
+    if (store.state.profile.filters.has('Unlinked')) {
+        internalVisibleList.value = modList.filter(value => isVulnerablePackage(value));
+    } else {
+        internalVisibleList.value = newModList;
+    }
+}
+
+watch([visibleModList, store.state.profile.filters], applyVisibleList);
+onMounted(applyVisibleList);
 
 const draggableList = computed({
     get() {
diff --git a/src/store/modules/ProfileModule.ts b/src/store/modules/ProfileModule.ts
index 3ee0212d4..8fdcba012 100644
--- a/src/store/modules/ProfileModule.ts
+++ b/src/store/modules/ProfileModule.ts
@@ -31,6 +31,7 @@ interface State {
     disabledPosition?: SortLocalDisabledMods;
     searchQuery: string;
     dismissedUpdateAll: boolean;
+    filters: Set<'Unlinked'>;
 }
 
 /**
@@ -49,6 +50,7 @@ export default {
         disabledPosition: undefined,
         searchQuery: '',
         dismissedUpdateAll: false,
+        filters: new Set(),
     }),
 
     getters: <GetterTree<State, RootState>>{
@@ -124,7 +126,8 @@ export default {
             return state.order === SortNaming.CUSTOM
                 && state.direction === SortDirection.STANDARD
                 && state.disabledPosition === SortLocalDisabledMods.CUSTOM
-                && state.searchQuery.length === 0;
+                && state.searchQuery.length === 0
+                && !state.filters.has('Unlinked');
         },
     },
 
@@ -180,6 +183,14 @@ export default {
         setSearchQuery(state: State, value: string) {
             state.searchQuery = value.trim();
         },
+
+        scopeLocalModListToUnlinkedPackages(state: State) {
+            state.filters.add('Unlinked');
+        },
+
+        removeFilter(state: State, filter: string) {
+            state.filters.delete(filter as any);
+        }
     },
 
     actions: <ActionTree<State, RootState>>{

From d558598af2ddf1fd87ec2a204b40441599158c1a Mon Sep 17 00:00:00 2001
From: Cade Ayres <ca469@kent.ac.uk>
Date: Wed, 11 Feb 2026 15:47:38 +0000
Subject: [PATCH 04/14] WIP: Added trusted package support

TODO:
- Auto-clear filter tag when no more remaining unlinked packages
- Rename usages from Vulnerable to Concerning
---
 .../VulnerablePackageComposable.ts            |  2 +-
 .../modals/VulnerablePackageReviewModal.vue   | 24 +++++++++++++++++--
 src/components/views/LocalModList.vue         | 13 +++++-----
 src/model/ManifestV2.ts                       | 10 ++++++++
 4 files changed, 40 insertions(+), 9 deletions(-)

diff --git a/src/components/composables/VulnerablePackageComposable.ts b/src/components/composables/VulnerablePackageComposable.ts
index bcee977ec..9aedc2b7a 100644
--- a/src/components/composables/VulnerablePackageComposable.ts
+++ b/src/components/composables/VulnerablePackageComposable.ts
@@ -17,7 +17,7 @@ const onlineModList = computed<Map<string, ThunderstoreMod>>(() => {
 
 const vulnerablePackages = computed<ManifestV2[]>(() => {
     // TODO - Fix logic (post dev testing)
-    return localModList.value.filter(value => !value.isOnlineSource() && onlineModList.value.has(value.getName()));
+    return localModList.value.filter(value => !value.isOnlineSource() && !value.isTrustedPackage() && onlineModList.value.has(value.getName()));
 });
 
 export function useVulnerablePackageComposable() {
diff --git a/src/components/modals/VulnerablePackageReviewModal.vue b/src/components/modals/VulnerablePackageReviewModal.vue
index c277051a1..8c22201b9 100644
--- a/src/components/modals/VulnerablePackageReviewModal.vue
+++ b/src/components/modals/VulnerablePackageReviewModal.vue
@@ -5,6 +5,8 @@ import { State } from '@r2/store';
 import { getStore } from '@r2/providers/generic/store/StoreProvider';
 import ManifestV2 from '@r2/model/ManifestV2';
 import { useModManagementComposable } from 'components/composables/ModManagementComposable';
+import R2Error from '@r2/model/errors/R2Error';
+import ProfileModList from '@r2/r2mm/mods/ProfileModList';
 
 const store = getStore<State>();
 
@@ -12,6 +14,7 @@ const { uninstallMod } = useModManagementComposable();
 
 const isOpen = computed(() => store.state.modals.isVulnerableModReviewModalOpen);
 const modToReview = computed<ManifestV2 | null>(() => store.state.modals.vulnerableModToReview);
+const profile = computed(() => store.getters['profile/activeProfile']);
 
 function close() {
     store.commit('closeVulnerableModReviewModal');
@@ -21,6 +24,23 @@ async function removeMod() {
     await uninstallMod(modToReview.value!);
     close();
 }
+
+async function trustPackage() {
+    const mods = await ProfileModList.getModList(profile.value.asImmutableProfile());
+    const mod = mods.find(value => value.getName() === modToReview.value?.getName());
+    if (mod) {
+        mod.setTrustedPackage(true);
+    }
+    try {
+        await store.dispatch(
+            'profile/saveModListToDisk',
+            {mods: mods, profile: profile.value}
+        );
+    } catch (e) {
+        store.commit('error/handleError', R2Error.fromThrownValue(e));
+    }
+    await close();
+}
 </script>
 
 <template>
@@ -38,10 +58,10 @@ async function removeMod() {
             </div>
         </template>
         <template v-slot:footer>
-            <button class="button">
+            <button class="button" @click.stop.prevent="trustPackage">
                 Mark version as safe
             </button>
-            <button class="button is-danger" @click="removeMod">
+            <button class="button is-danger" @click.stop.prevent="removeMod">
                 Remove mod
             </button>
         </template>
diff --git a/src/components/views/LocalModList.vue b/src/components/views/LocalModList.vue
index 8a1925930..3c0511770 100644
--- a/src/components/views/LocalModList.vue
+++ b/src/components/views/LocalModList.vue
@@ -3,12 +3,6 @@
         <div class="search-and-sort">
             <SearchAndSort />
         </div>
-        <DisableModModal />
-        <UninstallModModal />
-        <AssociatedModsModal />
-
-        <ManagerUpdateBanner/>
-        <VulnerablePackageBanner v-if="hasVulnerablePackages"/>
 
         <div class="tags has-addons" v-if="filters.size > 0">
             <span class="margin-right" v-for="filter in filters">
@@ -21,6 +15,13 @@
             </span>
         </div>
 
+        <DisableModModal />
+        <UninstallModModal />
+        <AssociatedModsModal />
+
+        <ManagerUpdateBanner/>
+        <VulnerablePackageBanner v-if="hasVulnerablePackages"/>
+
         <slot name="above-list"></slot>
 
         <div class="mod-list-content">
diff --git a/src/model/ManifestV2.ts b/src/model/ManifestV2.ts
index 8723f1714..f0c804106 100644
--- a/src/model/ManifestV2.ts
+++ b/src/model/ManifestV2.ts
@@ -32,6 +32,7 @@ export default class ManifestV2 {
     private icon: string = '';
 
     private onlineSource: boolean = false;
+    private trustedPackage: boolean = false;
 
     // Intended to be used to import a mod with only minimal fields specified.
     // Should support manifest V1. Defaults to an "Unknown" author field if not found.
@@ -90,6 +91,7 @@ export default class ManifestV2 {
         this.icon = path.join(PathResolver.MOD_ROOT, 'cache', this.getName(), this.versionNumber.toString(), 'icon.png');
         this.setInstalledAtTime(jsManifestObject.installedAtTime || 0);
         this.setOnlineSource(jsManifestObject.onlineSource || false);
+        this.setTrustedPackage(jsManifestObject.trustedPackage || false);
         if (!jsManifestObject.enabled) {
             this.disable();
         }
@@ -256,4 +258,12 @@ export default class ManifestV2 {
     public setOnlineSource(isOnlineSource: boolean) {
         this.onlineSource = isOnlineSource;
     }
+
+    public isTrustedPackage(): boolean {
+        return this.trustedPackage;
+    }
+
+    public setTrustedPackage(trusted: boolean) {
+        this.trustedPackage = trusted;
+    }
 }

From 153c42d86e4bc23b66b7a1c4924e6347b1197407 Mon Sep 17 00:00:00 2001
From: Cade Ayres <ca469@kent.ac.uk>
Date: Thu, 12 Feb 2026 21:43:22 +0000
Subject: [PATCH 05/14] WIP: Tag auto-clears when all packages have been
 resolved

---
 src/components/banner/ManagerUpdateBanner.vue  |  6 ++++++
 .../banner/VulnerablePackageBanner.vue         |  4 ++++
 .../composables/VulnerablePackageComposable.ts |  3 +--
 .../modals/VulnerablePackageReviewModal.vue    | 18 +++++++++++++-----
 src/components/views/LocalModList.vue          | 18 +++++++++---------
 .../LocalModList/LocalModDraggableList.vue     |  6 ++++++
 src/store/index.ts                             |  2 +-
 7 files changed, 40 insertions(+), 17 deletions(-)

diff --git a/src/components/banner/ManagerUpdateBanner.vue b/src/components/banner/ManagerUpdateBanner.vue
index 5a1e64ccd..d6323e56f 100644
--- a/src/components/banner/ManagerUpdateBanner.vue
+++ b/src/components/banner/ManagerUpdateBanner.vue
@@ -42,3 +42,9 @@ onMounted(async () => {
         </p>
     </div>
 </template>
+
+<style scoped lang="scss">
+.notification {
+    margin-bottom: 0.5rem;
+}
+</style>
diff --git a/src/components/banner/VulnerablePackageBanner.vue b/src/components/banner/VulnerablePackageBanner.vue
index 7fbc1fec8..eaf2b8425 100644
--- a/src/components/banner/VulnerablePackageBanner.vue
+++ b/src/components/banner/VulnerablePackageBanner.vue
@@ -21,4 +21,8 @@ function addUnlinkedFilter() {
     background-color: var(--notification-concern-background-color);
     color: var(--notification-concern-text-color);
 }
+
+.notification {
+    margin-bottom: 0.5rem;
+}
 </style>
diff --git a/src/components/composables/VulnerablePackageComposable.ts b/src/components/composables/VulnerablePackageComposable.ts
index 9aedc2b7a..fd4c05475 100644
--- a/src/components/composables/VulnerablePackageComposable.ts
+++ b/src/components/composables/VulnerablePackageComposable.ts
@@ -16,8 +16,7 @@ const onlineModList = computed<Map<string, ThunderstoreMod>>(() => {
 });
 
 const vulnerablePackages = computed<ManifestV2[]>(() => {
-    // TODO - Fix logic (post dev testing)
-    return localModList.value.filter(value => !value.isOnlineSource() && !value.isTrustedPackage() && onlineModList.value.has(value.getName()));
+    return localModList.value.filter(value => !value.isTrustedPackage() && (value.isOnlineSource() && !onlineModList.value.has(value.getName())));
 });
 
 export function useVulnerablePackageComposable() {
diff --git a/src/components/modals/VulnerablePackageReviewModal.vue b/src/components/modals/VulnerablePackageReviewModal.vue
index 8c22201b9..243b1f5aa 100644
--- a/src/components/modals/VulnerablePackageReviewModal.vue
+++ b/src/components/modals/VulnerablePackageReviewModal.vue
@@ -27,19 +27,27 @@ async function removeMod() {
 
 async function trustPackage() {
     const mods = await ProfileModList.getModList(profile.value.asImmutableProfile());
+    if (mods instanceof R2Error) {
+        console.error(mods);
+        store.commit('error/handleError', mods);
+        return;
+    }
     const mod = mods.find(value => value.getName() === modToReview.value?.getName());
     if (mod) {
         mod.setTrustedPackage(true);
     }
     try {
-        await store.dispatch(
-            'profile/saveModListToDisk',
-            {mods: mods, profile: profile.value}
-        );
+        const err = await ProfileModList.saveModList(profile.value.asImmutableProfile(), mods);
+        if (err instanceof R2Error) {
+            store.commit('error/handleError', err);
+            return;
+        }
+        await store.dispatch('profile/updateModList', mods);
     } catch (e) {
         store.commit('error/handleError', R2Error.fromThrownValue(e));
+    } finally {
+        close();
     }
-    await close();
 }
 </script>
 
diff --git a/src/components/views/LocalModList.vue b/src/components/views/LocalModList.vue
index 3c0511770..7c3434acf 100644
--- a/src/components/views/LocalModList.vue
+++ b/src/components/views/LocalModList.vue
@@ -4,6 +4,15 @@
             <SearchAndSort />
         </div>
 
+        <DisableModModal />
+        <UninstallModModal />
+        <AssociatedModsModal />
+
+        <ManagerUpdateBanner/>
+        <VulnerablePackageBanner v-if="hasVulnerablePackages"/>
+
+        <slot name="above-list"></slot>
+
         <div class="tags has-addons" v-if="filters.size > 0">
             <span class="margin-right" v-for="filter in filters">
                 <a href="#" @click="removeFilter(filter)">
@@ -15,15 +24,6 @@
             </span>
         </div>
 
-        <DisableModModal />
-        <UninstallModModal />
-        <AssociatedModsModal />
-
-        <ManagerUpdateBanner/>
-        <VulnerablePackageBanner v-if="hasVulnerablePackages"/>
-
-        <slot name="above-list"></slot>
-
         <div class="mod-list-content">
             <div class="draggable-content">
                 <Suspense>
diff --git a/src/components/views/LocalModList/LocalModDraggableList.vue b/src/components/views/LocalModList/LocalModDraggableList.vue
index 39d87ec42..cea87d2ba 100644
--- a/src/components/views/LocalModList/LocalModDraggableList.vue
+++ b/src/components/views/LocalModList/LocalModDraggableList.vue
@@ -47,6 +47,12 @@ function applyVisibleList() {
 watch([visibleModList, store.state.profile.filters], applyVisibleList);
 onMounted(applyVisibleList);
 
+watch(internalVisibleList, (newList) => {
+    if (newList.length === 0) {
+        store.commit('profile/removeFilter', 'Unlinked');
+    }
+})
+
 const draggableList = computed({
     get() {
         return internalVisibleList.value;
diff --git a/src/store/index.ts b/src/store/index.ts
index 6bea43128..f580f6cb8 100644
--- a/src/store/index.ts
+++ b/src/store/index.ts
@@ -140,7 +140,7 @@ export const store = {
 
     // enable strict mode (adds overhead!)
     // for dev mode only
-    strict: import.meta.env.MODE === 'development',
+    strict: import.meta.env.MODE === 'development1',
 };
 
 /*

From 1c42ef0f11ebeb8eed0291f78885f10a08692c1a Mon Sep 17 00:00:00 2001
From: Cade Ayres <ca469@kent.ac.uk>
Date: Fri, 13 Feb 2026 10:01:59 +0000
Subject: [PATCH 06/14] Renamed to "Concerning..."

---
 ...eBanner.vue => ConcerningPackageBanner.vue} |  4 +++-
 ...sable.ts => ConcerningPackageComposable.ts} | 16 ++++++++--------
 ...al.vue => ConcerningPackageReviewModal.vue} |  8 ++++----
 src/components/views/LocalModList.vue          |  7 ++-----
 .../views/LocalModList/LocalModCard.vue        | 14 +++++++-------
 .../LocalModList/LocalModDraggableList.vue     |  6 +++---
 src/pages/Manager.vue                          |  4 ++--
 src/store/modules/ModalsModule.ts              | 18 +++++++++---------
 8 files changed, 38 insertions(+), 39 deletions(-)
 rename src/components/banner/{VulnerablePackageBanner.vue => ConcerningPackageBanner.vue} (72%)
 rename src/components/composables/{VulnerablePackageComposable.ts => ConcerningPackageComposable.ts} (69%)
 rename src/components/modals/{VulnerablePackageReviewModal.vue => ConcerningPackageReviewModal.vue} (92%)

diff --git a/src/components/banner/VulnerablePackageBanner.vue b/src/components/banner/ConcerningPackageBanner.vue
similarity index 72%
rename from src/components/banner/VulnerablePackageBanner.vue
rename to src/components/banner/ConcerningPackageBanner.vue
index eaf2b8425..614a4e8c3 100644
--- a/src/components/banner/VulnerablePackageBanner.vue
+++ b/src/components/banner/ConcerningPackageBanner.vue
@@ -2,8 +2,10 @@
 
 import { getStore } from '@r2/providers/generic/store/StoreProvider';
 import { State } from '@r2/store';
+import { useConcerningPackageComposable } from '@r2/components/composables/ConcerningPackageComposable';
 
 const store = getStore<State>();
+const { hasConcerningPackages } = useConcerningPackageComposable();
 
 function addUnlinkedFilter() {
     store.commit('profile/scopeLocalModListToUnlinkedPackages');
@@ -11,7 +13,7 @@ function addUnlinkedFilter() {
 </script>
 
 <template>
-    <div class="notification is-concern margin-right">
+    <div class="notification is-concern margin-right" v-show="hasConcerningPackages">
         <span>You have packages that can no longer be found on Thunderstore.</span> <a href="#" @click.stop.prevent="addUnlinkedFilter">Click here to review packages.</a>
     </div>
 </template>
diff --git a/src/components/composables/VulnerablePackageComposable.ts b/src/components/composables/ConcerningPackageComposable.ts
similarity index 69%
rename from src/components/composables/VulnerablePackageComposable.ts
rename to src/components/composables/ConcerningPackageComposable.ts
index fd4c05475..b2f4ca76a 100644
--- a/src/components/composables/VulnerablePackageComposable.ts
+++ b/src/components/composables/ConcerningPackageComposable.ts
@@ -15,21 +15,21 @@ const onlineModList = computed<Map<string, ThunderstoreMod>>(() => {
     return new Map<string, ThunderstoreMod>(mods.map(value => [value.getFullName(), value]));
 });
 
-const vulnerablePackages = computed<ManifestV2[]>(() => {
+const concerningPackages = computed<ManifestV2[]>(() => {
     return localModList.value.filter(value => !value.isTrustedPackage() && (value.isOnlineSource() && !onlineModList.value.has(value.getName())));
 });
 
-export function useVulnerablePackageComposable() {
+export function useConcerningPackageComposable() {
 
-    const hasVulnerablePackages = computed<boolean>(() => vulnerablePackages.value.length > 0);
+    const hasConcerningPackages = computed<boolean>(() => concerningPackages.value.length > 0);
 
-    function isVulnerablePackage(mod: ManifestV2) {
-        return vulnerablePackages.value.findIndex(value => value.getName() === mod.getName()) >= 0;
+    function isConcerningPackage(mod: ManifestV2) {
+        return concerningPackages.value.findIndex(value => value.getName() === mod.getName()) >= 0;
     }
 
     return {
-        vulnerablePackages,
-        hasVulnerablePackages,
-        isVulnerablePackage
+        concerningPackages,
+        hasConcerningPackages,
+        isConcerningPackage
     }
 }
diff --git a/src/components/modals/VulnerablePackageReviewModal.vue b/src/components/modals/ConcerningPackageReviewModal.vue
similarity index 92%
rename from src/components/modals/VulnerablePackageReviewModal.vue
rename to src/components/modals/ConcerningPackageReviewModal.vue
index 243b1f5aa..e2dcdd7a8 100644
--- a/src/components/modals/VulnerablePackageReviewModal.vue
+++ b/src/components/modals/ConcerningPackageReviewModal.vue
@@ -4,7 +4,7 @@ import ModalCard from '@r2/components/ModalCard.vue';
 import { State } from '@r2/store';
 import { getStore } from '@r2/providers/generic/store/StoreProvider';
 import ManifestV2 from '@r2/model/ManifestV2';
-import { useModManagementComposable } from 'components/composables/ModManagementComposable';
+import { useModManagementComposable } from '@r2/components/composables/ModManagementComposable';
 import R2Error from '@r2/model/errors/R2Error';
 import ProfileModList from '@r2/r2mm/mods/ProfileModList';
 
@@ -12,12 +12,12 @@ const store = getStore<State>();
 
 const { uninstallMod } = useModManagementComposable();
 
-const isOpen = computed(() => store.state.modals.isVulnerableModReviewModalOpen);
-const modToReview = computed<ManifestV2 | null>(() => store.state.modals.vulnerableModToReview);
+const isOpen = computed(() => store.state.modals.isConcerningModReviewModalOpen);
+const modToReview = computed<ManifestV2 | null>(() => store.state.modals.concerningModToReview);
 const profile = computed(() => store.getters['profile/activeProfile']);
 
 function close() {
-    store.commit('closeVulnerableModReviewModal');
+    store.commit('closeConcerningModReviewModal');
 }
 
 async function removeMod() {
diff --git a/src/components/views/LocalModList.vue b/src/components/views/LocalModList.vue
index 7c3434acf..e50a3c0df 100644
--- a/src/components/views/LocalModList.vue
+++ b/src/components/views/LocalModList.vue
@@ -9,7 +9,7 @@
         <AssociatedModsModal />
 
         <ManagerUpdateBanner/>
-        <VulnerablePackageBanner v-if="hasVulnerablePackages"/>
+        <ConcerningPackageBanner/>
 
         <slot name="above-list"></slot>
 
@@ -50,13 +50,10 @@ import { State } from '../../store';
 import { computed, defineAsyncComponent } from 'vue';
 import SkeletonLocalModCard from './LocalModList/SkeletonLocalModCard.vue';
 import ManagerUpdateBanner from '../banner/ManagerUpdateBanner.vue';
-import VulnerablePackageBanner from '@r2/components/banner/VulnerablePackageBanner.vue';
-import { useVulnerablePackageComposable } from '@r2/components/composables/VulnerablePackageComposable';
+import ConcerningPackageBanner from '@r2/components/banner/ConcerningPackageBanner.vue';
 
 const store = getStore<State>();
 
-const { hasVulnerablePackages } = useVulnerablePackageComposable();
-
 const LocalModDraggableList = defineAsyncComponent(() => import('./LocalModList/LocalModDraggableList.vue'));
 
 const visibleModList = computed(() => store.getters['profile/visibleModList']);
diff --git a/src/components/views/LocalModList/LocalModCard.vue b/src/components/views/LocalModList/LocalModCard.vue
index da0cf872c..30066c95b 100644
--- a/src/components/views/LocalModList/LocalModCard.vue
+++ b/src/components/views/LocalModList/LocalModCard.vue
@@ -12,7 +12,7 @@ import { splitToNameAndVersion } from '../../../utils/DependencyUtils';
 import { computed, onMounted, ref, watch } from 'vue';
 import { getStore } from '../../../providers/generic/store/StoreProvider';
 import { State } from '../../../store';
-import { useVulnerablePackageComposable } from '@r2/components/composables/VulnerablePackageComposable';
+import { useConcerningPackageComposable } from '@r2/components/composables/ConcerningPackageComposable';
 import { useModManagementComposable } from '@r2/components/composables/ModManagementComposable';
 
 const store = getStore<State>();
@@ -23,7 +23,7 @@ type LocalModCardProps = {
 
 const props = defineProps<LocalModCardProps>();
 
-const { isVulnerablePackage } = useVulnerablePackageComposable();
+const { isConcerningPackage } = useConcerningPackageComposable();
 const { uninstallMod } = useModManagementComposable();
 
 const disabledDependencies = ref<ManifestV2[]>([]);
@@ -165,7 +165,7 @@ function dependencyStringToModName(x: string) {
 }
 
 function openReviewModal() {
-    store.commit('openVulnerableModReviewModal', props.mod);
+    store.commit('openConcerningModReviewModal', props.mod);
 }
 </script>
 
@@ -176,7 +176,7 @@ function openReviewModal() {
         :id="`${mod.getAuthorName()}-${mod.getName()}-${mod.getVersionNumber()}`"
         :image="mod.getIcon()"
         :allowSorting="true"
-        :class="[{'card--is-concern': isVulnerablePackage(props.mod)}]"
+        :class="[{'card--is-concern': isConcerningPackage(props.mod)}]"
     >
 
         <template v-slot:title>
@@ -207,11 +207,11 @@ function openReviewModal() {
 
         <template v-slot:description>
             <p class='card-timestamp' v-if="mod.getInstalledAtTime() !== 0"><strong>Installed on:</strong> {{ getReadableDate(mod.getInstalledAtTime()) }}</p>
-            <div class="notification is-warning" v-if="isVulnerablePackage(props.mod)">
+            <div class="notification is-warning" v-if="isConcerningPackage(props.mod)">
                 <p>This package was originally downloaded from Thunderstore however can no longer be found.</p>
                 <p>Mods can be removed due to the author's request or due to violating Thunderstore's package policies.</p>
                 <p><strong>It is recommended to remove this mod.</strong></p>
-                <button v-if="isVulnerablePackage(props.mod)" class="button" @click.stop.prevent="openReviewModal">
+                <button v-if="isConcerningPackage(props.mod)" class="button" @click.stop.prevent="openReviewModal">
                     Review package
                 </button>
             </div>
@@ -219,7 +219,7 @@ function openReviewModal() {
 
         <!-- Show icon button row even when card is collapsed -->
         <template v-slot:other-icons>
-            <span v-if="isVulnerablePackage(props.mod)"
+            <span v-if="isConcerningPackage(props.mod)"
                   class='card-header-icon'>
                 <i v-tooltip.left="`This package can no longer be found on Thunderstore`"
                    class='fas fa-unlink'
diff --git a/src/components/views/LocalModList/LocalModDraggableList.vue b/src/components/views/LocalModList/LocalModDraggableList.vue
index cea87d2ba..ed823c957 100644
--- a/src/components/views/LocalModList/LocalModDraggableList.vue
+++ b/src/components/views/LocalModList/LocalModDraggableList.vue
@@ -22,11 +22,11 @@ import { State } from '../../../store';
 import ManifestV2 from '../../../model/ManifestV2';
 import R2Error from '../../../model/errors/R2Error';
 import { ImmutableProfile } from '../../../model/Profile';
-import { useVulnerablePackageComposable } from '@r2/components/composables/VulnerablePackageComposable';
+import { useConcerningPackageComposable } from '@r2/components/composables/ConcerningPackageComposable';
 
 const store = getStore<State>();
 
-const { isVulnerablePackage } = useVulnerablePackageComposable();
+const { isConcerningPackage } = useConcerningPackageComposable();
 
 const profile = computed<ImmutableProfile>(() => store.getters['profile/activeProfile'].asImmutableProfile());
 
@@ -38,7 +38,7 @@ function applyVisibleList() {
     const newModList = visibleModList.value;
     const modList = store.state.profile.modList;
     if (store.state.profile.filters.has('Unlinked')) {
-        internalVisibleList.value = modList.filter(value => isVulnerablePackage(value));
+        internalVisibleList.value = modList.filter(value => isConcerningPackage(value));
     } else {
         internalVisibleList.value = newModList;
     }
diff --git a/src/pages/Manager.vue b/src/pages/Manager.vue
index 0084bb4a2..a07746b6f 100644
--- a/src/pages/Manager.vue
+++ b/src/pages/Manager.vue
@@ -119,7 +119,7 @@
         <DownloadProgressModal />
         <DownloadModVersionSelectModal />
         <UpdateAllInstalledModsModal />
-        <VulnerablePackageReviewModal/>
+        <ConcerningPackageReviewModal/>
         <LaunchTypeModal v-if="canRenderLaunchTypeModal()" />
 
         <div class="router-view">
@@ -159,7 +159,7 @@ import LaunchTypeModal from "../components/modals/launch-type/LaunchTypeModal.vu
 import appWindow from '../providers/node/app/app_window';
 import GameInstructionParser from "../r2mm/launching/instructions/GameInstructionParser";
 import ManagerActivityBar from '../components/navigation/ManagerActivityBar.vue';
-import VulnerablePackageReviewModal from 'components/modals/VulnerablePackageReviewModal.vue';
+import ConcerningPackageReviewModal from 'components/modals/ConcerningPackageReviewModal.vue';
 
 const store = getStore<State>();
 const router = useRouter();
diff --git a/src/store/modules/ModalsModule.ts b/src/store/modules/ModalsModule.ts
index 802e5daed..ce558d37a 100644
--- a/src/store/modules/ModalsModule.ts
+++ b/src/store/modules/ModalsModule.ts
@@ -21,8 +21,8 @@ interface State {
     uninstallModModalMod: ManifestV2 | null;
     isProfileCodeExportModalOpen: boolean;
     isLocalFileImportModalOpen: boolean;
-    vulnerableModToReview: ManifestV2 | null;
-    isVulnerableModReviewModalOpen: boolean;
+    concerningModToReview: ManifestV2 | null;
+    isConcerningModReviewModalOpen: boolean;
 }
 
 export default {
@@ -46,8 +46,8 @@ export default {
         uninstallModModalMod: null,
         isProfileCodeExportModalOpen: false,
         isLocalFileImportModalOpen: false,
-        vulnerableModToReview: null,
-        isVulnerableModReviewModalOpen: false,
+        concerningModToReview: null,
+        isConcerningModReviewModalOpen: false,
     }),
 
     mutations: {
@@ -115,8 +115,8 @@ export default {
             state.isLocalFileImportModalOpen = false;
         },
 
-        closeVulnerableModReviewModal: function(state: State): void {
-            state.isVulnerableModReviewModalOpen = false;
+        closeConcerningModReviewModal: function(state: State): void {
+            state.isConcerningModReviewModalOpen = false;
         },
 
         openAssociatedModsModal: function(state: State, mod: ManifestV2): void {
@@ -183,9 +183,9 @@ export default {
             state.isLocalFileImportModalOpen = true;
         },
 
-        openVulnerableModReviewModal: function(state: State, mod: ManifestV2): void {
-            state.vulnerableModToReview = mod;
-            state.isVulnerableModReviewModalOpen = true;
+        openConcerningModReviewModal: function(state: State, mod: ManifestV2): void {
+            state.concerningModToReview = mod;
+            state.isConcerningModReviewModalOpen = true;
         },
     }
 }

From 7af3abcdd8cd125a06eb82c1dcd09a77f06c9157 Mon Sep 17 00:00:00 2001
From: Cade Ayres <ca469@kent.ac.uk>
Date: Mon, 16 Feb 2026 15:21:12 +0000
Subject: [PATCH 07/14] Fixed import path in Manager.vue

---
 src/pages/Manager.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/pages/Manager.vue b/src/pages/Manager.vue
index a07746b6f..66d80c819 100644
--- a/src/pages/Manager.vue
+++ b/src/pages/Manager.vue
@@ -159,7 +159,7 @@ import LaunchTypeModal from "../components/modals/launch-type/LaunchTypeModal.vu
 import appWindow from '../providers/node/app/app_window';
 import GameInstructionParser from "../r2mm/launching/instructions/GameInstructionParser";
 import ManagerActivityBar from '../components/navigation/ManagerActivityBar.vue';
-import ConcerningPackageReviewModal from 'components/modals/ConcerningPackageReviewModal.vue';
+import ConcerningPackageReviewModal from '@r2/components/modals/ConcerningPackageReviewModal.vue';
 
 const store = getStore<State>();
 const router = useRouter();

From ab407e92ea8e281f50e01af4a7e21b6a0cbfa597 Mon Sep 17 00:00:00 2001
From: Cade Ayres <ca469@kent.ac.uk>
Date: Mon, 16 Feb 2026 15:59:26 +0000
Subject: [PATCH 08/14] Removed unnecessary padding

---
 src/components/views/LocalModList.vue  |   1 -
 src/components/views/OnlineModView.vue | 589 ++++++++++++-------------
 2 files changed, 294 insertions(+), 296 deletions(-)

diff --git a/src/components/views/LocalModList.vue b/src/components/views/LocalModList.vue
index e50a3c0df..c40c61821 100644
--- a/src/components/views/LocalModList.vue
+++ b/src/components/views/LocalModList.vue
@@ -73,7 +73,6 @@ function removeFilter(filter: string) {
     .mod-list-content {
         flex: 1;
         overflow-y: auto;
-        padding-right: 1rem;
     }
 }
 </style>
diff --git a/src/components/views/OnlineModView.vue b/src/components/views/OnlineModView.vue
index 75be3a3fe..6fdb5cdd0 100644
--- a/src/components/views/OnlineModView.vue
+++ b/src/components/views/OnlineModView.vue
@@ -1,295 +1,294 @@
-<template>
-    <div class="split-pane" :class="[{'split-pane--with-active-second-pane': previewMod !== null}]">
-        <div id="online-view">
-            <div id="controls">
-                <div class="inherit-background-colour non-selectable">
-                    <div class="is-shadowless is-square">
-                        <div class="no-padding-left card-header-title">
-                            <div class="input-group input-group--flex margin-right">
-                                <label for="thunderstore-search-filter">Search</label>
-                                <DeferredInput
-                                    :modelValue="thunderstoreSearchFilter"
-                                    @update:modelValue="$event => (thunderstoreSearchFilter = $event)"
-                                    id="thunderstore-search-filter"
-                                    class="input"
-                                    type="text"
-                                    placeholder="Search"
-                                    autocomplete="off"
-                                />
-                            </div>
-                            <div class="input-group">
-                                <div class="input-group input-group--flex">
-                                    <label for="thunderstore-category-filter">&nbsp;</label>
-                                    <button
-                                        id="thunderstore-category-filter"
-                                        class="button"
-                                        @click="store.commit('openOnlineSortModal')"
-                                    >
-                                        Sort
-                                    </button>
-                                </div>
-                            </div>
-                            &nbsp;
-                            <div class="input-group">
-                                <div class="input-group input-group--flex">
-                                    <label for="thunderstore-category-filter">&nbsp;</label>
-                                    <button
-                                        id="thunderstore-category-filter"
-                                        class="button"
-                                        @click="store.commit('openCategoryFilterModal')"
-                                    >
-                                        Filter
-                                    </button>
-                                </div>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-            <div id="view-content">
-                <ModListUpdateBanner />
-                <OnlineModList
-                    :local-mod-list="localModList"
-                    :paged-mod-list="pagedThunderstoreModList"
-                    :selected-mod="previewMod"
-                    @selected-mod="toggleModPreview"
-                    :read-only="false"
-                />
-                <div class="in-mod-list" v-if="getPaginationSize() > 1">
-                    <p class="notification margin-right">
-                        Use the numbers below to change page
-                    </p>
-                </div>
-                <div class="in-mod-list" v-else-if="getPaginationSize() === 0">
-                    <p class="notification margin-right">
-                        {{thunderstoreModList.length ? "No mods matching search found": "No mods available"}}
-                    </p>
-                </div>
-            </div>
-            <div id="pagination">
-                <PaginationButtons
-                    :current-page="pageNumber"
-                    :page-count="getPaginationSize()"
-                    :context-size="3"
-                    :on-click="updatePageNumber"
-                />
-            </div>
-        </div>
-        <div id="mod-preview">
-            <template v-if="previewMod !== null">
-                <OnlinePreviewPanel :mod="previewMod" @close="() => previewMod = null"/>
-            </template>
-        </div>
-    </div>
-</template>
-
-<script lang="ts" setup>
-import SortingDirection from '../../model/enums/SortingDirection';
-import SortingStyle from '../../model/enums/SortingStyle';
-import ManifestV2 from '../../model/ManifestV2';
-import ThunderstoreMod from '../../model/ThunderstoreMod';
-import OnlineModListProvider from '../../providers/components/loaders/OnlineModListProvider';
-import SearchUtils from '../../utils/SearchUtils';
-import PaginationButtons from "../navigation/PaginationButtons.vue";
-import { DeferredInput } from "../all";
-import ModListUpdateBanner from "../ModListUpdateBanner.vue";
-import OnlinePreviewPanel from '../v2/OnlinePreviewPanel.vue';
-import { getStore } from '../../providers/generic/store/StoreProvider';
-import { State } from '../../store';
-import { computed, ref, watch, onMounted, defineAsyncComponent } from 'vue';
-
-const store = getStore<State>();
-
-const PAGE_SIZE = 40;
-
-const pagedThunderstoreModList = ref<ThunderstoreMod[]>([]);
-const pageNumber = ref<number>(1);
-const searchableThunderstoreModList = ref<ThunderstoreMod[]>([]);
-const sortedThunderstoreModList = ref<ThunderstoreMod[]>([]);
-const thunderstoreSearchFilter = ref<string>("");
-const previewMod = ref<ThunderstoreMod | null>(null);
-
-const OnlineModList = defineAsyncComponent(() => OnlineModListProvider.provider());
-
-const localModList = computed<ManifestV2[]>(() => store.state.profile.modList);
-const thunderstoreModList = computed<ThunderstoreMod[]>(() => store.state.tsMods.mods);
-
-function getPaginationSize() {
-    return Math.ceil(searchableThunderstoreModList.value.length / PAGE_SIZE);
-}
-
-function changePage() {
-    pagedThunderstoreModList.value = searchableThunderstoreModList.value.slice(
-        (pageNumber.value - 1) * PAGE_SIZE,
-        pageNumber.value * PAGE_SIZE
-    );
-}
-
-watch(pageNumber, changePage);
-
-function filterThunderstoreModList() {
-    const allowNsfw = store.state.modFilters.allowNsfw;
-    const filterCategoriesToCompareOne = store.state.modFilters.selectedCategoriesCompareOne;
-    const filterCategoriesToCompareAll = store.state.modFilters.selectedCategoriesCompareAll;
-    const filterCategoriesToExclude = store.state.modFilters.selectedCategoriesToExclude;
-    const showDeprecatedPackages = store.state.modFilters.showDeprecatedPackages;
-
-    let searchableList = sortedThunderstoreModList.value;
-    const searchKeys = SearchUtils.makeKeys(thunderstoreSearchFilter.value);
-    if (searchKeys.length > 0) {
-        searchableList = sortedThunderstoreModList.value.filter((x: ThunderstoreMod) => {
-            return SearchUtils.isSearched(searchKeys, x.getFullName(), x.getDescription())
-        });
-    }
-    if (!allowNsfw) {
-        searchableList = searchableList.filter(mod => !mod.getNsfwFlag());
-    }
-    if (!showDeprecatedPackages) {
-        searchableList = searchableList.filter(
-            mod => !store.state.tsMods.deprecated.get(mod.getFullName())
-        );
-    }
-
-    // Category filters
-    if (filterCategoriesToExclude.length > 0) {
-        searchableList = searchableList.filter((x: ThunderstoreMod) =>
-            !filterCategoriesToExclude.some((category: string) => x.getCategories().includes(category)))
-    }
-    if (filterCategoriesToCompareOne.length > 0) {
-        searchableList = searchableList.filter((x: ThunderstoreMod) =>
-            filterCategoriesToCompareOne.some((category: string) => x.getCategories().includes(category)))
-    }
-    if (filterCategoriesToCompareAll.length > 0) {
-        searchableList = searchableList.filter((x: ThunderstoreMod) =>
-            filterCategoriesToCompareAll.every((category: string) => x.getCategories().includes(category)))
-    }
-
-    searchableThunderstoreModList.value = [...searchableList];
-
-    // Update results
-    changePage();
-}
-
-function sortThunderstoreModList() {
-    const sortDescending = store.state.modFilters.sortDirection == SortingDirection.STANDARD;
-    const sortedList = [...thunderstoreModList.value];
-    sortedList.sort((a: ThunderstoreMod, b: ThunderstoreMod) => {
-        let result: boolean;
-        switch (store.state.modFilters.sortBehaviour) {
-            case SortingStyle.LAST_UPDATED:
-                result = a.getDateUpdated() < b.getDateUpdated();
-                break;
-            case SortingStyle.ALPHABETICAL:
-                result = a.getName().localeCompare(b.getName()) > 0;
-                break;
-            case SortingStyle.DOWNLOADS:
-                result = a.getDownloadCount() < b.getDownloadCount();
-                break;
-            case SortingStyle.RATING:
-                result = a.getRating() < b.getRating();
-                break;
-            case SortingStyle.DEFAULT:
-                result = true;
-                break;
-            default:
-                result = true;
-                break;
-        }
-        const sortOrder = result ? 1 : -1;
-        return sortDescending ? sortOrder : -sortOrder;
-    });
-    sortedThunderstoreModList.value = sortedList;
-    filterThunderstoreModList();
-}
-
-watch(thunderstoreSearchFilter, () => {
-    pageNumber.value = 1;
-    filterThunderstoreModList();
-});
-
-watch(() => [
-    store.state.modFilters.allowNsfw,
-    store.state.modFilters.selectedCategoriesCompareOne,
-    store.state.modFilters.selectedCategoriesCompareAll,
-    store.state.modFilters.selectedCategoriesToExclude,
-    store.state.modFilters.showDeprecatedPackages,
-], () => {
-    filterThunderstoreModList();
-});
-
-watch(() => [
-    store.state.modFilters.sortDirection,
-    store.state.modFilters.sortBehaviour,
-    thunderstoreModList.value,
-], () => {
-    sortThunderstoreModList();
-})
-
-function updatePageNumber(page: number) {
-    pageNumber.value = page;
-    window.scrollTo({
-        top: 0,
-        left: 0,
-        behavior: "auto"
-    });
-}
-
-function toggleModPreview(mod: ThunderstoreMod) {
-    console.log("Toggled mod preview")
-    if (previewMod.value === mod) {
-        previewMod.value = null;
-    } else {
-        previewMod.value = mod;
-    }
-}
-
-onMounted(() => {
-    sortThunderstoreModList();
-});
-</script>
-
-<style lang="scss" scoped>
-#online-view {
-    flex: 1;
-    display: flex;
-    flex-direction: column;
-    width: 100%;
-    height: 100%;
-    overflow-x: hidden;
-
-    #controls {
-        flex: 0;
-    }
-
-    #pagination {
-        flex: 0;
-    }
-
-    #view-content {
-        flex-grow: 1;
-        overflow-y: auto;
-        padding-right: 1rem;
-        height: 100%;
-    }
-}
-
-#mod-preview {
-    flex: 0;
-    display: none;
-}
-
-.split-pane {
-    display: flex;
-    overflow-y: hidden;
-    max-height: 100%;
-    width: 100%;
-    flex: 1;
-
-    &--with-active-second-pane {
-        #mod-preview {
-            display: flex;
-            flex: 0;
-        }
-    }
-}
-</style>
+<template>
+    <div class="split-pane" :class="[{'split-pane--with-active-second-pane': previewMod !== null}]">
+        <div id="online-view">
+            <div id="controls">
+                <div class="inherit-background-colour non-selectable">
+                    <div class="is-shadowless is-square">
+                        <div class="no-padding-left card-header-title">
+                            <div class="input-group input-group--flex margin-right">
+                                <label for="thunderstore-search-filter">Search</label>
+                                <DeferredInput
+                                    :modelValue="thunderstoreSearchFilter"
+                                    @update:modelValue="$event => (thunderstoreSearchFilter = $event)"
+                                    id="thunderstore-search-filter"
+                                    class="input"
+                                    type="text"
+                                    placeholder="Search"
+                                    autocomplete="off"
+                                />
+                            </div>
+                            <div class="input-group">
+                                <div class="input-group input-group--flex">
+                                    <label for="thunderstore-category-filter">&nbsp;</label>
+                                    <button
+                                        id="thunderstore-category-filter"
+                                        class="button"
+                                        @click="store.commit('openOnlineSortModal')"
+                                    >
+                                        Sort
+                                    </button>
+                                </div>
+                            </div>
+                            &nbsp;
+                            <div class="input-group">
+                                <div class="input-group input-group--flex">
+                                    <label for="thunderstore-category-filter">&nbsp;</label>
+                                    <button
+                                        id="thunderstore-category-filter"
+                                        class="button"
+                                        @click="store.commit('openCategoryFilterModal')"
+                                    >
+                                        Filter
+                                    </button>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div id="view-content">
+                <ModListUpdateBanner />
+                <OnlineModList
+                    :local-mod-list="localModList"
+                    :paged-mod-list="pagedThunderstoreModList"
+                    :selected-mod="previewMod"
+                    @selected-mod="toggleModPreview"
+                    :read-only="false"
+                />
+                <div class="in-mod-list" v-if="getPaginationSize() > 1">
+                    <p class="notification margin-right">
+                        Use the numbers below to change page
+                    </p>
+                </div>
+                <div class="in-mod-list" v-else-if="getPaginationSize() === 0">
+                    <p class="notification margin-right">
+                        {{thunderstoreModList.length ? "No mods matching search found": "No mods available"}}
+                    </p>
+                </div>
+            </div>
+            <div id="pagination">
+                <PaginationButtons
+                    :current-page="pageNumber"
+                    :page-count="getPaginationSize()"
+                    :context-size="3"
+                    :on-click="updatePageNumber"
+                />
+            </div>
+        </div>
+        <div id="mod-preview">
+            <template v-if="previewMod !== null">
+                <OnlinePreviewPanel :mod="previewMod" @close="() => previewMod = null"/>
+            </template>
+        </div>
+    </div>
+</template>
+
+<script lang="ts" setup>
+import SortingDirection from '../../model/enums/SortingDirection';
+import SortingStyle from '../../model/enums/SortingStyle';
+import ManifestV2 from '../../model/ManifestV2';
+import ThunderstoreMod from '../../model/ThunderstoreMod';
+import OnlineModListProvider from '../../providers/components/loaders/OnlineModListProvider';
+import SearchUtils from '../../utils/SearchUtils';
+import PaginationButtons from "../navigation/PaginationButtons.vue";
+import { DeferredInput } from "../all";
+import ModListUpdateBanner from "../ModListUpdateBanner.vue";
+import OnlinePreviewPanel from '../v2/OnlinePreviewPanel.vue';
+import { getStore } from '../../providers/generic/store/StoreProvider';
+import { State } from '../../store';
+import { computed, ref, watch, onMounted, defineAsyncComponent } from 'vue';
+
+const store = getStore<State>();
+
+const PAGE_SIZE = 40;
+
+const pagedThunderstoreModList = ref<ThunderstoreMod[]>([]);
+const pageNumber = ref<number>(1);
+const searchableThunderstoreModList = ref<ThunderstoreMod[]>([]);
+const sortedThunderstoreModList = ref<ThunderstoreMod[]>([]);
+const thunderstoreSearchFilter = ref<string>("");
+const previewMod = ref<ThunderstoreMod | null>(null);
+
+const OnlineModList = defineAsyncComponent(() => OnlineModListProvider.provider());
+
+const localModList = computed<ManifestV2[]>(() => store.state.profile.modList);
+const thunderstoreModList = computed<ThunderstoreMod[]>(() => store.state.tsMods.mods);
+
+function getPaginationSize() {
+    return Math.ceil(searchableThunderstoreModList.value.length / PAGE_SIZE);
+}
+
+function changePage() {
+    pagedThunderstoreModList.value = searchableThunderstoreModList.value.slice(
+        (pageNumber.value - 1) * PAGE_SIZE,
+        pageNumber.value * PAGE_SIZE
+    );
+}
+
+watch(pageNumber, changePage);
+
+function filterThunderstoreModList() {
+    const allowNsfw = store.state.modFilters.allowNsfw;
+    const filterCategoriesToCompareOne = store.state.modFilters.selectedCategoriesCompareOne;
+    const filterCategoriesToCompareAll = store.state.modFilters.selectedCategoriesCompareAll;
+    const filterCategoriesToExclude = store.state.modFilters.selectedCategoriesToExclude;
+    const showDeprecatedPackages = store.state.modFilters.showDeprecatedPackages;
+
+    let searchableList = sortedThunderstoreModList.value;
+    const searchKeys = SearchUtils.makeKeys(thunderstoreSearchFilter.value);
+    if (searchKeys.length > 0) {
+        searchableList = sortedThunderstoreModList.value.filter((x: ThunderstoreMod) => {
+            return SearchUtils.isSearched(searchKeys, x.getFullName(), x.getDescription())
+        });
+    }
+    if (!allowNsfw) {
+        searchableList = searchableList.filter(mod => !mod.getNsfwFlag());
+    }
+    if (!showDeprecatedPackages) {
+        searchableList = searchableList.filter(
+            mod => !store.state.tsMods.deprecated.get(mod.getFullName())
+        );
+    }
+
+    // Category filters
+    if (filterCategoriesToExclude.length > 0) {
+        searchableList = searchableList.filter((x: ThunderstoreMod) =>
+            !filterCategoriesToExclude.some((category: string) => x.getCategories().includes(category)))
+    }
+    if (filterCategoriesToCompareOne.length > 0) {
+        searchableList = searchableList.filter((x: ThunderstoreMod) =>
+            filterCategoriesToCompareOne.some((category: string) => x.getCategories().includes(category)))
+    }
+    if (filterCategoriesToCompareAll.length > 0) {
+        searchableList = searchableList.filter((x: ThunderstoreMod) =>
+            filterCategoriesToCompareAll.every((category: string) => x.getCategories().includes(category)))
+    }
+
+    searchableThunderstoreModList.value = [...searchableList];
+
+    // Update results
+    changePage();
+}
+
+function sortThunderstoreModList() {
+    const sortDescending = store.state.modFilters.sortDirection == SortingDirection.STANDARD;
+    const sortedList = [...thunderstoreModList.value];
+    sortedList.sort((a: ThunderstoreMod, b: ThunderstoreMod) => {
+        let result: boolean;
+        switch (store.state.modFilters.sortBehaviour) {
+            case SortingStyle.LAST_UPDATED:
+                result = a.getDateUpdated() < b.getDateUpdated();
+                break;
+            case SortingStyle.ALPHABETICAL:
+                result = a.getName().localeCompare(b.getName()) > 0;
+                break;
+            case SortingStyle.DOWNLOADS:
+                result = a.getDownloadCount() < b.getDownloadCount();
+                break;
+            case SortingStyle.RATING:
+                result = a.getRating() < b.getRating();
+                break;
+            case SortingStyle.DEFAULT:
+                result = true;
+                break;
+            default:
+                result = true;
+                break;
+        }
+        const sortOrder = result ? 1 : -1;
+        return sortDescending ? sortOrder : -sortOrder;
+    });
+    sortedThunderstoreModList.value = sortedList;
+    filterThunderstoreModList();
+}
+
+watch(thunderstoreSearchFilter, () => {
+    pageNumber.value = 1;
+    filterThunderstoreModList();
+});
+
+watch(() => [
+    store.state.modFilters.allowNsfw,
+    store.state.modFilters.selectedCategoriesCompareOne,
+    store.state.modFilters.selectedCategoriesCompareAll,
+    store.state.modFilters.selectedCategoriesToExclude,
+    store.state.modFilters.showDeprecatedPackages,
+], () => {
+    filterThunderstoreModList();
+});
+
+watch(() => [
+    store.state.modFilters.sortDirection,
+    store.state.modFilters.sortBehaviour,
+    thunderstoreModList.value,
+], () => {
+    sortThunderstoreModList();
+})
+
+function updatePageNumber(page: number) {
+    pageNumber.value = page;
+    window.scrollTo({
+        top: 0,
+        left: 0,
+        behavior: "auto"
+    });
+}
+
+function toggleModPreview(mod: ThunderstoreMod) {
+    console.log("Toggled mod preview")
+    if (previewMod.value === mod) {
+        previewMod.value = null;
+    } else {
+        previewMod.value = mod;
+    }
+}
+
+onMounted(() => {
+    sortThunderstoreModList();
+});
+</script>
+
+<style lang="scss" scoped>
+#online-view {
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+    width: 100%;
+    height: 100%;
+    overflow-x: hidden;
+
+    #controls {
+        flex: 0;
+    }
+
+    #pagination {
+        flex: 0;
+    }
+
+    #view-content {
+        flex-grow: 1;
+        overflow-y: auto;
+        height: 100%;
+    }
+}
+
+#mod-preview {
+    flex: 0;
+    display: none;
+}
+
+.split-pane {
+    display: flex;
+    overflow-y: hidden;
+    max-height: 100%;
+    width: 100%;
+    flex: 1;
+
+    &--with-active-second-pane {
+        #mod-preview {
+            display: flex;
+            flex: 0;
+        }
+    }
+}
+</style>

From 0fd0baa0329e0166804c50a38932fb317b9da0da Mon Sep 17 00:00:00 2001
From: cade <cade.ayres@riskidev.fi>
Date: Wed, 6 May 2026 13:59:20 +0800
Subject: [PATCH 09/14] Wording fixes

---
 src/components/banner/ConcerningPackageBanner.vue      | 2 +-
 src/components/modals/ConcerningPackageReviewModal.vue | 6 +++---
 src/components/views/LocalModList/LocalModCard.vue     | 7 +++----
 3 files changed, 7 insertions(+), 8 deletions(-)

diff --git a/src/components/banner/ConcerningPackageBanner.vue b/src/components/banner/ConcerningPackageBanner.vue
index 614a4e8c3..f543c017c 100644
--- a/src/components/banner/ConcerningPackageBanner.vue
+++ b/src/components/banner/ConcerningPackageBanner.vue
@@ -14,7 +14,7 @@ function addUnlinkedFilter() {
 
 <template>
     <div class="notification is-concern margin-right" v-show="hasConcerningPackages">
-        <span>You have packages that can no longer be found on Thunderstore.</span> <a href="#" @click.stop.prevent="addUnlinkedFilter">Click here to review packages.</a>
+        <span>You have mods that can no longer be found on Thunderstore.</span> <a href="#" @click.stop.prevent="addUnlinkedFilter">Click here to review packages.</a>
     </div>
 </template>
 
diff --git a/src/components/modals/ConcerningPackageReviewModal.vue b/src/components/modals/ConcerningPackageReviewModal.vue
index e2dcdd7a8..7e7092d0e 100644
--- a/src/components/modals/ConcerningPackageReviewModal.vue
+++ b/src/components/modals/ConcerningPackageReviewModal.vue
@@ -60,9 +60,9 @@ async function trustPackage() {
             <p class="notification is-warning">It is generally recommended to remove mods that have been removed from Thunderstore.</p>
             <div>
                 <hr/>
-                <p class="margin-bottom">This mod was originally downloaded using the Online section however no longer appears in the package cache.</p>
-                <p class="margin-bottom">When a mod is no longer in the package cache, it means that it has been removed from Thunderstore.</p>
-                <p>Other people will be unable to import this mod if the profile is exported.</p>
+                <p class="margin-bottom">This mod was originally downloaded from Thunderstore, but can no longer be found on the site.</p>
+                <p class="margin-bottom">Mods may be removed at the author's request, for rule violations, or while undergoing verification by moderators.</p>
+                <p>Other people will be unable to import this mod from exported profiles.</p>
             </div>
         </template>
         <template v-slot:footer>
diff --git a/src/components/views/LocalModList/LocalModCard.vue b/src/components/views/LocalModList/LocalModCard.vue
index 30066c95b..16ee63922 100644
--- a/src/components/views/LocalModList/LocalModCard.vue
+++ b/src/components/views/LocalModList/LocalModCard.vue
@@ -208,11 +208,10 @@ function openReviewModal() {
         <template v-slot:description>
             <p class='card-timestamp' v-if="mod.getInstalledAtTime() !== 0"><strong>Installed on:</strong> {{ getReadableDate(mod.getInstalledAtTime()) }}</p>
             <div class="notification is-warning" v-if="isConcerningPackage(props.mod)">
-                <p>This package was originally downloaded from Thunderstore however can no longer be found.</p>
-                <p>Mods can be removed due to the author's request or due to violating Thunderstore's package policies.</p>
-                <p><strong>It is recommended to remove this mod.</strong></p>
+                <p>This mod was originally downloaded from Thunderstore, but can no longer be found on the site.</p>
+                <p><strong>It is recommended that you remove this mod.</strong></p>
                 <button v-if="isConcerningPackage(props.mod)" class="button" @click.stop.prevent="openReviewModal">
-                    Review package
+                    Review mod
                 </button>
             </div>
         </template>

From 05d4672dea0988f979e1282c98f7fa6d05247563 Mon Sep 17 00:00:00 2001
From: cade <cade.ayres@riskidev.fi>
Date: Wed, 6 May 2026 14:49:38 +0800
Subject: [PATCH 10/14] Added unlinked icon to trusted packages

---
 .../ConcerningPackageComposable.ts            | 21 +++++++++++++------
 .../views/LocalModList/LocalModCard.vue       |  4 ++--
 2 files changed, 17 insertions(+), 8 deletions(-)

diff --git a/src/components/composables/ConcerningPackageComposable.ts b/src/components/composables/ConcerningPackageComposable.ts
index b2f4ca76a..e72efa86a 100644
--- a/src/components/composables/ConcerningPackageComposable.ts
+++ b/src/components/composables/ConcerningPackageComposable.ts
@@ -15,21 +15,30 @@ const onlineModList = computed<Map<string, ThunderstoreMod>>(() => {
     return new Map<string, ThunderstoreMod>(mods.map(value => [value.getFullName(), value]));
 });
 
-const concerningPackages = computed<ManifestV2[]>(() => {
-    return localModList.value.filter(value => !value.isTrustedPackage() && (value.isOnlineSource() && !onlineModList.value.has(value.getName())));
+const allConcerningPackages = computed<ManifestV2[]>(() => {
+    return localModList.value.filter(value => (value.isOnlineSource() && !onlineModList.value.has(value.getName())));
+});
+
+const activeConcerningPackages = computed<ManifestV2[]>(() => {
+    return allConcerningPackages.value.filter(value => !value.isTrustedPackage() && (value.isOnlineSource() && !onlineModList.value.has(value.getName())));
 });
 
 export function useConcerningPackageComposable() {
 
-    const hasConcerningPackages = computed<boolean>(() => concerningPackages.value.length > 0);
+    const hasConcerningPackages = computed<boolean>(() => activeConcerningPackages.value.length > 0);
 
     function isConcerningPackage(mod: ManifestV2) {
-        return concerningPackages.value.findIndex(value => value.getName() === mod.getName()) >= 0;
+        return activeConcerningPackages.value.findIndex(value => value.getName() === mod.getName()) >= 0;
+    }
+
+    function wasConcerningPackage(mod: ManifestV2) {
+        return allConcerningPackages.value.findIndex(value => value.getName() === mod.getName()) >= 0;
     }
 
     return {
-        concerningPackages,
+        concerningPackages: activeConcerningPackages,
         hasConcerningPackages,
-        isConcerningPackage
+        isConcerningPackage,
+        wasConcerningPackage,
     }
 }
diff --git a/src/components/views/LocalModList/LocalModCard.vue b/src/components/views/LocalModList/LocalModCard.vue
index 16ee63922..cdc9ca796 100644
--- a/src/components/views/LocalModList/LocalModCard.vue
+++ b/src/components/views/LocalModList/LocalModCard.vue
@@ -23,7 +23,7 @@ type LocalModCardProps = {
 
 const props = defineProps<LocalModCardProps>();
 
-const { isConcerningPackage } = useConcerningPackageComposable();
+const { isConcerningPackage, wasConcerningPackage } = useConcerningPackageComposable();
 const { uninstallMod } = useModManagementComposable();
 
 const disabledDependencies = ref<ManifestV2[]>([]);
@@ -218,7 +218,7 @@ function openReviewModal() {
 
         <!-- Show icon button row even when card is collapsed -->
         <template v-slot:other-icons>
-            <span v-if="isConcerningPackage(props.mod)"
+            <span v-if="wasConcerningPackage(props.mod)"
                   class='card-header-icon'>
                 <i v-tooltip.left="`This package can no longer be found on Thunderstore`"
                    class='fas fa-unlink'

From e96364a2be6b447324512195a1992fffdfae9629 Mon Sep 17 00:00:00 2001
From: cade <cade.ayres@riskidev.fi>
Date: Fri, 8 May 2026 11:37:28 +0800
Subject: [PATCH 11/14] WIP: Correctly show unlinked versions.

- Slow
---
 .../ConcerningPackageComposable.ts            | 58 ++++++++++++++++---
 1 file changed, 50 insertions(+), 8 deletions(-)

diff --git a/src/components/composables/ConcerningPackageComposable.ts b/src/components/composables/ConcerningPackageComposable.ts
index e72efa86a..6755a9ba1 100644
--- a/src/components/composables/ConcerningPackageComposable.ts
+++ b/src/components/composables/ConcerningPackageComposable.ts
@@ -3,28 +3,70 @@
  * We do not need to recalculate on a per-usage basis.
  */
 import { getStore } from '@r2/providers/generic/store/StoreProvider';
-import { computed, ref, watch } from 'vue';
+import { computed, onMounted, ref, watch } from 'vue';
 import ManifestV2 from '@r2/model/ManifestV2';
 import ThunderstoreMod from '@r2/model/ThunderstoreMod';
+import VersionNumber from '@r2/model/VersionNumber';
+import * as PackageDb from "@r2/r2mm/manager/PackageDexieStore";
+
+type ConcerningPackage = {
+    fullName: string;
+    latestVersion: string;
+}
 
 const store = getStore<any>();
 
+const activeGame = computed(() => store.state.activeGame);
+
 const localModList = computed<ManifestV2[]>(() => store.state.profile.modList);
-const onlineModList = computed<Map<string, ThunderstoreMod>>(() => {
+const onlineModList = computed<Map<string, ConcerningPackage>>(() => {
     const mods: ThunderstoreMod[] = store.state.tsMods.mods;
-    return new Map<string, ThunderstoreMod>(mods.map(value => [value.getFullName(), value]));
+    return new Map<string, ConcerningPackage>(mods.map(value => [value.getFullName(), {
+        fullName: value.getFullName(),
+        latestVersion: value.getLatestVersion(),
+    }]));
 });
 
-const allConcerningPackages = computed<ManifestV2[]>(() => {
-    return localModList.value.filter(value => (value.isOnlineSource() && !onlineModList.value.has(value.getName())));
-});
+const allConcerningPackages = ref<ManifestV2[]>([]);
+const activeConcerningPackages = ref<ManifestV2[]>([]);
+
+async function updateConcerningPackages() {
+    const game = activeGame.value;
+    const localMods = localModList.value;
+    const concerningPackages = [];
 
-const activeConcerningPackages = computed<ManifestV2[]>(() => {
-    return allConcerningPackages.value.filter(value => !value.isTrustedPackage() && (value.isOnlineSource() && !onlineModList.value.has(value.getName())));
+    for (const mod of localMods) {
+        if (!mod.isOnlineSource()) {
+            continue;
+        }
+        if (!onlineModList.value.has(mod.getName())) {
+            concerningPackages.push(mod);
+            continue;
+        }
+        const packageVersionNumbers = await PackageDb.getPackageVersionNumbers(
+            game.internalFolderName,
+            mod.getName()
+        );
+        const dnf = !packageVersionNumbers.find(ver => ver === mod.getVersionNumber().toString());
+        if (dnf) {
+            concerningPackages.push(mod);
+        }
+    }
+
+    allConcerningPackages.value = concerningPackages;
+    activeConcerningPackages.value = concerningPackages.filter(value => !value.isTrustedPackage());
+}
+
+watch([activeGame, localModList], async () => {
+    await updateConcerningPackages();
 });
 
 export function useConcerningPackageComposable() {
 
+    onMounted(async () => {
+        await updateConcerningPackages();
+    });
+
     const hasConcerningPackages = computed<boolean>(() => activeConcerningPackages.value.length > 0);
 
     function isConcerningPackage(mod: ManifestV2) {

From 69ef97cf7b71e4de297218484e4279a3d492db44 Mon Sep 17 00:00:00 2001
From: cade <cade.ayres@riskidev.fi>
Date: Fri, 8 May 2026 12:12:15 +0800
Subject: [PATCH 12/14] Added package versions batching to speed up performance

---
 .../ConcerningPackageComposable.ts            | 21 ++++++++++++-------
 src/r2mm/manager/PackageDexieStore.ts         |  6 ++++++
 2 files changed, 20 insertions(+), 7 deletions(-)

diff --git a/src/components/composables/ConcerningPackageComposable.ts b/src/components/composables/ConcerningPackageComposable.ts
index 6755a9ba1..b241dedaf 100644
--- a/src/components/composables/ConcerningPackageComposable.ts
+++ b/src/components/composables/ConcerningPackageComposable.ts
@@ -33,7 +33,8 @@ const activeConcerningPackages = ref<ManifestV2[]>([]);
 async function updateConcerningPackages() {
     const game = activeGame.value;
     const localMods = localModList.value;
-    const concerningPackages = [];
+    const concerningPackages: ManifestV2[] = [];
+    const modsToCheck: ManifestV2[] = [];
 
     for (const mod of localMods) {
         if (!mod.isOnlineSource()) {
@@ -41,13 +42,19 @@ async function updateConcerningPackages() {
         }
         if (!onlineModList.value.has(mod.getName())) {
             concerningPackages.push(mod);
-            continue;
+        } else {
+            modsToCheck.push(mod);
         }
-        const packageVersionNumbers = await PackageDb.getPackageVersionNumbers(
-            game.internalFolderName,
-            mod.getName()
-        );
-        const dnf = !packageVersionNumbers.find(ver => ver === mod.getVersionNumber().toString());
+    }
+
+    const versionNumbersBatch = await PackageDb.getPackageVersionNumbersBatch(
+        game.internalFolderName,
+        modsToCheck.map(mod => mod.getName())
+    );
+
+    for (const mod of modsToCheck) {
+        const versions = versionNumbersBatch.get(mod.getName());
+        const dnf = !versions || !versions.includes(mod.getVersionNumber().toString());
         if (dnf) {
             concerningPackages.push(mod);
         }
diff --git a/src/r2mm/manager/PackageDexieStore.ts b/src/r2mm/manager/PackageDexieStore.ts
index bd1f8ef11..ba35856d5 100644
--- a/src/r2mm/manager/PackageDexieStore.ts
+++ b/src/r2mm/manager/PackageDexieStore.ts
@@ -54,6 +54,12 @@ export async function getPackageVersionNumbers(community: string, packageName: s
     return pkg.versions.map((v) => v.version_number);
 }
 
+export async function getPackageVersionNumbersBatch(community: string, packageNames: string[]): Promise<Map<string, string[]>> {
+    const keys = packageNames.map((p): [string, string] => [community, p]);
+    const packages = await db.packages.where('[community+full_name]').anyOf(keys).toArray();
+    return new Map(packages.map(pkg => [pkg.full_name, pkg.versions.map(v => v.version_number)]));
+}
+
 export async function getPackageCount(community: string) {
     return await db.packages.where({community}).count();
 }

From a6033d39d79d83ed4dfb11b63de4907451e1e19f Mon Sep 17 00:00:00 2001
From: cade <cade.ayres@riskidev.fi>
Date: Wed, 13 May 2026 18:44:21 +0800
Subject: [PATCH 13/14] Fixed bug causing review action to be hidden

---
 src/components/ExpandableCard.vue                  | 2 +-
 src/components/views/LocalModList/LocalModCard.vue | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/ExpandableCard.vue b/src/components/ExpandableCard.vue
index 700b75eea..3a699b4e0 100644
--- a/src/components/ExpandableCard.vue
+++ b/src/components/ExpandableCard.vue
@@ -26,7 +26,7 @@
                         </a>
                     </header>
                 </div>
-                <div class='mod-card-content' v-show='visible' v-if="description !== ''">
+                <div class='mod-card-content' v-show='visible' v-if="description !== '' || $slots.description">
                     <div class='content'>
                         <p ref="description">{{description}}</p>
                         <slot name='description'></slot>
diff --git a/src/components/views/LocalModList/LocalModCard.vue b/src/components/views/LocalModList/LocalModCard.vue
index cdc9ca796..6c2f925a7 100644
--- a/src/components/views/LocalModList/LocalModCard.vue
+++ b/src/components/views/LocalModList/LocalModCard.vue
@@ -210,7 +210,7 @@ function openReviewModal() {
             <div class="notification is-warning" v-if="isConcerningPackage(props.mod)">
                 <p>This mod was originally downloaded from Thunderstore, but can no longer be found on the site.</p>
                 <p><strong>It is recommended that you remove this mod.</strong></p>
-                <button v-if="isConcerningPackage(props.mod)" class="button" @click.stop.prevent="openReviewModal">
+                <button class="button" @click.stop.prevent="openReviewModal">
                     Review mod
                 </button>
             </div>

From 826bcbf2c3a7473432dcb2ed123095425f39192f Mon Sep 17 00:00:00 2001
From: cade <cade.ayres@riskidev.fi>
Date: Wed, 13 May 2026 19:25:22 +0800
Subject: [PATCH 14/14] Fixed warning notification text colour

---
 src/css/v2/components/_notification.scss | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/src/css/v2/components/_notification.scss b/src/css/v2/components/_notification.scss
index 6b47dc74f..490e91959 100644
--- a/src/css/v2/components/_notification.scss
+++ b/src/css/v2/components/_notification.scss
@@ -4,3 +4,7 @@
     position: relative;
     padding: 1.25rem 2.5rem 1.25rem 1.5rem;
 }
+
+.notification.is-warning {
+    color: var(--v2-warning-text-color, #f5f5f5);;
+}