Revert "First set of changes for Notebooks removal. (#1816)" (#1830)

This reverts commit b023250e67.

src/Explorer/Panes/CopyNotebookPane/CopyNotebookPane.tsx

@@ -0,0 +1,154 @@
+import { IDropdownOption } from "@fluentui/react";
+import React, { FormEvent, FunctionComponent, useEffect, useState } from "react";
+import { HttpStatusCodes, PoolIdType } from "../../../Common/Constants";
+import { getErrorMessage, handleError } from "../../../Common/ErrorHandlingUtils";
+import { GitHubOAuthService } from "../../../GitHub/GitHubOAuthService";
+import { IPinnedRepo, JunoClient } from "../../../Juno/JunoClient";
+import * as GitHubUtils from "../../../Utils/GitHubUtils";
+import * as NotificationConsoleUtils from "../../../Utils/NotificationConsoleUtils";
+import { useSidePanel } from "../../../hooks/useSidePanel";
+import Explorer from "../../Explorer";
+import { NotebookContentItem, NotebookContentItemType } from "../../Notebook/NotebookContentItem";
+import { useNotebook } from "../../Notebook/useNotebook";
+import { RightPaneForm, RightPaneFormProps } from "../RightPaneForm/RightPaneForm";
+import { CopyNotebookPaneComponent, CopyNotebookPaneProps } from "./CopyNotebookPaneComponent";
+
+interface Location {
+  type: "MyNotebooks" | "GitHub";
+
+  // GitHub
+  owner?: string;
+  repo?: string;
+  branch?: string;
+}
+export interface CopyNotebookPanelProps {
+  name: string;
+  content: string;
+  container: Explorer;
+  junoClient: JunoClient;
+  gitHubOAuthService: GitHubOAuthService;
+}
+
+export const CopyNotebookPane: FunctionComponent<CopyNotebookPanelProps> = ({
+  name,
+  content,
+  container,
+  junoClient,
+  gitHubOAuthService,
+}: CopyNotebookPanelProps) => {
+  const closeSidePanel = useSidePanel((state) => state.closeSidePanel);
+  const [isExecuting, setIsExecuting] = useState<boolean>();
+  const [formError, setFormError] = useState<string>("");
+  const [pinnedRepos, setPinnedRepos] = useState<IPinnedRepo[]>();
+  const [selectedLocation, setSelectedLocation] = useState<Location>();
+
+  useEffect(() => {
+    open();
+  }, []);
+
+  const open = async (): Promise<void> => {
+    if (gitHubOAuthService.isLoggedIn()) {
+      const response = await junoClient.getPinnedRepos(gitHubOAuthService.getTokenObservable()()?.scope);
+      if (response.status !== HttpStatusCodes.OK && response.status !== HttpStatusCodes.NoContent) {
+        handleError(`Received HTTP ${response.status} when fetching pinned repos`, "CopyNotebookPaneAdapter/submit");
+      }
+
+      if (response.data?.length > 0) {
+        setPinnedRepos(response.data);
+      }
+    }
+  };
+
+  const submit = async (): Promise<void> => {
+    let destination: string = selectedLocation?.type;
+    let clearMessage: () => void;
+    setIsExecuting(true);
+
+    try {
+      if (!selectedLocation) {
+        throw new Error(`No location selected`);
+      }
+
+      if (selectedLocation.type === "GitHub") {
+        destination = `${destination} - ${GitHubUtils.toRepoFullName(
+          selectedLocation.owner,
+          selectedLocation.repo,
+        )} - ${selectedLocation.branch}`;
+      } else if (selectedLocation.type === "MyNotebooks" && useNotebook.getState().isPhoenixNotebooks) {
+        destination = useNotebook.getState().notebookFolderName;
+      }
+
+      clearMessage = NotificationConsoleUtils.logConsoleProgress(`Copying ${name} to ${destination}`);
+
+      const notebookContentItem = await copyNotebook(selectedLocation);
+      if (!notebookContentItem) {
+        throw new Error(`Failed to upload ${name}`);
+      }
+
+      NotificationConsoleUtils.logConsoleInfo(`Successfully copied ${name} to ${destination}`);
+      closeSidePanel();
+    } catch (error) {
+      const errorMessage = getErrorMessage(error);
+      setFormError(`Failed to copy ${name} to ${destination}`);
+      handleError(errorMessage, "CopyNotebookPaneAdapter/submit", formError);
+    } finally {
+      clearMessage && clearMessage();
+      setIsExecuting(false);
+    }
+  };
+
+  const copyNotebook = async (location: Location): Promise<NotebookContentItem> => {
+    let parent: NotebookContentItem;
+    let isGithubTree: boolean;
+    switch (location.type) {
+      case "MyNotebooks":
+        parent = {
+          name: useNotebook.getState().notebookFolderName,
+          path: useNotebook.getState().notebookBasePath,
+          type: NotebookContentItemType.Directory,
+        };
+        isGithubTree = false;
+        if (useNotebook.getState().isPhoenixNotebooks) {
+          await container.allocateContainer(PoolIdType.DefaultPoolId);
+        }
+        break;
+
+      case "GitHub":
+        parent = {
+          name: selectedLocation.branch,
+          path: GitHubUtils.toContentUri(selectedLocation.owner, selectedLocation.repo, selectedLocation.branch, ""),
+          type: NotebookContentItemType.Directory,
+        };
+        isGithubTree = true;
+        break;
+
+      default:
+        throw new Error(`Unsupported location type ${location.type}`);
+    }
+
+    return container.uploadFile(name, content, parent, isGithubTree);
+  };
+
+  const onDropDownChange = (_: FormEvent<HTMLDivElement>, option?: IDropdownOption): void => {
+    setSelectedLocation(option?.data);
+  };
+
+  const props: RightPaneFormProps = {
+    formError,
+    isExecuting: isExecuting,
+    submitButtonText: "OK",
+    onSubmit: () => submit(),
+  };
+
+  const copyNotebookPaneProps: CopyNotebookPaneProps = {
+    name,
+    pinnedRepos,
+    onDropDownChange: onDropDownChange,
+  };
+
+  return (
+    <RightPaneForm {...props}>
+      <CopyNotebookPaneComponent {...copyNotebookPaneProps} />
+    </RightPaneForm>
+  );
+};

src/Explorer/Panes/CopyNotebookPane/CopyNotebookPaneComponent.tsx

@@ -0,0 +1,120 @@
+import {
+  Dropdown,
+  IDropdownOption,
+  IDropdownProps,
+  IRenderFunction,
+  ISelectableOption,
+  Label,
+  SelectableOptionMenuItemType,
+  Stack,
+  Text,
+} from "@fluentui/react";
+import { GitHubReposTitle } from "Explorer/Tree/ResourceTree";
+import React, { FormEvent, FunctionComponent } from "react";
+import { IPinnedRepo } from "../../../Juno/JunoClient";
+import * as GitHubUtils from "../../../Utils/GitHubUtils";
+import { useNotebook } from "../../Notebook/useNotebook";
+
+interface Location {
+  type: "MyNotebooks" | "GitHub";
+
+  // GitHub
+  owner?: string;
+  repo?: string;
+  branch?: string;
+}
+
+export interface CopyNotebookPaneProps {
+  name: string;
+  pinnedRepos: IPinnedRepo[];
+  onDropDownChange: (_: FormEvent<HTMLDivElement>, option?: IDropdownOption) => void;
+}
+
+export const CopyNotebookPaneComponent: FunctionComponent<CopyNotebookPaneProps> = ({
+  name,
+  pinnedRepos,
+  onDropDownChange,
+}: CopyNotebookPaneProps) => {
+  const BranchNameWhiteSpace = "   ";
+
+  const onRenderDropDownTitle: IRenderFunction<IDropdownOption[]> = (options: IDropdownOption[]): JSX.Element => {
+    return <span>{options.length && options[0].title}</span>;
+  };
+
+  const onRenderDropDownOption: IRenderFunction<ISelectableOption> = (option: ISelectableOption): JSX.Element => {
+    return <span style={{ whiteSpace: "pre-wrap" }}>{option.text}</span>;
+  };
+
+  const getDropDownOptions = (): IDropdownOption[] => {
+    const options: IDropdownOption[] = [];
+    options.push({
+      key: "MyNotebooks-Item",
+      text: useNotebook.getState().notebookFolderName,
+      title: useNotebook.getState().notebookFolderName,
+      data: {
+        type: "MyNotebooks",
+      } as Location,
+    });
+
+    if (pinnedRepos && pinnedRepos.length > 0) {
+      options.push({
+        key: "GitHub-Header-Divider",
+        text: undefined,
+        itemType: SelectableOptionMenuItemType.Divider,
+      });
+
+      options.push({
+        key: "GitHub-Header",
+        text: GitHubReposTitle,
+        itemType: SelectableOptionMenuItemType.Header,
+      });
+
+      pinnedRepos.forEach((pinnedRepo) => {
+        const repoFullName = GitHubUtils.toRepoFullName(pinnedRepo.owner, pinnedRepo.name);
+        options.push({
+          key: `GitHub-Repo-${repoFullName}`,
+          text: repoFullName,
+          disabled: true,
+        });
+
+        pinnedRepo.branches.forEach((branch) =>
+          options.push({
+            key: `GitHub-Repo-${repoFullName}-${branch.name}`,
+            text: `${BranchNameWhiteSpace}${branch.name}`,
+            title: `${repoFullName} - ${branch.name}`,
+            data: {
+              type: "GitHub",
+              owner: pinnedRepo.owner,
+              repo: pinnedRepo.name,
+              branch: branch.name,
+            } as Location,
+          }),
+        );
+      });
+    }
+
+    return options;
+  };
+  const dropDownProps: IDropdownProps = {
+    label: "Location",
+    ariaLabel: "Location",
+    placeholder: "Select an option",
+    onRenderTitle: onRenderDropDownTitle,
+    onRenderOption: onRenderDropDownOption,
+    options: getDropDownOptions(),
+    onChange: onDropDownChange,
+  };
+
+  return (
+    <div className="paneMainContent">
+      <Stack tokens={{ childrenGap: 10 }}>
+        <Stack.Item>
+          <Label htmlFor="notebookName">Name</Label>
+          <Text id="notebookName">{name}</Text>
+        </Stack.Item>
+
+        <Dropdown {...dropDownProps} />
+      </Stack>
+    </div>
+  );
+};

src/Explorer/Panes/GitHubReposPanel/__snapshots__/GitHubReposPanel.test.tsx.snap

@@ -17,6 +17,8 @@ exports[`GitHub Repos Panel should render Default properly 1`] = `
       addRepoProps={
         Object {
           "container": Explorer {
+            "_isInitializingNotebooks": false,
+            "_resetNotebookWorkspace": [Function],
             "isFixedCollectionWithSharedThroughputSupported": [Function],
             "isTabsContentExpanded": [Function],
             "onRefreshDatabasesKeyPress": [Function],
@@ -33,8 +35,10 @@ exports[`GitHub Repos Panel should render Default properly 1`] = `
             "queriesClient": QueriesClient {
               "container": [Circular],
             },
+            "refreshNotebookList": [Function],
             "resourceTree": ResourceTreeAdapter {
               "container": [Circular],
+              "copyNotebook": [Function],
               "parameters": [Function],
             },
           },

src/Explorer/Panes/StringInputPane/__snapshots__/StringInputPane.test.tsx.snap

@@ -7,6 +7,8 @@ exports[`StringInput Pane should render Create new directory properly 1`] = `
   errorMessage="Could not create directory "
   explorer={
     Explorer {
+      "_isInitializingNotebooks": false,
+      "_resetNotebookWorkspace": [Function],
       "isFixedCollectionWithSharedThroughputSupported": [Function],
       "isTabsContentExpanded": [Function],
       "onRefreshDatabasesKeyPress": [Function],
@@ -23,8 +25,10 @@ exports[`StringInput Pane should render Create new directory properly 1`] = `
       "queriesClient": QueriesClient {
         "container": [Circular],
       },
+      "refreshNotebookList": [Function],
       "resourceTree": ResourceTreeAdapter {
         "container": [Circular],
+        "copyNotebook": [Function],
         "parameters": [Function],
       },
     }