dbn-cli 0.3.0 → 0.5.2

package/src/ui/grit/index.test.ts

@@ -0,0 +1,67 @@
+import test from 'node:test';
+import assert from 'node:assert/strict';
+import { Box, Transition, Grid, ANSI } from './index.ts';
+
+test('Grid.calculateWidths distributes widths correctly', () => {
+  const widths = Grid.calculateWidths(100, [
+    { weight: 1 },
+    { weight: 1 }
+  ]);
+  assert.deepEqual(widths, [50, 50]);
+
+  const weightedWidths = Grid.calculateWidths(100, [
+    { weight: 1 },
+    { weight: 3 }
+  ]);
+  assert.deepEqual(weightedWidths, [25, 75]);
+
+  const minWidths = Grid.calculateWidths(100, [
+    { weight: 1, minWidth: 40 },
+    { weight: 1 }
+  ]);
+  // Total weight 2, available 100 - 40 = 60.
+  // Col 1: 40 + (1/2 * 60) = 70
+  // Col 2: 0 + (1/2 * 60) = 30
+  assert.deepEqual(minWidths, [70, 30]);
+});
+
+test('Grid.calculateWidths caps extreme weights', () => {
+    // Avg weight = (1 + 10) / 2 = 5.5. Max weight = 22.
+    // Wait, if I have 1 and 100, avg is 50.5, max is 202. That won't cap.
+    // If I have [1, 1, 1, 10], avg is 13/4 = 3.25. Max is 13. Capped 10 is fine.
+    // If I have [1, 1, 1, 20], avg is 23/4 = 5.75. Max is 23.
+    // Let's use [1, 1, 1, 1, 1, 100]. Avg = 105/6 = 17.5. Max = 70. 100 capped to 70.
+    const configs = [
+        { weight: 1 }, { weight: 1 }, { weight: 1 }, { weight: 1 }, { weight: 1 }, { weight: 100 }
+    ];
+    const widths = Grid.calculateWidths(100, configs);
+    // Total capped weight = 1+1+1+1+1+70 = 75.
+    // Each 1 weight gets 1/75 * 100 = 1.33 -> 1
+    // 70 weight gets 70/75 * 100 = 93.33 -> 93
+    // Sum = 1*5 + 93 = 98. Last col gets remainder: 93 + 2 = 95.
+    assert.deepEqual(widths, [1, 1, 1, 1, 1, 95]);
+});
+
+test('Box renders with background and padding', () => {
+  const box = new Box({ width: 10, background: '#000000', padding: 1 });
+  const result = box.render('HI');
+
+  // ANSI.bg('#000000') + ' ' + 'HI' + ' '.repeat(10 - 1 - 2 - 1) + ' ' + ANSI.reset
+  // width 10, padding 1. Inner width 8. 'HI' is 2. Fill 6.
+  // BG + ' ' (pad) + 'HI' + '      ' (fill) + ' ' (pad) + RESET
+  const expected = `${ANSI.bg('#000000')} HI       ${ANSI.reset}`;
+  assert.strictEqual(result, expected);
+});
+
+test('Box handles alignment', () => {
+  const box = new Box({ width: 10, padding: 0 });
+
+  assert.strictEqual(box.render('HI', { align: 'right' }), '        HI');
+  assert.strictEqual(box.render('HI', { align: 'center' }), '    HI    ');
+});
+
+test('Transition.draw generates correct ANSI', () => {
+  const result = Transition.draw(5, '#FF0000', '#0000FF');
+  const expected = `${ANSI.fg('#FF0000')}${ANSI.bg('#0000FF')}▀▀▀▀▀${ANSI.reset}`;
+  assert.strictEqual(result, expected);
+});

package/src/ui/grit/index.ts

