feat: replace Index Supply with tidx

.env.example

@@ -1,4 +1,5 @@
-INDEXSUPPLY_API_KEY=
+TIDX_BASIC_AUTH=            # e.g. tidx:...
+TIDX_URL=https://tidx.tempo.xyz
 SLACK_FEEDBACK_WEBHOOK=     # e.g. https://hooks.slack.com/services/...
 VITE_BASE_URL=              # e.g. https://docs.tempo.xyz
 VITE_GA_MEASUREMENT_ID=

env.d.ts

@@ -6,7 +6,8 @@ interface EnvironmentVariables {
   readonly VITE_POSTHOG_HOST: string
   readonly VITE_TEMPO_ENV: 'localnet' | 'devnet' | 'moderato'
 
-  readonly INDEXSUPPLY_API_KEY: string
+  readonly TIDX_BASIC_AUTH: string
+  readonly TIDX_URL: string
   readonly SLACK_FEEDBACK_WEBHOOK: string
 
   readonly VERCEL_URL: string

package.json

@@ -43,6 +43,7 @@
     "sql-formatter": "^15.7.3",
     "tailwind-merge": "^3.5.0",
     "tailwindcss": "^4.2.2",
+    "tidx.ts": "^0.1.1",
     "unplugin-auto-import": "^21.0.0",
     "unplugin-icons": "^23.0.1",
     "viem": "^2.48.4",

src/components/SignatureSelector.tsx

@@ -1,6 +1,6 @@
 'use client'
 import * as React from 'react'
-import { getAllSignatures, type SignatureInfo } from './lib/IndexSupplySignatures'
+import { getAllSignatures, type SignatureInfo } from './lib/TidxSignatures'
 
 type SignatureSelectorProps = {
   value: string[]
@@ -17,6 +17,12 @@ export function SignatureSelector(props: SignatureSelectorProps) {
 
   const allSignatures = React.useMemo(() => getAllSignatures(), [])
 
+  const handleClickOutside = React.useEffectEvent((event: MouseEvent) => {
+    if (dropdownRef.current && !dropdownRef.current.contains(event.target as Node)) {
+      setIsOpen(false)
+    }
+  })
+
   const filteredSignatures = React.useMemo(() => {
     let signatures = allSignatures
 
@@ -56,12 +62,6 @@ export function SignatureSelector(props: SignatureSelectorProps) {
   React.useEffect(() => {
     if (!isOpen) return
 
-    function handleClickOutside(event: MouseEvent) {
-      if (dropdownRef.current && !dropdownRef.current.contains(event.target as Node)) {
-        setIsOpen(false)
-      }
-    }
-
     document.addEventListener('mousedown', handleClickOutside)
     return () => document.removeEventListener('mousedown', handleClickOutside)
   }, [isOpen])
@@ -115,7 +115,7 @@ export function SignatureSelector(props: SignatureSelectorProps) {
             onChange={(e) => setSearchQuery(e.target.value)}
             onFocus={() => !disabled && setIsOpen(true)}
             placeholder={placeholderText}
-            className="h-[34px] w-full rounded-lg border border-gray4 px-3 text-[13px] focus:outline-none focus:ring-1 focus:ring-accent disabled:cursor-not-allowed disabled:opacity-50"
+            className="h-8.5 w-full rounded-lg border border-gray4 px-3 text-[13px] focus:outline-none focus:ring-1 focus:ring-accent disabled:cursor-not-allowed disabled:opacity-50"
             disabled={disabled}
           />
           {value.length > 0 && !disabled && (
@@ -131,7 +131,7 @@ export function SignatureSelector(props: SignatureSelectorProps) {
       </div>
 
       {isOpen && (
-        <div className="absolute z-10 mt-1 max-h-[400px] w-full overflow-y-auto rounded-lg border border-gray4 bg-gray1 shadow-lg">
+        <div className="absolute z-10 mt-1 max-h-100 w-full overflow-y-auto rounded-lg border border-gray4 bg-gray1 shadow-lg">
           {Object.keys(groupedSignatures).length === 0 ? (
             <div className="px-3 py-4 text-center text-[13px] text-gray9">No signatures found</div>
           ) : (
@@ -159,7 +159,7 @@ export function SignatureSelector(props: SignatureSelectorProps) {
                         {sig.signature}
                       </span>
                       <span
-                        className={`ml-auto flex h-[16px] shrink-0 items-center justify-center rounded px-1.5 text-center font-medium text-[9px] uppercase leading-none tracking-[2%] ${
+                        className={`ml-auto flex h-4 shrink-0 items-center justify-center rounded px-1.5 text-center font-medium text-[9px] uppercase leading-none tracking-[2%] ${
                           sig.type === 'event' ? 'bg-blue3 text-blue9' : 'bg-purple3 text-purple9'
                         }`}
                       >
@@ -194,7 +194,7 @@ export function SignatureSelector(props: SignatureSelectorProps) {
               </div>
               <div className="text-[11px] text-gray10">
                 <a
-                  href="https://www.indexsupply.net/docs#evm-data"
+                  href="https://github.com/tempoxyz/tidx.ts"
                   target="_blank"
                   rel="noopener noreferrer"
                   className="text-accent hover:underline"
@@ -219,9 +219,7 @@ export function SignatureSelector(props: SignatureSelectorProps) {
                           isEvent ? 'bg-blue9' : 'bg-purple9'
                         }`}
                       />
-                      <span className="max-w-[300px] truncate text-gray11">
-                        {sigInfo?.name || sig}
-                      </span>
+                      <span className="max-w-75 truncate text-gray11">{sigInfo?.name || sig}</span>
                       {!disabled && (
                         <button
                           type="button"