Use graphql in GitHubClient and misc fixes (#8)

* Use graphql in GitHubClient

* Replace usage of Array.find with _.find

package.json

@@ -32,7 +32,7 @@
     "@nteract/transform-plotly": "6.1.6",
     "@nteract/transform-vdom": "4.0.11",
     "@nteract/transform-vega": "7.0.6",
-    "@octokit/rest": "17.5.1",
+    "@octokit/rest": "17.9.2",
     "@phosphor/widgets": "1.9.3",
     "@uifabric/react-cards": "0.109.53",
     "@uifabric/styling": "7.11.2",

src/Explorer/Controls/DialogReactComponent/DialogComponent.tsx

@@ -54,7 +54,8 @@ export class DialogComponent extends React.Component<DialogProps, {}> {
         styles: {
           title: { fontSize: DIALOG_TITLE_FONT_SIZE, fontWeight: DIALOG_TITLE_FONT_WEIGHT },
           subText: { fontSize: DIALOG_SUBTEXT_FONT_SIZE }
-        }
+        },
+        showCloseButton: false
       },
       modalProps: { isBlocking: this.props.isModal },
       minWidth: DIALOG_MIN_WIDTH,

src/Explorer/Controls/Directory/DefaultDirectoryDropdownComponent.tsx

@@ -2,6 +2,7 @@
  * React component for Switch Directory
  */
 
+import _ from "underscore";
 import * as React from "react";
 import { Dropdown, IDropdownOption, IDropdownProps } from "office-ui-fabric-react/lib/Dropdown";
 import { Tenant } from "../../../Contracts/DataModels";
@@ -60,7 +61,7 @@ export class DefaultDirectoryDropdownComponent extends React.Component<DefaultDi
       return;
     }
 
-    const selectedDirectory = this.props.directories.find(d => d.tenantId === option.key);
+    const selectedDirectory = _.find(this.props.directories, d => d.tenantId === option.key);
     if (!selectedDirectory) {
       return;
     }

src/Explorer/Controls/Directory/DirectoryListComponent.tsx

@@ -1,3 +1,4 @@
+import _ from "underscore";
 import * as React from "react";
 
 import { DefaultButton, IButtonProps } from "office-ui-fabric-react/lib/Button";
@@ -114,7 +115,7 @@ export class DirectoryListComponent extends React.Component<DirectoryListProps,
     }
     const buttonElement = e.currentTarget;
     const selectedDirectoryId = buttonElement.getElementsByClassName("directoryListItemId")[0].textContent;
-    const selectedDirectory = this.props.directories.find(d => d.tenantId === selectedDirectoryId);
+    const selectedDirectory = _.find(this.props.directories, d => d.tenantId === selectedDirectoryId);
 
     this.props.onNewDirectorySelected(selectedDirectory);
   };

src/Explorer/Controls/GitHub/AddRepoComponent.tsx

