diff --git a/dashboard/reports/wallet-integration.json b/dashboard/reports/wallet-integration.json index 00cb0a5..28eeafd 100644 --- a/dashboard/reports/wallet-integration.json +++ b/dashboard/reports/wallet-integration.json @@ -1,4 +1,5 @@ { + "generatedAt": "2026-06-26T13:01:40.990Z", "generatedAt": "2026-06-27T12:47:07.864Z", "total": 3, "passed": 3, diff --git a/dashboard/src/App.tsx b/dashboard/src/App.tsx index cd6a031..f494468 100644 --- a/dashboard/src/App.tsx +++ b/dashboard/src/App.tsx @@ -132,7 +132,9 @@ type Tab = 'explorer' | 'timeline' | 'templates'; import { ActivityFeed } from './components/ActivityFeed'; import { WebhookDashboardPage } from './pages/WebhookDashboardPage'; import { ExportHistoryPage } from './pages/ExportHistoryPage'; +import { NotificationSearchPage } from './pages/NotificationSearchPage'; +type Tab = 'explorer' | 'timeline' | 'activity' | 'export-history' | 'search'; type Tab = 'explorer' | 'timeline' | 'activity' | 'webhooks' | 'export-history'; export function App() { @@ -193,6 +195,14 @@ export function App() { > Export History + {tab === 'explorer' && } @@ -200,6 +210,7 @@ export function App() { {tab === 'activity' && } {tab === 'webhooks' && } {tab === 'export-history' && } + {tab === 'search' && } ); } diff --git a/dashboard/src/index.css b/dashboard/src/index.css index 16e0285..b4fad84 100644 --- a/dashboard/src/index.css +++ b/dashboard/src/index.css @@ -4686,3 +4686,202 @@ body { } } +/* ── Notification Search Page ──────────────────────────────────────────────── */ + +.notif-search-page { + max-width: 1100px; + margin: 0 auto; + padding: 24px; +} + +.notif-search-page__header { + margin-bottom: 24px; +} + +.notif-search-page__header h1 { + margin: 4px 0 8px; + font-size: 1.75rem; +} + +.notif-search-form { + background: rgba(255,255,255,0.03); + border: 1px solid rgba(255,255,255,0.08); + border-radius: 12px; + padding: 16px; + margin-bottom: 24px; +} + +.notif-search-form__row { + display: grid; + grid-template-columns: 2fr repeat(5, 1fr); + gap: 12px; + align-items: end; +} + +.notif-search-form__group { + display: flex; + flex-direction: column; + gap: 6px; +} + +.notif-search-form__group--wide { + grid-column: span 2; +} + +.notif-search-form__label { + font-size: 0.82rem; + color: #9aa0a6; + font-weight: 500; +} + +.notif-search-form__input { + background: rgba(255,255,255,0.05); + border: 1px solid rgba(255,255,255,0.12); + border-radius: 8px; + color: #e8eaed; + font-size: 0.9rem; + padding: 8px 12px; + outline: none; + width: 100%; +} + +.notif-search-form__input:focus { + border-color: #4a9eff; +} + +.notif-search-page__status { + color: #9aa0a6; + padding: 8px 0; +} + +.notif-search-page__empty { + text-align: center; + padding: 64px 24px; + color: #9aa0a6; +} + +.notif-search-page__empty h2 { + margin: 0 0 8px; + font-size: 1.25rem; + color: #e8eaed; +} + +.notif-search-page__empty p { + margin: 0; +} + +.notif-search-results { + display: flex; + flex-direction: column; + gap: 12px; + margin-top: 16px; +} + +.notif-result-card { + background: rgba(255,255,255,0.03); + border: 1px solid rgba(255,255,255,0.08); + border-radius: 10px; + padding: 14px 16px; +} + +.notif-result-card__header { + display: flex; + gap: 8px; + align-items: center; + margin-bottom: 10px; + flex-wrap: wrap; +} + +.notif-result-card__source { + font-size: 0.75rem; + padding: 2px 8px; + border-radius: 4px; + font-weight: 600; + text-transform: uppercase; + letter-spacing: 0.04em; +} + +.notif-result-card__source--scheduled { background: rgba(74,158,255,0.15); color: #4a9eff; } +.notif-result-card__source--processed { background: rgba(52,211,153,0.15); color: #34d399; } + +.notif-result-card__status { + font-size: 0.75rem; + padding: 2px 8px; + border-radius: 4px; + font-weight: 600; + text-transform: uppercase; +} + +.notif-result-card__status--completed, +.notif-result-card__status--processed { background: rgba(52,211,153,0.1); color: #34d399; } +.notif-result-card__status--pending { background: rgba(251,191,36,0.1); color: #fbbf24; } +.notif-result-card__status--failed { background: rgba(239,68,68,0.1); color: #ef4444; } +.notif-result-card__status--processing { background: rgba(74,158,255,0.1); color: #4a9eff; } +.notif-result-card__status--cancelled { background: rgba(156,163,175,0.1); color: #9ca3af; } + +.notif-result-card__type { + font-size: 0.75rem; + color: #9aa0a6; + padding: 2px 8px; + border: 1px solid rgba(255,255,255,0.1); + border-radius: 4px; +} + +.notif-result-card__fields { + display: grid; + grid-template-columns: auto 1fr; + gap: 4px 16px; + margin: 0; + font-size: 0.85rem; +} + +.notif-result-card__fields dt { + color: #9aa0a6; + white-space: nowrap; +} + +.notif-result-card__fields dd { + margin: 0; + color: #e8eaed; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} + +.notif-result-card__fields code { + font-family: 'JetBrains Mono', 'Fira Code', monospace; + font-size: 0.8rem; + color: #a5d6ff; +} + +.notif-search-page__pagination { + display: flex; + align-items: center; + justify-content: center; + gap: 16px; + margin-top: 24px; +} + +.pagination__info { + color: #9aa0a6; + font-size: 0.9rem; +} + +@media (max-width: 768px) { + .notif-search-form__row { + grid-template-columns: 1fr 1fr; + } + + .notif-search-form__group--wide { + grid-column: span 2; + } + + .notif-result-card__fields { + grid-template-columns: 1fr; + } + + .notif-result-card__fields dt { + font-weight: 600; + margin-top: 6px; + } +} diff --git a/dashboard/src/pages/NotificationSearchPage.tsx b/dashboard/src/pages/NotificationSearchPage.tsx new file mode 100644 index 0000000..28a59ab --- /dev/null +++ b/dashboard/src/pages/NotificationSearchPage.tsx @@ -0,0 +1,316 @@ +import { useState, useCallback, useEffect, useRef } from 'react'; +import { useDebounce } from '../hooks/useDebounce'; +import { + searchNotifications, + type NotificationSearchResult, + type NotificationSearchResponse, +} from '../services/eventsApi'; + +const PAGE_SIZE = 20; +const API_BASE = (import.meta.env.VITE_EVENTS_API_URL ?? 'http://localhost:8787/api/events').replace( + '/api/events', + '' +); + +const STATUS_OPTIONS = ['', 'PENDING', 'PROCESSING', 'COMPLETED', 'FAILED', 'CANCELLED', 'PROCESSED']; + +export function NotificationSearchPage() { + const [query, setQuery] = useState(''); + const [sender, setSender] = useState(''); + const [txHash, setTxHash] = useState(''); + const [eventId, setEventId] = useState(''); + const [status, setStatus] = useState(''); + const [type, setType] = useState(''); + const [page, setPage] = useState(1); + + const [response, setResponse] = useState(null); + const [loading, setLoading] = useState(false); + const [error, setError] = useState(null); + + const debouncedQuery = useDebounce(query, 300); + const debouncedSender = useDebounce(sender, 300); + const debouncedTxHash = useDebounce(txHash, 300); + const debouncedEventId = useDebounce(eventId, 300); + + // Track whether any search param is active + const hasParams = + debouncedQuery || debouncedSender || debouncedTxHash || debouncedEventId || status || type; + + const abortRef = useRef(null); + + const runSearch = useCallback(async () => { + if (!hasParams) { + setResponse(null); + setError(null); + return; + } + + abortRef.current?.abort(); + abortRef.current = new AbortController(); + + setLoading(true); + setError(null); + + try { + const result = await searchNotifications(API_BASE, { + q: debouncedQuery || undefined, + sender: debouncedSender || undefined, + txHash: debouncedTxHash || undefined, + eventId: debouncedEventId || undefined, + status: status || undefined, + type: type || undefined, + limit: PAGE_SIZE, + offset: (page - 1) * PAGE_SIZE, + }); + setResponse(result); + } catch (err: unknown) { + if (err instanceof Error && err.name === 'AbortError') return; + setError(err instanceof Error ? err.message : 'Search failed'); + } finally { + setLoading(false); + } + }, [debouncedQuery, debouncedSender, debouncedTxHash, debouncedEventId, status, type, page, hasParams]); + + // Re-run search whenever debounced params change; reset page when filters change + const filtersKey = `${debouncedQuery}|${debouncedSender}|${debouncedTxHash}|${debouncedEventId}|${status}|${type}`; + const prevFiltersRef = useRef(filtersKey); + useEffect(() => { + if (filtersKey !== prevFiltersRef.current) { + setPage(1); + prevFiltersRef.current = filtersKey; + } + }, [filtersKey]); + + useEffect(() => { + runSearch(); + // eslint-disable-next-line react-hooks/exhaustive-deps + }, [filtersKey, page]); + + function clearAll() { + setQuery(''); + setSender(''); + setTxHash(''); + setEventId(''); + setStatus(''); + setType(''); + setPage(1); + setResponse(null); + setError(null); + } + + const totalPages = response ? response.totalPages : 0; + + return ( +
+
+

Notifications

+

Notification Search

+

+ Search scheduled and processed notifications by sender, transaction hash, event ID, type, or free-text. +

+
+ + {/* Search form */} +
+
+
+ + setQuery(e.target.value)} + aria-label="Free-text search" + /> +
+ +
+ + setSender(e.target.value)} + /> +
+ +
+ + setTxHash(e.target.value)} + /> +
+ +
+ + setEventId(e.target.value)} + /> +
+ +
+ + +
+ +
+ + setType(e.target.value)} + /> +
+
+ + {hasParams && ( + + )} +
+ + {/* Results area */} +
+ {loading && ( +

Searching…

+ )} + + {error && !loading && ( +
+ Error: {error} +
+ )} + + {!loading && !error && !hasParams && ( +
+

Start searching

+

Enter a query above to find notifications by sender, transaction hash, event ID, or type.

+
+ )} + + {!loading && !error && hasParams && response?.results.length === 0 && ( +
+

No results found

+

Try different keywords or clear filters to broaden the search.

+
+ )} + + {!loading && !error && response && response.results.length > 0 && ( + <> +

+ {response.total.toLocaleString()} result{response.total !== 1 ? 's' : ''} — showing{' '} + {((page - 1) * PAGE_SIZE + 1).toLocaleString()}– + {Math.min(page * PAGE_SIZE, response.total).toLocaleString()} +

+ +
+ {response.results.map((r) => ( + + ))} +
+ + {totalPages > 1 && ( + + )} + + )} +
+
+ ); +} + +function NotificationResultCard({ result }: { result: NotificationSearchResult }) { + return ( +
+
+ + {result.source} + + + {result.status} + + {result.notificationType && ( + {result.notificationType} + )} +
+ +
+ {result.eventId && ( + <> +
Event ID
+
{result.eventId}
+ + )} + {result.txHash && ( + <> +
Tx Hash
+
{result.txHash}
+ + )} + {result.contractAddress && ( + <> +
Contract
+
{result.contractAddress}
+ + )} + {result.targetRecipient && ( + <> +
Recipient
+
{result.targetRecipient}
+ + )} +
Created
+
{new Date(result.createdAt).toLocaleString()}
+
+
+ ); +} diff --git a/dashboard/src/services/eventsApi.ts b/dashboard/src/services/eventsApi.ts index b6154fe..a1e1cd5 100644 --- a/dashboard/src/services/eventsApi.ts +++ b/dashboard/src/services/eventsApi.ts @@ -30,6 +30,39 @@ export interface StatusResponse { contracts: ContractStatus[]; } +export interface NotificationSearchResult { + id: number; + source: 'scheduled' | 'processed'; + eventId: string | null; + txHash: string | null; + contractAddress: string | null; + notificationType: string | null; + targetRecipient: string | null; + status: string; + createdAt: string; + payload: string | null; +} + +export interface NotificationSearchResponse { + results: NotificationSearchResult[]; + total: number; + limit: number; + offset: number; + itemCount: number; + totalPages: number; +} + +export interface NotificationSearchParams { + q?: string; + sender?: string; + txHash?: string; + eventId?: string; + status?: string; + type?: string; + limit?: number; + offset?: number; +} + export async function fetchEvents(apiUrl: string): Promise { const response = await fetch(apiUrl); if (!response.ok) { @@ -48,3 +81,24 @@ export async function fetchStatus(apiUrl: string): Promise { } return response.json() as Promise; } + +export async function searchNotifications( + baseUrl: string, + params: NotificationSearchParams +): Promise { + const url = new URL(`${baseUrl}/api/notifications/search`); + if (params.q) url.searchParams.set('q', params.q); + if (params.sender) url.searchParams.set('sender', params.sender); + if (params.txHash) url.searchParams.set('txHash', params.txHash); + if (params.eventId) url.searchParams.set('eventId', params.eventId); + if (params.status) url.searchParams.set('status', params.status); + if (params.type) url.searchParams.set('type', params.type); + if (params.limit !== undefined) url.searchParams.set('limit', String(params.limit)); + if (params.offset !== undefined) url.searchParams.set('offset', String(params.offset)); + + const response = await fetch(url.toString()); + if (!response.ok) { + throw new Error(`Search failed: ${response.status}`); + } + return response.json() as Promise; +} diff --git a/dashboard/src/services/timelineApi.ts b/dashboard/src/services/timelineApi.ts index e2c78d5..274c9be 100644 --- a/dashboard/src/services/timelineApi.ts +++ b/dashboard/src/services/timelineApi.ts @@ -1,6 +1,13 @@ import type { NotificationTimeline } from '../types/timeline'; import { getEventsApiBaseUrl } from '../config/eventsApiUrl'; +// globalThis.__VITE_EVENTS_API_URL__ is injected by Vite's define plugin (if configured). +// In Jest/Node it is undefined, so we fall back to the default. +declare const __VITE_EVENTS_API_URL__: string | undefined; + +const BASE_URL: string = + (typeof __VITE_EVENTS_API_URL__ !== 'undefined' ? __VITE_EVENTS_API_URL__ : '') || + 'http://localhost:8787'; const BASE_URL = getEventsApiBaseUrl(); export async function fetchTimeline(notificationId: number): Promise { diff --git a/listener/src/api/events-server.ts b/listener/src/api/events-server.ts index 358dd16..41bf6ba 100644 --- a/listener/src/api/events-server.ts +++ b/listener/src/api/events-server.ts @@ -12,6 +12,7 @@ import { handleTemplateRoutes } from './template-routes'; import { generateRequestId, resolveCorrelationId } from '../utils/request-id'; import { NotificationHistoryService } from '../services/notification-history'; import { SearchSuggestionService } from '../services/search-suggestion'; +import { NotificationSearchService } from '../services/notification-search-service'; import { verifySignature, extractSignature, @@ -371,6 +372,7 @@ export function createEventsServer(options: EventsServerOptions): http.Server { const corsOrigin = options.corsOrigin ?? 'http://localhost:5173'; const historyService = new NotificationHistoryService(); const suggestionService = new SearchSuggestionService(); + const notificationSearchService = new NotificationSearchService(); const rateLimiter = options.rateLimit ? new RateLimiter(options.rateLimit) : undefined; const server = http.createServer(async (req, res) => { @@ -884,6 +886,33 @@ export function createEventsServer(options: EventsServerOptions): http.Server { return; } + // GET /api/notifications/search + if (req.method === 'GET' && url.pathname === '/api/notifications/search') { + const q = url.searchParams.get('q') ?? undefined; + const sender = url.searchParams.get('sender') ?? undefined; + const txHash = url.searchParams.get('txHash') ?? undefined; + const eventId = url.searchParams.get('eventId') ?? undefined; + const status = url.searchParams.get('status') ?? undefined; + const type = url.searchParams.get('type') ?? undefined; + const limit = url.searchParams.get('limit') ? parseInt(url.searchParams.get('limit')!, 10) : undefined; + const offset = url.searchParams.get('offset') ? parseInt(url.searchParams.get('offset')!, 10) : undefined; + + logger.info('Handling GET /api/notifications/search', { requestId, correlationId, q, sender, txHash, eventId, status, type, limit, offset }); + + notificationSearchService.search({ q, sender, txHash, eventId, status, type, limit, offset }) + .then((result) => { + res.writeHead(200, { 'Content-Type': 'application/json' }); + res.end(JSON.stringify(result)); + logger.info('GET /api/notifications/search complete', { requestId, total: result.total, durationMs: Date.now() - startTime }); + }) + .catch((error) => { + logger.error('Failed to search notifications', { error, requestId, correlationId }); + res.writeHead(500, { 'Content-Type': 'application/json' }); + res.end(JSON.stringify({ error: (error as Error).message })); + }); + return; + } + // GET /api/search/suggestions if (req.method === 'GET' && url.pathname === '/api/search/suggestions') { const q = url.searchParams.get('q') || ''; diff --git a/listener/src/database/schema.sql b/listener/src/database/schema.sql index 7105f4b..57612ff 100644 --- a/listener/src/database/schema.sql +++ b/listener/src/database/schema.sql @@ -35,6 +35,7 @@ CREATE TABLE IF NOT EXISTS scheduled_notifications ( contract_address TEXT, -- Stellar contract address (if applicable) priority INTEGER NOT NULL DEFAULT 5, -- 1-10, lower = higher priority metadata TEXT, -- Additional JSON metadata + next_retry_at DATETIME -- When the next retry should be attempted next_retry_at DATETIME -- Explicit retry scheduling timestamp ); diff --git a/listener/src/services/notification-search-service.ts b/listener/src/services/notification-search-service.ts new file mode 100644 index 0000000..55ec8ae --- /dev/null +++ b/listener/src/services/notification-search-service.ts @@ -0,0 +1,219 @@ +import { getDatabase } from '../database/database'; +import logger from '../utils/logger'; +import { buildPaginationMetadata, normalizePaginationParams } from '../utils/pagination'; + +export interface NotificationSearchParams { + q?: string; // partial match: sender, eventId, txHash, contractAddress, notificationType, payload + sender?: string; // target_recipient exact/partial match + txHash?: string; // tx_hash exact/partial match + eventId?: string; // event_id exact/partial match + status?: string; // scheduled_notifications.status + type?: string; // notification_type + limit?: number; + offset?: number; +} + +export interface NotificationSearchResult { + id: number; + source: 'scheduled' | 'processed'; + eventId: string | null; + txHash: string | null; + contractAddress: string | null; + notificationType: string | null; + targetRecipient: string | null; + status: string; + createdAt: string; + payload: string | null; +} + +export interface PaginatedSearchResponse { + results: NotificationSearchResult[]; + total: number; + limit: number; + offset: number; + itemCount: number; + totalPages: number; +} + +export class NotificationSearchService { + private db = getDatabase(); + + async search(params: NotificationSearchParams): Promise { + const { limit, offset } = normalizePaginationParams(params.limit, params.offset); + const pattern = params.q ? `%${params.q}%` : null; + + try { + const scheduledResults = await this.searchScheduled(params, pattern, limit, offset); + const processedResults = await this.searchProcessed(params, pattern, limit, offset); + + // Merge, sort by createdAt desc, then re-paginate + const merged = [...scheduledResults.rows, ...processedResults.rows].sort( + (a, b) => new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime() + ); + const total = scheduledResults.total + processedResults.total; + + const paginated = merged.slice(0, limit); + + const pagination = buildPaginationMetadata(total, limit, offset); + + logger.info('Notification search complete', { total, returned: paginated.length, limit, offset }); + + return { + results: paginated, + total, + limit: pagination.limit, + offset: pagination.offset, + itemCount: pagination.itemCount, + totalPages: pagination.totalPages, + }; + } catch (error) { + logger.error('Notification search failed', { error, params }); + throw error; + } + } + + private async searchScheduled( + params: NotificationSearchParams, + pattern: string | null, + limit: number, + offset: number + ): Promise<{ rows: NotificationSearchResult[]; total: number }> { + const conditions: string[] = []; + const queryParams: unknown[] = []; + + if (pattern) { + conditions.push( + `(target_recipient LIKE ? OR event_id LIKE ? OR contract_address LIKE ? OR notification_type LIKE ? OR payload LIKE ?)` + ); + queryParams.push(pattern, pattern, pattern, pattern, pattern); + } + if (params.sender) { + conditions.push('target_recipient LIKE ?'); + queryParams.push(`%${params.sender}%`); + } + if (params.eventId) { + conditions.push('event_id LIKE ?'); + queryParams.push(`%${params.eventId}%`); + } + if (params.status) { + conditions.push('status = ?'); + queryParams.push(params.status.toUpperCase()); + } + if (params.type) { + conditions.push('notification_type LIKE ?'); + queryParams.push(`%${params.type}%`); + } + + const where = conditions.length ? `WHERE ${conditions.join(' AND ')}` : ''; + + const countRow = await this.db.get<{ count: number }>( + `SELECT COUNT(*) as count FROM scheduled_notifications ${where}`, + queryParams + ); + const total = countRow?.count ?? 0; + + const rows = await this.db.all<{ + id: number; + event_id: string | null; + contract_address: string | null; + notification_type: string; + target_recipient: string; + status: string; + created_at: string; + payload: string; + }>( + `SELECT id, event_id, contract_address, notification_type, target_recipient, status, created_at, payload + FROM scheduled_notifications ${where} + ORDER BY created_at DESC + LIMIT ? OFFSET ?`, + [...queryParams, limit, offset] + ); + + return { + total, + rows: rows.map((r) => ({ + id: r.id, + source: 'scheduled' as const, + eventId: r.event_id, + txHash: null, + contractAddress: r.contract_address, + notificationType: r.notification_type, + targetRecipient: r.target_recipient, + status: r.status, + createdAt: r.created_at, + payload: r.payload, + })), + }; + } + + private async searchProcessed( + params: NotificationSearchParams, + pattern: string | null, + limit: number, + offset: number + ): Promise<{ rows: NotificationSearchResult[]; total: number }> { + const conditions: string[] = []; + const queryParams: unknown[] = []; + + if (pattern) { + conditions.push( + `(event_id LIKE ? OR tx_hash LIKE ? OR contract_address LIKE ? OR event_type LIKE ?)` + ); + queryParams.push(pattern, pattern, pattern, pattern); + } + if (params.txHash) { + conditions.push('tx_hash LIKE ?'); + queryParams.push(`%${params.txHash}%`); + } + if (params.eventId) { + conditions.push('event_id LIKE ?'); + queryParams.push(`%${params.eventId}%`); + } + if (params.status) { + conditions.push('status = ?'); + queryParams.push(params.status.toUpperCase()); + } + + // sender / type don't apply to processed_events, skip those params + + const where = conditions.length ? `WHERE ${conditions.join(' AND ')}` : ''; + + const countRow = await this.db.get<{ count: number }>( + `SELECT COUNT(*) as count FROM processed_events ${where}`, + queryParams + ); + const total = countRow?.count ?? 0; + + const rows = await this.db.all<{ + id: number; + event_id: string; + tx_hash: string | null; + contract_address: string; + event_type: string; + status: string; + processed_at: string; + }>( + `SELECT id, event_id, tx_hash, contract_address, event_type, status, processed_at + FROM processed_events ${where} + ORDER BY processed_at DESC + LIMIT ? OFFSET ?`, + [...queryParams, limit, offset] + ); + + return { + total, + rows: rows.map((r) => ({ + id: r.id, + source: 'processed' as const, + eventId: r.event_id, + txHash: r.tx_hash, + contractAddress: r.contract_address, + notificationType: r.event_type, + targetRecipient: null, + status: r.status, + createdAt: r.processed_at, + payload: null, + })), + }; + } +}