From 0fa035601f55fffafe9f839f40ea1d529c83f198 Mon Sep 17 00:00:00 2001 From: PhatPhuckDave Date: Mon, 16 Jun 2025 16:36:04 +0200 Subject: [PATCH] Fix the icon meta disaster --- src/components/SignatureCategories.tsx | 47 ++------ src/components/SignatureListItem.tsx | 14 ++- ...tegories.ts => useSignatureCategories.tsx} | 108 ++++++++++++------ 3 files changed, 89 insertions(+), 80 deletions(-) rename src/hooks/{useSignatureCategories.ts => useSignatureCategories.tsx} (55%) diff --git a/src/components/SignatureCategories.tsx b/src/components/SignatureCategories.tsx index 5ee18ce..bd2dfb6 100644 --- a/src/components/SignatureCategories.tsx +++ b/src/components/SignatureCategories.tsx @@ -2,7 +2,7 @@ import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"; import { Badge } from "@/components/ui/badge"; import { Collapsible, CollapsibleContent, CollapsibleTrigger } from "@/components/ui/collapsible"; -import { ChevronDown, ChevronRight, Zap, Shield, Coins, HelpCircle, Pickaxe, Fuel, Gauge } from "lucide-react"; +import { ChevronDown, ChevronRight } from "lucide-react"; import { SignatureListItem } from "@/components/SignatureListItem"; import { SignatureCategory } from "@/hooks/useSignatureCategories"; @@ -11,41 +11,8 @@ interface SignatureCategoriesProps { onToggleCategory: (categoryId: string) => void; } -export const getCategoryIcon = (categoryId: string) => { - switch (categoryId) { - case 'combat': - return ; - case 'data_relic': - return ; - case 'gas': - return ; - case 'ore': - return ; - case 'wormhole': - return ; - default: - return ; - } -}; - -export const getCategoryColor = (categoryId: string) => { - switch (categoryId) { - case 'combat': - return 'text-red-400 border-red-600'; - case 'data_relic': - return 'text-blue-400 border-blue-600'; - case 'gas': - return 'text-green-400 border-green-600'; - case 'ore': - return 'text-yellow-400 border-yellow-600'; - case 'wormhole': - return 'text-purple-400 border-purple-600'; - default: - return 'text-slate-400 border-slate-600'; - } -}; - export const SignatureCategories = ({ categories, onToggleCategory }: SignatureCategoriesProps) => { + console.log(categories); if (categories.length === 0) { return ( @@ -59,8 +26,8 @@ export const SignatureCategories = ({ categories, onToggleCategory }: SignatureC return (
{categories.map((category) => ( - - onToggleCategory(category.id)}> + + onToggleCategory(category.meta.id)}> @@ -70,12 +37,12 @@ export const SignatureCategories = ({ categories, onToggleCategory }: SignatureC ) : ( )} - {getCategoryIcon(category.id)} - {category.name} + {category.meta.icon} + {category.meta.name}
{category.signatures.length} diff --git a/src/components/SignatureListItem.tsx b/src/components/SignatureListItem.tsx index 8f5fc8c..6318dc5 100644 --- a/src/components/SignatureListItem.tsx +++ b/src/components/SignatureListItem.tsx @@ -1,7 +1,7 @@ import { Badge } from "@/components/ui/badge"; -import { Zap, Shield, Coins, HelpCircle, Clock, AlertTriangle, Skull } from "lucide-react"; +import { Clock, AlertTriangle, Skull } from "lucide-react"; import { SigviewRecord as Signature } from "@/lib/pbtypes"; -import { getCategoryColor, getCategoryIcon } from "./SignatureCategories"; +import { getSignatureMeta } from "@/hooks/useSignatureCategories"; interface SignatureListItemProps { signature: Signature; @@ -42,6 +42,8 @@ export const SignatureListItem = ({ signature }: SignatureListItemProps) => { } }; + const meta = getSignatureMeta(signature.type || ""); + const oldEntry = isOld(); return ( @@ -53,11 +55,11 @@ export const SignatureListItem = ({ signature }: SignatureListItemProps) => { {/* Type Badge - Most Important */} - {signature.dangerous ? : getCategoryIcon(signature.type)} + {signature.dangerous + ? + : meta.icon} {signature.type || "Unknown Type"} diff --git a/src/hooks/useSignatureCategories.ts b/src/hooks/useSignatureCategories.tsx similarity index 55% rename from src/hooks/useSignatureCategories.ts rename to src/hooks/useSignatureCategories.tsx index 86093cc..ee09bd8 100644 --- a/src/hooks/useSignatureCategories.ts +++ b/src/hooks/useSignatureCategories.tsx @@ -1,16 +1,76 @@ - import { useState, useEffect, useMemo } from 'react'; import { SigviewRecord as Signature } from "@/lib/pbtypes"; +import { Coins, Gauge, HelpCircle, Pickaxe, Shield, Zap } from 'lucide-react'; export interface SignatureCategory { - id: string; - name: string; + meta: SignatureCategoryMeta; signatures: Signature[]; isVisible: boolean; } +export interface SignatureCategoryMeta { + id: string; + name: string; + matcher: RegExp; + icon: JSX.Element; + color: string; +} const CATEGORY_PREFERENCES_KEY = 'signature-category-preferences'; +const allCategories = new Map([ + ["unknown", { + matcher: /^$/i, + id: "unknown", + name: 'Unknown Sites', + icon: , + color: "text-slate-400 border-slate-600" + }], + ["combat", { + matcher: /^combat/i, + id: "combat", + name: 'Combat Sites', + icon: , + color: "text-red-400 border-red-600" + }], + ["data_relic", { + matcher: /^(?:data|relic)/i, + id: "data_relic", + name: 'Data/Relic Sites', + icon: , + color: "text-blue-400 border-blue-600" + }], + ["gas", { + matcher: /^gas/i, + id: "gas", + name: 'Gas Sites', + icon: , + color: "text-green-400 border-green-600" + }], + ["ore", { + matcher: /^ore/i, + id: "ore", + name: 'Ore Sites', + icon: , + color: "text-yellow-400 border-yellow-600" + }], + ["wormhole", { + matcher: /^wormhole/i, + id: "wormhole", + name: 'Wormholes', + icon: , + color: "text-purple-400 border-purple-600" + }] +]); + +export const getSignatureMeta = (type: string): SignatureCategoryMeta => { + for (const category of allCategories.values()) { + if (category.matcher.test(type)) { + return category; + } + } + return allCategories.get("unknown")!; +}; + export const categorizeSignatures = (signatures: Signature[]): Record => { const categories: Record = { unknown: [], @@ -23,25 +83,10 @@ export const categorizeSignatures = (signatures: Signature[]): Record { const type = signature.type?.toLowerCase() || ''; - const name = signature.signame?.toLowerCase() || ''; - - if (!type || type === '') { - categories.unknown.push(signature); - } else if (type.includes('combat') || type.includes('den') || type.includes('rally')) { - categories.combat.push(signature); - } else if (type.includes('data') || type.includes('relic') || type.includes('exploration')) { - categories.data_relic.push(signature); - } else if (type.includes('gas') || name.includes('gas')) { - categories.gas.push(signature); - } else if (type.includes('ore') || type.includes('mining') || name.includes('ore')) { - categories.ore.push(signature); - } else if (type.includes('wormhole') || name.includes('wormhole') || type.includes('k162')) { - categories.wormhole.push(signature); - } else { - categories.unknown.push(signature); - } + const meta = getSignatureMeta(type); + categories[meta.id] = categories[meta.id] || []; + categories[meta.id].push(signature); }); - return categories; }; @@ -75,41 +120,36 @@ export const useSignatureCategories = (signatures: Signature[]) => { const categories = useMemo(() => { const categorized = categorizeSignatures(signatures); - + console.log(categorized); + return [ { - id: 'unknown', - name: 'Unknown Sites', + meta: allCategories.get("unknown"), signatures: categorized.unknown, isVisible: categoryVisibility.unknown }, { - id: 'combat', - name: 'Combat Sites', + meta: allCategories.get("combat"), signatures: categorized.combat, isVisible: categoryVisibility.combat }, { - id: 'data_relic', - name: 'Data/Relic Sites', + meta: allCategories.get("data_relic"), signatures: categorized.data_relic, isVisible: categoryVisibility.data_relic }, { - id: 'gas', - name: 'Gas Sites', + meta: allCategories.get("gas"), signatures: categorized.gas, isVisible: categoryVisibility.gas }, { - id: 'ore', - name: 'Ore Sites', + meta: allCategories.get("ore"), signatures: categorized.ore, isVisible: categoryVisibility.ore }, { - id: 'wormhole', - name: 'Wormholes', + meta: allCategories.get("wormhole"), signatures: categorized.wormhole, isVisible: categoryVisibility.wormhole }