@@ -93,7 +93,7 @@ export class AddRepoComponent extends React.Component<AddRepoComponentProps, Add
       const repo = await this.props.getRepo(repoInfo.owner, repoInfo.repo);
       if (repo) {
         const item: RepoListItem = {
-          key: GitHubUtils.toRepoFullName(repo.owner.login, repo.name),
+          key: GitHubUtils.toRepoFullName(repo.owner, repo.name),
           repo,
           branches: [
             {

src/Explorer/Controls/GitHub/ReposListComponent.tsx

@@ -18,7 +18,7 @@ import {
   Text
 } from "office-ui-fabric-react";
 import * as React from "react";
-import { IGitHubBranch } from "../../../GitHub/GitHubClient";
+import { IGitHubBranch, IGitHubPageInfo } from "../../../GitHub/GitHubClient";
 import { GitHubUtils } from "../../../Utils/GitHubUtils";
 import { RepoListItem } from "./GitHubReposComponent";
 import {
@@ -41,6 +41,7 @@ export interface ReposListComponentProps {
 
 export interface BranchesProps {
   branches: IGitHubBranch[];
+  lastPageInfo?: IGitHubPageInfo;
   hasMore: boolean;
   isLoading: boolean;
   loadMore: () => void;
@@ -139,7 +140,7 @@ export class ReposListComponent extends React.Component<ReposListComponentProps>
     }
 
     const checkboxProps: ICheckboxProps = {
-      ...ReposListComponent.getCheckboxPropsForLabel(GitHubUtils.toRepoFullName(item.repo.owner.login, item.repo.name)),
+      ...ReposListComponent.getCheckboxPropsForLabel(GitHubUtils.toRepoFullName(item.repo.owner, item.repo.name)),
       styles: ReposListCheckboxStyles,
       defaultChecked: true,
       onChange: () => this.props.unpinRepo(item)
@@ -153,7 +154,7 @@ export class ReposListComponent extends React.Component<ReposListComponentProps>
       return <></>;
     }
 
-    const branchesProps = this.props.branchesProps[GitHubUtils.toRepoFullName(item.repo.owner.login, item.repo.name)];
+    const branchesProps = this.props.branchesProps[GitHubUtils.toRepoFullName(item.repo.owner, item.repo.name)];
     const options: IDropdownOption[] = branchesProps.branches.map(branch => ({
       key: branch.name,
       text: branch.name,
@@ -222,7 +223,7 @@ export class ReposListComponent extends React.Component<ReposListComponentProps>
 
   private onRenderPinnedReposBranchesDropdownOption(option: IDropdownOption): JSX.Element {
     const item: RepoListItem = option.data;
-    const branchesProps = this.props.branchesProps[GitHubUtils.toRepoFullName(item.repo.owner.login, item.repo.name)];
+    const branchesProps = this.props.branchesProps[GitHubUtils.toRepoFullName(item.repo.owner, item.repo.name)];
 
     if (option.index === ReposListComponent.FooterIndex) {
       const linkProps: ILinkProps = {
@@ -267,7 +268,7 @@ export class ReposListComponent extends React.Component<ReposListComponentProps>
     }
 
     const checkboxProps: ICheckboxProps = {
-      ...ReposListComponent.getCheckboxPropsForLabel(GitHubUtils.toRepoFullName(item.repo.owner.login, item.repo.name)),
+      ...ReposListComponent.getCheckboxPropsForLabel(GitHubUtils.toRepoFullName(item.repo.owner, item.repo.name)),
       styles: ReposListCheckboxStyles,
       onChange: () => {
         const repoListItem = { ...item };

src/Explorer/Explorer.ts

@@ -2583,7 +2583,7 @@ export default class Explorer implements ViewModels.Explorer {
     const item = NotebookUtil.createNotebookContentItem(name, path, "file");
     const parent = this.resourceTree.myNotebooksContentRoot;
 
-    if (parent && this.isNotebookEnabled() && this.notebookClient) {
+    if (parent && parent.children && this.isNotebookEnabled() && this.notebookClient) {
       if (this._filePathToImportAndOpen === path) {
         this._filePathToImportAndOpen = null; // we don't want to try opening this path again
       }

src/Explorer/Menus/CommandBar/CommandBarUtil.tsx

@@ -1,3 +1,4 @@
+import _ from "underscore";
 import * as React from "react";
 import * as ViewModels from "../../../Contracts/ViewModels";
 import { Observable } from "knockout";
@@ -46,7 +47,7 @@ export class CommandBarUtil {
             text: btn.commandButtonLabel || btn.tooltipText,
             "data-test": btn.commandButtonLabel || btn.tooltipText,
             title: btn.tooltipText,
-            name: "menuitem",
+            name: btn.commandButtonLabel || btn.tooltipText,
             disabled: btn.disabled,
             ariaLabel: btn.ariaLabel,
             buttonStyles: {
@@ -126,6 +127,9 @@ export class CommandBarUtil {
           }
 
           if (btn.isDropdown) {
+            const selectedChild = _.find(btn.children, child => child.dropdownItemKey === btn.dropdownSelectedKey);
+            result.name = selectedChild?.commandButtonLabel || btn.dropdownPlaceholder;
+
             const dropdownStyles: Partial<IDropdownStyles> = {
               root: { margin: 5 },
               dropdown: { width: btn.dropdownWidth },

src/Explorer/Notebook/NotebookComponent/actions.ts

@@ -17,25 +17,6 @@ export const closeNotebook = (payload: { contentRef: ContentRef }): CloseNoteboo
   };
 };
 
-export const UPDATE_LAST_MODIFIED = "UPDATE_LAST_MODIFIED";
-export interface UpdateLastModifiedAction {
-  type: "UPDATE_LAST_MODIFIED";
-  payload: {
-    contentRef: ContentRef;
-    lastModified: string;
-  };
-}
-
-export const updateLastModified = (payload: {
-  contentRef: ContentRef;
-  lastModified: string;
-}): UpdateLastModifiedAction => {
-  return {
-    type: UPDATE_LAST_MODIFIED,
-    payload
-  };
-};
-
 export const EXECUTE_FOCUSED_CELL_AND_FOCUS_NEXT = "EXECUTE_FOCUSED_CELL_AND_FOCUS_NEXT";
 export interface ExecuteFocusedCellAndFocusNextAction {
   type: "EXECUTE_FOCUSED_CELL_AND_FOCUS_NEXT";