Azure Ledger Explorer

A TypeScript/React application for exploring and analyzing CCF (Confidential Consortium Framework) ledger data with querying capabilities.

Features

• Ledger File Parsing: Import and parse CCF ledger files with full transaction details
• Transaction Visualization: Browse transactions with detailed information and search capabilities
• Azure Integration: Direct import from Azure File Shares using SAS tokens
• Persistent Storage: Client-side SQLite database with OPFS VFS
• Progressive Web App: Install to your device, work offline, and get automatic updates
• Clean UI: Built with FluentUI React components and responsive design
• State Management: Efficient data handling with TanStack Query and optimistic updates

Quick Start

Local Development

1. Clone the repository git clone $REPOSITORY_URL ccf-ledger-explorer && cd ccf-ledger-explorer
2. Install dependencies npm install
3. Start the development server npm run dev
4. Open http://localhost:5173 in your browser

Usage

1. Upload ledger files:
   • Option 1: drag and drop CCF ledger files that you already obtained, find sample files in the e2e tests folder
   • Option 2: backup CCF ledger to Azure File Share and provide a SAS token in the import dialog
   • Option 3: download files from a known Microsoft's Signing Transparency ledger, i.e. provide a known domain name in the import dialog.
   • Option 4: click Load sample ledger on the welcome screen to import a small bundled sample (public/samples/ledger_1-14.committed) and explore the app immediately
2. Verify ledger integrity after importing the files
3. Explore transactions, key-value operations, and statistics. Find specific transactions and analyze patterns.

Documentation

IMPORTANT: Before contributing to this project, you MUST read the documentation in the /docs folder:

Essential Reading

• Documentation Index
• Code Standards
• Architecture Overview

Development Guides

• Testing Guide
• Deployment Guide

Component Documentation

• Parser System
• Database & Persistence
• External Services
• AI Assistant

Acknowledgements

CCF Ledger Explorer is built on the shoulders of many excellent open source projects:

Core Framework

Project	Description
React	JavaScript library for building user interfaces
React Router	Declarative routing for React web applications
TypeScript	Typed superset of JavaScript

UI Components

Project	Description
Fluent UI React	Microsoft's React component library
Fluent UI System Icons	Familiar, friendly, and modern icon collection
Monaco Editor for React	Monaco code editor component for React

State Management & Data

Project	Description
TanStack Query	Async state management for React
SQLite WASM	SQLite compiled to WebAssembly

Azure SDKs

Project	Description
Azure SDK for JavaScript	Azure Confidential Ledger and Storage File Share clients
Application Insights JS	Azure Application Insights telemetry SDK

Data Processing & Cryptography

Project	Description
cbor2	CBOR (Concise Binary Object Representation) encoding and decoding
jsrsasign	Pure JavaScript cryptographic library (RSA, ECDSA, X.509)
js-base64	Base64 transcoder
buffer	Node.js Buffer API for the browser

Markdown Rendering

Project	Description
react-markdown	React component to render Markdown
remark-gfm	GitHub Flavored Markdown support

Build & Development Tools

Project	Description
Vite	Next-generation frontend build tool
ESLint	Pluggable linting utility for JavaScript and TypeScript
typescript-eslint	TypeScript support for ESLint
vite-plugin-pwa	Zero-config PWA plugin for Vite
Workbox	Service worker libraries for Progressive Web Apps
sharp	High-performance Node.js image processing

Testing

Project	Description
Playwright	End-to-end testing framework for web apps
Vitest	Vite-native unit testing framework
Testing Library	Simple and complete DOM testing utilities