Cleanup static imports.

README.md

@@ -15,11 +15,5 @@ There are a few assumptions made to facilitate the development of the PoC:
 - DbRepository interfaces
 - Setup DB Migrations
 - Tests
-- Fix ordering for Blocks and Transactions
 - Fix assumption of 1 block per slot
-- Split the single file static into components
 - Log colouring
-
-- Store hashes
-- Get transaction by hash
-- Get block by hash

static/app.js

@@ -1,11 +1,11 @@
 import { h, render, Fragment } from 'preact';
 
-import Router from './components/Router.js?dev=1';
-import HealthPill from './components/HealthPill.js?dev=1';
+import Router from './components/Router.js';
+import HealthPill from './components/HealthPill.js';
 
-import HomePage from './pages/Home.js?dev=1';
-import BlockDetailPage from './pages/BlockDetail.js?dev=1';
-import TransactionDetailPage from './pages/TransactionDetail.js?dev=1';
+import HomePage from './pages/Home.js';
+import BlockDetailPage from './pages/BlockDetail.js';
+import TransactionDetailPage from './pages/TransactionDetail.js';
 
 const ROOT = document.getElementById('app');
 

static/components/BlocksTable.js

@@ -1,8 +1,9 @@
 // static/pages/BlocksTable.js
 import { h } from 'preact';
 import { useEffect, useRef } from 'preact/hooks';
-import { PAGE, API, TABLE_SIZE } from '../lib/api.js?dev=1';
-import { streamNdjson, ensureFixedRowCount, shortenHex } from '../lib/utils.js?dev=1';
+import { PAGE, API } from '../lib/api.js';
+import { TABLE_SIZE } from '../lib/constants.js';
+import { streamNdjson, ensureFixedRowCount, shortenHex } from '../lib/utils.js';
 
 export default function BlocksTable() {
     const bodyRef = useRef(null);

static/components/HealthPill.js

@@ -16,10 +16,10 @@ export default function HealthPill() {
 
     // Flash animation whenever status changes
     useEffect(() => {
-        const el = pillRef.current;
-        if (!el) return;
-        el.classList.add('flash');
-        const id = setTimeout(() => el.classList.remove('flash'), 750);
+        const pillElement = pillRef.current;
+        if (!pillElement) return;
+        pillElement.classList.add('flash');
+        const id = setTimeout(() => pillElement.classList.remove('flash'), 750);
         return () => clearTimeout(id);
     }, [status]);
 

static/components/TransactionsTable.js

@@ -1,13 +1,14 @@
 // static/pages/TransactionsTable.js
 import { h } from 'preact';
 import { useEffect, useRef } from 'preact/hooks';
-import { API, TABLE_SIZE } from '../lib/api.js?dev=1';
+import { API } from '../lib/api.js';
+import { TABLE_SIZE } from '../lib/constants.js';
 import {
     streamNdjson,
     ensureFixedRowCount,
     shortenHex, // (kept in case you want to use later)
     withBenignFilter,
-} from '../lib/utils.js?dev=1';
+} from '../lib/utils.js';
 
 const OPERATIONS_PREVIEW_LIMIT = 2;
 

static/lib/api.js

@@ -1,5 +1,4 @@
-export const API_PREFIX = '/api/v1';
-export const TABLE_SIZE = 10;
+const API_PREFIX = '/api/v1';
 
 const joinUrl = (...parts) => parts.join('/').replace(/\/{2,}/g, '/');
 const encodeId = (id) => encodeURIComponent(String(id));

static/lib/constants.js

@@ -0,0 +1 @@
+export const TABLE_SIZE = 10;

static/lib/utils.js

@@ -12,6 +12,7 @@ export async function streamNdjson(url, handleItem, { signal, onError = () => {}
         signal,
         cache: 'no-cache',
     });
+
     if (!response.ok || !response.body) {
         throw new Error(`Stream failed: ${response.status}`);
     }

static/pages/BlockDetail.js

@@ -1,7 +1,7 @@
 // static/pages/BlockDetailPage.js
 import { h, Fragment } from 'preact';
 import { useEffect, useMemo, useState } from 'preact/hooks';
-import { API, PAGE } from '../lib/api.js?dev=1';
+import { API, PAGE } from '../lib/api.js';
 
 const OPERATIONS_PREVIEW_LIMIT = 2;
 

static/pages/TransactionDetail.js

@@ -1,7 +1,7 @@
 // static/pages/TransactionDetail.js
 import { h, Fragment } from 'preact';
 import { useEffect, useMemo, useState } from 'preact/hooks';
-import { API } from '../lib/api.js?dev=1';
+import { API } from '../lib/api.js';
 
 // ————— helpers —————
 const isNumber = (v) => typeof v === 'number' && !Number.isNaN(v);