4 Commits

Author SHA1 Message Date
a29f13c75a v1.12.2
Some checks failed
Default (tags) / security (push) Failing after 0s
Default (tags) / test (push) Failing after 0s
Default (tags) / release (push) Has been skipped
Default (tags) / metadata (push) Has been skipped
2026-03-24 15:08:13 +00:00
02b3a79d99 fix(config): migrate runtime configuration loading from npmextra to smartconfig 2026-03-24 15:08:13 +00:00
7f4528bdab v1.12.1
Some checks failed
Default (tags) / security (push) Failing after 0s
Default (tags) / test (push) Failing after 0s
Default (tags) / release (push) Has been skipped
Default (tags) / metadata (push) Has been skipped
2026-03-14 23:27:25 +00:00
a829f76d4b fix(storage): rename S3 configuration and change stream interfaces to storage-oriented types 2026-03-14 23:27:25 +00:00
23 changed files with 2181 additions and 2034 deletions

View File

@@ -1,5 +1,21 @@
# Changelog
## 2026-03-24 - 1.12.2 - fix(config)
migrate runtime configuration loading from npmextra to smartconfig
- replace the @push.rocks/npmextra dependency with @push.rocks/smartconfig
- update tsview startup configuration types and loading logic to read port, killIfBusy, and openBrowser from smartconfig
- adjust busy-port error messaging to reference smartconfig.json
- add npmjs.org to the release registries configuration
## 2026-03-14 - 1.12.1 - fix(storage)
rename S3 configuration and change stream interfaces to storage-oriented types
- Renames public config APIs from setS3Config/getS3Config/hasS3 to setStorageConfig/getStorageConfig/hasStorage.
- Replaces shared S3 interfaces with storage equivalents such as IStorageConfig, IStorageObject, IStorageChangeEvent, and storage subscription request types.
- Updates frontend integration to use dees-storage-browser and the new storage data provider and change stream types.
- Refreshes dependency versions and documentation to match the new storage-oriented naming.
## 2026-03-12 - 1.12.0 - feat(web)
replace custom S3 browser components with dees-s3-browser integration

View File

