diff --git a/app/client/src/git/components/OpsModal/TabMerge/TabMergeView.tsx b/app/client/src/git/components/OpsModal/TabMerge/TabMergeView.tsx index acfc7d50e250..337aa18e7406 100644 --- a/app/client/src/git/components/OpsModal/TabMerge/TabMergeView.tsx +++ b/app/client/src/git/components/OpsModal/TabMerge/TabMergeView.tsx @@ -112,7 +112,7 @@ export default function TabMergeView({ let status = MergeStatusState.NONE; - if (isFetchStatusLoading) { + if (isFetchStatusLoading || isFetchBranchesLoading) { status = MergeStatusState.FETCHING; message = createMessage(FETCH_GIT_STATUS); } else if (!isStatusClean) { diff --git a/app/client/src/git/components/QuickActions/QuickActionsView.test.tsx b/app/client/src/git/components/QuickActions/QuickActionsView.test.tsx index bb47195dab76..aa3ee90cb7d8 100644 --- a/app/client/src/git/components/QuickActions/QuickActionsView.test.tsx +++ b/app/client/src/git/components/QuickActions/QuickActionsView.test.tsx @@ -30,6 +30,7 @@ describe("QuickActionsView Component", () => { isDiscardLoading: false, isFetchStatusLoading: false, isConnected: false, + isInitialized: true, isProtectedMode: false, isPullFailing: false, isPullLoading: false, @@ -48,6 +49,24 @@ describe("QuickActionsView Component", () => { jest.clearAllMocks(); }); + it("should not render QuickActionsView when isInitialized is false", () => { + const props = { + ...defaultProps, + isInitialized: false, + }; + + render( + + + , + ); + + expect(screen.queryByTestId("connect-button")).not.toBeInTheDocument(); + expect( + screen.queryByTestId("t--git-quick-actions-commit"), + ).not.toBeInTheDocument(); + }); + it("should render ConnectButton when isConnected is false", () => { render( diff --git a/app/client/src/git/components/QuickActions/QuickActionsView.tsx b/app/client/src/git/components/QuickActions/QuickActionsView.tsx index 9a11ca5de4b2..c5b49fb39ca5 100644 --- a/app/client/src/git/components/QuickActions/QuickActionsView.tsx +++ b/app/client/src/git/components/QuickActions/QuickActionsView.tsx @@ -2,6 +2,7 @@ import React, { useCallback } from "react"; import styled from "styled-components"; import { + AUTOCOMMIT_IN_PROGRESS_MESSAGE, COMMIT_CHANGES, createMessage, GIT_SETTINGS, @@ -13,7 +14,7 @@ import { GitOpsTab } from "../../constants/enums"; import { GitSettingsTab } from "../../constants/enums"; import ConnectButton from "./ConnectButton"; import QuickActionButton from "./QuickActionButton"; -import AutocommitStatusbar from "../Statusbar"; +import Statusbar from "../Statusbar"; import getPullBtnStatus from "./helpers/getPullButtonStatus"; import noop from "lodash/noop"; import BranchButton from "./BranchButton"; @@ -33,6 +34,7 @@ interface QuickActionsViewProps { isConnectPermitted: boolean; isDiscardLoading: boolean; isFetchStatusLoading: boolean; + isInitialized: boolean; isConnected: boolean; isProtectedMode: boolean; isPullFailing: boolean; @@ -61,6 +63,7 @@ function QuickActionsView({ isConnectPermitted = false, isDiscardLoading = false, isFetchStatusLoading = false, + isInitialized = false, isProtectedMode = false, isPullFailing = false, isPullLoading = false, @@ -131,6 +134,10 @@ function QuickActionsView({ toggleConnectModal(true); }, [toggleConnectModal]); + if (!isInitialized) { + return null; + } + return isConnected ? ( - + ) : ( <> diff --git a/app/client/src/git/components/QuickActions/index.tsx b/app/client/src/git/components/QuickActions/index.tsx index 9224823d8016..5ec638e8aa8d 100644 --- a/app/client/src/git/components/QuickActions/index.tsx +++ b/app/client/src/git/components/QuickActions/index.tsx @@ -12,6 +12,7 @@ import useOps from "git/hooks/useOps"; import useBranches from "git/hooks/useBranches"; import useConnected from "git/hooks/useConnected"; import useProtectedMode from "git/hooks/useProtectedMode"; +import useInit from "git/hooks/useInit"; function QuickActions() { const isConnected = useConnected(); @@ -29,6 +30,7 @@ function QuickActions() { const { toggleSettingsModal } = useSettings(); const { toggleConnectModal } = useConnect(); const { currentBranch, isBranchPopupOpen, toggleBranchPopup } = useBranches(); + const { isInitialized } = useInit(); const isPullFailing = !!pullError; const isStatusClean = status?.isClean ?? true; @@ -46,6 +48,7 @@ function QuickActions() { isConnected={isConnected} isDiscardLoading={isDiscardLoading} isFetchStatusLoading={isFetchStatusLoading} + isInitialized={isInitialized} isProtectedMode={isProtectedMode} isPullFailing={isPullFailing} isPullLoading={isPullLoading} diff --git a/app/client/src/git/hooks/useInit.ts b/app/client/src/git/hooks/useInit.ts new file mode 100644 index 000000000000..fd0c802035ca --- /dev/null +++ b/app/client/src/git/hooks/useInit.ts @@ -0,0 +1,16 @@ +import { + selectInitialized, + selectInitializing, +} from "git/store/selectors/gitArtifactSelectors"; +import useArtifactSelector from "./useArtifactSelector"; + +export default function useInit() { + const initializing = useArtifactSelector(selectInitializing); + + const initialized = useArtifactSelector(selectInitialized); + + return { + isInitializing: initializing ?? false, + isInitialized: initialized ?? false, + }; +} diff --git a/app/client/src/git/sagas/initGitSaga.ts b/app/client/src/git/sagas/initGitSaga.ts index cf1a823f8ce8..3a8aebba5b30 100644 --- a/app/client/src/git/sagas/initGitSaga.ts +++ b/app/client/src/git/sagas/initGitSaga.ts @@ -35,4 +35,6 @@ export default function* initGitForEditorSaga( ); } } + + yield put(gitArtifactActions.initGitForEditorSuccess({ artifactDef })); } diff --git a/app/client/src/git/store/actions/initGitActions.ts b/app/client/src/git/store/actions/initGitActions.ts index ebe588555a24..e7bcdfeeb0ab 100644 --- a/app/client/src/git/store/actions/initGitActions.ts +++ b/app/client/src/git/store/actions/initGitActions.ts @@ -7,5 +7,19 @@ export interface InitGitForEditorPayload { export const initGitForEditorAction = createArtifactAction((state) => { - return state; + // need to do this to avoid mutation, bug with redux-toolkit immer + const ui = { + ...state.ui, + initializing: true, + initialized: false, + }; + + return { ...state, ui }; }); + +export const initGitForEditorSuccessAction = createArtifactAction((state) => { + state.ui.initializing = false; + state.ui.initialized = true; + + return state; +}); diff --git a/app/client/src/git/store/gitArtifactSlice.ts b/app/client/src/git/store/gitArtifactSlice.ts index bcb70f89aa60..7109bcfbfee8 100644 --- a/app/client/src/git/store/gitArtifactSlice.ts +++ b/app/client/src/git/store/gitArtifactSlice.ts @@ -108,7 +108,10 @@ import { updateProtectedBranchesInitAction, updateProtectedBranchesSuccessAction, } from "./actions/updateProtectedBranchesActions"; -import { initGitForEditorAction } from "./actions/initGitActions"; +import { + initGitForEditorAction, + initGitForEditorSuccessAction, +} from "./actions/initGitActions"; import { fetchAutocommitProgressErrorAction, fetchAutocommitProgressInitAction, @@ -142,6 +145,7 @@ export const gitArtifactSlice = createSlice({ reducers: { // init initGitForEditor: initGitForEditorAction, + initGitForEditorSuccess: initGitForEditorSuccessAction, mount: mountAction, unmount: unmountAction, fetchMetadataInit: fetchMetadataInitAction, diff --git a/app/client/src/git/store/helpers/initialState.ts b/app/client/src/git/store/helpers/initialState.ts index 18b6e58ca826..f2927621539d 100644 --- a/app/client/src/git/store/helpers/initialState.ts +++ b/app/client/src/git/store/helpers/initialState.ts @@ -11,6 +11,8 @@ import type { } from "../types"; const gitArtifactInitialUIState: GitArtifactUIReduxState = { + initializing: false, + initialized: false, connectModalOpen: false, connectSuccessModalOpen: false, disconnectBaseArtifactId: null, diff --git a/app/client/src/git/store/selectors/gitArtifactSelectors.ts b/app/client/src/git/store/selectors/gitArtifactSelectors.ts index 4f5346559367..7b3145908998 100644 --- a/app/client/src/git/store/selectors/gitArtifactSelectors.ts +++ b/app/client/src/git/store/selectors/gitArtifactSelectors.ts @@ -9,6 +9,17 @@ export const selectGitArtifact = ( ]; }; +// init +export const selectInitializing = ( + state: GitRootState, + artifactDef: GitArtifactDef, +) => selectGitArtifact(state, artifactDef)?.ui?.initializing ?? false; + +export const selectInitialized = ( + state: GitRootState, + artifactDef: GitArtifactDef, +) => selectGitArtifact(state, artifactDef)?.ui?.initialized ?? false; + // metadata export const selectMetadataState = ( state: GitRootState, diff --git a/app/client/src/git/store/types.ts b/app/client/src/git/store/types.ts index c23f4d431af1..bcf59c07599f 100644 --- a/app/client/src/git/store/types.ts +++ b/app/client/src/git/store/types.ts @@ -63,6 +63,8 @@ export interface GitArtifactAPIResponsesReduxState export interface GitArtifactUIReduxState extends GitArtifactUIReduxStateExtended { + initializing: boolean; + initialized: boolean; connectModalOpen: boolean; connectSuccessModalOpen: boolean; disconnectBaseArtifactId: string | null;