From 0200c4eecefcd8dba6a1c9dca16906d2b210f4d4 Mon Sep 17 00:00:00 2001
From: Rudraprasad Das <rudra@appsmith.com>
Date: Tue, 14 Nov 2023 10:56:26 +0530
Subject: [PATCH] fix: calling protected branches on sync (#28824)

## Description
Fetching updated protected branches when new branch list is synced

#### PR fixes following issue(s)
Fixes #28826

#### Type of change
- Bug fix (non-breaking change which fixes an issue)

## Testing

#### How Has This Been Tested?
> Please describe the tests that you ran to verify your changes. Also
list any relevant details for your test configuration.
> Delete anything that is not relevant
- [ ] Manual
- [ ] JUnit
- [ ] Jest
- [ ] Cypress
>
>
#### Test Plan
> Add Testsmith test cases links that relate to this PR
>
>
#### Issues raised during DP testing
> Link issues raised during DP testing for better visiblity and tracking
(copy link from comments dropped on this PR)
>
>
>
## Checklist:
#### Dev activity
- [ ] My code follows the style guidelines of this project
- [ ] I have performed a self-review of my own code
- [ ] I have commented my code, particularly in hard-to-understand areas
- [ ] I have made corresponding changes to the documentation
- [ ] My changes generate no new warnings
- [ ] I have added tests that prove my fix is effective or that my
feature works
- [ ] New and existing unit tests pass locally with my changes
- [ ] PR is being merged under a feature flag


#### QA activity:
- [ ] [Speedbreak
features](https://github.com/appsmithorg/TestSmith/wiki/Guidelines-for-test-plans#speedbreakers-)
have been covered
- [ ] Test plan covers all impacted features and [areas of
interest](https://github.com/appsmithorg/TestSmith/wiki/Guidelines-for-test-plans#areas-of-interest-)
- [ ] Test plan has been peer reviewed by project stakeholders and other
QA members
- [ ] Manually tested functionality on DP
- [ ] We had an implementation alignment call with stakeholders post QA
Round 2
- [ ] Cypress test cases have been added and approved by SDET/manual QA
- [ ] Added `Test Plan Approved` label after Cypress tests were reviewed
- [ ] Added `Test Plan Approved` label after JUnit tests were reviewed
---
 .../Editor/gitSync/components/BranchList.tsx  | 24 ++++++++++---------
 app/client/src/selectors/gitSyncSelectors.tsx |  4 ++++
 2 files changed, 17 insertions(+), 11 deletions(-)

diff --git a/app/client/src/pages/Editor/gitSync/components/BranchList.tsx b/app/client/src/pages/Editor/gitSync/components/BranchList.tsx
index cafdd034e3..516e3d6931 100644
--- a/app/client/src/pages/Editor/gitSync/components/BranchList.tsx
+++ b/app/client/src/pages/Editor/gitSync/components/BranchList.tsx
@@ -6,7 +6,7 @@ import { useDispatch, useSelector } from "react-redux";
 import {
   createNewBranchInit,
   fetchBranchesInit,
-  // setIsGitSyncModalOpen,
+  fetchGitProtectedBranchesInit,
   switchGitBranchInit,
 } from "actions/gitSyncActions";
 import {
@@ -15,6 +15,7 @@ import {
   getFetchingBranches,
   getGitBranches,
   getGitBranchNames,
+  getIsGetProtectedBranchesLoading,
   getProtectedBranchesSelector,
 } from "selectors/gitSyncSelectors";
 
@@ -54,7 +55,6 @@ import { RemoteBranchList } from "./RemoteBranchList";
 import { LocalBranchList } from "./LocalBranchList";
 import type { Theme } from "constants/DefaultTheme";
 import { Space } from "./StyledComponents";
-// import { GitSyncModalTab } from "entities/GitSync";
 
 const ListContainer = styled.div`
   flex: 1;
@@ -69,11 +69,6 @@ const BranchDropdownContainer = styled.div`
   display: flex;
   flex-direction: column;
 
-  // & .title {
-  //   ${getTypographyByKey("h3")};
-  //   color: var(--ads-v2-color-fg-emphasis-plus);
-  // }
-
   padding: ${(props) => props.theme.spaces[5]}px;
   min-height: 0;
 `;
@@ -246,6 +241,7 @@ export default function BranchList(props: {
       source: "BRANCH_LIST_POPUP_FROM_BOTTOM_BAR",
     });
     dispatch(fetchBranchesInit({ pruneBranches: true }));
+    dispatch(fetchGitProtectedBranchesInit());
   };
 
   const branches = useSelector(getGitBranches);
@@ -254,6 +250,9 @@ export default function BranchList(props: {
   const fetchingBranches = useSelector(getFetchingBranches);
   const defaultBranch = useSelector(getDefaultGitBranchName);
   const protectedBranches = useSelector(getProtectedBranchesSelector);
+  const isGetProtectedBranchesLoading = useSelector(
+    getIsGetProtectedBranchesLoading,
+  );
   const [searchText, changeSearchTextInState] = useState("");
   const changeSearchText = (text: string) => {
     changeSearchTextInState(removeSpecialChars(text));
@@ -340,6 +339,9 @@ export default function BranchList(props: {
     switchBranch,
     protectedBranches,
   );
+
+  const loading = fetchingBranches || isGetProtectedBranchesLoading;
+
   return (
     <BranchListHotkeys
       handleDownKey={handleDownKey}
@@ -358,12 +360,12 @@ export default function BranchList(props: {
         />
         <Space size={3} />
         <div style={{ width: 300 }}>
-          {fetchingBranches && (
+          {loading && (
             <div style={{ width: "100%", height: textInputHeight }}>
               <Skeleton />
             </div>
           )}
-          {!fetchingBranches && (
+          {!loading && (
             <SearchInput
               autoFocus
               className="branch-search t--branch-search-input"
@@ -376,8 +378,8 @@ export default function BranchList(props: {
         </div>
         <Space size={3} />
 
-        {fetchingBranches && <BranchesLoading />}
-        {!fetchingBranches && (
+        {loading && <BranchesLoading />}
+        {!loading && (
           <ListContainer>
             {/* keeping it commented for future use */}
             {/* <Callout
diff --git a/app/client/src/selectors/gitSyncSelectors.tsx b/app/client/src/selectors/gitSyncSelectors.tsx
index 9403e99666..12d82d113e 100644
--- a/app/client/src/selectors/gitSyncSelectors.tsx
+++ b/app/client/src/selectors/gitSyncSelectors.tsx
@@ -239,3 +239,7 @@ export const getIsUpdateProtectedBranchesLoading = (state: AppState) => {
     state.ui.gitSync.protectedBranchesLoading
   );
 };
+
+export const getIsGetProtectedBranchesLoading = (state: AppState) => {
+  return state.ui.gitSync.protectedBranchesLoading;
+};