@@ -0,0 +1,101 @@
+import { ANSI, wrapAnsiBg } from './utils.ts';
+import { getVisibleWidth } from '../../utils/format.ts';
+import type { Color, Alignment, LayoutOptions, ColumnConfig } from './types.ts';
+
+export * from './types.ts';
+export * from './utils.ts';
+
+export class Box {
+  private options: LayoutOptions;
+
+  constructor(options: LayoutOptions) {
+    this.options = {
+      padding: 0,
+      ...options
+    };
+  }
+
+  render(content: string, options: { align?: Alignment; background?: Color } = {}): string {
+    const { width, background: defaultBg, padding = 0 } = this.options;
+    const bg = options.background || defaultBg || '';
+
+    const innerWidth = width - (padding * 2);
+    const contentWidth = getVisibleWidth(content);
+
+    let line = '';
+    if (bg) line += ANSI.bg(bg);
+
+    // Left padding
+    line += ' '.repeat(padding);
+
+    const fill = Math.max(0, innerWidth - contentWidth);
+    const safeContent = wrapAnsiBg(content, bg);
+
+    if (options.align === 'right') {
+      line += ' '.repeat(fill) + safeContent;
+    } else if (options.align === 'center') {
+      const leftFill = Math.floor(fill / 2);
+      const rightFill = fill - leftFill;
+      line += ' '.repeat(leftFill) + safeContent + ' '.repeat(rightFill);
+    } else {
+      line += safeContent + ' '.repeat(fill);
+    }
+
+    // Right padding
+    line += ' '.repeat(padding);
+
+    if (bg) line += ANSI.reset;
+
+    return line;
+  }
+}
+
+export class Transition {
+  static draw(width: number, topBg: Color, bottomBg: Color): string {
+    return `${ANSI.fg(topBg)}${ANSI.bg(bottomBg)}${ANSI.blockUpper.repeat(width)}${ANSI.reset}`;
+  }
+
+  static drawInverted(width: number, topBg: Color, bottomBg: Color): string {
+    return `${ANSI.fg(bottomBg)}${ANSI.bg(topBg)}${ANSI.blockLower.repeat(width)}${ANSI.reset}`;
+  }
+}
+
+export class Grid {
+  static calculateWidths(totalWidth: number, configs: ColumnConfig[]): number[] {
+    const numCols = configs.length;
+    if (numCols === 0) return [];
+
+    const minWidths = configs.map(c => c.minWidth ?? 0);
+    const weights = configs.map(c => c.weight ?? 1);
+
+    const totalMinWidth = minWidths.reduce((a, b) => a + b, 0);
+    const availableWidth = totalWidth - totalMinWidth;
+
+    if (availableWidth <= 0) {
+      // If not enough space, distribute equally based on minWidths or just evenly
+      const equalWidth = Math.floor(totalWidth / numCols);
+      return new Array(numCols).fill(equalWidth);
+    }
+
+    // Cap weights to prevent extreme ratios (max 4x average)
+    const avgWeight = weights.reduce((a, b) => a + b, 0) / numCols;
+    const maxWeight = avgWeight * 4;
+    const cappedWeights = weights.map(w => Math.min(w, maxWeight));
+    const totalWeight = cappedWeights.reduce((a, b) => a + b, 0);
+
+    if (totalWeight === 0) {
+        const equalWidth = Math.floor(totalWidth / numCols);
+        return new Array(numCols).fill(equalWidth);
+    }
+
+    const widths = cappedWeights.map((w, i) => minWidths[i] + Math.floor((w / totalWeight) * availableWidth));
+
+    // Distribute rounding remainder to the last column
+    const usedWidth = widths.reduce((a, b) => a + b, 0);
+    if (usedWidth < totalWidth) {
+      widths[widths.length - 1] += (totalWidth - usedWidth);
+    }
+
+    return widths;
+  }
+}

package/src/ui/grit/types.ts

