Skip to content

Commit 8e4ace0

Browse files
hiderrhiderr
committed
code review fixes 2
1 parent f65a331 commit 8e4ace0

File tree

13 files changed

+114
-49
lines changed

13 files changed

+114
-49
lines changed

‎apps/gitness/src/components-v2/branch-selector-container.tsx

+4-1
Original file line numberDiff line numberDiff line change
@@ -15,12 +15,14 @@ interface BranchSelectorContainerProps {
1515
onSelectBranchorTag: (branchTag: BranchSelectorListItem, type: BranchSelectorTab) => void
1616
isBranchOnly?: boolean
1717
dynamicWidth?: boolean
18+
preSelectedTab?: BranchSelectorTab
1819
}
1920
export const BranchSelectorContainer: React.FC<BranchSelectorContainerProps> = ({
2021
selectedBranch,
2122
onSelectBranchorTag,
2223
isBranchOnly = false,
23-
dynamicWidth = false
24+
dynamicWidth = false,
25+
preSelectedTab
2426
}) => {
2527
const repoRef = useGetRepoRef()
2628
const { spaceId, repoId } = useParams<PathParams>()
@@ -95,6 +97,7 @@ export const BranchSelectorContainer: React.FC<BranchSelectorContainerProps> = (
9597
onSelectBranch={onSelectBranchorTag}
9698
isBranchOnly={isBranchOnly}
9799
dynamicWidth={dynamicWidth}
100+
preSelectedTab={preSelectedTab}
98101
/>
99102
)
100103
}

‎apps/gitness/src/components-v2/create-branch-dialog.tsx

+31-5
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,10 @@
1-
import { useCallback, useState } from 'react'
1+
import { useCallback, useEffect, useState } from 'react'
22

33
import { useCreateBranchMutation } from '@harnessio/code-service-client'
44
import { useToastNotification } from '@harnessio/ui/components'
55
import {
66
BranchSelectorListItem,
7+
BranchSelectorTab,
78
CreateBranchDialog as CreateBranchDialogComp,
89
CreateBranchFormFields
910
} from '@harnessio/ui/views'
@@ -16,15 +17,23 @@ interface CreateBranchDialogProps {
1617
open: boolean
1718
onClose: () => void
1819
onSuccess?: () => void
20+
preselectedBranchOrTag?: BranchSelectorListItem | null
21+
preselectedTab?: BranchSelectorTab
1922
}
2023

