Merge branch 'master' of https://github.com/Azure/cosmos-explorer into eslint/fix-lint-heatmap

.eslintignore

@@ -23,13 +23,8 @@ src/Common/QueriesClient.ts
 src/Common/Splitter.ts
 src/Config.ts
 src/Contracts/ActionContracts.ts
-src/Contracts/DataModels.ts
-src/Contracts/Diagnostics.ts
-src/Contracts/ExplorerContracts.ts
 src/Contracts/Versions.ts
 src/Contracts/ViewModels.ts
-src/Controls/Heatmap/Heatmap.test.ts
-src/Controls/Heatmap/Heatmap.ts
 src/Controls/Heatmap/HeatmapDatatypes.ts
 src/Definitions/datatables.d.ts
 src/Definitions/gif.d.ts

src/Controls/Heatmap/Heatmap.test.ts

@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
 import dayjs from "dayjs";
 import { handleMessage, Heatmap, isDarkTheme } from "./Heatmap";
 import { PortalTheme } from "./HeatmapDatatypes";
@@ -22,8 +23,8 @@ describe("The Heatmap Control", () => {
   };
 
   let heatmap: Heatmap;
-  let theme: PortalTheme = 1;
-  const divElement: string = `<div id="${Heatmap.elementId}"></div>`;
+  const theme: PortalTheme = 1;
+  const divElement = `<div id="${Heatmap.elementId}"></div>`;
 
   describe("drawHeatmap rendering", () => {
     beforeEach(() => {
@@ -100,7 +101,7 @@ describe("iframe rendering when there is no data", () => {
   });
 
   it("should show a no data message with a dark theme", () => {
-    let data = {
+    const data = {
       data: {
         signature: "pcIframe",
         data: {
@@ -111,7 +112,7 @@ describe("iframe rendering when there is no data", () => {
       },
     };
 
-    const divElement: string = `<div id="${Heatmap.elementId}"></div>`;
+    const divElement = `<div id="${Heatmap.elementId}"></div>`;
     document.body.innerHTML = divElement;
 
     handleMessage(data as MessageEvent);
@@ -120,7 +121,7 @@ describe("iframe rendering when there is no data", () => {
   });
 
   it("should show a no data message with a white theme", () => {
-    let data = {
+    const data = {
       data: {
         signature: "pcIframe",
         data: {
@@ -131,7 +132,7 @@ describe("iframe rendering when there is no data", () => {
       },
     };
 
-    const divElement: string = `<div id="${Heatmap.elementId}"></div>`;
+    const divElement = `<div id="${Heatmap.elementId}"></div>`;
     document.body.innerHTML = divElement;
 
     handleMessage(data as MessageEvent);

src/Controls/Heatmap/Heatmap.ts

@@ -39,7 +39,7 @@ export class Heatmap {
     }
   }
 
-  private _getFontStyles(size: number = StyleConstants.MediumFontSize, color: string = "#838383"): FontSettings {
+  private _getFontStyles(size: number = StyleConstants.MediumFontSize, color = "#838383"): FontSettings {
     return {
       family: StyleConstants.DataExplorerFont,
       size,
@@ -78,9 +78,9 @@ export class Heatmap {
     // go thru all rows and create 2d matrix for heatmap...
     for (let i = 0; i < rows.length; i++) {
       output.yAxisPoints.push(rows[i]);
-      let dataPoints: number[] = [];
+      const dataPoints: number[] = [];
       for (let a = 0; a < output.xAxisPoints.length; a++) {
-        let row: PartitionTimeStampToData = data[rows[i]];
+        const row: PartitionTimeStampToData = data[rows[i]];
         dataPoints.push(row[output.xAxisPoints[a]]["Normalized Throughput"]);
       }
       output.dataPoints.push(dataPoints);
@@ -193,8 +193,8 @@ export class Heatmap {
       this._getLayoutSettings(),
       this._getChartDisplaySettings()
     );
-    let plotDiv: any = document.getElementById(Heatmap.elementId);
-    plotDiv.on("plotly_click", (data: any) => {
+    const plotDiv = document.getElementById(Heatmap.elementId) as HTMLFormElement;
+    plotDiv.on("plotly_click", (data: HTMLFormElement) => {
       let timeSelected: string = data.points[0].x;
       timeSelected = timeSelected.replace(" ", "T");
       timeSelected = `${timeSelected}Z`;
@@ -205,7 +205,7 @@ export class Heatmap {
           break;
         }
       }
-      let output = [];
+      const output = [];
       for (let i = 0; i < this._chartData.dataPoints.length; i++) {
         output.push(this._chartData.dataPoints[i][xAxisIndex]);
       }

src/Explorer/Notebook/NotebookManager.tsx

@@ -29,6 +29,7 @@ import { SnapshotRequest } from "./NotebookComponent/types";
 import { NotebookContainerClient } from "./NotebookContainerClient";
 import { NotebookContentClient } from "./NotebookContentClient";
 import { SchemaAnalyzerNotebook } from "./SchemaAnalyzer/SchemaAnalyzerUtils";
+import { useNotebook } from "./useNotebook";
 
 type NotebookPaneContent = string | ImmutableNotebook;
 
@@ -110,6 +111,7 @@ export default class NotebookManager {
     this.junoClient.subscribeToPinnedRepos((pinnedRepos) => {
       this.params.resourceTree.initializeGitHubRepos(pinnedRepos);
       this.params.resourceTree.triggerRender();
+      useNotebook.getState().initializeGitHubRepos(pinnedRepos);
     });
     this.refreshPinnedRepos();
   }

src/Explorer/Notebook/useNotebook.ts

@@ -6,10 +6,12 @@ import { getErrorMessage } from "../../Common/ErrorHandlingUtils";
 import * as Logger from "../../Common/Logger";
 import { configContext } from "../../ConfigContext";
 import * as DataModels from "../../Contracts/DataModels";
+import { IPinnedRepo } from "../../Juno/JunoClient";
 import { Action, ActionModifiers } from "../../Shared/Telemetry/TelemetryConstants";
 import * as TelemetryProcessor from "../../Shared/Telemetry/TelemetryProcessor";
 import { userContext } from "../../UserContext";
 import { getAuthorizationHeader } from "../../Utils/AuthorizationUtils";
+import * as GitHubUtils from "../../Utils/GitHubUtils";
 import { NotebookContentItem, NotebookContentItemType } from "./NotebookContentItem";
 import NotebookManager from "./NotebookManager";
 
@@ -39,6 +41,7 @@ interface NotebookState {
   updateNotebookItem: (item: NotebookContentItem) => void;
   deleteNotebookItem: (item: NotebookContentItem) => void;
   initializeNotebooksTree: (notebookManager: NotebookManager) => Promise<void>;
+  initializeGitHubRepos: (pinnedRepos: IPinnedRepo[]) => void;
 }
 
 export const useNotebook: UseStore<NotebookState> = create((set, get) => ({
@@ -202,4 +205,31 @@ export const useNotebook: UseStore<NotebookState> = create((set, get) => ({
       }
     }
   },
+  initializeGitHubRepos: (pinnedRepos: IPinnedRepo[]): void => {
+    const gitHubNotebooksContentRoot = cloneDeep(get().gitHubNotebooksContentRoot);
+    if (gitHubNotebooksContentRoot) {
+      gitHubNotebooksContentRoot.children = [];
+      pinnedRepos?.forEach((pinnedRepo) => {
+        const repoFullName = GitHubUtils.toRepoFullName(pinnedRepo.owner, pinnedRepo.name);
+        const repoTreeItem: NotebookContentItem = {
+          name: repoFullName,
+          path: "PsuedoDir",
+          type: NotebookContentItemType.Directory,
+          children: [],
+        };
+
+        pinnedRepo.branches.forEach((branch) => {
+          repoTreeItem.children.push({
+            name: branch.name,
+            path: GitHubUtils.toContentUri(pinnedRepo.owner, pinnedRepo.name, branch.name, ""),
+            type: NotebookContentItemType.Directory,
+          });
+        });
+
+        gitHubNotebooksContentRoot.children.push(repoTreeItem);
+      });
+
+      set({ gitHubNotebooksContentRoot });
+    }
+  },
 }));

src/Explorer/useDatabases.ts

@@ -2,6 +2,7 @@ import _ from "underscore";
 import create, { UseStore } from "zustand";
 import * as Constants from "../Common/Constants";
 import * as ViewModels from "../Contracts/ViewModels";
+import { userContext } from "../UserContext";
 import { useSelectedNode } from "./useSelectedNode";
 
 interface DatabasesState {
@@ -136,6 +137,11 @@ export const useDatabases: UseStore<DatabasesState> = create((set, get) => ({
   },
   validateCollectionId: async (databaseId: string, collectionId: string): Promise<boolean> => {
     const database = get().databases.find((db) => db.id() === databaseId);
+    // For a new tables account, database is undefined when creating the first table
+    if (!database && userContext.apiType === "Tables") {
+      return true;
+    }
+
     await database.loadCollections();
     return !database.collections().some((collection) => collection.id() === collectionId);
   },