Filters instances shown for mods

Author: blarfoon

apps/desktop/packages/mainWindow/src/components/ModDownloadButton/hooks/useInstanceSearch.ts

@@ -2,7 +2,11 @@ import { createSignal, createMemo, createEffect } from "solid-js"
 import { useGlobalStore } from "@/components/GlobalStoreContext"
 import { getInstanceImageUrl } from "@/utils/instances"
 
-export const useInstanceSearch = () => {
+interface UseInstanceSearchOptions {
+  addonType?: string
+}
+
+export const useInstanceSearch = (options?: UseInstanceSearchOptions) => {
   const [searchQuery, setSearchQuery] = createSignal("")
   const [debouncedQuery, setDebouncedQuery] = createSignal("")
   const [hoveredInstanceId, setHoveredInstanceId] = createSignal<number | null>(
@@ -38,6 +42,14 @@ export const useInstanceSearch = () => {
             : null
         }
       })
+      .filter((instance) => {
+        // For mods, only show instances with modloaders
+        if (options?.addonType === "mod") {
+          return instance.modloader !== "vanilla"
+        }
+        // For all other addon types, show all instances
+        return true
+      })
   })
 
   const filteredInstances = createMemo(() => {

apps/desktop/packages/mainWindow/src/components/ModDownloadButton/index.tsx

@@ -38,7 +38,7 @@ const ModDownloadButton = (props: ModDownloadButtonProps) => {
     setHoveredInstanceId,
     filteredInstances,
     shouldVirtualize
-  } = useInstanceSearch()
+  } = useInstanceSearch({ addonType: props.addon?.type })
 
   const { loading, setLoading, progress, setProgress } = useTaskProgress(
     instanceTaskIds,

apps/desktop/packages/mainWindow/src/pages/Library/Instance/Tabs/Addons/components/AddonFilters.tsx

@@ -25,6 +25,7 @@ interface AddonFiltersProps {
   onOpenFolder: () => void
   onUpdateAll: () => void
   updateCount: () => number
+  hasModloaders: () => boolean
 }
 
 export const AddonFilters = (props: AddonFiltersProps) => {
@@ -34,6 +35,15 @@ export const AddonFilters = (props: AddonFiltersProps) => {
     return t(`instance.tabs.${type}`)
   }
 
+  const visibleAddonTypes = () => {
+    return ADDON_TYPES.filter((type) => {
+      if (type === "mods" && !props.hasModloaders()) {
+        return false
+      }
+      return true
+    })
+  }
+
   return (
     <div class="bg-darkSlate-800 border-darkSlate-700 sticky top-14 z-20 border-b px-6 py-4">
       <div class="flex flex-col gap-4">
@@ -102,7 +112,7 @@ export const AddonFilters = (props: AddonFiltersProps) => {
             <span class="text-lightSlate-600 text-sm">
               {t("instance.addon_types")}:
             </span>
-            <For each={ADDON_TYPES}>
+            <For each={visibleAddonTypes()}>
               {(type) => (
                 <Badge
                   variant={

apps/desktop/packages/mainWindow/src/pages/Library/Instance/Tabs/Addons/index.tsx

@@ -30,6 +30,9 @@ const Addons = () => {
   const isInstanceLocked = () =>
     !!routeData.instanceDetails.data?.modpack?.locked
 
+  const hasModloaders = () =>
+    (routeData.instanceDetails.data?.modloaders?.length || 0) > 0
+
   // Get selected rows reactively using row selection state
   const selectedRows = createMemo(() => {
     const rowSelectionState = addonData.rowSelection()
@@ -91,6 +94,7 @@ const Addons = () => {
           addonMutations.handleUpdateAll(addonData.filteredAddons())
         }
         updateCount={updateCount}
+        hasModloaders={hasModloaders}
       />
 
       {/* Loading state */}