diff --git a/libs/domains/organizations/feature/src/lib/git-branch-settings/git-branch-settings.spec.tsx b/libs/domains/organizations/feature/src/lib/git-branch-settings/git-branch-settings.spec.tsx
index 73c59be1470..f1f67090ad5 100644
--- a/libs/domains/organizations/feature/src/lib/git-branch-settings/git-branch-settings.spec.tsx
+++ b/libs/domains/organizations/feature/src/lib/git-branch-settings/git-branch-settings.spec.tsx
@@ -1,27 +1,55 @@
import { wrapWithReactHookForm } from '__tests__/utils/wrap-with-react-hook-form'
-import { renderWithProviders } from '@qovery/shared/util-tests'
+import { renderWithProviders, screen } from '@qovery/shared/util-tests'
import { GitBranchSettings } from './git-branch-settings'
+let mockBranches: { name: string }[] = [
+ {
+ name: 'main',
+ },
+]
+
jest.mock('../hooks/use-branches/use-branches', () => {
return {
...jest.requireActual('../hooks/use-branches/use-branches'),
useBranches: () => ({
isLoading: false,
isRefetching: false,
- data: [
- {
- name: 'main',
- },
- ],
+ data: mockBranches,
}),
}
})
describe('GitBranchSettings', () => {
+ beforeEach(() => {
+ mockBranches = [
+ {
+ name: 'main',
+ },
+ ]
+ })
+
it('should match snapshot', () => {
const { baseElement } = renderWithProviders(
wrapWithReactHookForm()
)
expect(baseElement).toMatchSnapshot()
})
+
+ it('should display the selected branch when it is not part of returned branches', () => {
+ mockBranches = [
+ {
+ name: 'develop',
+ },
+ ]
+
+ renderWithProviders(
+ wrapWithReactHookForm(, {
+ defaultValues: {
+ branch: 'main',
+ },
+ })
+ )
+
+ expect(screen.getByText('main')).toBeInTheDocument()
+ })
})
diff --git a/libs/domains/organizations/feature/src/lib/git-branch-settings/git-branch-settings.tsx b/libs/domains/organizations/feature/src/lib/git-branch-settings/git-branch-settings.tsx
index 7deff50891e..034ff5d08b7 100644
--- a/libs/domains/organizations/feature/src/lib/git-branch-settings/git-branch-settings.tsx
+++ b/libs/domains/organizations/feature/src/lib/git-branch-settings/git-branch-settings.tsx
@@ -1,4 +1,5 @@
import { type GitProviderEnum } from 'qovery-typescript-axios'
+import { useMemo } from 'react'
import { Controller, useFormContext } from 'react-hook-form'
import { InputSelect, InputText, LoaderSpinner } from '@qovery/shared/ui'
import { useBranches } from '../hooks/use-branches/use-branches'
@@ -40,6 +41,25 @@ export function GitBranchSettings({
enabled: !disabled,
})
+ const branchOptionsWithSelectedValue = useMemo(() => {
+ const branchOptions = branches.map((branch) => ({
+ label: branch.name,
+ value: branch.name,
+ }))
+
+ if (disabled || !watchFieldBranch || branchOptions.some((branch) => branch.value === watchFieldBranch)) {
+ return branchOptions
+ }
+
+ return [
+ ...branchOptions,
+ {
+ label: watchFieldBranch,
+ value: watchFieldBranch,
+ },
+ ]
+ }, [branches, disabled, watchFieldBranch])
+
if (isError) {
return null
}
@@ -71,16 +91,14 @@ export function GitBranchSettings({
value: watchFieldBranch ?? '',
},
]
- : branches.map((branch) => ({
- label: branch.name,
- value: branch.name,
- }))
+ : branchOptionsWithSelectedValue
}
onChange={field.onChange}
value={field.value}
error={error?.message}
disabled={disabled}
isSearchable
+ isCreatable
/>
)}
/>