xtralab 0.15.1 → 0.15.2

package/src/fileBrowser/gitStatus.ts

@@ -1,7 +1,13 @@
 import type { GitStatus, GitStatusEntry } from '@pierre/trees';
 
 import { expandStatusFiles, status } from '../git/api';
-import type { FileChangeStatus } from '../git/tokens';
+import type { FileChangeStatus, IFileChange } from '../git/tokens';
+
+/**
+ * Repo path for `/git/*` calls; empty means the server root, letting git
+ * resolve the enclosing repo (same convention as the git panel).
+ */
+export const GIT_REPO_PATH = '';
 
 /**
  * Translate a `jupyterlab_git` porcelain status into a `@pierre/trees`
@@ -25,32 +31,39 @@ function toTreeStatus(value: FileChangeStatus): GitStatus {
 }
 
 /**
- * Fetch the porcelain status for `repoPath` as `GitStatusEntry` values.
- * Any failure yields an empty array — the file browser must work without
- * git. A file both staged and unstaged gets one entry, the unstaged status
- * winning (mirrors what is on disk, matching VS Code).
+ * Fetch the porcelain status for `repoPath`, one entry per staged or
+ * unstaged change. Any failure yields an empty array — the file browser
+ * must work without git.
  */
-export async function loadGitStatusEntries(
-  repoPath: string
-): Promise<GitStatusEntry[]> {
+export async function loadGitChanges(repoPath: string): Promise<IFileChange[]> {
   try {
     const result = await status(repoPath);
     if (result.code !== 0) {
       return [];
     }
-    const changes = expandStatusFiles(result.files);
-    const byPath = new Map<string, FileChangeStatus>();
-    for (const change of changes) {
-      if (change.group === 'unstaged' || !byPath.has(change.path)) {
-        byPath.set(change.path, change.status);
-      }
-    }
-    const entries: GitStatusEntry[] = [];
-    byPath.forEach((value, path) => {
-      entries.push({ path, status: toTreeStatus(value) });
-    });
-    return entries;
+    return expandStatusFiles(result.files);
   } catch {
     return [];
   }
 }
+
+/**
+ * Collapse changes into the tree's `GitStatusEntry` values. A file both
+ * staged and unstaged gets one entry, the unstaged status winning (mirrors
+ * what is on disk, matching VS Code).
+ */
+export function toGitStatusEntries(
+  changes: readonly IFileChange[]
+): GitStatusEntry[] {
+  const byPath = new Map<string, FileChangeStatus>();
+  for (const change of changes) {
+    if (change.group === 'unstaged' || !byPath.has(change.path)) {
+      byPath.set(change.path, change.status);
+    }
+  }
+  const entries: GitStatusEntry[] = [];
+  byPath.forEach((value, path) => {
+    entries.push({ path, status: toTreeStatus(value) });
+  });
+  return entries;
+}

package/src/fileBrowser/widget.tsx

@@ -17,6 +17,7 @@ import {
 import { Signal, ISignal } from '@lumino/signaling';
 import { AccordionPanel, PanelLayout, Widget } from '@lumino/widgets';
 
+import type { IFileChange } from '../git/tokens';
 import { FileBrowserComponent } from './fileBrowser';
 import { xtralabFileBrowserIcon } from './icons';
 
@@ -92,6 +93,12 @@ export interface IXtralabFileBrowser {
    */
   readonly selectionChanged: ISignal<IXtralabFileBrowser, readonly string[]>;
 
+  /**
+   * Git changes from the latest status poll, one per staged or unstaged
+   * change; paths are repo-relative.
+   */
+  readonly gitChanges: readonly IFileChange[];
+
   /**
    * Emits when {@link refresh} is called.
    */
@@ -251,6 +258,13 @@ export class XtralabFileBrowser
     return this._selectionChanged;
   }
 
+  /**
+   * Git changes from the latest status poll.
+   */
+  get gitChanges(): readonly IFileChange[] {
+    return this._gitChanges;
+  }
+
   /**
    * A signal emitted when {@link refresh} is called.
    */
@@ -308,6 +322,13 @@ export class XtralabFileBrowser
     this._selectionChanged.emit(paths);
   }
 
+  /**
+   * Update the cached git changes from the React tree's status poll.
+   */
+  updateGitChanges(changes: readonly IFileChange[]): void {
+    this._gitChanges = changes;
+  }
+
   /**
    * Trigger a refresh of every loaded directory in the tree.
    */
@@ -537,6 +558,7 @@ export class XtralabFileBrowser
   private _translator: ITranslator | undefined;
   private _selectedPaths: readonly string[] = [];
   private _selectionChanged = new Signal<this, readonly string[]>(this);
+  private _gitChanges: readonly IFileChange[] = [];
   private _refreshRequested = new Signal<this, void>(this);
   private _pathAdded = new Signal<this, string>(this);
   private _revealRequested = new Signal<this, string>(this);

package/src/git/commands.ts

@@ -10,6 +10,7 @@ import { ISignal, Signal } from '@lumino/signaling';
 import type { IAskAgent } from '../askAgent/tokens';
 import { getTreeIcon } from '../fileBrowser/icons';
 import { fileChangeToDiffModel } from './diffModel';
+import type { IDiffPreferences } from './diffPreferences';
 import {
   DIFF_WIDGET_CSS_CLASS,
   XtralabDiffWidget,
@@ -156,6 +157,10 @@ interface ICreateDiffWidgetOptions {
    * Ask-agent popup for prompting an agent about diff lines; may be `null`.
    */
   askAgent: IAskAgent | null;
+  /**
+   * The display choices shared by all diff views.
+   */
+  preferences: IDiffPreferences;
   /**
    * Translation bundle for user-facing strings.
    */
@@ -180,12 +185,13 @@ function createDiffWidget(
     contentsManager,
     rendermime,
     askAgent,
+    preferences,
     trans
   } = options;
   const pinned = options.pinned === true;
   const content = new XtralabDiffWidget(
     fileChangeToDiffModel(repoPath, change),
-    { contentsManager, rendermime, themeManager, askAgent, trans }
+    { contentsManager, rendermime, themeManager, askAgent, preferences, trans }
   );
   const widget = new DiffMainAreaWidget({ content }, change, pinned, trans);
   widget.id = pinned ? pinnedDiffWidgetId(change) : PREVIEW_DIFF_WIDGET_ID;
@@ -279,6 +285,10 @@ interface IRegisterGitCommandsOptions {
    * Ask-agent popup for prompting an agent about diff lines; may be `null`.
    */
   askAgent: IAskAgent | null;
+  /**
+   * The display choices shared by all diff views.
+   */
+  preferences: IDiffPreferences;
   /**
    * Translation bundle for user-facing strings.
    */
@@ -309,6 +319,7 @@ export function registerGitCommands(
     contentsManager,
     rendermime,
     askAgent,
+    preferences,
     trans,
     trackDiff,
     findDiff,
@@ -340,6 +351,7 @@ export function registerGitCommands(
         contentsManager,
         rendermime,
         askAgent,
+        preferences,
         trans,
         pinned: pin,
         onPinned

package/src/git/diffPreferences.ts

@@ -0,0 +1,192 @@
+import * as React from 'react';
+
+import type { ISettingRegistry } from '@jupyterlab/settingregistry';
+import type { IStateDB } from '@jupyterlab/statedb';
+import { Token } from '@lumino/coreutils';
+import { ISignal, Signal } from '@lumino/signaling';
+
+export type DiffStyle = 'split' | 'unified';
+
+export type DiffStyleControlMode = 'buttons' | 'toggle';
+
+export type NotebookDiffViewMode = 'notebook' | 'json';
+
+export type ImageDiffViewMode = '2-up' | 'swipe' | 'onion';
+
+export const MIN_SPLIT_RATIO = 0.1;
+export const MAX_SPLIT_RATIO = 0.9;
+export const DEFAULT_SPLIT_RATIO = 0.5;
+
+const SPLIT_RATIO_STATE_KEY = 'xtralab:git-diff:split-ratio';
+
+/**
+ * Display choices shared by every diff view. The toggles live in the
+ * plugin settings; the split width lives in the state database.
+ */
+export interface IDiffPreferences {
+  /**
+   * The current values; a new object after each change.
+   */
+  readonly values: IDiffPreferences.IValues;
+  /**
+   * A signal emitted when any value changes.
+   */
+  readonly changed: ISignal<IDiffPreferences, void>;
+  /**
+   * Change some values and persist them.
+   */
+  update(values: Partial<IDiffPreferences.IValues>): void;
+}
+
+export namespace IDiffPreferences {
+  /**
+   * The diff display values.
+   */
+  export interface IValues {
+    /**
+     * Split or unified layout for textual file diffs.
+     */
+    diffStyle: DiffStyle;
+    /**
+     * Two toolbar buttons for the layout, or one button that toggles it.
+     */
+    diffStyleControl: DiffStyleControlMode;
+    /**
+     * Whether long lines wrap instead of scrolling horizontally.
+     */
+    lineWrap: boolean;
+    /**
+     * Rendered or JSON view for notebook diffs.
+     */
+    notebookViewMode: NotebookDiffViewMode;
+    /**
+     * Comparison mode for image diffs.
+     */
+    imageViewMode: ImageDiffViewMode;
+    /**
+     * Width of the left pane in split view, as a fraction of the diff width.
+     */
+    splitRatio: number;
+  }
+}
+
+export const IDiffPreferences = new Token<IDiffPreferences>(
+  'xtralab:IDiffPreferences',
+  'Display choices shared by the git diff views.'
+);
+
+type SettingKey = Exclude<keyof IDiffPreferences.IValues, 'splitRatio'>;
+
+const SETTING_KEYS: SettingKey[] = [
+  'diffStyle',
+  'diffStyleControl',
+  'lineWrap',
+  'notebookViewMode',
+  'imageViewMode'
+];
+
+/**
+ * {@link IDiffPreferences} backed by the settings registry and the state
+ * database. Without them it keeps the values in memory only.
+ */
+export class DiffPreferences implements IDiffPreferences {
+  get values(): IDiffPreferences.IValues {
+    return this._values;
+  }
+
+  get changed(): ISignal<this, void> {
+    return this._changed;
+  }
+
+  update(values: Partial<IDiffPreferences.IValues>): void {
+    if (!this._apply(values)) {
+      return;
+    }
+    for (const key of SETTING_KEYS) {
+      if (key in values) {
+        this._settings?.set(key, this._values[key]).catch(reason => {
+          console.error(`xtralab: failed to save the diff ${key}`, reason);
+        });
+      }
+    }
+    if ('splitRatio' in values) {
+      this._state
+        ?.save(SPLIT_RATIO_STATE_KEY, this._values.splitRatio)
+        .catch(reason => {
+          console.error('xtralab: failed to save the diff split', reason);
+        });
+    }
+  }
+
+  /**
+   * Read the toggles from the plugin settings and follow their changes.
+   */
+  connectSettings(settings: ISettingRegistry.ISettings): void {
+    this._settings = settings;
+    const sync = (): void => {
+      this._apply(settings.composite as Partial<IDiffPreferences.IValues>);
+    };
+    sync();
+    settings.changed.connect(sync);
+  }
+
+  /**
+   * Restore the split width from the state database and save it there.
+   */
+  async connectState(state: IStateDB): Promise<void> {
+    this._state = state;
+    const ratio = await state.fetch(SPLIT_RATIO_STATE_KEY);
+    if (
+      typeof ratio === 'number' &&
+      ratio >= MIN_SPLIT_RATIO &&
+      ratio <= MAX_SPLIT_RATIO
+    ) {
+      this._apply({ splitRatio: ratio });
+    }
+  }
+
+  /**
+   * Merge values without persisting them; return whether one changed.
+   */
+  private _apply(values: Partial<IDiffPreferences.IValues>): boolean {
+    const next = { ...this._values, ...values };
+    const keys = Object.keys(next) as (keyof IDiffPreferences.IValues)[];
+    if (keys.every(key => next[key] === this._values[key])) {
+      return false;
+    }
+    this._values = next;
+    this._changed.emit();
+    return true;
+  }
+
+  private _values: IDiffPreferences.IValues = {
+    diffStyle: 'split',
+    diffStyleControl: 'buttons',
+    lineWrap: false,
+    notebookViewMode: 'notebook',
+    imageViewMode: '2-up',
+    splitRatio: DEFAULT_SPLIT_RATIO
+  };
+  private _changed = new Signal<this, void>(this);
+  private _settings: ISettingRegistry.ISettings | null = null;
+  private _state: IStateDB | null = null;
+}
+
+/**
+ * Re-render on every preference change and return the current values.
+ */
+export function useDiffPreferences(
+  preferences: IDiffPreferences
+): IDiffPreferences.IValues {
+  const subscribe = React.useCallback(
+    (onChange: () => void) => {
+      const slot = (): void => onChange();
+      preferences.changed.connect(slot);
+      return () => {
+        preferences.changed.disconnect(slot);
+      };
+    },
+    [preferences]
+  );
+  return React.useSyncExternalStore(subscribe, () => preferences.values);
+}

package/src/git/diffProvider.tsx

@@ -9,6 +9,7 @@ import { Git, IGitExtension } from '@jupyterlab/git';
 
 import { IAskAgent } from '../askAgent/tokens';
 
+import { DiffPreferences, IDiffPreferences } from './diffPreferences';
 import {
   IXtralabDiffContext,
   XtralabDiffWidget,
@@ -37,14 +38,21 @@ const diffProviderPlugin: JupyterFrontEndPlugin<void> = {
     "Replaces jupyterlab-git's notebook, text and image diff plugins with xtralab's renderer.",
   autoStart: true,
   requires: [IGitExtension],
-  optional: [IRenderMimeRegistry, IThemeManager, ITranslator, IAskAgent],
+  optional: [
+    IRenderMimeRegistry,
+    IThemeManager,
+    ITranslator,
+    IAskAgent,
+    IDiffPreferences
+  ],
   activate: (
     app: JupyterFrontEnd,
     gitExtension: IGitExtension,
     rendermime: IRenderMimeRegistry | null,
     themeManager: IThemeManager | null,
     translator: ITranslator | null,
-    askAgent: IAskAgent | null
+    askAgent: IAskAgent | null,
+    preferences: IDiffPreferences | null
   ): void => {
     const trans = (translator ?? nullTranslator).load('jupyterlab');
     const factory = makeXtralabDiffFactory({
@@ -52,6 +60,7 @@ const diffProviderPlugin: JupyterFrontEndPlugin<void> = {
       rendermime,
       themeManager,
       askAgent,
+      preferences: preferences ?? new DiffPreferences(),
       trans
     });