Search packet hashes server-side with hashPrefix

src/api/client.ts

@@ -97,7 +97,7 @@ function statsRegionParams(r: StatsRegion): { iatas?: string; region?: string }
 
 export function getPackets(
   iatas: string[] | undefined,
-  params?: { cursor?: number; limit?: number; payloadTypes?: number[]; routeTypes?: number[]; scopes?: string[] },
+  params?: { cursor?: number; limit?: number; payloadTypes?: number[]; routeTypes?: number[]; scopes?: string[]; hashPrefix?: string },
 ): Promise<CursorPage<PacketSummary>> {
   if (noIatas(iatas)) return Promise.resolve(emptyPage());
   return request("/packets", {
@@ -107,6 +107,7 @@ export function getPackets(
     payloadTypes: params?.payloadTypes?.length ? params.payloadTypes.join(",") : undefined,
     routeTypes: params?.routeTypes?.length ? params.routeTypes.join(",") : undefined,
     scopes: params?.scopes?.length ? params.scopes.join(",") : undefined,
+    hashPrefix: params?.hashPrefix,
   });
 }
 

src/components/SearchBar.tsx

@@ -50,6 +50,12 @@ export function SearchBar({ value, onChange, fields, field, onFieldChange, hideF
   function handleChange(val: string) {
     setLocalValue(val);
     if (debounceRef.current) clearTimeout(debounceRef.current);
+    // clearing should restore the full list right away
+    if (val === "") {
+      debounceRef.current = null;
+      onChange(val);
+      return;
+    }
     debounceRef.current = setTimeout(() => {
       onChange(val);
     }, 300);

src/features/packets/types.ts

@@ -16,6 +16,7 @@ export interface PacketServerFilter {
   payloadTypes?: number[];
   routeTypes?: number[];
   scopes?: string[];
+  hashPrefix?: string;
 }
 
 export const EMPTY_FILTERS: PacketFilterState = {

src/features/packets/usePacketFilters.ts

@@ -118,11 +118,18 @@ export function usePacketFilters() {
 // The /packets endpoint accepts comma-separated payloadTypes/routeTypes/scopes, so any selected
 // dimension goes server-side and pagination pulls the correctly-filtered set from the full history.
 // (observers has no server param, so it stays client-side in matchesFilters, as does the live buffer.)
+// A 4-16 char hex hash search also goes server-side so older packets can be found.
+const HASH_PREFIX_RE = /^[0-9a-f]{4,16}$/i;
+
 export function toServerFilter(filters: PacketFilterState): PacketServerFilter | null {
   const serverFilter: PacketServerFilter = {};
   if (filters.payloadTypes.length > 0) serverFilter.payloadTypes = filters.payloadTypes;
   if (filters.routeTypes.length > 0) serverFilter.routeTypes = filters.routeTypes;
   if (filters.scopes.length > 0) serverFilter.scopes = filters.scopes;
+  const hashSearch = filters.search.trim();
+  if (filters.searchField === "hash" && HASH_PREFIX_RE.test(hashSearch)) {
+    serverFilter.hashPrefix = hashSearch.toLowerCase();
+  }
   return Object.keys(serverFilter).length > 0 ? serverFilter : null;
 }
 
@@ -151,7 +158,7 @@ export function matchesFilters(
     return false;
   }
   if (filters.search && filters.searchField === "hash") {
-    const q = filters.search.toLowerCase();
+    const q = filters.search.trim().toLowerCase();
     if (!packet.packetHash.toLowerCase().includes(q)) {
       return false;
     }