Compare commits
17 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| bb7742b1a0 | |||
| 9f15e2fa4e | |||
| 4026f09339 | |||
| 961841cdf7 | |||
| 792216f7c1 | |||
| b1f7342b16 | |||
| 2a21ac3075 | |||
| bd3823741b | |||
| 2c23b8862b | |||
| 5a25f22fc5 | |||
| 219a34e6a5 | |||
| 69ab8f3436 | |||
| 1b5b023556 | |||
| 61a83f0c03 | |||
| a9448ec0df | |||
| a29f13c75a | |||
| 02b3a79d99 |
@@ -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",
|
||||
2
.vscode/settings.json
vendored
2
.vscode/settings.json
vendored
@@ -1,7 +1,7 @@
|
||||
{
|
||||
"json.schemas": [
|
||||
{
|
||||
"fileMatch": ["/npmextra.json"],
|
||||
"fileMatch": ["/.smartconfig.json"],
|
||||
"schema": {
|
||||
"type": "object",
|
||||
"properties": {
|
||||
|
||||
48
changelog.md
48
changelog.md
@@ -1,5 +1,53 @@
|
||||
# Changelog
|
||||
|
||||
## 2026-03-24 - 1.12.9 - fix(package)
|
||||
bump package version to 1.12.8
|
||||
|
||||
- Updates the package metadata version with no indicated source changes.
|
||||
|
||||
## 2026-03-24 - 1.12.8 - fix(package)
|
||||
bump package version to 1.12.8
|
||||
|
||||
- Updates the project package version from 1.12.7 to 1.12.8.
|
||||
|
||||
## 2026-03-24 - 1.12.7 - fix(deps)
|
||||
bump aws sdk, smartdata, and tswatch dependencies
|
||||
|
||||
- update @aws-sdk/client-s3 from ^3.1015.0 to ^3.1016.0
|
||||
- update @push.rocks/smartdata from ^7.1.0 to ^7.1.1
|
||||
- update @git.zone/tswatch from ^3.3.1 to ^3.3.2
|
||||
|
||||
## 2026-03-24 - 1.12.6 - fix(build)
|
||||
remove skiplibcheck from the build script
|
||||
|
||||
- Updates the build command to run tsbuild without the --skiplibcheck flag.
|
||||
- Tightens TypeScript build validation by including library type checks during builds.
|
||||
|
||||
## 2026-03-24 - 1.12.5 - fix(package)
|
||||
bump package version to 1.12.5
|
||||
|
||||
- Updates the package metadata version from 1.12.4 to 1.12.5.
|
||||
|
||||
## 2026-03-24 - 1.12.4 - fix(config)
|
||||
migrate project config to .smartconfig.json and refresh build settings
|
||||
|
||||
- replaces npmextra.json with .smartconfig.json and updates packaged files accordingly
|
||||
- adds --skiplibcheck to the build script and simplifies tsconfig settings
|
||||
- bumps build and runtime dependencies and updates README references to the new config file
|
||||
|
||||
## 2026-03-24 - 1.12.3 - fix(package)
|
||||
bump package version to 1.12.3
|
||||
|
||||
- Updates the package version from 1.12.2 to 1.12.3.
|
||||
|
||||
## 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
|
||||
|
||||
|
||||
24
package.json
24
package.json
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "@git.zone/tsview",
|
||||
"version": "1.12.1",
|
||||
"version": "1.12.9",
|
||||
"private": false,
|
||||
"description": "A CLI tool for viewing S3 and MongoDB data with a web UI",
|
||||
"main": "dist_ts/index.js",
|
||||
@@ -21,26 +21,26 @@
|
||||
},
|
||||
"devDependencies": {
|
||||
"@api.global/typedsocket": "^4.1.2",
|
||||
"@git.zone/tsbuild": "^4.3.0",
|
||||
"@git.zone/tsbundle": "^2.9.1",
|
||||
"@git.zone/tsbuild": "^4.4.0",
|
||||
"@git.zone/tsbundle": "^2.10.0",
|
||||
"@git.zone/tsrun": "^2.0.1",
|
||||
"@git.zone/tstest": "^3.3.2",
|
||||
"@git.zone/tswatch": "^3.3.0",
|
||||
"@git.zone/tstest": "^3.5.1",
|
||||
"@git.zone/tswatch": "^3.3.2",
|
||||
"@push.rocks/smartrx": "^3.0.10",
|
||||
"@types/node": "^25.5.0"
|
||||
},
|
||||
"dependencies": {
|
||||
"@api.global/typedrequest": "^3.3.0",
|
||||
"@api.global/typedrequest-interfaces": "^3.0.19",
|
||||
"@api.global/typedserver": "^8.4.2",
|
||||
"@aws-sdk/client-s3": "^3.1009.0",
|
||||
"@design.estate/dees-catalog": "^3.48.5",
|
||||
"@api.global/typedserver": "^8.4.6",
|
||||
"@aws-sdk/client-s3": "^3.1016.0",
|
||||
"@design.estate/dees-catalog": "^3.49.0",
|
||||
"@design.estate/dees-element": "^2.2.3",
|
||||
"@push.rocks/early": "^4.0.4",
|
||||
"@push.rocks/npmextra": "^5.3.3",
|
||||
"@push.rocks/smartbucket": "^4.5.1",
|
||||
"@push.rocks/smartcli": "^4.0.20",
|
||||
"@push.rocks/smartdata": "^7.1.0",
|
||||
"@push.rocks/smartconfig": "^6.0.1",
|
||||
"@push.rocks/smartdata": "^7.1.1",
|
||||
"@push.rocks/smartfile": "^13.1.2",
|
||||
"@push.rocks/smartlog": "^3.2.1",
|
||||
"@push.rocks/smartlog-destination-local": "^9.0.2",
|
||||
@@ -48,7 +48,7 @@
|
||||
"@push.rocks/smartopen": "^2.0.0",
|
||||
"@push.rocks/smartpath": "^6.0.0",
|
||||
"@push.rocks/smartpromise": "^4.2.3",
|
||||
"mongodb": "^7.1.0"
|
||||
"mongodb": "^7.1.1"
|
||||
},
|
||||
"files": [
|
||||
"ts/**/*",
|
||||
@@ -59,7 +59,7 @@
|
||||
"dist_ts_web/**/*",
|
||||
"assets/**/*",
|
||||
"cli.js",
|
||||
"npmextra.json",
|
||||
".smartconfig.json",
|
||||
"readme.md"
|
||||
],
|
||||
"browserslist": [
|
||||
|
||||
2441
pnpm-lock.yaml
generated
2441
pnpm-lock.yaml
generated
File diff suppressed because it is too large
Load Diff
112
readme.md
112
readme.md
@@ -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 during development.
|
||||
|
||||
## Issue Reporting and Security
|
||||
|
||||
@@ -16,54 +16,11 @@ pnpm add -g @git.zone/tsview
|
||||
pnpm add @git.zone/tsview
|
||||
```
|
||||
|
||||
## Features
|
||||
|
||||
### 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, 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
|
||||
|
||||
- **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
|
||||
|
||||
- **MongoDB Change Streams** — Live updates via native MongoDB change streams
|
||||
- **S3 Change Detection** — Polling-based bucket monitoring with ETag comparison (5s intervals)
|
||||
- **Activity Stream** — Combined timeline of all changes from both sources, filterable by type
|
||||
- **Live Indicators** — Green dot + change count badges on active views
|
||||
- **WebSocket Subscriptions** — Per-collection, per-bucket, or global activity feed
|
||||
- **Auto-Reconnect** — Subscriptions automatically restored after connection loss
|
||||
|
||||
### 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
|
||||
|
||||
## Quick Start
|
||||
## 🚀 Quick Start
|
||||
|
||||
### 1. Configure Your Connection
|
||||
|
||||
Create a `.nogit/env.json` file in your project root:
|
||||
Create a `.nogit/env.json` file in your project root (auto-generated by `gitzone service`):
|
||||
|
||||
```json
|
||||
{
|
||||
@@ -83,7 +40,50 @@ 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 opens automatically to the viewer interface.
|
||||
|
||||
## ✨ Features
|
||||
|
||||
### 🗄️ S3 Storage Browser
|
||||
|
||||
Powered by `dees-storage-browser` 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, code, and more directly in the browser
|
||||
- **Bucket Management** — Create, delete, and switch between buckets
|
||||
- **File Operations** — Upload, download, delete, move, and copy objects
|
||||
- **In-place Text Editing** — Edit text files directly with change tracking
|
||||
- **Smart Content Type Detection** — Automatic recognition for 20+ file types
|
||||
- **Breadcrumb Navigation** — Clickable path traversal
|
||||
|
||||
### 🍃 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
|
||||
|
||||
- **MongoDB Change Streams** — Live updates via native MongoDB change streams
|
||||
- **S3 Change Detection** — Polling-based bucket monitoring with ETag comparison (5s intervals)
|
||||
- **Activity Stream** — Combined timeline of all changes from both sources, filterable by type
|
||||
- **Live Indicators** — Green dot + change count badges on active views
|
||||
- **WebSocket Subscriptions** — Per-collection, per-bucket, or global activity feed
|
||||
- **Auto-Reconnect** — Subscriptions automatically restored after connection loss
|
||||
|
||||
### 🎨 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
|
||||
|
||||
## CLI Usage
|
||||
|
||||
@@ -116,7 +116,7 @@ const viewer = new TsView();
|
||||
await viewer.loadConfigFromEnv();
|
||||
|
||||
// Option 2: Configure programmatically
|
||||
viewer.setS3Config({
|
||||
viewer.setStorageConfig({
|
||||
endpoint: 'localhost',
|
||||
port: 9000,
|
||||
accessKey: 'minioadmin',
|
||||
@@ -130,7 +130,7 @@ viewer.setMongoConfig({
|
||||
});
|
||||
|
||||
// Option 3: Cloud services
|
||||
viewer.setS3Config({
|
||||
viewer.setStorageConfig({
|
||||
endpoint: 's3.amazonaws.com',
|
||||
accessKey: 'AKIAXXXXXXX',
|
||||
accessSecret: 'your-secret-key',
|
||||
@@ -156,7 +156,7 @@ await viewer.stop();
|
||||
|
||||
## Configuration
|
||||
|
||||
### Project-level via `npmextra.json`
|
||||
### Project-level via `.smartconfig.json`
|
||||
|
||||
```json
|
||||
{
|
||||
@@ -174,7 +174,7 @@ await viewer.stop();
|
||||
| `killIfBusy` | `boolean` | `false` | Kill existing process if port is busy |
|
||||
| `openBrowser` | `boolean` | `true` | Automatically open browser on start |
|
||||
|
||||
**Port priority:** CLI `--port` flag → `npmextra.json` → auto-detect
|
||||
**Port priority:** CLI `--port` flag → `.smartconfig.json` → auto-detect
|
||||
|
||||
### Environment Variables (`.nogit/env.json`)
|
||||
|
||||
@@ -229,11 +229,11 @@ tsview works with any S3-compatible storage:
|
||||
| **Data** | `.csv`, `.xml`, `.yaml`, `.yml` |
|
||||
| **Documents** | `.pdf` |
|
||||
|
||||
## Architecture
|
||||
## 🏗️ Architecture
|
||||
|
||||
```
|
||||
tsview/
|
||||
├── ts/ # Backend
|
||||
├── ts/ # Backend (Node.js)
|
||||
│ ├── api/ # TypedRequest API handlers
|
||||
│ │ ├── handlers.s3.ts # S3 bucket & object operations
|
||||
│ │ └── handlers.mongodb.ts # MongoDB CRUD & admin operations
|
||||
@@ -244,7 +244,7 @@ tsview/
|
||||
│ │ └── interfaces.streaming.ts # Subscription interfaces
|
||||
│ ├── interfaces/ # Shared TypeScript interfaces
|
||||
│ └── tsview.classes.tsview.ts # Main class
|
||||
├── ts_web/ # Frontend
|
||||
├── ts_web/ # Frontend (bundled via esbuild → base64ts)
|
||||
│ ├── elements/ # Web components (LitElement)
|
||||
│ │ ├── tsview-app.ts # App shell + navigation
|
||||
│ │ ├── tsview-mongo-*.ts # MongoDB browser components
|
||||
@@ -254,7 +254,7 @@ tsview/
|
||||
│ ├── services/ # API + WebSocket clients
|
||||
│ ├── styles/ # Dark theme
|
||||
│ └── utilities/ # Formatting helpers
|
||||
└── cli.ts.js # CLI entry point
|
||||
└── .smartconfig.json # Build & runtime config
|
||||
```
|
||||
|
||||
### How It Works
|
||||
@@ -287,7 +287,7 @@ pnpm test
|
||||
|
||||
## License and Legal Information
|
||||
|
||||
This repository contains open-source code licensed under the MIT License. A copy of the license can be found in the [LICENSE](./LICENSE) file.
|
||||
This repository contains open-source code licensed under the MIT License. A copy of the license can be found in the [license](./license) file.
|
||||
|
||||
**Please note:** The MIT License does not grant permission to use the trade names, trademarks, service marks, or product names of the project, except as required for reasonable and customary use in describing the origin of the work and reproducing the content of the NOTICE file.
|
||||
|
||||
|
||||
@@ -10,7 +10,7 @@ tsview/
|
||||
├── cli.ts.js # Dev CLI (uses tsrun to run cli.child.ts)
|
||||
├── cli.child.ts # Dev CLI entry (imports ts/index.js)
|
||||
├── package.json # bin: { "tsview": "cli.js" }
|
||||
├── npmextra.json # tsbundle config for UI bundling
|
||||
├── .smartconfig.json # tsbundle/tswatch config
|
||||
├── tsconfig.json
|
||||
├── readme.md
|
||||
├── readme.hints.md
|
||||
|
||||
@@ -3,6 +3,6 @@
|
||||
*/
|
||||
export const commitinfo = {
|
||||
name: '@git.zone/tsview',
|
||||
version: '1.12.1',
|
||||
version: '1.12.9',
|
||||
description: 'A CLI tool for viewing S3 and MongoDB data with a web UI'
|
||||
}
|
||||
|
||||
File diff suppressed because one or more lines are too long
@@ -29,9 +29,9 @@ export interface ITsViewConfig {
|
||||
}
|
||||
|
||||
/**
|
||||
* 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)
|
||||
|
||||
@@ -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,
|
||||
|
||||
@@ -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}`);
|
||||
|
||||
@@ -3,6 +3,6 @@
|
||||
*/
|
||||
export const commitinfo = {
|
||||
name: '@git.zone/tsview',
|
||||
version: '1.12.1',
|
||||
version: '1.12.9',
|
||||
description: 'A CLI tool for viewing S3 and MongoDB data with a web UI'
|
||||
}
|
||||
|
||||
@@ -4,9 +4,7 @@
|
||||
"module": "NodeNext",
|
||||
"moduleResolution": "NodeNext",
|
||||
"esModuleInterop": true,
|
||||
"verbatimModuleSyntax": true,
|
||||
"baseUrl": ".",
|
||||
"paths": {}
|
||||
"verbatimModuleSyntax": true
|
||||
},
|
||||
"exclude": ["dist_*/**/*.d.ts"]
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user