Update style

jupyterlab-contrib · Nov 27, 2024 · df65ab5 · df65ab5
1 parent 28a2f39
commit df65ab5
Show file tree

Hide file tree

Showing 4 changed files with 36 additions and 3 deletions.
diff --git a/packages/base/src/suggestionsPanel/model.ts b/packages/base/src/suggestionsPanel/model.ts
@@ -69,6 +69,23 @@ export class SuggestionsModel implements ISuggestionsModel {
       ...options
     });
   }
+  getCellIndex(cellId?: string): number {
+    if (!cellId) {
+      return -1;
+    }
+
+    const allCells = this._notebookPanel?.content.model?.cells;
+    if (!allCells) {
+      return -1;
+    }
+    for (let idx = 0; idx < allCells.length; idx++) {
+      const element = allCells.get(idx);
+      if (element.id === cellId) {
+        return idx;
+      }
+    }
+    return -1;
+  }
   async switchNotebook(panel: NotebookPanel | null): Promise<void> {
     if (panel) {
       await panel.context.ready;

diff --git a/packages/base/src/suggestionsPanel/style.ts b/packages/base/src/suggestionsPanel/style.ts
@@ -4,8 +4,9 @@ export const mainPanelStyle = style({});
 export const suggestionsWidgetAreaStyle = style({
   display: 'flex',
   flexDirection: 'column',
-  gap: '10px',
-  height: '100%'
+  gap: '5px',
+  height: '100%',
+  overflow: 'auto'
 });
 
 export const suggestionCellStyle = style({

diff --git a/packages/base/src/suggestionsPanel/widget.ts b/packages/base/src/suggestionsPanel/widget.ts
@@ -14,6 +14,7 @@ export class SuggestionsWidget extends PanelWithToolbar {
     this.title.label = 'All Suggestions';
     this._model = options.model;
     this._suggestionsArea.addClass(suggestionsWidgetAreaStyle);
+    this._suggestionsArea.addClass('jp-scrollbar-tiny');
     this.addWidget(this._suggestionsArea);
 
     this._renderSuggestions();
@@ -41,10 +42,22 @@ export class SuggestionsWidget extends PanelWithToolbar {
       case 'added': {
         const suggestion = this._model.getSuggestion({ cellId, suggestionId });
         if (suggestion) {
+          const cellIdx = this._model.getCellIndex(cellId);
+
+          if (cellIdx in this._indexCount) {
+            this._indexCount[cellIdx] += 1;
+          } else {
+            this._indexCount[cellIdx] = 1;
+          }
+          let suggestionPos = 0;
+          for (let key = 0; key <= cellIdx; key++) {
+            suggestionPos += this._indexCount[key];
+          }
+
           const w = new CellWidget({ cellModel: suggestion.content });
           w.id = suggestionId;
           w.addClass(suggestionCellSelectedStyle);
-          this._suggestionsArea.addWidget(w);
+          this._suggestionsArea.insertWidget(suggestionPos - 1, w);
         }
         break;
       }
@@ -87,6 +100,7 @@ export class SuggestionsWidget extends PanelWithToolbar {
     }
   }
   private _suggestionsArea = new Panel();
+  private _indexCount: { [key: number]: number } = {};
   private _model: ISuggestionsModel;
 }
 

diff --git a/packages/base/src/types.ts b/packages/base/src/types.ts
@@ -23,6 +23,7 @@ export interface ISuggestionsModel extends IDisposable {
     cellId: string;
     suggestionId: string;
   }): { content: ICell } | undefined;
+  getCellIndex(cellId?: string): number;
 }
 
 export interface ISuggestionChange {