feat: allow filtering of k-space kills (#147)

assets/js/hooks/Mapper/components/mapInterface/widgets/SystemKills/SystemKills.tsx

@@ -6,6 +6,7 @@ import { KillsHeader } from './components/SystemKillsHeader';
 import { useKillsWidgetSettings } from './hooks/useKillsWidgetSettings';
 import { useSystemKills } from './hooks/useSystemKills';
 import { KillsSettingsDialog } from './components/SystemKillsSettingsDialog';
+import { isWormholeSpace } from '@/hooks/Mapper/components/map/helpers/isWormholeSpace';
 
 export const SystemKills: React.FC = () => {
   const {
@@ -37,10 +38,26 @@ export const SystemKills: React.FC = () => {
   const isNothingSelected = !systemId && !visible;
   const showLoading = isLoading && kills.length === 0;
 
+  const filteredKills = useMemo(() => {
+    if (!settings.whOnly) return kills;
+    return kills.filter(kill => {
+      const system = systems.find(sys => sys.system_static_info.solar_system_id === kill.solar_system_id);
+      if (!system) {
+        console.warn(`System with id ${kill.solar_system_id} not found.`);
+        return false;
+      }
+      return isWormholeSpace(system.system_static_info.system_class);
+    });
+  }, [kills, settings.whOnly, systems]);
+
   return (
     <div className="h-full flex flex-col min-h-0">
       <div className="flex flex-col flex-1 min-h-0">
-        <Widget label={<KillsHeader systemId={systemId} onOpenSettings={() => setSettingsDialogVisible(true)} />}>
+        <Widget
+          label={
+            <KillsHeader systemId={systemId} onOpenSettings={() => setSettingsDialogVisible(true)} />
+          }
+        >
           {!isSubscriptionActive && (
             <div className="w-full h-full flex justify-center items-center select-none text-center text-stone-400/80 text-sm">
               Kills available with &#39;Active&#39; map subscription only (contact map administrators)
@@ -66,17 +83,20 @@ export const SystemKills: React.FC = () => {
                 </div>
               )}
 
-              {!isNothingSelected && !showLoading && !error && (!kills || kills.length === 0) && (
-                <div className="w-full h-full flex justify-center items-center select-none text-center text-stone-400/80 text-sm">
-                  No kills found
-                </div>
-              )}
+              {!isNothingSelected &&
+                !showLoading &&
+                !error &&
+                (!filteredKills || filteredKills.length === 0) && (
+                  <div className="w-full h-full flex justify-center items-center select-none text-center text-stone-400/80 text-sm">
+                    No kills found
+                  </div>
+                )}
 
               {!isNothingSelected && !showLoading && !error && (
                 <div className="flex-1 flex flex-col overflow-y-auto">
                   <SystemKillsContent
                     key={settings.compact ? 'compact' : 'normal'}
-                    kills={kills}
+                    kills={filteredKills}
                     systemNameMap={systemNameMap}
                     compact={settings.compact}
                     onlyOneSystem={!visible}

assets/js/hooks/Mapper/components/mapInterface/widgets/SystemKills/SystemKillsContent/SystemKillsContent.tsx

@@ -28,7 +28,7 @@ export const SystemKillsContent: React.FC<SystemKillsContentProps> = ({
     <div
       className={clsx(
         'flex flex-col w-full text-stone-200 text-xs transition-all duration-300',
-        compact ? 'p-1' : 'p-1',
+        compact ? 'p-1' : 'p-1'
       )}
     >
       {sortedKills.map(kill => {

assets/js/hooks/Mapper/components/mapInterface/widgets/SystemKills/components/SystemKillsSettingsDialog.tsx

@@ -19,6 +19,7 @@ export const KillsSettingsDialog: React.FC<KillsSettingsDialogProps> = ({ visibl
   const localRef = useRef({
     compact: globalSettings.compact,
     showAll: globalSettings.showAll,
+    whOnly: globalSettings.whOnly,
     excludedSystems: globalSettings.excludedSystems || [],
   });
 
@@ -31,6 +32,7 @@ export const KillsSettingsDialog: React.FC<KillsSettingsDialogProps> = ({ visibl
       localRef.current = {
         compact: globalSettings.compact,
         showAll: globalSettings.showAll,
+        whOnly: globalSettings.whOnly,
         excludedSystems: globalSettings.excludedSystems || [],
       };
       forceRender(n => n + 1);
@@ -45,6 +47,14 @@ export const KillsSettingsDialog: React.FC<KillsSettingsDialogProps> = ({ visibl
     forceRender(n => n + 1);
   }, []);
 
+  const handleWHChange = useCallback((checked: boolean) => {
+    localRef.current = {
+      ...localRef.current,
+      whOnly: checked,
+    };
+    forceRender(n => n + 1);
+  }, []);
+
   const handleRemoveSystem = useCallback((sysId: number) => {
     localRef.current = {
       ...localRef.current,
@@ -94,6 +104,18 @@ export const KillsSettingsDialog: React.FC<KillsSettingsDialogProps> = ({ visibl
           </label>
         </div>
 
+        <div className="flex items-center gap-2">
+          <input
+            type="checkbox"
+            id="kills-wormhole-only-mode"
+            checked={localData.whOnly}
+            onChange={e => handleWHChange(e.target.checked)}
+          />
+          <label htmlFor="kills-wh-only-mode" className="cursor-pointer">
+            Only show wormhole kills
+          </label>
+        </div>
+
         <div className="flex flex-col gap-1">
           <div className="flex items-center justify-between">
             <label className="text-sm text-stone-400">Excluded Systems</label>
@@ -106,7 +128,7 @@ export const KillsSettingsDialog: React.FC<KillsSettingsDialogProps> = ({ visibl
           {excluded.length === 0 && <div className="text-stone-500 text-xs italic">No systems excluded.</div>}
           {excluded.map(sysId => (
             <div key={sysId} className="flex items-center justify-between border-b border-stone-600 py-1 px-1 text-xs">
-              <SystemView systemId={sysId.toString()} hideRegion compact />
+              <SystemView systemId={sysId.toString()} hideRegion compact/>
 
               <WdImgButton
                 className={PrimeIcons.TRASH}
@@ -117,13 +139,11 @@ export const KillsSettingsDialog: React.FC<KillsSettingsDialogProps> = ({ visibl
           ))}
         </div>
 
-        {/* Apply + Close button row */}
         <div className="flex gap-2 justify-end mt-4">
           <Button onClick={handleApply} label="Apply" outlined size="small" />
         </div>
       </div>
 
-      {/* AddSystemDialog for picking new systems to exclude */}
       <AddSystemDialog
         title="Add system to kills exclude list"
         visible={addSystemDialogVisible}

assets/js/hooks/Mapper/components/mapInterface/widgets/SystemKills/hooks/useKillsWidgetSettings.ts

@@ -4,6 +4,7 @@ import useLocalStorageState from 'use-local-storage-state';
 export interface KillsWidgetSettings {
   compact: boolean;
   showAll: boolean;
+  whOnly: boolean;
   excludedSystems: number[];
   version: number;
 }
@@ -11,6 +12,7 @@ export interface KillsWidgetSettings {
 export const DEFAULT_KILLS_WIDGET_SETTINGS: KillsWidgetSettings = {
   compact: true,
   showAll: false,
+  whOnly: true,
   excludedSystems: [],
   version: 0,
 };