@@ -34,7 +34,7 @@
"@git.zone/cli": {
"services": ["mongodb", "minio"],
"release": {
"registries": ["https://verdaccio.lossless.digital"],
"registries": ["https://verdaccio.lossless.digital", "https://registry.npmjs.org"],
"accessLevel": "public"
},
"projectType": "npm",

View File

@@ -1,6 +1,6 @@
{
"name": "@git.zone/tsview",
"version": "1.12.0",
"version": "1.12.2",
"private": false,
"description": "A CLI tool for viewing S3 and MongoDB data with a web UI",
"main": "dist_ts/index.js",
@@ -20,35 +20,35 @@
"tsview": "cli.js"
},
"devDependencies": {
"@api.global/typedsocket": "^4.1.0",
"@git.zone/tsbuild": "^4.1.2",
"@git.zone/tsbundle": "^2.8.3",
"@api.global/typedsocket": "^4.1.2",
"@git.zone/tsbuild": "^4.3.0",
"@git.zone/tsbundle": "^2.9.1",
"@git.zone/tsrun": "^2.0.1",
"@git.zone/tstest": "^3.1.8",
"@git.zone/tswatch": "3.0.1",
"@git.zone/tstest": "^3.3.2",
"@git.zone/tswatch": "^3.3.0",
"@push.rocks/smartrx": "^3.0.10",
"@types/node": "^25.0.10"
"@types/node": "^25.5.0"
},
"dependencies": {
"@api.global/typedrequest": "^3.2.5",
"@api.global/typedrequest": "^3.3.0",
"@api.global/typedrequest-interfaces": "^3.0.19",
"@api.global/typedserver": "^8.3.0",
"@aws-sdk/client-s3": "^3.975.0",
"@design.estate/dees-catalog": "^3.41.2",
"@design.estate/dees-element": "^2.1.6",
"@api.global/typedserver": "^8.4.2",
"@aws-sdk/client-s3": "^3.1009.0",
"@design.estate/dees-catalog": "^3.48.5",
"@design.estate/dees-element": "^2.2.3",
"@push.rocks/early": "^4.0.4",
"@push.rocks/npmextra": "^5.3.3",
"@push.rocks/smartbucket": "^4.4.1",
"@push.rocks/smartconfig": "^6.0.0",
"@push.rocks/smartbucket": "^4.5.1",
"@push.rocks/smartcli": "^4.0.20",
"@push.rocks/smartdata": "^7.0.15",
"@push.rocks/smartdata": "^7.1.0",
"@push.rocks/smartfile": "^13.1.2",
"@push.rocks/smartlog": "^3.1.10",
"@push.rocks/smartlog": "^3.2.1",
"@push.rocks/smartlog-destination-local": "^9.0.2",
"@push.rocks/smartnetwork": "^4.4.0",
"@push.rocks/smartopen": "^2.0.0",
"@push.rocks/smartpath": "^6.0.0",
"@push.rocks/smartpromise": "^4.2.3",
"mongodb": "^7.0.0"
"mongodb": "^7.1.0"
},
"files": [
"ts/**/*",

3734
pnpm-lock.yaml generated

File diff suppressed because it is too large Load Diff

View File

@@ -1,6 +1,6 @@
# @git.zone/tsview
A powerful developer tool for browsing and managing S3-compatible storage and MongoDB databases through a sleek web UI — with real-time change streaming baked in. Built with TypeScript, designed for developers who need quick, visual access to their data stores. 🚀
A powerful developer tool for browsing and managing S3-compatible storage and MongoDB databases through a sleek web UI — with real-time change streaming baked in. Built with TypeScript, designed for developers who need quick, visual access to their data stores.
## Issue Reporting and Security
@@ -16,31 +16,34 @@ pnpm add -g @git.zone/tsview
pnpm add @git.zone/tsview
```
## Features
## Features
### 🗄️ S3 Storage Browser
### S3 Storage Browser
Powered by the `dees-storage-browser` component from `@design.estate/dees-catalog`:
- **Column View Navigation** — Mac Finder-style interface with resizable columns
- **List View** — Traditional key-based view with hierarchical navigation
- **Real-time Preview** — View images, JSON, text files, code, and more directly in the browser
- **Bucket Management** — Create, delete, and switch between buckets
- **File Operations** — Upload, download, delete objects
- **File Operations** — Upload, download, delete, move, and copy objects
- **In-place Text Editing** — Edit text files directly in the browser with change tracking
- **Smart Content Type Detection** — Automatic recognition for 20+ file types
- **Breadcrumb Navigation** — Clickable path traversal
### 🍃 MongoDB Browser
### MongoDB Browser
- **Database Explorer** — Hierarchical navigation through databases and collections
- **Database Overview** — Collection counts, data sizes, index stats at a glance
- **Document Viewer** — Paginated table view with JSON filter support
- **Document Editor** — Full CRUD with syntax-highlighted code editor and change tracking
- **Index Management** — View, create, and drop indexes
- **Aggregation Pipeline** — Run aggregation queries directly
- **Collection Stats** — Document counts, sizes, storage metrics
- **Server Status** — Connection info, version, uptime
- **Show/Hide System Databases** — Toggle visibility of `admin`, `local`, `config`
### Real-Time Change Streaming
### Real-Time Change Streaming
- **MongoDB Change Streams** — Live updates via native MongoDB change streams
- **S3 Change Detection** — Polling-based bucket monitoring with ETag comparison (5s intervals)
@@ -49,14 +52,14 @@ pnpm add @git.zone/tsview
- **WebSocket Subscriptions** — Per-collection, per-bucket, or global activity feed
- **Auto-Reconnect** — Subscriptions automatically restored after connection loss
### 🎨 Modern Web UI
### Modern Web UI
- 🌙 Dark theme designed for developer comfort
- 📱 Responsive layout with resizable panels
- ⌨️ Context menus for quick actions
- 🔌 Everything bundled — zero external runtime dependencies in the browser
- Dark theme designed for developer comfort
- Responsive layout with resizable panels
- Context menus for quick actions
- Everything bundled — zero external runtime dependencies in the browser
## Quick Start 🚀
## Quick Start
### 1. Configure Your Connection
@@ -80,7 +83,7 @@ Create a `.nogit/env.json` file in your project root:
tsview
```
That's it! 🎉 Your browser will automatically open to the viewer interface.
That's it! Your browser will automatically open to the viewer interface.
## CLI Usage
@@ -206,15 +209,15 @@ Or use individual variables:
tsview works with any S3-compatible storage:
| Provider | Status |
| ----------------------- | --------------------------- |
| **MinIO** | Perfect for local dev |
| **AWS S3** | Amazon's object storage |
| **DigitalOcean Spaces** | Simple object storage |
| **Backblaze B2** | S3-compatible API |
| **Cloudflare R2** | Zero egress fees |
| **Wasabi** | Hot cloud storage |
| **Self-hosted** | Any S3-compatible server |
| Provider | Status |
| ----------------------- | -------------------------- |
| **MinIO** | Perfect for local dev |
| **AWS S3** | Amazon's object storage |
| **DigitalOcean Spaces** | Simple object storage |
| **Backblaze B2** | S3-compatible API |
| **Cloudflare R2** | Zero egress fees |
| **Wasabi** | Hot cloud storage |
| **Self-hosted** | Any S3-compatible server |
## Supported File Types for Preview
@@ -244,9 +247,10 @@ tsview/
├── ts_web/ # Frontend
│ ├── elements/ # Web components (LitElement)
│ │ ├── tsview-app.ts # App shell + navigation
│ │ ├── tsview-s3-*.ts # S3 browser components
│ │ ├── tsview-mongo-*.ts # MongoDB browser components
│ │ └── tsview-activity-stream.ts # Real-time activity feed
│ ├── adapters/ # Data provider adapters
│ │ └── s3-data-provider.ts # IStorageDataProvider for dees-storage-browser
│ ├── services/ # API + WebSocket clients
│ ├── styles/ # Dark theme
│ └── utilities/ # Formatting helpers
@@ -257,7 +261,7 @@ tsview/
1. **Backend** — A `TypedServer` serves the bundled web UI and exposes a typed API via `TypedRequest` over HTTP. A `TypedSocket` WebSocket layer handles real-time streaming subscriptions.
2. **Frontend** — LitElement-based web components communicate with the backend via `TypedRequest`. The `ChangeStreamService` connects over WebSocket and distributes real-time events to active views via RxJS Subjects.
2. **Frontend** — LitElement-based web components communicate with the backend via `TypedRequest`. The S3 browser uses `dees-storage-browser` from `@design.estate/dees-catalog` with a custom `IStorageDataProvider` adapter. The `ChangeStreamService` connects over WebSocket and distributes real-time events to active views via RxJS Subjects.
3. **Streaming** — The `ChangeStreamManager` creates MongoDB Change Streams and S3 BucketWatchers on demand (one per subscribed resource). Changes are pushed to subscribed clients and accumulated in a 1000-event ring buffer for the Activity Stream view.

View File

@@ -14,8 +14,8 @@ tap.test('should create TsView instance', async () => {
tap.test('should have config methods', async () => {
const viewer = new tsview.TsView();
// Set S3 config
viewer.setS3Config({
// Set storage config
viewer.setStorageConfig({
endpoint: 'localhost',
port: 9000,
accessKey: 'test',
@@ -23,7 +23,7 @@ tap.test('should have config methods', async () => {
useSsl: false,
});
expect(viewer.config.hasS3()).toBeTrue();
expect(viewer.config.hasStorage()).toBeTrue();
expect(viewer.config.hasMongo()).toBeFalse();
// Set MongoDB config

View File

@@ -3,6 +3,6 @@
*/
export const commitinfo = {
name: '@git.zone/tsview',
version: '1.12.0',
version: '1.12.2',
description: 'A CLI tool for viewing S3 and MongoDB data with a web UI'
}

View File

@@ -119,7 +119,7 @@ export async function registerS3Handlers(
}
}
const objects: interfaces.IS3Object[] = [];
const objects: interfaces.IStorageObject[] = [];
const prefixSet = new Set<string>();
// List files in current directory

File diff suppressed because one or more lines are too long

View File

@@ -7,7 +7,7 @@ import type * as interfaces from '../interfaces/index.js';
* or accepts programmatic configuration.
*/
export class TsViewConfig {
private s3Config: interfaces.IS3Config | null = null;
private storageConfig: interfaces.IStorageConfig | null = null;
private mongoConfig: interfaces.IMongoConfig | null = null;
/**
@@ -29,7 +29,7 @@ export class TsViewConfig {
// Parse S3 config
if (envConfig.S3_HOST || envConfig.S3_ENDPOINT) {
this.s3Config = {
this.storageConfig = {
endpoint: envConfig.S3_ENDPOINT || envConfig.S3_HOST || '',
port: envConfig.S3_PORT ? parseInt(envConfig.S3_PORT, 10) : undefined,
accessKey: envConfig.S3_ACCESSKEY || '',
@@ -69,8 +69,8 @@ export class TsViewConfig {
/**
* Set S3 configuration programmatically
*/
public setS3Config(config: interfaces.IS3Config): void {
this.s3Config = config;
public setStorageConfig(config: interfaces.IStorageConfig): void {
this.storageConfig = config;
}
/**
@@ -83,8 +83,8 @@ export class TsViewConfig {
/**
* Get S3 configuration
*/
public getS3Config(): interfaces.IS3Config | null {
return this.s3Config;
public getStorageConfig(): interfaces.IStorageConfig | null {
return this.storageConfig;
}
/**
@@ -97,8 +97,8 @@ export class TsViewConfig {
/**
* Check if S3 is configured
*/
public hasS3(): boolean {
return this.s3Config !== null && !!this.s3Config.endpoint && !!this.s3Config.accessKey;
public hasStorage(): boolean {
return this.storageConfig !== null && !!this.storageConfig.endpoint && !!this.storageConfig.accessKey;
}
/**

View File

@@ -1,9 +1,9 @@
import type * as plugins from '../plugins.js';
/**
* Configuration for S3 connection
* Configuration for storage (S3-compatible) connection
*/
export interface IS3Config {
export interface IStorageConfig {
endpoint: string;
port?: number;
accessKey: string;
@@ -24,14 +24,14 @@ export interface IMongoConfig {
* Combined configuration for tsview
*/
export interface ITsViewConfig {
s3?: IS3Config;
s3?: IStorageConfig;
mongo?: IMongoConfig;
}
/**
* Configuration from npmextra.json for @git.zone/tsview
* Configuration from smartconfig.json for @git.zone/tsview
*/
export interface INpmextraConfig {
export interface ISmartconfigConfig {
port?: number; // Fixed port to use (optional)
killIfBusy?: boolean; // Kill process on port if busy (default: false)
openBrowser?: boolean; // Open browser on start (default: true)
@@ -97,7 +97,7 @@ export interface IReq_DeleteBucket extends plugins.typedrequestInterfaces.implem
};
}
export interface IS3Object {
export interface IStorageObject {
key: string;
size?: number;
lastModified?: string;
@@ -115,7 +115,7 @@ export interface IReq_ListObjects extends plugins.typedrequestInterfaces.impleme
delimiter?: string;
};
response: {
objects: IS3Object[];
objects: IStorageObject[];
prefixes: string[];
};
}

View File

@@ -6,7 +6,7 @@ export { path };
import * as early from '@push.rocks/early';
early.start('tsview');
import * as npmextra from '@push.rocks/npmextra';
import * as smartconfig from '@push.rocks/smartconfig';
import * as smartbucket from '@push.rocks/smartbucket';
import * as smartcli from '@push.rocks/smartcli';
import * as smartdata from '@push.rocks/smartdata';
@@ -21,7 +21,7 @@ import * as smartrx from '@push.rocks/smartrx';
export {
early,
npmextra,
smartconfig,
smartbucket,
smartcli,
smartdata,

View File

@@ -39,7 +39,7 @@ export class ViewServer {
this.changeStreamManager = new ChangeStreamManager(this.tsview);
// Register API handlers directly to server's router
if (this.tsview.config.hasS3()) {
if (this.tsview.config.hasStorage()) {
await registerS3Handlers(this.typedServer.typedrouter, this.tsview);
}
@@ -107,9 +107,9 @@ export class ViewServer {
)
);
// Subscribe to S3 bucket changes
// Subscribe to storage bucket changes
typedrouter.addTypedHandler(
new plugins.typedrequest.TypedHandler<interfaces.IReq_SubscribeS3>(
new plugins.typedrequest.TypedHandler<interfaces.IReq_SubscribeStorage>(
'subscribeS3',
async (reqData, context) => {
const connectionId = this.getConnectionId(context);
@@ -127,9 +127,9 @@ export class ViewServer {
)
);
// Unsubscribe from S3 bucket changes
// Unsubscribe from storage bucket changes
typedrouter.addTypedHandler(
new plugins.typedrequest.TypedHandler<interfaces.IReq_UnsubscribeS3>(
new plugins.typedrequest.TypedHandler<interfaces.IReq_UnsubscribeStorage>(
'unsubscribeS3',
async (reqData, context) => {
const connectionId = this.getConnectionId(context);

View File

@@ -1,7 +1,7 @@
import * as plugins from '../plugins.js';
import type { TsView } from '../tsview.classes.tsview.js';
import type * as interfaces from './interfaces.streaming.js';
import type { IS3ChangeEvent } from '@push.rocks/smartbucket';
import type { IStorageChangeEvent } from './interfaces.streaming.js';
/**
* Subscription entry tracking a client's subscription to a resource
@@ -21,19 +21,19 @@ interface IMongoWatcherEntry {
}
/**
* S3 watcher entry
* Storage watcher entry
*/
interface IS3WatcherEntry {
interface IStorageWatcherEntry {
watcher: plugins.smartbucket.BucketWatcher;
subscriptions: Map<string, ISubscriptionEntry>; // connectionId -> subscription
}
/**
* ChangeStreamManager manages real-time change streaming for both MongoDB and S3.
* ChangeStreamManager manages real-time change streaming for both MongoDB and storage.
*
* Features:
* - MongoDB Change Streams for real-time database updates
* - S3 BucketWatcher for polling-based S3 change detection
* - S3 BucketWatcher for polling-based storage change detection
* - Subscription management per WebSocket client
* - Activity stream with ring buffer for recent events
* - Automatic cleanup on client disconnect
@@ -45,8 +45,8 @@ export class ChangeStreamManager {
// MongoDB watchers: "db/collection" -> watcher entry
private mongoWatchers: Map<string, IMongoWatcherEntry> = new Map();
// S3 watchers: "bucket/prefix" -> watcher entry
private s3Watchers: Map<string, IS3WatcherEntry> = new Map();
// Storage watchers: "bucket/prefix" -> watcher entry
private storageWatchers: Map<string, IStorageWatcherEntry> = new Map();
// Activity subscribers: connectionId -> subscription entry
private activitySubscribers: Map<string, ISubscriptionEntry> = new Map();
@@ -57,7 +57,7 @@ export class ChangeStreamManager {
// Global watchers for the activity stream (started lazily on first subscriber)
private globalMongoWatcher: plugins.mongodb.ChangeStream | null = null;
private globalS3Watchers: Map<string, plugins.smartbucket.BucketWatcher> = new Map();
private globalStorageWatchers: Map<string, plugins.smartbucket.BucketWatcher> = new Map();
private globalWatchersActive: boolean = false;
// Counter for generating unique subscription IDs
@@ -89,9 +89,9 @@ export class ChangeStreamManager {
}
/**
* Get the S3 key for a bucket/prefix pair
* Get the storage key for a bucket/prefix pair
*/
private getS3Key(bucket: string, prefix?: string): string {
private getStorageKey(bucket: string, prefix?: string): string {
return prefix ? `${bucket}/${prefix}` : bucket;
}
@@ -280,24 +280,24 @@ export class ChangeStreamManager {
}
// ===========================================
// S3 Change Watching
// Storage Change Watching
// ===========================================
/**
* Subscribe a client to S3 bucket/prefix changes
* Subscribe a client to storage bucket/prefix changes
*/
public async subscribeToS3(
connectionId: string,
bucket: string,
prefix?: string
): Promise<{ success: boolean; subscriptionId: string }> {
const key = this.getS3Key(bucket, prefix);
const key = this.getStorageKey(bucket, prefix);
let entry = this.s3Watchers.get(key);
let entry = this.storageWatchers.get(key);
// Create watcher if it doesn't exist
if (!entry) {
const watcher = await this.createS3Watcher(bucket, prefix);
const watcher = await this.createStorageWatcher(bucket, prefix);
if (!watcher) {
return { success: false, subscriptionId: '' };
}
@@ -306,7 +306,7 @@ export class ChangeStreamManager {
watcher,
subscriptions: new Map(),
};
this.s3Watchers.set(key, entry);
this.storageWatchers.set(key, entry);
}
// Add subscription
@@ -317,47 +317,47 @@ export class ChangeStreamManager {
createdAt: new Date(),
});
console.log(`[ChangeStream] S3 subscription added: ${key} for connection ${connectionId}`);
console.log(`[ChangeStream] Storage subscription added: ${key} for connection ${connectionId}`);
return { success: true, subscriptionId };
}
/**
* Unsubscribe a client from S3 bucket/prefix changes
* Unsubscribe a client from storage bucket/prefix changes
*/
public async unsubscribeFromS3(
connectionId: string,
bucket: string,
prefix?: string
): Promise<boolean> {
const key = this.getS3Key(bucket, prefix);
const entry = this.s3Watchers.get(key);
const key = this.getStorageKey(bucket, prefix);
const entry = this.storageWatchers.get(key);
if (!entry) {
return false;
}
entry.subscriptions.delete(connectionId);
console.log(`[ChangeStream] S3 subscription removed: ${key} for connection ${connectionId}`);
console.log(`[ChangeStream] Storage subscription removed: ${key} for connection ${connectionId}`);
// Close watcher if no more subscribers
if (entry.subscriptions.size === 0) {
await this.closeS3Watcher(key);
await this.closeStorageWatcher(key);
}
return true;
}
/**
* Create an S3 bucket watcher
* Create a storage bucket watcher
*/
private async createS3Watcher(
private async createStorageWatcher(
bucket: string,
prefix?: string
): Promise<plugins.smartbucket.BucketWatcher | null> {
try {
const smartbucket = await this.tsview.getSmartBucket();
if (!smartbucket) {
console.error('[ChangeStream] S3 not configured');
console.error('[ChangeStream] Storage not configured');
return null;
}
@@ -371,10 +371,10 @@ export class ChangeStreamManager {
});
// Subscribe to change events
watcher.changeSubject.subscribe((eventOrEvents: IS3ChangeEvent | IS3ChangeEvent[]) => {
watcher.changeSubject.subscribe((eventOrEvents: IStorageChangeEvent | IStorageChangeEvent[]) => {
const events = Array.isArray(eventOrEvents) ? eventOrEvents : [eventOrEvents];
for (const event of events) {
this.handleS3Change(bucket, prefix, event);
this.handleStorageChange(bucket, prefix, event);
}
});
@@ -382,41 +382,41 @@ export class ChangeStreamManager {
await watcher.start();
await watcher.readyDeferred.promise;
console.log(`[ChangeStream] S3 watcher created for ${bucket}${prefix ? '/' + prefix : ''}`);
console.log(`[ChangeStream] Storage watcher created for ${bucket}${prefix ? '/' + prefix : ''}`);
return watcher;
} catch (error) {
console.error(`[ChangeStream] Failed to create S3 watcher for ${bucket}:`, error);
console.error(`[ChangeStream] Failed to create storage watcher for ${bucket}:`, error);
return null;
}
}
/**
* Handle an S3 change event
* Handle a storage change event
*/
private handleS3Change(bucket: string, prefix: string | undefined, event: IS3ChangeEvent): void {
const key = this.getS3Key(bucket, prefix);
const entry = this.s3Watchers.get(key);
private handleStorageChange(bucket: string, prefix: string | undefined, event: IStorageChangeEvent): void {
const key = this.getStorageKey(bucket, prefix);
const entry = this.storageWatchers.get(key);
if (!entry) return;
// Only add to activity buffer if global watchers are NOT active.
// When active, the global S3 watchers already feed the activity stream.
// When active, the global storage watchers already feed the activity stream.
if (!this.globalWatchersActive) {
this.addToActivityBuffer('s3', event);
this.addToActivityBuffer('storage', event);
}
// Push to all subscribed clients
this.pushS3ChangeToClients(key, event);
this.pushStorageChangeToClients(key, event);
}
/**
* Push S3 change to subscribed clients
* Push storage change to subscribed clients
*/
private async pushS3ChangeToClients(
private async pushStorageChangeToClients(
key: string,
event: IS3ChangeEvent
event: IStorageChangeEvent
): Promise<void> {
const entry = this.s3Watchers.get(key);
const entry = this.storageWatchers.get(key);
if (!entry || !this.typedSocket) return;
for (const [connectionId, _sub] of entry.subscriptions) {
@@ -426,31 +426,31 @@ export class ChangeStreamManager {
});
if (connection) {
const request = this.typedSocket.createTypedRequest<interfaces.IReq_PushS3Change>(
const request = this.typedSocket.createTypedRequest<interfaces.IReq_PushStorageChange>(
'pushS3Change',
connection
);
await request.fire({ event });
}
} catch (error) {
console.error(`[ChangeStream] Failed to push S3 change to ${connectionId}:`, error);
console.error(`[ChangeStream] Failed to push storage change to ${connectionId}:`, error);
}
}
}
/**
* Close an S3 bucket watcher
* Close a storage bucket watcher
*/
private async closeS3Watcher(key: string): Promise<void> {
const entry = this.s3Watchers.get(key);
private async closeStorageWatcher(key: string): Promise<void> {
const entry = this.storageWatchers.get(key);
if (!entry) return;
try {
await entry.watcher.stop();
this.s3Watchers.delete(key);
console.log(`[ChangeStream] S3 watcher closed for ${key}`);
this.storageWatchers.delete(key);
console.log(`[ChangeStream] Storage watcher closed for ${key}`);
} catch (error) {
console.error(`[ChangeStream] Error closing S3 watcher for ${key}:`, error);
console.error(`[ChangeStream] Error closing storage watcher for ${key}:`, error);
}
}
@@ -515,11 +515,11 @@ export class ChangeStreamManager {
* Add an event to the activity buffer
*/
private addToActivityBuffer(
source: 'mongodb' | 's3',
event: interfaces.IMongoChangeEvent | IS3ChangeEvent
source: 'mongodb' | 'storage',
event: interfaces.IMongoChangeEvent | IStorageChangeEvent
): void {
const activityEvent: interfaces.IActivityEvent = {
id: `evt_${Date.now()}_${Math.random().toString(36).substr(2, 9)}`,
id: `evt_${Date.now()}_${Math.random().toString(36).substring(2, 11)}`,
source,
event,
timestamp: new Date().toISOString(),
@@ -567,7 +567,7 @@ export class ChangeStreamManager {
/**
* Start global watchers when the first activity subscriber connects.
* These watch all MongoDB and S3 activity and feed into the activity buffer.
* These watch all MongoDB and storage activity and feed into the activity buffer.
*/
private async startGlobalWatchers(): Promise<void> {
if (this.globalWatchersActive) return;
@@ -577,7 +577,7 @@ export class ChangeStreamManager {
await Promise.all([
this.startGlobalMongoWatcher(),
this.startGlobalS3Watchers(),
this.startGlobalStorageWatchers(),
]);
}
@@ -628,13 +628,13 @@ export class ChangeStreamManager {
}
/**
* Start S3 bucket watchers — one BucketWatcher per bucket.
* Start storage bucket watchers — one BucketWatcher per bucket.
*/
private async startGlobalS3Watchers(): Promise<void> {
private async startGlobalStorageWatchers(): Promise<void> {
try {
const smartbucket = await this.tsview.getSmartBucket();
if (!smartbucket) {
console.log('[ChangeStream] S3 not configured, skipping global S3 watchers');
console.log('[ChangeStream] Storage not configured, skipping global storage watchers');
return;
}
@@ -652,26 +652,26 @@ export class ChangeStreamManager {
bufferTimeMs: 500,
});
watcher.changeSubject.subscribe((eventOrEvents: IS3ChangeEvent | IS3ChangeEvent[]) => {
watcher.changeSubject.subscribe((eventOrEvents: IStorageChangeEvent | IStorageChangeEvent[]) => {
const events = Array.isArray(eventOrEvents) ? eventOrEvents : [eventOrEvents];
for (const event of events) {
this.addToActivityBuffer('s3', event);
this.addToActivityBuffer('storage', event);
}
});
await watcher.start();
await watcher.readyDeferred.promise;
this.globalS3Watchers.set(bucketName, watcher);
console.log(`[ChangeStream] Global S3 watcher started for bucket: ${bucketName}`);
this.globalStorageWatchers.set(bucketName, watcher);
console.log(`[ChangeStream] Global storage watcher started for bucket: ${bucketName}`);
} catch (bucketError) {
console.error(`[ChangeStream] Failed to start global S3 watcher for bucket ${bucketName}:`, bucketError);
console.error(`[ChangeStream] Failed to start global storage watcher for bucket ${bucketName}:`, bucketError);
}
}
console.log(`[ChangeStream] Global S3 watchers started (${this.globalS3Watchers.size}/${bucketNames.length} buckets)`);
console.log(`[ChangeStream] Global storage watchers started (${this.globalStorageWatchers.size}/${bucketNames.length} buckets)`);
} catch (error) {
console.error('[ChangeStream] Failed to start global S3 watchers:', error);
console.error('[ChangeStream] Failed to start global storage watchers:', error);
}
}
@@ -694,16 +694,16 @@ export class ChangeStreamManager {
this.globalMongoWatcher = null;
}
// Close all global S3 watchers
for (const [bucketName, watcher] of this.globalS3Watchers) {
// Close all global storage watchers
for (const [bucketName, watcher] of this.globalStorageWatchers) {
try {
await watcher.stop();
console.log(`[ChangeStream] Global S3 watcher stopped for bucket: ${bucketName}`);
console.log(`[ChangeStream] Global storage watcher stopped for bucket: ${bucketName}`);
} catch (error) {
console.error(`[ChangeStream] Error closing global S3 watcher for ${bucketName}:`, error);
console.error(`[ChangeStream] Error closing global storage watcher for ${bucketName}:`, error);
}
}
this.globalS3Watchers.clear();
this.globalStorageWatchers.clear();
this.globalWatchersActive = false;
console.log('[ChangeStream] Global watchers stopped');
@@ -729,12 +729,12 @@ export class ChangeStreamManager {
}
}
// Clean up S3 subscriptions
for (const [key, entry] of this.s3Watchers) {
// Clean up storage subscriptions
for (const [key, entry] of this.storageWatchers) {
if (entry.subscriptions.has(connectionId)) {
entry.subscriptions.delete(connectionId);
if (entry.subscriptions.size === 0) {
await this.closeS3Watcher(key);
await this.closeStorageWatcher(key);
}
}
}
@@ -762,9 +762,9 @@ export class ChangeStreamManager {
await this.closeMongoWatcher(key);
}
// Close all S3 watchers
for (const key of this.s3Watchers.keys()) {
await this.closeS3Watcher(key);
// Close all storage watchers
for (const key of this.storageWatchers.keys()) {
await this.closeStorageWatcher(key);
}
// Clear activity buffer and subscribers

View File

@@ -1,7 +1,8 @@
import type * as plugins from '../plugins.js';
// Re-export S3 change event from smartbucket
export type { IS3ChangeEvent } from '@push.rocks/smartbucket';
// Re-export storage change event from smartbucket
import type { IStorageChangeEvent } from '@push.rocks/smartbucket';
export type { IStorageChangeEvent };
/**
* MongoDB change event - wraps smartdata watcher output
@@ -24,8 +25,8 @@ export interface IMongoChangeEvent {
*/
export interface IActivityEvent {
id: string;
source: 'mongodb' | 's3';
event: IMongoChangeEvent | import('@push.rocks/smartbucket').IS3ChangeEvent;
source: 'mongodb' | 'storage';
event: IMongoChangeEvent | IStorageChangeEvent;
timestamp: string;
}
@@ -69,11 +70,11 @@ export interface IReq_UnsubscribeMongo extends plugins.typedrequestInterfaces.im
}
/**
* Subscribe to S3 bucket/prefix changes
* Subscribe to storage bucket/prefix changes
*/
export interface IReq_SubscribeS3 extends plugins.typedrequestInterfaces.implementsTR<
export interface IReq_SubscribeStorage extends plugins.typedrequestInterfaces.implementsTR<
plugins.typedrequestInterfaces.ITypedRequest,
IReq_SubscribeS3
IReq_SubscribeStorage
> {
method: 'subscribeS3';
request: {
@@ -87,11 +88,11 @@ export interface IReq_SubscribeS3 extends plugins.typedrequestInterfaces.impleme
}
/**
* Unsubscribe from S3 bucket/prefix changes
* Unsubscribe from storage bucket/prefix changes
*/
export interface IReq_UnsubscribeS3 extends plugins.typedrequestInterfaces.implementsTR<
export interface IReq_UnsubscribeStorage extends plugins.typedrequestInterfaces.implementsTR<
plugins.typedrequestInterfaces.ITypedRequest,
IReq_UnsubscribeS3
IReq_UnsubscribeStorage
> {
method: 'unsubscribeS3';
request: {
@@ -104,7 +105,7 @@ export interface IReq_UnsubscribeS3 extends plugins.typedrequestInterfaces.imple
}
/**
* Subscribe to activity stream (all changes from MongoDB and S3)
* Subscribe to activity stream (all changes from MongoDB and storage)
*/
export interface IReq_SubscribeActivity extends plugins.typedrequestInterfaces.implementsTR<
plugins.typedrequestInterfaces.ITypedRequest,
@@ -169,15 +170,15 @@ export interface IReq_PushMongoChange extends plugins.typedrequestInterfaces.imp
}
/**
* Server pushes S3 change to client
* Server pushes storage change to client
*/
export interface IReq_PushS3Change extends plugins.typedrequestInterfaces.implementsTR<
export interface IReq_PushStorageChange extends plugins.typedrequestInterfaces.implementsTR<
plugins.typedrequestInterfaces.ITypedRequest,
IReq_PushS3Change
IReq_PushStorageChange
> {
method: 'pushS3Change';
request: {
event: import('@push.rocks/smartbucket').IS3ChangeEvent;
event: IStorageChangeEvent;
};
response: {
received: boolean;
@@ -206,7 +207,7 @@ export interface IReq_PushActivityEvent extends plugins.typedrequestInterfaces.i
export interface ISubscriptionTag extends plugins.typedrequestInterfaces.ITag {
name: 'subscription';
payload: {
type: 'mongo' | 's3' | 'activity';
type: 'mongo' | 'storage' | 'activity';
key: string; // e.g., "db/collection" or "bucket/prefix" or "activity"
};
}

View File

@@ -33,8 +33,8 @@ export class TsView {
/**
* Set S3 configuration programmatically
*/
public setS3Config(config: interfaces.IS3Config): void {
this.config.setS3Config(config);
public setStorageConfig(config: interfaces.IStorageConfig): void {
this.config.setStorageConfig(config);
}
/**
@@ -52,17 +52,17 @@ export class TsView {
return this.smartbucketInstance;
}
const s3Config = this.config.getS3Config();
if (!s3Config) {
const storageConfig = this.config.getStorageConfig();
if (!storageConfig) {
return null;
}
this.smartbucketInstance = new plugins.smartbucket.SmartBucket({
endpoint: s3Config.endpoint,
port: s3Config.port,
accessKey: s3Config.accessKey,
accessSecret: s3Config.accessSecret,
useSsl: s3Config.useSsl ?? true,
endpoint: storageConfig.endpoint,
port: storageConfig.port,
accessKey: storageConfig.accessKey,
accessSecret: storageConfig.accessSecret,
useSsl: storageConfig.useSsl ?? true,
});
return this.smartbucketInstance;
@@ -103,11 +103,11 @@ export class TsView {
}
/**
* Load configuration from npmextra.json
* Load configuration from smartconfig.json
*/
private loadNpmextraConfig(cwd?: string): interfaces.INpmextraConfig {
const npmextra = new plugins.npmextra.Npmextra(cwd || process.cwd());
const config = npmextra.dataFor<interfaces.INpmextraConfig>('@git.zone/tsview', {});
private loadSmartconfigConfig(cwd?: string): interfaces.ISmartconfigConfig {
const smartconfigInstance = new plugins.smartconfig.Smartconfig(cwd || process.cwd());
const config = smartconfigInstance.dataFor<interfaces.ISmartconfigConfig>('@git.zone/tsview', {});
return config || {};
}
@@ -135,7 +135,7 @@ export class TsView {
* @param cliPort - Optional port number from CLI (highest priority)
*/
public async start(cliPort?: number): Promise<number> {
const npmextraConfig = await this.loadNpmextraConfig();
const smartconfigConfig = await this.loadSmartconfigConfig();
let port: number;
let portWasExplicitlySet = false;
@@ -144,9 +144,9 @@ export class TsView {
// CLI has highest priority
port = cliPort;
portWasExplicitlySet = true;
} else if (npmextraConfig.port) {
} else if (smartconfigConfig.port) {
// Config port specified
port = npmextraConfig.port;
port = smartconfigConfig.port;
portWasExplicitlySet = true;
} else {
// Auto-find free port
@@ -158,11 +158,11 @@ export class TsView {
const isFree = await network.isLocalPortUnused(port);
if (!isFree) {
if (npmextraConfig.killIfBusy) {
if (smartconfigConfig.killIfBusy) {
console.log(`Port ${port} is busy. Killing existing process...`);
await this.killProcessOnPort(port);
} else if (portWasExplicitlySet) {
throw new Error(`Port ${port} is busy. Set "killIfBusy": true in npmextra.json to auto-kill, or use a different port.`);
throw new Error(`Port ${port} is busy. Set "killIfBusy": true in smartconfig.json to auto-kill, or use a different port.`);
} else {
// Auto port was already free, shouldn't happen, but fallback
port = await this.findFreePort(port + 1);
@@ -175,7 +175,7 @@ export class TsView {
console.log(`TsView server started on http://localhost:${port}`);
// Open browser (default: true, can be disabled via config)
const shouldOpenBrowser = npmextraConfig.openBrowser !== false;
const shouldOpenBrowser = smartconfigConfig.openBrowser !== false;
if (shouldOpenBrowser) {
try {
await plugins.smartopen.openUrl(`http://localhost:${port}`);

View File

@@ -19,7 +19,7 @@ export class TsViewCli {
this.smartcli.standardCommand().subscribe(async (argvArg) => {
await this.startViewer({
port: argvArg.port as number | undefined,
s3Only: false,
storageOnly: false,
mongoOnly: false,
});
});
@@ -29,7 +29,7 @@ export class TsViewCli {
s3Command.subscribe(async (argvArg) => {
await this.startViewer({
port: argvArg.port as number | undefined,
s3Only: true,
storageOnly: true,
mongoOnly: false,
});
});
@@ -39,7 +39,7 @@ export class TsViewCli {
mongoCommand.subscribe(async (argvArg) => {
await this.startViewer({
port: argvArg.port as number | undefined,
s3Only: false,
storageOnly: false,
mongoOnly: true,
});
});
@@ -56,7 +56,7 @@ export class TsViewCli {
*/
private async startViewer(options: {
port?: number;
s3Only: boolean;
storageOnly: boolean;
mongoOnly: boolean;
}): Promise<void> {
console.log('Starting TsView...');
@@ -67,10 +67,10 @@ export class TsViewCli {
await viewer.loadConfigFromEnv();
// Check what's configured
const hasS3 = viewer.config.hasS3();
const hasStorage = viewer.config.hasStorage();
const hasMongo = viewer.config.hasMongo();
if (!hasS3 && !hasMongo) {
if (!hasStorage && !hasMongo) {
console.error('Error: No S3 or MongoDB configuration found.');
console.error('Please create .nogit/env.json with your configuration.');
console.error('');
@@ -87,7 +87,7 @@ export class TsViewCli {
process.exit(1);
}
if (options.s3Only && !hasS3) {
if (options.storageOnly && !hasStorage) {
console.error('Error: S3 configuration not found in .nogit/env.json');
process.exit(1);
}
@@ -98,7 +98,7 @@ export class TsViewCli {
}
// Log what's available
if (hasS3) {
if (hasStorage) {
console.log('S3 storage configured');
}
if (hasMongo) {

View File

@@ -3,6 +3,6 @@
*/
export const commitinfo = {
name: '@git.zone/tsview',
version: '1.12.0',
version: '1.12.2',
description: 'A CLI tool for viewing S3 and MongoDB data with a web UI'
}

View File

@@ -1,10 +1,10 @@
import type { IS3DataProvider } from '@design.estate/dees-catalog';
import type { IStorageDataProvider } from '@design.estate/dees-catalog';
import { apiService } from '../services/index.js';
/**
* Adapter that implements IS3DataProvider by delegating to tsview's ApiService
* Adapter that implements IStorageDataProvider by delegating to tsview's ApiService
*/
export class TsviewS3DataProvider implements IS3DataProvider {
export class TsviewS3DataProvider implements IStorageDataProvider {
async listObjects(bucket: string, prefix?: string, delimiter?: string) {
return apiService.listObjects(bucket, prefix, delimiter);
}

View File

@@ -1,10 +1,11 @@
import * as plugins from '../plugins.js';
import { changeStreamService, type IActivityEvent, type IMongoChangeEvent, type IS3ChangeEvent } from '../services/index.js';
import { changeStreamService, type IActivityEvent, type IMongoChangeEvent } from '../services/index.js';
import type { IStorageChangeEvent } from '@design.estate/dees-catalog';
import { themeStyles } from '../styles/index.js';
const { html, css, cssManager, customElement, property, state, DeesElement } = plugins;
type TFilterMode = 'all' | 'mongodb' | 's3';
type TFilterMode = 'all' | 'mongodb' | 'storage';
@customElement('tsview-activity-stream')
export class TsviewActivityStream extends DeesElement {
@@ -426,8 +427,8 @@ export class TsviewActivityStream extends DeesElement {
const mongoEvent = event.event as IMongoChangeEvent;
return `${mongoEvent.database}.${mongoEvent.collection}`;
} else {
const s3Event = event.event as IS3ChangeEvent;
return s3Event.bucket;
const storageEvent = event.event as IStorageChangeEvent;
return storageEvent.bucket;
}
}
@@ -439,8 +440,8 @@ export class TsviewActivityStream extends DeesElement {
}
return '';
} else {
const s3Event = event.event as IS3ChangeEvent;
return s3Event.key;
const storageEvent = event.event as IStorageChangeEvent;
return storageEvent.key;
}
}
@@ -464,12 +465,12 @@ export class TsviewActivityStream extends DeesElement {
})
);
} else {
const s3Event = event.event as IS3ChangeEvent;
const storageEvent = event.event as IStorageChangeEvent;
this.dispatchEvent(
new CustomEvent('navigate-to-s3', {
detail: {
bucket: s3Event.bucket,
key: s3Event.key,
bucket: storageEvent.bucket,
key: storageEvent.key,
},
bubbles: true,
composed: true,
@@ -529,8 +530,8 @@ export class TsviewActivityStream extends DeesElement {
MongoDB
</button>
<button
class="filter-tab ${this.filterMode === 's3' ? 'active' : ''}"
@click=${() => this.setFilterMode('s3')}
class="filter-tab ${this.filterMode === 'storage' ? 'active' : ''}"
@click=${() => this.setFilterMode('storage')}
>
S3
</button>

View File

@@ -2,7 +2,7 @@ import * as plugins from '../plugins.js';
import { apiService, changeStreamService } from '../services/index.js';
import { themeStyles } from '../styles/index.js';
import { s3DataProvider } from '../adapters/s3-data-provider.js';
import type { IS3ChangeEvent } from '@design.estate/dees-catalog';
import type { IStorageChangeEvent } from '@design.estate/dees-catalog';
const { html, css, cssManager, customElement, state, DeesElement } = plugins;
const { DeesContextmenu } = plugins.deesCatalog;
@@ -1041,16 +1041,16 @@ export class TsviewApp extends DeesElement {
return html`
<div class="content-area">
<dees-s3-browser
<dees-storage-browser
.dataProvider=${s3DataProvider}
.bucketName=${this.selectedBucket}
.onChangeEvent=${(callback: (event: IS3ChangeEvent) => void) => {
.onChangeEvent=${(callback: (event: IStorageChangeEvent) => void) => {
const sub = changeStreamService
.getBucketChanges(this.selectedBucket)
.subscribe(callback);
return () => sub.unsubscribe();
}}
></dees-s3-browser>
></dees-storage-browser>
</div>
`;
}

View File

@@ -1,13 +1,6 @@
import * as plugins from '../plugins.js';
// Import interfaces from shared types
// Note: In bundled form these are inlined
export interface IS3Object {
key: string;
size?: number;
lastModified?: string;
isPrefix?: boolean;
}
import type { IStorageObject } from '@design.estate/dees-catalog';
export type { IStorageObject };
export interface IMongoDatabase {
name: string;
@@ -100,7 +93,7 @@ export class ApiService {
bucketName: string,
prefix?: string,
delimiter?: string
): Promise<{ objects: IS3Object[]; prefixes: string[] }> {
): Promise<{ objects: IStorageObject[]; prefixes: string[] }> {
return this.request('listObjects', { bucketName, prefix, delimiter });
}

View File

@@ -1,4 +1,6 @@
import * as plugins from '../plugins.js';
import type { IStorageChangeEvent } from '@design.estate/dees-catalog';
export type { IStorageChangeEvent };
/**
* MongoDB change event
@@ -16,25 +18,13 @@ export interface IMongoChangeEvent {
timestamp: string;
}
/**
* S3 change event
*/
export interface IS3ChangeEvent {
type: 'add' | 'modify' | 'delete';
key: string;
size?: number;
etag?: string;
lastModified?: Date;
bucket: string;
}
/**
* Combined activity event
*/
export interface IActivityEvent {
id: string;
source: 'mongodb' | 's3';
event: IMongoChangeEvent | IS3ChangeEvent;
source: 'mongodb' | 'storage';
event: IMongoChangeEvent | IStorageChangeEvent;
timestamp: string;
}
@@ -42,7 +32,7 @@ export interface IActivityEvent {
* Subscription info tracked by the service
*/
interface ISubscription {
type: 'mongo' | 's3' | 'activity';
type: 'mongo' | 'storage' | 'activity';
key: string; // "db/collection" or "bucket/prefix" or "activity"
subscriptionId: string;
}
@@ -69,7 +59,7 @@ export class ChangeStreamService {
// RxJS Subjects for UI components
public readonly mongoChanges$ = new plugins.smartrx.rxjs.Subject<IMongoChangeEvent>();
public readonly s3Changes$ = new plugins.smartrx.rxjs.Subject<IS3ChangeEvent>();
public readonly storageChanges$ = new plugins.smartrx.rxjs.Subject<IStorageChangeEvent>();
public readonly activityEvents$ = new plugins.smartrx.rxjs.Subject<IActivityEvent>();
public readonly connectionStatus$ = new plugins.smartrx.rxjs.ReplaySubject<'connected' | 'disconnected' | 'connecting'>(1);
@@ -193,8 +183,8 @@ export class ChangeStreamService {
router.addTypedHandler(
new plugins.typedrequest.TypedHandler<any>(
'pushS3Change',
async (data: { event: IS3ChangeEvent }) => {
this.s3Changes$.next(data.event);
async (data: { event: IStorageChangeEvent }) => {
this.storageChanges$.next(data.event);
return { received: true };
}
)
@@ -540,8 +530,8 @@ export class ChangeStreamService {
/**
* Get S3 changes as an Observable
*/
public getS3Changes(): plugins.smartrx.rxjs.Observable<IS3ChangeEvent> {
return this.s3Changes$.asObservable();
public getStorageChanges(): plugins.smartrx.rxjs.Observable<IStorageChangeEvent> {
return this.storageChanges$.asObservable();
}
/**
@@ -565,8 +555,8 @@ export class ChangeStreamService {
/**
* Get filtered S3 changes for a specific bucket/prefix
*/
public getBucketChanges(bucket: string, prefix?: string): plugins.smartrx.rxjs.Observable<IS3ChangeEvent> {
return this.s3Changes$.pipe(
public getBucketChanges(bucket: string, prefix?: string): plugins.smartrx.rxjs.Observable<IStorageChangeEvent> {
return this.storageChanges$.pipe(
plugins.smartrx.rxjs.ops.filter((event) => {
if (event.bucket !== bucket) return false;
if (prefix && !event.key.startsWith(prefix)) return false;