@@ -0,0 +1,16 @@
+export type Color = string; // Hex color string like '#FFFFFF'
+
+export type Alignment = 'left' | 'right' | 'center';
+
+export interface LayoutOptions {
+  width: number;
+  height?: number;
+  padding?: number;
+  background?: Color;
+}
+
+export interface ColumnConfig {
+  weight?: number;
+  minWidth?: number;
+  maxWidth?: number;
+}

package/src/ui/grit/utils.ts

@@ -0,0 +1,35 @@
+export const ANSI = {
+  reset: '\x1b[0m',
+  bold: '\x1b[1m',
+  dim: '\x1b[2m',
+  inverse: '\x1b[7m',
+  // TrueColor (24-bit) foreground
+  fg: (hex: string) => {
+    const { r, g, b } = hexToRgb(hex);
+    return `\x1b[38;2;${r};${g};${b}m`;
+  },
+  // TrueColor (24-bit) background
+  bg: (hex: string) => {
+    const { r, g, b } = hexToRgb(hex);
+    return `\x1b[48;2;${r};${g};${b}m`;
+  },
+  blockUpper: '▀',
+  blockLower: '▄',
+};
+
+function hexToRgb(hex: string) {
+  const result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
+  return result ? {
+    r: parseInt(result[1], 16),
+    g: parseInt(result[2], 16),
+    b: parseInt(result[3], 16)
+  } : { r: 0, g: 0, b: 0 };
+}
+
+/**
+ * Ensures background color is maintained if content contains ANSI resets.
+ */
+export function wrapAnsiBg(content: string, bg: string): string {
+  if (!bg) return content;
+  return content.replaceAll(ANSI.reset, ANSI.reset + ANSI.bg(bg));
+}

package/src/ui/navigator.test.ts

