chore: git mod - connect modal and branches

app/client/src/git/ce/components/ContinuousDelivery/index.tsx

@@ -1,8 +1,8 @@
 import React from "react";
-import CDUnLicnesed from "./CDUnLicensed";
+import CDUnLicensed from "./CDUnLicensed";
 
 function ContinuousDelivery() {
-  return <CDUnLicnesed />;
+  return <CDUnLicensed />;
 }
 
 export default ContinuousDelivery;

app/client/src/git/ce/components/DefaultBranch/index.tsx

@@ -1,9 +1,9 @@
 import React from "react";
-import { useGitContext } from "git/components/GitContextProvider";
 import DefaultBranchView from "./DefaultBranchView";
+import useBranches from "git/hooks/useBranches";
 
 export default function DefaultBranch() {
-  const { branches } = useGitContext();
+  const { branches } = useBranches();
 
   return (
     <DefaultBranchView

app/client/src/git/ce/components/GitModals/index.tsx

@@ -1,4 +1,5 @@
 import ConflictErrorModal from "git/components/ConflictErrorModal";
+import ConnectModal from "git/components/ConnectModal";
 import DisableAutocommitModal from "git/components/DisableAutocommitModal";
 import DisconnectModal from "git/components/DisconnectModal";
 import OpsModal from "git/components/OpsModal";
@@ -8,6 +9,7 @@ import React from "react";
 function GitModals() {
   return (
     <>
+      <ConnectModal />
       <OpsModal />
       <SettingsModal />
       <DisconnectModal />

app/client/src/git/components/BranchList/BranchListHotKeys.tsx

@@ -0,0 +1,86 @@
+import React from "react";
+import { Hotkey, Hotkeys, HotkeysTarget } from "@blueprintjs/core";
+
+interface Props {
+  handleUpKey: () => void;
+  handleDownKey: () => void;
+  handleSubmitKey: () => void;
+  handleEscKey: () => void;
+  children: React.ReactNode;
+}
+
+@HotkeysTarget
+class GlobalSearchHotKeys extends React.Component<Props> {
+  get hotKeysConfig() {
+    return [
+      {
+        combo: "up",
+        onKeyDown: () => {
+          this.props.handleUpKey();
+        },
+        allowInInput: true,
+        group: "Branches",
+        label: "Move up the list",
+      },
+      {
+        combo: "down",
+        onKeyDown: this.props.handleDownKey,
+        allowInInput: true,
+        group: "Branches",
+        label: "Move down the list",
+      },
+      {
+        combo: "return",
+        onKeyDown: this.props.handleSubmitKey,
+        allowInInput: true,
+        group: "Branches",
+        label: "Submit",
+      },
+      {
+        combo: "ESC",
+        onKeyDown: this.props.handleEscKey,
+        allowInInput: true,
+        group: "Branches",
+        label: "ESC",
+      },
+    ];
+  }
+
+  renderHotkeys() {
+    return (
+      <Hotkeys>
+        {this.hotKeysConfig.map(
+          ({ allowInInput, combo, group, label, onKeyDown }, index) => (
+            <Hotkey
+              allowInInput={allowInInput}
+              combo={combo}
+              global={false}
+              group={group}
+              key={index}
+              label={label}
+              onKeyDown={onKeyDown}
+            />
+          ),
+        )}
+      </Hotkeys>
+    );
+  }
+
+  render() {
+    return (
+      <div
+        style={{
+          display: "flex",
+          flex: 1,
+          flexDirection: "column",
+          minHeight: 0,
+          overflow: "auto",
+        }}
+      >
+        {this.props.children}
+      </div>
+    );
+  }
+}
+
+export default GlobalSearchHotKeys;

app/client/src/git/components/BranchList/BranchListItemContainer.tsx

@@ -0,0 +1,37 @@
+import styled from "styled-components";
+
+const BranchListItemContainer = styled.div<{
+  isSelected?: boolean;
+  isActive?: boolean;
+  isDefault?: boolean;
+}>`
+  padding: ${(props) => `${props.theme.spaces[4]}px`};
+  margin: ${(props) => `${props.theme.spaces[1]}px 0`};
+  color: var(--ads-v2-color-fg-emphasis);
+  cursor: pointer;
+  width: 100%;
+  height: 36px;
+  border-radius: var(--ads-v2-border-radius);
+  background-color: ${(props) =>
+    props.isSelected || props.isActive ? "var(--ads-v2-color-bg-muted)" : ""};
+  ${(props) =>
+    !props.isActive &&
+    `&:hover {
+  background-color: var(--ads-v2-color-bg-subtle);
+  }`}
+
+  display: flex;
+  align-items: center;
+
+  .branch-list-item-text {
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    display: flex;
+    align-items: center;
+    gap: 4px;
+    flex: 1;
+  }
+`;
+
+export default BranchListItemContainer;