xtralab 0.8.0 → 0.9.0

package/lib/git/commands.js

@@ -1,20 +1,144 @@
-import { createGitDiffWidget, diffWidgetId, updateGitDiffWidget } from './diffWidget';
+import { MainAreaWidget } from '@jupyterlab/apputils';
+import { ToolbarButton, launchIcon } from '@jupyterlab/ui-components';
+import { Signal } from '@lumino/signaling';
+import { getTreeIcon } from '../fileBrowser/icons';
+import { fileChangeToDiffModel } from './diffModel';
+import { DIFF_WIDGET_CSS_CLASS, XtralabDiffWidget, addDiffToolbarItems } from './diffWidget';
 /**
- * Command IDs exposed by the launcher's git diff path. The launcher
- * dashboard's "Changes" section drives {@link CommandIDs.openDiff} to open
- * its own diff tab, independent of `jupyterlab-git` (whose panel reaches
- * the same rendering via the providers in `diffProvider.tsx`).
+ * Command IDs exposed by the launcher's git diff path.
  */
 export var CommandIDs;
 (function (CommandIDs) {
     CommandIDs.openDiff = 'xtralab:git:open-diff';
 })(CommandIDs || (CommandIDs = {}));
+/**
+ * Widget id of the single, reused preview diff tab.
+ */
+export const PREVIEW_DIFF_WIDGET_ID = 'xtralab:diff:preview';
+/**
+ * Deterministic widget id for a pinned file/group pair.
+ */
+export function pinnedDiffWidgetId(change) {
+    return `xtralab:diff:pinned:${change.group}:${change.path}`;
+}
+function formatTitle(change) {
+    var _a;
+    const name = (_a = change.path.split('/').pop()) !== null && _a !== void 0 ? _a : change.path;
+    const groupLabel = change.group === 'staged' ? 'Staged' : 'Working';
+    return `${name} (${groupLabel})`;
+}
+/**
+ * Launcher-owned host for a shared diff widget.
+ */
+export class DiffMainAreaWidget extends MainAreaWidget {
+    constructor(options, change, pinned) {
+        super(options);
+        this._pinnedChanged = new Signal(this);
+        this._change = change;
+        this._pinned = pinned;
+    }
+    get change() {
+        return this._change;
+    }
+    get pinned() {
+        return this._pinned;
+    }
+    pin() {
+        if (this._pinned) {
+            return;
+        }
+        this._pinned = true;
+        this._pinnedChanged.emit(true);
+    }
+    get pinnedChanged() {
+        return this._pinnedChanged;
+    }
+    setChange(repoPath, change) {
+        this._change = change;
+        this.content.setModel(fileChangeToDiffModel(repoPath, change));
+        this.title.label = formatTitle(change);
+        this.title.caption = change.path;
+        this.title.icon = getTreeIcon(change.path);
+    }
+}
+/**
+ * Build the launcher's diff tab around the shared diff widget.
+ */
+function createDiffWidget(options) {
+    var _a;
+    const { repoPath, change, themeManager, contentsManager, rendermime } = options;
+    const pinned = options.pinned === true;
+    const content = new XtralabDiffWidget(fileChangeToDiffModel(repoPath, change), { contentsManager, rendermime, themeManager });
+    const widget = new DiffMainAreaWidget({ content }, change, pinned);
+    widget.id = pinned ? pinnedDiffWidgetId(change) : PREVIEW_DIFF_WIDGET_ID;
+    widget.title.label = formatTitle(change);
+    widget.title.caption = change.path;
+    widget.title.closable = true;
+    widget.title.icon = getTreeIcon(change.path);
+    widget.title.className = pinned ? '' : 'jp-mod-preview';
+    widget.addClass(DIFF_WIDGET_CSS_CLASS);
+    const onPinned = (_a = options.onPinned) !== null && _a !== void 0 ? _a : (() => undefined);
+    const pinButton = new ToolbarButton({
+        icon: launchIcon,
+        tooltip: 'Pin tab',
+        onClick: () => widget.pin()
+    });
+    if (widget.pinned) {
+        pinButton.hide();
+    }
+    widget.toolbar.addItem('pin', pinButton);
+    addDiffToolbarItems(widget.toolbar, content);
+    // Keep chrome visible only while there is a relevant toolbar control.
+    const syncToolbarVisibility = () => {
+        if (widget.isDisposed) {
+            return;
+        }
+        if (!widget.pinned || content.hasNotebookView || content.fileDiffActive) {
+            widget.toolbar.show();
+        }
+        else {
+            widget.toolbar.hide();
+        }
+    };
+    const onPinnedChanged = (_sender, value) => {
+        if (widget.isDisposed) {
+            return;
+        }
+        if (value) {
+            pinButton.hide();
+            onPinned(widget);
+            if (widget.isDisposed) {
+                return;
+            }
+            widget.title.className = '';
+        }
+        syncToolbarVisibility();
+    };
+    // Auto-close once a discard leaves nothing to show.
+    const onEmptied = () => {
+        if (!widget.isDisposed) {
+            widget.close();
+        }
+    };
+    content.hasNotebookViewChanged.connect(syncToolbarVisibility);
+    content.fileDiffActiveChanged.connect(syncToolbarVisibility);
+    content.emptied.connect(onEmptied);
+    widget.pinnedChanged.connect(onPinnedChanged);
+    syncToolbarVisibility();
+    widget.disposed.connect(() => {
+        content.hasNotebookViewChanged.disconnect(syncToolbarVisibility);
+        content.fileDiffActiveChanged.disconnect(syncToolbarVisibility);
+        content.emptied.disconnect(onEmptied);
+        widget.pinnedChanged.disconnect(onPinnedChanged);
+    });
+    return widget;
+}
 /**
  * Register the launcher's git diff command on the application command
  * registry.
  */
 export function registerGitCommands(options) {
-    const { app, themeManager, contentsManager, rendermime, onChanged, trackDiff, findDiff, onPinned } = options;
+    const { app, themeManager, contentsManager, rendermime, trackDiff, findDiff, onPinned } = options;
     const { commands } = app;
     commands.addCommand(CommandIDs.openDiff, {
         label: 'Open Git Diff',
@@ -28,18 +152,17 @@ export function registerGitCommands(options) {
             const existing = findDiff(typed.change, pin);
             if (existing !== undefined && !existing.isDisposed) {
                 if (!pin) {
-                    updateGitDiffWidget(existing, typed.change);
+                    existing.setChange(typed.repoPath, typed.change);
                 }
                 app.shell.activateById(existing.id);
                 return;
             }
-            const widget = createGitDiffWidget({
+            const widget = createDiffWidget({
                 repoPath: typed.repoPath,
                 change: typed.change,
                 themeManager,
                 contentsManager,
                 rendermime,
-                onChanged,
                 pinned: pin,
                 onPinned
             });
@@ -49,4 +172,3 @@ export function registerGitCommands(options) {
         }
     });
 }
-export { diffWidgetId };

package/lib/git/diffModel.d.ts

@@ -0,0 +1,14 @@
+import type { IXtralabDiffModel } from './diffWidget';
+import type { GitReference, IFileChange } from './tokens';
+/**
+ * Resolve the old/new git refs for a launcher file change. Staged diffs are
+ * INDEX vs HEAD; unstaged diffs are WORKING vs INDEX.
+ */
+export declare function resolveReferences(change: IFileChange): {
+    oldRef: GitReference | null;
+    newRef: GitReference | null;
+};
+/**
+ * Build a diff model for a single {@link IFileChange}.
+ */
+export declare function fileChangeToDiffModel(repoPath: string, change: IFileChange): IXtralabDiffModel;

package/lib/git/diffModel.js

@@ -0,0 +1,75 @@
+import { Git } from '@jupyterlab/git';
+import { Signal } from '@lumino/signaling';
+import { content } from './api';
+/**
+ * Resolve the old/new git refs for a launcher file change. Staged diffs are
+ * INDEX vs HEAD; unstaged diffs are WORKING vs INDEX.
+ */
+export function resolveReferences(change) {
+    if (change.status === 'untracked') {
+        return { oldRef: null, newRef: { special: 'WORKING' } };
+    }
+    if (change.group === 'staged') {
+        return { oldRef: { git: 'HEAD' }, newRef: { special: 'INDEX' } };
+    }
+    // If INDEX has no blob, the server falls back to HEAD as the baseline.
+    return { oldRef: { special: 'INDEX' }, newRef: { special: 'WORKING' } };
+}
+/**
+ * Map a launcher git ref onto `Git.Diff.IContent.source`; keep JupyterLab's
+ * enum values where downstream diff code checks for them.
+ */
+function referenceSource(ref) {
+    if (ref === null) {
+        return null;
+    }
+    if ('git' in ref) {
+        return ref.git;
+    }
+    if (ref.special === 'WORKING') {
+        return Git.Diff.SpecialRef.WORKING;
+    }
+    if (ref.special === 'INDEX') {
+        return Git.Diff.SpecialRef.INDEX;
+    }
+    return Git.Diff.SpecialRef.BASE;
+}
+/**
+ * `Git.Diff.IModel` adapter for launcher file changes.
+ */
+class FileChangeDiffModel {
+    constructor(repoPath, change) {
+        var _a;
+        this.changed = new Signal(this);
+        const { oldRef, newRef } = resolveReferences(change);
+        // Renames compare the new path against the old path's previous content.
+        const oldName = (_a = change.from) !== null && _a !== void 0 ? _a : change.path;
+        this.filename = change.path;
+        this.oldFilename = change.from;
+        this.repositoryPath = repoPath;
+        this.isBinary = change.isBinary === true;
+        // Only unstaged tracked files can be reverted through a working-tree save.
+        this.canDiscard =
+            change.group === 'unstaged' && change.status !== 'untracked';
+        this.reference = {
+            label: oldName,
+            source: referenceSource(oldRef),
+            content: () => oldRef === null
+                ? Promise.resolve('')
+                : content(repoPath, oldName, oldRef).then(result => { var _a; return (_a = result.content) !== null && _a !== void 0 ? _a : ''; })
+        };
+        this.challenger = {
+            label: change.path,
+            source: referenceSource(newRef),
+            content: () => newRef === null
+                ? Promise.resolve('')
+                : content(repoPath, change.path, newRef).then(result => { var _a; return (_a = result.content) !== null && _a !== void 0 ? _a : ''; })
+        };
+    }
+}
+/**
+ * Build a diff model for a single {@link IFileChange}.
+ */
+export function fileChangeToDiffModel(repoPath, change) {
+    return new FileChangeDiffModel(repoPath, change);
+}

package/lib/git/diffProvider.d.ts

@@ -1,8 +1,3 @@
 import { JupyterFrontEndPlugin } from '@jupyterlab/application';
-/**
- * Registers xtralab's diff rendering as jupyterlab-git's diff providers:
- * `@pierre/diffs` for text and notebooks, the bundled `<img>`-based view
- * for raster images.
- */
 declare const diffProviderPlugin: JupyterFrontEndPlugin<void>;
 export default diffProviderPlugin;

package/lib/git/diffProvider.js

@@ -1,388 +1,20 @@
-import * as React from 'react';
 import { IThemeManager } from '@jupyterlab/apputils';
-import { PathExt } from '@jupyterlab/coreutils';
 import { IRenderMimeRegistry } from '@jupyterlab/rendermime';
-import { ReactWidget } from '@jupyterlab/ui-components';
-import { Git, IGitExtension } from '@jupyterlab/git';
-import { PromiseDelegate } from '@lumino/coreutils';
-import { Signal } from '@lumino/signaling';
-import { DIFF_WIDGET_CSS_CLASS, DiffStyleControl, DiffSurface, NotebookViewModeControl, isDarkTheme, readStoredDiffStyle, readStoredNotebookViewMode, writeStoredDiffStyle, writeStoredNotebookViewMode } from './diffSurface';
-import { IMAGE_DIFF_EXTENSIONS, imageDataType } from './imageDiff';
+import { IGitExtension } from '@jupyterlab/git';
+import { XtralabDiffWidget, addDiffToolbarItems } from './diffWidget';
+import { IMAGE_DIFF_EXTENSIONS } from './imageDiff';
 /**
- * A `Git.Diff.IDiffWidget` that renders through {@link DiffSurface}.
- *
- * `jupyterlab-git` constructs this via the registered factory, hosts it in
- * its own `PreviewMainAreaWidget`, and reads `model` / calls `refresh()` /
- * `getResolvedFile()` on it. It owns the notebook view-mode state (mounted
- * into the diff toolbar `jupyterlab-git` hands the factory) and a reload
- * nonce so `refresh()` re-pulls the model's content.
- */
-class XtralabDiffWidget extends ReactWidget {
-    constructor(model, context) {
-        super();
-        this._reloadNonce = 0;
-        this._pendingRefresh = null;
-        this._notebookViewModeChanged = new Signal(this);
-        this._hasNotebookView = false;
-        this._hasNotebookViewChanged = new Signal(this);
-        this._diffStyleChanged = new Signal(this);
-        this._fileDiffActive = false;
-        this._fileDiffActiveChanged = new Signal(this);
-        this._model = model;
-        this._context = context;
-        this._notebookViewMode = readStoredNotebookViewMode();
-        this._diffStyle = readStoredDiffStyle();
-        // `jp-git-diff-root` borrows jupyterlab-git's host sizing (height:100%
-        // flex column inside its PreviewMainAreaWidget); `jp-xtralab-DiffWidget`
-        // brings our diff theming + the `.jp-xtralab-DiffWidget-*` styles.
-        this.addClass('jp-git-diff-root');
-        this.addClass(DIFF_WIDGET_CSS_CLASS);
-    }
-    /** The diff model, as required by `Git.Diff.IDiffWidget`. */
-    get model() {
-        return this._model;
-    }
-    /**
-     * We render a two-way (reference vs. challenger) view and do not provide
-     * a merge editor, so there is nothing to leave unresolved — report
-     * resolved so jupyterlab-git's merge-conflict flow is not blocked.
-     */
-    get isFileResolved() {
-        return true;
-    }
-    /**
-     * Used by jupyterlab-git's "Mark as resolved" button. For merge
-     * conflicts, jupyterlab-git passes the working-tree result as `base`;
-     * keep that content rather than overwriting it with either compared side.
-     */
-    async getResolvedFile() {
-        const source = this._model.hasConflict === true && this._model.base !== undefined
-            ? this._model.base
-            : this._model.challenger;
-        const content = await source.content();
-        return {
-            type: 'file',
-            format: imageDataType(this._model.filename) !== null ? 'base64' : 'text',
-            content
-        };
-    }
-    /**
-     * Re-pull both sides of the model and re-render. jupyterlab-git wires a
-     * "Refresh" toolbar button to this whenever `model.changed` fires (e.g.
-     * the compared `HEAD` moved).
-     */
-    async refresh() {
-        const done = new PromiseDelegate();
-        this._pendingRefresh = done;
-        this._reloadNonce += 1;
-        this.update();
-        await done.promise;
-    }
-    /** The notebook rendered-vs-JSON choice; mirrored into the toolbar. */
-    get notebookViewMode() {
-        return this._notebookViewMode;
-    }
-    setNotebookViewMode(mode) {
-        if (mode === this._notebookViewMode) {
-            return;
-        }
-        this._notebookViewMode = mode;
-        writeStoredNotebookViewMode(mode);
-        this._notebookViewModeChanged.emit(mode);
-    }
-    get notebookViewModeChanged() {
-        return this._notebookViewModeChanged;
-    }
-    get hasNotebookView() {
-        return this._hasNotebookView;
-    }
-    setHasNotebookView(value) {
-        if (value === this._hasNotebookView) {
-            return;
-        }
-        this._hasNotebookView = value;
-        this._hasNotebookViewChanged.emit(value);
-    }
-    get hasNotebookViewChanged() {
-        return this._hasNotebookViewChanged;
-    }
-    /** The user's current split-vs-unified layout choice for file diffs. */
-    get diffStyle() {
-        return this._diffStyle;
-    }
-    setDiffStyle(style) {
-        if (style === this._diffStyle) {
-            return;
-        }
-        this._diffStyle = style;
-        writeStoredDiffStyle(style);
-        this._diffStyleChanged.emit(style);
-    }
-    get diffStyleChanged() {
-        return this._diffStyleChanged;
-    }
-    /**
-     * Whether the textual/code file diff (the only view the split-vs-unified
-     * choice affects) is currently active; mirrored into the toolbar so the
-     * Split/Unified selector only shows when it applies.
-     */
-    get fileDiffActive() {
-        return this._fileDiffActive;
-    }
-    setFileDiffActive(value) {
-        if (value === this._fileDiffActive) {
-            return;
-        }
-        this._fileDiffActive = value;
-        this._fileDiffActiveChanged.emit(value);
-    }
-    get fileDiffActiveChanged() {
-        return this._fileDiffActiveChanged;
-    }
-    /** Resolve the in-flight {@link refresh} promise, if any. */
-    settleRefresh() {
-        const pending = this._pendingRefresh;
-        this._pendingRefresh = null;
-        pending === null || pending === void 0 ? void 0 : pending.resolve();
-    }
-    get reloadNonce() {
-        return this._reloadNonce;
-    }
-    get context() {
-        return this._context;
-    }
-    render() {
-        return React.createElement(ModelDiffView, { widget: this });
-    }
-}
-function ModelDiffView(props) {
-    const { widget } = props;
-    const model = widget.model;
-    const { contentsManager, rendermime, themeManager } = widget.context;
-    const nonce = widget.reloadNonce;
-    const [state, setState] = React.useState({
-        loading: true,
-        oldText: '',
-        newText: '',
-        error: null
-    });
-    // Mirror the widget's notebook view mode so toolbar-driven changes
-    // re-render the diff. The widget owns the canonical value (so the
-    // toolbar can read/write it without going through React).
-    const [notebookViewMode, setNotebookViewMode] = React.useState(() => widget.notebookViewMode);
-    React.useEffect(() => {
-        const handler = (_sender, mode) => {
-            setNotebookViewMode(mode);
-        };
-        widget.notebookViewModeChanged.connect(handler);
-        setNotebookViewMode(widget.notebookViewMode);
-        return () => {
-            widget.notebookViewModeChanged.disconnect(handler);
-        };
-    }, [widget]);
-    const handleNotebookAvailabilityChange = React.useCallback((available) => {
-        widget.setHasNotebookView(available);
-    }, [widget]);
-    // Mirror the widget's diff-style choice so toolbar-driven changes
-    // re-render the diff. The widget owns the canonical value.
-    const [diffStyle, setDiffStyle] = React.useState(() => widget.diffStyle);
-    React.useEffect(() => {
-        const handler = (_sender, style) => {
-            setDiffStyle(style);
-        };
-        widget.diffStyleChanged.connect(handler);
-        setDiffStyle(widget.diffStyle);
-        return () => {
-            widget.diffStyleChanged.disconnect(handler);
-        };
-    }, [widget]);
-    const handleFileDiffActiveChange = React.useCallback((active) => {
-        widget.setFileDiffActive(active);
-    }, [widget]);
-    const [dark, setDark] = React.useState(() => isDarkTheme(themeManager));
-    React.useEffect(() => {
-        if (themeManager !== null) {
-            const handler = () => setDark(isDarkTheme(themeManager));
-            themeManager.themeChanged.connect(handler);
-            return () => {
-                themeManager.themeChanged.disconnect(handler);
-            };
-        }
-        const observer = new MutationObserver(() => setDark(isDarkTheme(themeManager)));
-        observer.observe(document.body, {
-            attributes: true,
-            attributeFilter: ['data-jp-theme-light']
-        });
-        return () => {
-            observer.disconnect();
-        };
-    }, [themeManager]);
-    // Fetch both sides whenever the model or the reload nonce changes. The
-    // model's `content()` getters target the right git refs internally
-    // (working tree, index, a commit, …) so we stay content-source-agnostic.
-    React.useEffect(() => {
-        let cancelled = false;
-        setState({ loading: true, oldText: '', newText: '', error: null });
-        void (async () => {
-            try {
-                const [oldText, newText] = await Promise.all([
-                    model.reference.content(),
-                    model.challenger.content()
-                ]);
-                if (cancelled) {
-                    return;
-                }
-                setState({
-                    loading: false,
-                    oldText: oldText !== null && oldText !== void 0 ? oldText : '',
-                    newText: newText !== null && newText !== void 0 ? newText : '',
-                    error: null
-                });
-            }
-            catch (err) {
-                if (cancelled) {
-                    return;
-                }
-                setState({
-                    loading: false,
-                    oldText: '',
-                    newText: '',
-                    error: err instanceof Error ? err.message : String(err)
-                });
-            }
-            finally {
-                if (!cancelled) {
-                    // Let an in-flight `widget.refresh()` resolve once the reload
-                    // has settled (jupyterlab-git only awaits it to hide its
-                    // refresh button).
-                    widget.settleRefresh();
-                }
-            }
-        })();
-        return () => {
-            cancelled = true;
-        };
-    }, [widget, model, nonce]);
-    // Per-hunk discard is only meaningful when the challenger is the working
-    // tree (an unstaged change) and we are not in a three-way merge view.
-    const canDiscardHunk = model.challenger.source === Git.Diff.SpecialRef.WORKING &&
-        model.hasConflict !== true;
-    const serverPath = React.useMemo(() => { var _a; return PathExt.join((_a = model.repositoryPath) !== null && _a !== void 0 ? _a : '', model.filename); }, [model.repositoryPath, model.filename]);
-    const hunkDiscard = React.useMemo(() => ({
-        enabled: canDiscardHunk,
-        save: async (text) => {
-            await contentsManager.save(serverPath, {
-                type: 'file',
-                format: 'text',
-                content: text
-            });
-        },
-        onAfterSave: () => {
-            // jupyterlab-git's panel auto-refreshes off the contents
-            // `fileChanged` signal the save above emits; we just need to
-            // re-pull so the diff reflects the reverted hunk. (We do not
-            // auto-close: jupyterlab-git owns the diff tab.)
-            void widget.refresh();
-        }
-    }), [canDiscardHunk, contentsManager, serverPath, widget]);
-    return (React.createElement(DiffSurface, { loading: state.loading, error: state.error, isBinary: false, oldText: state.oldText, newText: state.newText, newName: model.filename, oldName: model.filename, dark: dark, rendermime: rendermime, notebookViewMode: notebookViewMode, diffStyle: diffStyle, onNotebookAvailabilityChange: handleNotebookAvailabilityChange, onFileDiffActiveChange: handleFileDiffActiveChange, hunkDiscard: hunkDiscard }));
-}
-/**
- * Notebook/JSON toggle mounted into the diff toolbar that jupyterlab-git
- * passes to the factory. Bound to the widget's signals so it stays in sync
- * with the rendered surface and only appears for parseable notebooks.
- */
-class NotebookViewModeToolbarItem extends ReactWidget {
-    constructor(widget) {
-        super();
-        this._widget = widget;
-        this.addClass('jp-xtralab-DiffWidget-viewModeToolbarItem');
-    }
-    render() {
-        return React.createElement(ToolbarControl, { widget: this._widget });
-    }
-}
-function ToolbarControl(props) {
-    const { widget } = props;
-    const [mode, setMode] = React.useState(() => widget.notebookViewMode);
-    const [available, setAvailable] = React.useState(() => widget.hasNotebookView);
-    React.useEffect(() => {
-        const onMode = (_sender, next) => {
-            setMode(next);
-        };
-        const onAvailable = (_sender, next) => {
-            setAvailable(next);
-        };
-        widget.notebookViewModeChanged.connect(onMode);
-        widget.hasNotebookViewChanged.connect(onAvailable);
-        setMode(widget.notebookViewMode);
-        setAvailable(widget.hasNotebookView);
-        return () => {
-            widget.notebookViewModeChanged.disconnect(onMode);
-            widget.hasNotebookViewChanged.disconnect(onAvailable);
-        };
-    }, [widget]);
-    return (React.createElement(NotebookViewModeControl, { mode: mode, available: available, onChange: next => widget.setNotebookViewMode(next) }));
-}
-/**
- * Split/Unified toggle mounted into the diff toolbar jupyterlab-git passes
- * to the factory. Bound to the widget's signals so it stays in sync with the
- * rendered surface and only appears while the textual/code file diff is the
- * active view.
- */
-class DiffStyleToolbarItem extends ReactWidget {
-    constructor(widget) {
-        super();
-        this._widget = widget;
-        this.addClass('jp-xtralab-DiffWidget-diffStyleToolbarItem');
-    }
-    render() {
-        return React.createElement(DiffStyleControlBound, { widget: this._widget });
-    }
-}
-function DiffStyleControlBound(props) {
-    const { widget } = props;
-    const [style, setStyle] = React.useState(() => widget.diffStyle);
-    const [available, setAvailable] = React.useState(() => widget.fileDiffActive);
-    React.useEffect(() => {
-        const onStyle = (_sender, next) => {
-            setStyle(next);
-        };
-        const onAvailable = (_sender, next) => {
-            setAvailable(next);
-        };
-        widget.diffStyleChanged.connect(onStyle);
-        widget.fileDiffActiveChanged.connect(onAvailable);
-        setStyle(widget.diffStyle);
-        setAvailable(widget.fileDiffActive);
-        return () => {
-            widget.diffStyleChanged.disconnect(onStyle);
-            widget.fileDiffActiveChanged.disconnect(onAvailable);
-        };
-    }, [widget]);
-    return (React.createElement(DiffStyleControl, { diffStyle: style, available: available, onChange: next => widget.setDiffStyle(next) }));
-}
-/**
- * Build the `Git.Diff.Factory` xtralab registers with jupyterlab-git. The
- * factory closes over the application-level context (contents manager for
- * hunk discard, rendermime for notebook outputs, theme manager) that the
- * `Git.Diff.IFactoryOptions` does not carry.
+ * Build the `Git.Diff.Factory` registered with jupyterlab-git.
  */
 function makeXtralabDiffFactory(context) {
     return async (options) => {
         const widget = new XtralabDiffWidget(options.model, context);
         if (options.toolbar) {
-            options.toolbar.addItem('xtralab-notebook-view-mode', new NotebookViewModeToolbarItem(widget));
-            options.toolbar.addItem('xtralab-diff-style', new DiffStyleToolbarItem(widget));
+            addDiffToolbarItems(options.toolbar, widget);
         }
         return widget;
     };
 }
-/**
- * Registers xtralab's diff rendering as jupyterlab-git's diff providers:
- * `@pierre/diffs` for text and notebooks, the bundled `<img>`-based view
- * for raster images.
- */
 const diffProviderPlugin = {
     id: 'xtralab:git-diff-providers',
     description: "Replaces jupyterlab-git's notebook, text and image diff plugins with xtralab's renderer.",
@@ -395,9 +27,7 @@ const diffProviderPlugin = {
             rendermime,
             themeManager
         });
-        // Notebooks and raster images get extension-specific providers; every
-        // other text file falls back to the same factory. One factory serves
-        // all three — the surface auto-detects notebooks/images by filename.
+        // Use one shared factory; the surface detects notebooks/images by filename.
         gitExtension.registerDiffProvider('XtralabNotebook', ['.ipynb'], factory);
         gitExtension.registerDiffProvider('XtralabImage', IMAGE_DIFF_EXTENSIONS, factory);
         gitExtension.registerFallbackDiffProvider(factory);