@@ -0,0 +1,434 @@
+import { describe, it, before, after } from 'node:test';
+import assert from 'node:assert';
+import { DatabaseSync } from 'node:sqlite';
+import { unlinkSync, existsSync } from 'node:fs';
+import { SQLiteAdapter } from '../adapter/sqlite.ts';
+import { Navigator } from '../ui/navigator.ts';
+
+const TEST_DB = './test-navigator.db';
+
+describe('Navigator', () => {
+  let adapter: SQLiteAdapter;
+  let navigator: Navigator;
+
+  const setupDB = () => {
+    // Create test database
+    if (existsSync(TEST_DB)) {
+      unlinkSync(TEST_DB);
+    }
+    const db = new DatabaseSync(TEST_DB);
+    
+    db.exec(`
+      CREATE TABLE users (
+        id INTEGER PRIMARY KEY,
+        name TEXT NOT NULL,
+        email TEXT UNIQUE
+      );
+      
+      CREATE TABLE posts (
+        id INTEGER PRIMARY KEY,
+        user_id INTEGER,
+        title TEXT,
+        content TEXT,
+        FOREIGN KEY (user_id) REFERENCES users(id)
+      );
+      
+      CREATE TABLE logs (
+        message TEXT
+      );
+    `);
+    
+    // Insert test data
+    const insertUser = db.prepare('INSERT INTO users (name, email) VALUES (?, ?)');
+    insertUser.run('Alice', 'alice@example.com');
+    insertUser.run('Bob', 'bob@example.com');
+    insertUser.run('Charlie', 'charlie@example.com');
+    
+    const insertPost = db.prepare('INSERT INTO posts (user_id, title, content) VALUES (?, ?, ?)');
+    insertPost.run(1, 'Post 1', 'Content 1');
+    insertPost.run(1, 'Post 2', 'Content 2');
+    insertPost.run(2, 'Post 3', 'Content 3');
+    
+    const insertLog = db.prepare('INSERT INTO logs (message) VALUES (?)');
+    insertLog.run('First log entry');
+    insertLog.run('Second log entry');
+    
+    db.close();
+  };
+
+  before(() => {
+    setupDB();
+    // Create adapter and navigator
+    adapter = new SQLiteAdapter();
+    adapter.connect(TEST_DB);
+    navigator = new Navigator(adapter);
+  });
+
+  after(() => {
+    adapter.close();
+    if (existsSync(TEST_DB)) {
+      unlinkSync(TEST_DB);
+    }
+  });
+
+  describe('initialization', () => {
+    it('should initialize with tables view', () => {
+      navigator.init();
+      const state = navigator.getState();
+      
+      assert.strictEqual(state.type, 'tables');
+      assert.ok(Array.isArray((state as any).tables));
+      assert.strictEqual((state as any).cursor, 0);
+      assert.strictEqual((state as any).scrollOffset, 0);
+    });
+
+    it('should load all tables', () => {
+      const state = navigator.getState() as any;
+      assert.ok(state.tables.length >= 2);
+      
+      const tableNames = state.tables.map((t: any) => t.name);
+      assert.ok(tableNames.includes('users'));
+      assert.ok(tableNames.includes('posts'));
+    });
+  });
+
+  describe('navigation in tables view', () => {
+    it('should move cursor down', () => {
+      navigator.init();
+      const initialCursor = (navigator.getState() as any).cursor;
+      
+      navigator.moveDown();
+      const newCursor = (navigator.getState() as any).cursor;
+      
+      assert.strictEqual(newCursor, initialCursor + 1);
+    });
+
+    it('should move cursor up', () => {
+      navigator.moveDown();
+      const initialCursor = (navigator.getState() as any).cursor;
+      
+      navigator.moveUp();
+      const newCursor = (navigator.getState() as any).cursor;
+      
+      assert.strictEqual(newCursor, initialCursor - 1);
+    });
+
+    it('should not move cursor below 0', () => {
+      navigator.jumpToTop();
+      navigator.moveUp();
+      
+      assert.strictEqual((navigator.getState() as any).cursor, 0);
+    });
+
+    it('should not move cursor beyond table count', () => {
+      const state = navigator.getState() as any;
+      const maxCursor = state.tables.length - 1;
+      
+      navigator.jumpToBottom();
+      navigator.moveDown();
+      
+      assert.strictEqual((navigator.getState() as any).cursor, maxCursor);
+    });
+
+    it('should jump to top', () => {
+      navigator.moveDown();
+      navigator.moveDown();
+      navigator.jumpToTop();
+      
+      assert.strictEqual((navigator.getState() as any).cursor, 0);
+    });
+
+    it('should jump to bottom', () => {
+      navigator.jumpToTop();
+      navigator.jumpToBottom();
+      
+      const state = navigator.getState() as any;
+      assert.strictEqual(state.cursor, state.tables.length - 1);
+    });
+  });
+
+  describe('entering table detail', () => {
+    it('should enter table detail view', () => {
+      navigator.init();
+      navigator.enter();
+      
+      const state = navigator.getState() as any;
+      assert.strictEqual(state.type, 'table-detail');
+      assert.ok(state.tableName);
+      assert.ok(Array.isArray(state.schema));
+      assert.ok(Array.isArray(state.data));
+      assert.strictEqual(typeof state.totalRows, 'number');
+      assert.strictEqual(state.dataOffset, 0);
+      assert.strictEqual(state.dataCursor, 0);
+    });
+
+    it('should load table schema', () => {
+      const state = navigator.getState() as any;
+      assert.ok(state.schema.length > 0);
+      
+      const schema = state.schema;
+      assert.ok(schema[0].name);
+      assert.ok(schema[0].type);
+    });
+
+    it('should load table data', () => {
+      const state = navigator.getState() as any;
+      assert.ok(state.data.length > 0);
+      assert.ok(state.totalRows > 0);
+    });
+  });
+
+  describe('schema view toggle', () => {
+    const enterUsersTable = () => {
+      navigator.init();
+      const tablesState = navigator.getState() as any;
+      const index = tablesState.tables.findIndex((t: any) => t.name === 'users');
+      assert.ok(index >= 0);
+      
+      while ((navigator.getState() as any).cursor < index) {
+        navigator.moveDown();
+      }
+      
+      while ((navigator.getState() as any).cursor > index) {
+        navigator.moveUp();
+      }
+      
+      navigator.enter();
+    };
+    
+    const enterSchemaView = () => {
+      enterUsersTable();
+      navigator.viewSchema();
+    };
+    
+    it('should view schema from table detail', () => {
+      enterSchemaView();
+      
+      const state = navigator.getState() as any;
+      assert.strictEqual(state.type, 'schema-view');
+      assert.ok(state.tableName);
+      assert.ok(Array.isArray(state.schema));
+      assert.strictEqual(state.cursor, 0);
+      assert.strictEqual(state.scrollOffset, 0);
+    });
+
+    it('should navigate in schema view', () => {
+      enterSchemaView();
+      const state = navigator.getState() as any;
+      assert.strictEqual(state.type, 'schema-view');
+      assert.strictEqual(state.cursor, 0);
+      
+      navigator.moveDown();
+      assert.strictEqual((navigator.getState() as any).cursor, 1);
+      
+      navigator.moveUp();
+      assert.strictEqual((navigator.getState() as any).cursor, 0);
+    });
+
+    it('should jump to top/bottom in schema view', () => {
+      enterSchemaView();
+      navigator.moveDown();
+      navigator.jumpToTop();
+      assert.strictEqual((navigator.getState() as any).cursor, 0);
+      
+      navigator.jumpToBottom();
+      const state = navigator.getState() as any;
+      assert.strictEqual(state.cursor, state.schema.length - 1);
+    });
+
+    it('should not move cursor beyond schema bounds', () => {
+      enterSchemaView();
+      navigator.jumpToTop();
+      navigator.moveUp();
+      assert.strictEqual((navigator.getState() as any).cursor, 0);
+      
+      navigator.jumpToBottom();
+      const maxCursor = (navigator.getState() as any).schema.length - 1;
+      navigator.moveDown();
+      assert.strictEqual((navigator.getState() as any).cursor, maxCursor);
+    });
+
+    it('should go back to table detail', () => {
+      enterSchemaView();
+      navigator.back();
+      
+      const state = navigator.getState();
+      assert.strictEqual(state.type, 'table-detail');
+    });
+
+    it('should preserve table detail state when toggling', () => {
+      enterUsersTable();
+      const state = navigator.getState() as any;
+      const tableName = state.tableName;
+      const dataOffset = state.dataOffset;
+      const dataCursor = state.dataCursor;
+      
+      navigator.viewSchema();
+      navigator.back();
+      
+      const newState = navigator.getState() as any;
+      assert.strictEqual(newState.type, 'table-detail');
+      assert.strictEqual(newState.tableName, tableName);
+      assert.strictEqual(newState.dataOffset, dataOffset);
+      assert.strictEqual(newState.dataCursor, dataCursor);
+    });
+  });
+
+  describe('row detail view', () => {
+    it('should enter row detail from table detail', () => {
+      navigator.init();
+      navigator.enter();
+      navigator.enter();
+      
+      const state = navigator.getState() as any;
+      assert.strictEqual(state.type, 'row-detail');
+      assert.ok(state.tableName);
+      assert.ok(state.row);
+      assert.strictEqual(typeof state.rowIndex, 'number');
+      assert.ok(Array.isArray(state.schema));
+    });
+
+    it('should go back to table detail', () => {
+      navigator.back();
+      
+      const state = navigator.getState();
+      assert.strictEqual(state.type, 'table-detail');
+    });
+  });
+
+  describe('delete flow', () => {
+    const selectTable = (tableName: string) => {
+      navigator.init();
+      const tablesState = navigator.getState() as any;
+      const index = tablesState.tables.findIndex((t: any) => t.name === tableName);
+      assert.ok(index >= 0);
+      
+      while ((navigator.getState() as any).cursor < index) {
+        navigator.moveDown();
+      }
+      
+      while ((navigator.getState() as any).cursor > index) {
+        navigator.moveUp();
+      }
+      
+      navigator.enter();
+      const state = navigator.getState() as any;
+      assert.strictEqual(state.type, 'table-detail');
+      assert.strictEqual(state.tableName, tableName);
+      return state;
+    };
+    
+    it('should require two confirmations before deleting and actually remove the row', () => {
+      // Refresh the DB and navigator to ensure clean state
+      setupDB();
+      adapter.close();
+      adapter.connect(TEST_DB);
+      navigator.init();
+
+      // Enter the 'posts' table (no FK constraints on delete)
+      const tablesState = navigator.getState() as any;
+      const index = tablesState.tables.findIndex((t: any) => t.name === 'posts');
+      assert.ok(index >= 0);
+      tablesState.cursor = index;
+
+      navigator.enter();
+      let state = navigator.getState() as any;
+      const initialTotal = state.totalRows;
+
+      // Select first post
+      state.dataCursor = 0;
+      
+      navigator.requestDelete();
+      state = navigator.getState() as any;
+      assert.strictEqual(state.deleteConfirm.step, 1);
+      
+      navigator.confirmDelete();
+      state = navigator.getState() as any;
+      assert.strictEqual(state.deleteConfirm.step, 2);
+      
+      navigator.confirmDelete();
+      state = navigator.getState() as any;
+      assert.ok(!state.deleteConfirm);
+      assert.strictEqual(state.totalRows, initialTotal - 1);
+
+      // Verify row is gone from state data
+      assert.strictEqual(state.totalRows, initialTotal - 1);
+
+      // Verify row is gone from database
+      const dbCount = adapter.getRowCount('posts');
+      assert.strictEqual(dbCount, initialTotal - 1);
+    });
+    
+    it('should allow canceling a delete request', () => {
+      selectTable('users');
+      navigator.requestDelete();
+      let current = navigator.getState() as any;
+      assert.ok(current.deleteConfirm);
+      
+      navigator.cancelDelete();
+      current = navigator.getState() as any;
+      assert.ok(!current.deleteConfirm);
+      assert.strictEqual(navigator.hasPendingDelete(), false);
+    });
+    
+    it('should block deletion when table has no primary key', () => {
+      selectTable('logs');
+      navigator.requestDelete();
+      const current = navigator.getState() as any;
+      assert.ok(!current.deleteConfirm);
+      assert.match(current.notice, /no primary key/i);
+    });
+  });
+  
+  describe('back navigation', () => {
+    it('should maintain state stack', () => {
+      navigator.init();
+      assert.strictEqual((navigator as any).states.length, 1);
+      
+      navigator.enter();
+      assert.strictEqual((navigator as any).states.length, 2);
+      
+      navigator.viewSchema();
+      assert.strictEqual((navigator as any).states.length, 3);
+      
+      navigator.back();
+      assert.strictEqual((navigator as any).states.length, 2);
+      
+      navigator.back();
+      assert.strictEqual((navigator as any).states.length, 1);
+    });
+
+    it('should not go back beyond root', () => {
+      navigator.init();
+      navigator.back();
+      
+      assert.strictEqual((navigator as any).states.length, 1);
+      assert.strictEqual(navigator.getState().type, 'tables');
+    });
+  });
+
+  describe('data reload', () => {
+    it('should reload table data in table detail', () => {
+      navigator.init();
+      navigator.enter();
+      
+      const state = navigator.getState() as any;
+      const initialData = [...state.data];
+      
+      navigator.reload();
+      
+      const newData = (navigator.getState() as any).data;
+      assert.deepStrictEqual(newData, initialData);
+    });
+
+    it('should reload data after offset change', () => {
+      const state = navigator.getState() as any;
+      state.dataOffset = 1;
+      
+      navigator.reload();
+      
+      // Data should be reloaded from new offset
+      assert.ok((navigator.getState() as any).data);
+    });
+  });
+});