21-
export const CreateBranchDialog = ({ open, onClose, onSuccess }: CreateBranchDialogProps) => {
24+
export const CreateBranchDialog = ({
25+
open,
26+
onClose,
27+
onSuccess,
28+
preselectedBranchOrTag,
29+
preselectedTab
30+
}: CreateBranchDialogProps) => {
2231
const repo_ref = useGetRepoRef()
2332

2433
const { t } = useTranslationStore()
2534
const [selectedBranchOrTag, setSelectedBranchOrTag] = useState<BranchSelectorListItem | null>(null)
2635

27-
const [createdBranchName, setCreatedBranchName] = useState<string>('')
36+
const [createdBranchName, setCreatedBranchName] = useState('')
2837

2938
const selectBranchOrTag = useCallback((branchTagName: BranchSelectorListItem) => {
3039
setSelectedBranchOrTag(branchTagName)
@@ -38,7 +47,8 @@ export const CreateBranchDialog = ({ open, onClose, onSuccess }: CreateBranchDia
3847
const {
3948
mutateAsync: createBranch,
4049
error: createBranchError,
41-
isLoading: isCreatingBranch
50+
isLoading: isCreatingBranch,
51+
reset: resetBranchMutation
4252
} = useCreateBranchMutation(
4353
{},
4454
{
@@ -60,6 +70,18 @@ export const CreateBranchDialog = ({ open, onClose, onSuccess }: CreateBranchDia
6070
})
6171
}
6272

73+
useEffect(() => {
74+
if (!open) {
75+
resetBranchMutation()
76+
}
77+
}, [open, resetBranchMutation])
78+
79+
useEffect(() => {
80+
if (preselectedBranchOrTag) {
81+
setSelectedBranchOrTag(preselectedBranchOrTag)
82+
}
83+
}, [open, preselectedBranchOrTag])
84+
6385
return (
6486
<CreateBranchDialogComp
6587
useTranslationStore={useTranslationStore}
@@ -70,7 +92,11 @@ export const CreateBranchDialog = ({ open, onClose, onSuccess }: CreateBranchDia
7092
isCreatingBranch={isCreatingBranch}
7193
error={createBranchError?.message}
7294
renderProp={() => (
73-
<BranchSelectorContainer onSelectBranchorTag={selectBranchOrTag} selectedBranch={selectedBranchOrTag} />
95+
<BranchSelectorContainer
96+
onSelectBranchorTag={selectBranchOrTag}
97+
selectedBranch={selectedBranchOrTag}
98+
preSelectedTab={preselectedTab}
99+
/>
74100
)}
75101
/>
76102
)

‎apps/gitness/src/pages-v2/repo/repo-tags-list-container.tsx

+22-3
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@ import {
1010
import { DeleteAlertDialog, DeleteAlertDialogProps } from '@harnessio/ui/components'
1111
import {
1212
BranchSelectorListItem,
13+
BranchSelectorTab,
1314
CommitTagType,
1415
CreateTagDialog,
1516
CreateTagFormFields,
@@ -38,6 +39,8 @@ export const RepoTagsListContainer = () => {
3839
const { queryPage } = usePaginationQueryStateWithStore({ page, setPage })
3940

4041
const [selectedBranchOrTag, setSelectedBranchOrTag] = useState<BranchSelectorListItem | null>(null)
42+
const [selectedTagInList, setSelectedTagInList] = useState<BranchSelectorListItem | null>(null)
43+
const [preSelectedTab, setPreSelectedTab] = useState<BranchSelectorTab>(BranchSelectorTab.BRANCHES)
4144

4245
const [openCreateTagDialog, setOpenCreateTagDialog] = useState(false)
4346
const [openCreateBranchDialog, setOpenCreateBranchDialog] = useState(false)
@@ -62,7 +65,8 @@ export const RepoTagsListContainer = () => {
6265
const {
6366
mutate: createTag,
6467
isLoading: isCreatingTag,
65-
error: createTagError
68+
error: createTagError,
69+
reset: resetCreateTagMutation
6670
} = useCreateTagMutation(
6771
{ repo_ref: repo_ref },
6872
{
@@ -120,12 +124,22 @@ export const RepoTagsListContainer = () => {
120124
setSelectedBranchOrTag(branchTagName)
121125
}, [])
122126

127+
useEffect(() => {
128+
if (!openCreateTagDialog) {
129+
resetCreateTagMutation()
130+
}
131+
}, [openCreateTagDialog, resetCreateTagMutation])
132+
123133
return (
124134
<>
125135
<RepoTagsListView
126136
useTranslationStore={useTranslationStore}
127137
isLoading={isLoadingTags}
128-
openCreateBranchDialog={() => setOpenCreateBranchDialog(true)}
138+
openCreateBranchDialog={(selectedTagInList: BranchSelectorListItem) => {
139+
setOpenCreateBranchDialog(true)
140+
setSelectedTagInList(selectedTagInList)
141+
setPreSelectedTab(BranchSelectorTab.TAGS)
142+
}}
129143
openCreateTagDialog={() => setOpenCreateTagDialog(true)}
130144
searchQuery={query}
131145
setSearchQuery={setQuery}
@@ -148,7 +162,12 @@ export const RepoTagsListContainer = () => {
148162
<BranchSelectorContainer onSelectBranchorTag={selectBranchOrTag} selectedBranch={selectedBranchOrTag} />
149163
)}
150164
/>
151-
<CreateBranchDialog open={openCreateBranchDialog} onClose={() => setOpenCreateBranchDialog(false)} />
165+
<CreateBranchDialog
166+
open={openCreateBranchDialog}
167+
onClose={() => setOpenCreateBranchDialog(false)}
168+
preselectedBranchOrTag={selectedTagInList}
169+
preselectedTab={preSelectedTab}
170+
/>
152171
<DeleteAlertDialog
153172
open={deleteTagDialog}
154173
onClose={() => setDeleteTagDialog(false)}

‎packages/ui/.gitignore

+1-2
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,2 @@
11
coverage/
2-
dist
3-
node_modules
2+
dist

‎packages/ui/locales/en/views.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -525,9 +525,9 @@
525525
"selectMember": "Select member",
526526
"selectRole": "Select role",
527527
"enterBranchName": "Enter branch name",
528+
"basedOn": "Based on",
528529
"tagName": "Name",
529530
"enterTagName": "Enter a tag name here",
530-
"basedOn": "Based on",
531531
"createBranchError": "Branch name is required",
532532
"select": "Select",
533533
"baseBranch": "Base branch",

‎packages/ui/locales/fr/views.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -514,9 +514,9 @@
514514
"selectMember": "",
515515
"selectRole": "",
516516
"enterBranchName": "Entrez le nom de la branche",
517+
"basedOn": "Basé sur",
517518
"tagName": "Nom",
518519
"enterTagName": "Entrez un nom d'étiquette ici",
519-
"basedOn": "Basé sur",
520520
"createBranchError": "Le nom de la branche est requis",
521521
"select": "Sélectionner",
522522
"baseBranch": "Branche de base",

‎packages/ui/src/components/alert-dialog.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -70,7 +70,7 @@ const AlertDialogContent = React.forwardRef<
7070
{...props}
7171
>
7272
<Button
73-
className="absolute right-3 top-[18px] z-10 text-icons-4 transition-colors duration-200 hover:text-icons-2 disabled:pointer-events-none"
73+
className="text-icons-4 hover:text-icons-2 absolute right-3 top-[18px] z-10 transition-colors duration-200 disabled:pointer-events-none"
7474
type="button"
7575
variant="custom"
7676
size="icon"

‎packages/ui/src/views/repo/components/branch-selector-v2/branch-selector-dropdown.tsx

+3-2
Original file line numberDiff line numberDiff line change
@@ -17,10 +17,11 @@ export const BranchSelectorDropdown: FC<BranchSelectorDropdownProps> = ({
1717
isBranchOnly = false,
1818
searchQuery,
1919
setSearchQuery,
20-
dynamicWidth = false
20+
dynamicWidth = false,
21+
preSelectedTab = BranchSelectorTab.BRANCHES
2122
}) => {
2223
const { Link } = useRouterContext()
23-
const [activeTab, setActiveTab] = useState<BranchSelectorTab>(BranchSelectorTab.BRANCHES)
24+
const [activeTab, setActiveTab] = useState<BranchSelectorTab>(preSelectedTab)
2425
const { t } = useTranslationStore()
2526
const BRANCH_SELECTOR_LABELS = getBranchSelectorLabels(t)
2627

‎packages/ui/src/views/repo/components/branch-selector-v2/branch-selector.tsx

+4-1
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,7 @@ interface BranchSelectorProps {
2020
searchQuery?: string
2121
setSearchQuery: (query: string) => void
2222
dynamicWidth?: boolean
23+
preSelectedTab?: BranchSelectorTab
2324
}
2425
export const BranchSelectorV2: FC<BranchSelectorProps> = ({
2526
repoId,
@@ -35,7 +36,8 @@ export const BranchSelectorV2: FC<BranchSelectorProps> = ({
3536
isBranchOnly = false,
3637
searchQuery = '',
3738
setSearchQuery,
38-
dynamicWidth = false
39+
dynamicWidth = false,
40+
preSelectedTab
3941
}) => {
4042
const isTag = selectedBranchorTag
4143
? tagList?.some(tag => tag.name === selectedBranchorTag.name && tag.sha === selectedBranchorTag.sha)
@@ -72,6 +74,7 @@ export const BranchSelectorV2: FC<BranchSelectorProps> = ({
7274
searchQuery={searchQuery}
7375
setSearchQuery={setSearchQuery}
7476
dynamicWidth={dynamicWidth}
77+
preSelectedTab={preSelectedTab}
7578
/>
7679
</DropdownMenu.Root>
7780
)

‎packages/ui/src/views/repo/components/branch-selector/types.ts

+1
Original file line numberDiff line numberDiff line change
@@ -30,6 +30,7 @@ export interface BranchSelectorDropdownProps {
3030
searchQuery: string
3131
setSearchQuery: (query: string) => void
3232
dynamicWidth?: boolean
33+
preSelectedTab?: BranchSelectorTab
3334
}
3435

3536
export interface BranchSelectorProps extends BranchSelectorDropdownProps {

‎packages/ui/src/views/repo/repo-branch/components/create-branch-dialog.tsx

+22-9
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
1-
import { useEffect } from 'react'
1+
import { useCallback, useEffect } from 'react'
22
import { useForm } from 'react-hook-form'
33

4-
import { Alert, Button, ControlGroup, Dialog, Fieldset, FormWrapper, Input } from '@/components'
4+
import { Alert, Button, ControlGroup, Dialog, Fieldset, FormWrapper, Input, Label } from '@/components'
55
import { zodResolver } from '@hookform/resolvers/zod'
66
import { TranslationStore } from '@views/repo'
77
import { z } from 'zod'
@@ -52,11 +52,10 @@ export function CreateBranchDialog({
5252
defaultValues: INITIAL_FORM_VALUES
5353
})
5454

55-
const handleClose = () => {
55+
const resetForm = useCallback(() => {
5656
clearErrors()
5757
reset(INITIAL_FORM_VALUES)
58-
onClose()
59-
}
58+
}, [clearErrors, reset])
6059

6160
const handleFormSubmit = async (data: CreateBranchFormFields) => {
6261
await onSubmit(data)
@@ -67,10 +66,19 @@ export function CreateBranchDialog({
6766
}
6867

6968
useEffect(() => {
70-
if (open && selectedBranchOrTag) {
71-
setValue('target', selectedBranchOrTag.name, { shouldValidate: true })
69+
if (open) {
70+
resetForm()
71+
72+
if (selectedBranchOrTag) {
73+
setValue('target', selectedBranchOrTag.name, { shouldValidate: true })
74+
}
7275
}
73-
}, [selectedBranchOrTag, setValue, open])
76+
}, [selectedBranchOrTag, setValue, open, resetForm])
77+
78+
const handleClose = () => {
79+
resetForm()
80+
onClose()
81+
}
7482

7583
return (
7684
<Dialog.Root open={open} onOpenChange={handleClose}>
@@ -92,7 +100,12 @@ export function CreateBranchDialog({
92100
</Fieldset>
93101

94102
<Fieldset>
95-
<ControlGroup>{BranchSelectorContainer()}</ControlGroup>
103+
<ControlGroup>
104+
<Label htmlFor="target" className="mb-2" color="secondary">
105+
{t('views:forms.basedOn', 'Based on')}
106+
</Label>
107+
{BranchSelectorContainer()}
108+
</ControlGroup>
96109
</Fieldset>
97110

98111
{error ? (

0 commit comments

Comments
 (0)