github/drone
5
0
Fork 0
mirror of https://github.com/harness/drone.git synced 2025-05-10 22:21:22 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix: [code-736]: make tag and branch pages consistent (#302)

Browse Source
This commit is contained in:
Calvin Lee 2023-08-11 04:35:52 +00:00 committed by Harness
parent e523966db8
commit 7b70f8c18d
18 changed files with 119 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
web/package.json
View File

@ -42,7 +42,7 @@
"@codemirror/state": "^6.2.0",
"@codemirror/view": "^6.9.6",
"@harness/design-system": "1.4.0",
"@harness/icons": "1.149.0",
"@harness/icons": "1.174.0",
"@harness/uicore": "3.131.1",
"@harness/use-modal": "1.1.0",
"@popperjs/core": "^2.4.2",

9
web/src/components/BranchTagSelect/BranchTagSelect.module.scss
View File

@ -61,8 +61,15 @@ html[class=''] {
.listContainer {
min-height: 50px;
max-height: 300px;
max-height: 200px;
overflow-y: auto;
:global {
a.bp3-menu-item:hover {
background: var(--primary-1) !important;
color: var(--grey-1000) !important;
}
}
}
.newBtnText {

4
web/src/components/BranchTagSelect/BranchTagSelect.tsx
View File

@ -30,6 +30,7 @@ export interface BranchTagSelectProps extends Omit<ButtonProps, 'onSelect'>, Pic
forBranchesOnly?: boolean
labelPrefix?: string
placeHolder?: string
popoverClassname?: string
}
export const BranchTagSelect: React.FC<BranchTagSelectProps> = ({
@ -43,6 +44,7 @@ export const BranchTagSelect: React.FC<BranchTagSelectProps> = ({
labelPrefix,
placeHolder,
className,
popoverClassname,
...props
}) => {
const [query, onQuery] = useState('')
@ -90,7 +92,7 @@ export const BranchTagSelect: React.FC<BranchTagSelectProps> = ({
interactionKind: 'click',
usePortal: true,
position: PopoverPosition.BOTTOM_LEFT,
popoverClassName: css.popover
popoverClassName: cx(css.popover, popoverClassname)
}}
tabIndex={0}
{...props}

30
web/src/components/CreateBranchModal/CreateBranchModal.module.scss
View File

@ -1,4 +1,5 @@
.main {
padding-left: var(--spacing-10) !important;
.title {
--typography-size: 20px !important;
}
@ -9,6 +10,10 @@
font-weight: 500 !important;
}
.container {
margin-right: var(--spacing-10) !important;
}
// .branchSourceDesc {
// color: var(--grey-400) !important;
// font-size: var(--form-input-font-size) !important;
@ -20,3 +25,28 @@
.maxContainer {
max-width: 250px;
}
.branchTagSelect {
width: 100% !important;
}
.selectContainer {
:global {
.bp3-popover-wrapper {
width: 100% !important;
.bp3-popover-target {
width: 100% !important;
}
}
.bp3-button {
justify-content: start;
}
.bp3-icon-chevron-down {
margin-left: auto;
}
}
}
.popoverContainer {
width: 489px;
}

4
web/src/components/CreateBranchModal/CreateBranchModal.module.scss.d.ts vendored
View File

@ -4,6 +4,10 @@ declare const styles: {
readonly main: string
readonly title: string
readonly label: string
readonly container: string
readonly maxContainer: string
readonly branchTagSelect: string
readonly selectContainer: string
readonly popoverContainer: string
}
export default styles

21
web/src/components/CreateBranchModal/CreateBranchModal.tsx
View File

@ -94,12 +94,12 @@ export function useCreateBranchModal({
enforceFocus={false}
onClose={hideModal}
title={''}
style={{ width: 700, maxHeight: '95vh', overflow: 'auto' }}>
<Layout.Vertical padding={{ left: 'xxlarge' }} style={{ height: '100%' }} className={css.main}>
style={{ width: 585, maxHeight: '95vh', overflow: 'auto' }}>
<Layout.Vertical style={{ height: '100%' }} className={css.main}>
<Heading className={css.title} font={{ variation: FontVariation.H3 }} margin={{ bottom: 'xlarge' }}>
<Icon name={CodeIcon.Branch} size={22} /> {getString('createABranch')}
{getString('createABranch')}
</Heading>
<Container margin={{ right: 'xxlarge' }}>
<Container className={css.container}>
<Formik<FormData>
initialValues={{
name: branchName,
@ -123,32 +123,33 @@ export function useCreateBranchModal({
<FormikForm>
<FormInput.Text
name="name"
label={getString('branchName')}
placeholder={getString('nameYourBranch')}
label={getString('name')}
placeholder={getString('enterBranchPlaceholder')}
tooltipProps={{
dataTooltipId: 'repositoryBranchTextField'
}}
inputGroup={{ autoFocus: true }}
/>
<Container margin={{ top: 'medium', bottom: 'medium' }}>
<Container margin={{ top: 'medium' }}>
<Label className={css.label}>{getString('basedOn')}</Label>
{/* <Text className={css.branchSourceDesc}>{getString('branchSourceDesc')}</Text> */}
<Layout.Horizontal spacing="medium" padding={{ top: 'xsmall' }}>
<Layout.Horizontal className={css.selectContainer} padding={{ top: 'xsmall' }}>
<BranchTagSelect
className={css.branchTagSelect}
repoMetadata={repoMetadata}
disableBranchCreation
disableViewAllBranches
forBranchesOnly={showBranchTag}
gitRef={refIsATag ? `refs/tags/${sourceBranch}` : sourceBranch}
onSelect={setSourceBranch}
popoverClassname={css.popoverContainer}
/>
<FlexExpander />
</Layout.Horizontal>
</Container>
<Layout.Horizontal
spacing="small"
padding={{ right: 'xxlarge', top: 'xxxlarge', bottom: 'large' }}
padding={{ right: 'xxlarge', top: 'xxlarge', bottom: 'large' }}
style={{ alignItems: 'center' }}>
<Button
type="submit"

37
web/src/components/CreateTagModal/CreateTagModal.module.scss
View File

@ -1,4 +1,6 @@
.main {
padding-left: var(--spacing-10) !important;
.title {
--typography-size: 20px !important;
}
@ -8,8 +10,41 @@
font-size: var(--form-input-font-size) !important;
font-weight: 500 !important;
}
.container {
margin-right: var(--spacing-10) !important;
}
}
.extendedDescription textarea {
height: 100px !important;
height: 73px !important;
}
.branchTagSelect {
width: 100% !important;
}
.selectContainer {
:global {
.bp3-popover-wrapper {
width: 100% !important;
.bp3-popover-target {
width: 100% !important;
}
}
.bp3-button {
justify-content: start;
}
.bp3-icon-chevron-down {
margin-left: auto;
}
}
}
.popoverContainer {
width: 489px;
}
.extendedDescription {
margin: unset !important;
}

4
web/src/components/CreateTagModal/CreateTagModal.module.scss.d.ts vendored
View File

@ -4,6 +4,10 @@ declare const styles: {
readonly main: string
readonly title: string
readonly label: string
readonly container: string
readonly extendedDescription: string
readonly branchTagSelect: string
readonly selectContainer: string
readonly popoverContainer: string
}
export default styles

10
web/src/components/CreateTagModal/CreateTagModal.tsx
View File

@ -94,12 +94,12 @@ export function useCreateTagModal({
enforceFocus={false}
onClose={hideModal}
title={''}
style={{ width: 700, maxHeight: '95vh', overflow: 'auto' }}>
style={{ width: 585, maxHeight: '95vh', overflow: 'auto' }}>
<Layout.Vertical padding={{ left: 'xxlarge' }} style={{ height: '100%' }} className={css.main}>
<Heading className={css.title} font={{ variation: FontVariation.H3 }} margin={{ bottom: 'xlarge' }}>
{getString('createATag')}
</Heading>
<Container margin={{ right: 'xxlarge' }}>
<Container className={css.container} margin={{ right: 'xxlarge' }}>
<Formik<FormData>
initialValues={{
name: branchName,
@ -135,13 +135,15 @@ export function useCreateTagModal({
<Container margin={{ top: 'medium', bottom: 'medium' }}>
<Label className={css.label}>{getString('basedOn')}</Label>
{/* <Text className={css.branchSourceDesc}>{getString('branchSourceDesc')}</Text> */}
<Layout.Horizontal spacing="medium" padding={{ top: 'xsmall' }}>
<Layout.Horizontal className={css.selectContainer} padding={{ top: 'xsmall' }}>
<BranchTagSelect
className={css.branchTagSelect}
repoMetadata={repoMetadata}
disableBranchCreation
disableViewAllBranches
gitRef={sourceBranch}
onSelect={setSourceBranch}
popoverClassname={css.popoverContainer}
/>
<FlexExpander />
</Layout.Horizontal>
@ -155,7 +157,7 @@ export function useCreateTagModal({
<Layout.Horizontal
spacing="small"
padding={{ right: 'xxlarge', top: 'xxxlarge', bottom: 'large' }}
padding={{ right: 'xxlarge', top: 'xxlarge', bottom: 'large' }}
style={{ alignItems: 'center' }}>
<Button
type="submit"

4
web/src/components/LatestCommit/LatestCommit.module.scss
View File

@ -27,8 +27,8 @@
}
.commitLink {
font-weight: 500;
font-size: var(--font-size-small);
font-weight: 500 !important;
font-size: var(--font-size-small) !important;
color: var(--primary-8);
}

6
web/src/components/LatestCommit/LatestCommit.tsx
View File

@ -33,8 +33,10 @@ export function LatestCommitForFolder({ repoMetadata, latestCommit, standaloneSt
<Text font={{ variation: FontVariation.SMALL_BOLD }}>
{latestCommit?.author?.identity?.name || latestCommit?.author?.identity?.email}
</Text>
<Link to={commitURL} className={css.commitLink}>
{latestCommit?.title}
<Link to={commitURL}>
<Text className={css.commitLink} lineClamp={1}>
{latestCommit?.title}
</Text>
</Link>
<FlexExpander />
<CommitActions sha={latestCommit?.sha as string} href={commitURL} />

2
web/src/components/ReviewerSelect/ReviewerSelect.module.scss
View File

@ -64,7 +64,7 @@
overflow-y: auto;
.menuItem:hover {
background: rgba(0, 146, 228, 0.0392156863) !important;
background: var(--primary-1) !important;
border-radius: 4px;
}
}

1
web/src/framework/strings/stringTypes.ts
View File

@ -155,6 +155,7 @@ export interface StringsMap {
enableWebhookContent: string
enableWebhookTitle: string
enabled: string
enterBranchPlaceholder: string
enterDescription: string
enterName: string
enterNewBranchName: string

1
web/src/i18n/strings.en.yaml
View File

@ -135,6 +135,7 @@ delete: Delete
edit: Edit
editAsText: Edit as Text
branchName: Branch name
enterBranchPlaceholder: Enter the branch name here
nameYourBranch: Name your branch
nameYourTag: Name your tag
enterTagPlaceholder: Enter the tag name here

2
web/src/pages/SpaceAccessControl/AddNewMember/AddNewMember.tsx
View File

@ -52,7 +52,7 @@ const useAddNewMember = ({ onClose }: { onClose: () => void }) => {
value: role,
label: getString(roleStringKeyMap[role])
})),
[]
[] // eslint-disable-line react-hooks/exhaustive-deps
)
const userOptions: SelectOption[] = useMemo(

2
web/src/pages/SpaceAccessControl/SpaceAccessControl.tsx
View File

@ -119,7 +119,7 @@ const SpaceAccessControl = () => {
}
}
] as Column<TypesMembershipUser>[],
[]
[] // eslint-disable-line react-hooks/exhaustive-deps
)
return (

2
web/src/pages/UserProfile/UserProfile.tsx
View File

@ -147,7 +147,7 @@ const UserProfile = () => {
}
}
],
[]
[] // eslint-disable-line react-hooks/exhaustive-deps
)
const onEditField = async (field: keyof TypesUser, value: string) => {

8
web/yarn.lock
View File

@ -686,10 +686,10 @@
resolved "https://npm.pkg.github.com/download/@harness/design-system/1.4.0/b2a77f73696d71a53765c71efd0a5b28039fa1cf#b2a77f73696d71a53765c71efd0a5b28039fa1cf"
integrity sha512-LuzuPEHPkE6xgIuXxn16RCCvPY1NDXF3o1JWlIjxmepoDTkgFuwnV1OhBdQftvAVBawJ5wJP10IIKUL161LdYg==
"@harness/icons@1.149.0":
version "1.149.0"
resolved "https://npm.pkg.github.com/download/@harness/icons/1.149.0/0f2e1faba8d5e1a651b5b8f2c03582d30702d81f#0f2e1faba8d5e1a651b5b8f2c03582d30702d81f"
integrity sha512-kfcGY7t+V1NoSRAoDJofZpKAY79UN+NI8XWf0OLYtRI1JnVF37ZyJgvJ3Vk4VgLbMElsPRXopcx9ADjCWz/RZw==
"@harness/icons@1.174.0":
version "1.174.0"
resolved "https://npm.pkg.github.com/download/@harness/icons/1.174.0/f0b22590cd34ddc2276d293c8c30afdb9174d62f#f0b22590cd34ddc2276d293c8c30afdb9174d62f"
integrity sha512-xAbVjP5u6LA3X8hhArjM5AiknyrPv5k+480c4ILrkrBKhDO6+W/sEh/wJjMOWRDxyxA9uU9RINOLt4QruqD8Vw==
"@harness/jarvis@^0.12.0":
version "0.12.0"