Bug fixes #3 (#810)

* feat: password/signin fixes

* chore: rebase

* feat: fix webhook flicker

* feat: add rule + disbale btn fix

* fix: edit button

* fix: tsc/lint

* fix: tsc

apps/design-system/src/subjects/views/repo-webhooks-list/repo-webhooks-list.tsx

@@ -1,6 +1,6 @@
 import { useCallback, useState } from 'react'
 
-import { useTranslationsStore } from '@utils/viewUtils.ts'
+import { noop, useTranslationsStore } from '@utils/viewUtils.ts'
 
 import { DeleteAlertDialog } from '@harnessio/ui/components'
 import { RepoWebhookListPage } from '@harnessio/ui/views'
@@ -27,6 +27,9 @@ export const RepoWebhooksList = () => {
         useWebhookStore={repoWebhooksListStore.useWebhookStore}
         useTranslationStore={useTranslationsStore}
         openDeleteWebhookDialog={openDeleteWebhookDialog}
+        setSearchQuery={noop}
+        searchQuery={null}
+        webhookLoading={false}
       />
       <DeleteAlertDialog
         open={deleteWebhookId !== null}

apps/gitness/src/pages-v2/repo/repo-settings-general-container.tsx

@@ -310,7 +310,7 @@ export const RepoSettingsGeneralPageContainer = () => {
   }
 
   const handleRuleClick = (identifier: string) => {
-    navigate(routes.toRepoBranchRule({ spaceId, repoId: repoName, identifier }))
+    navigate(routes.toRepoBranchRules({ spaceId, repoId: repoName, identifier }))
   }
 
   const handleDeleteRule = (ruleIdentifier: string) => {

apps/gitness/src/pages-v2/webhooks/webhook-list.tsx

@@ -1,6 +1,7 @@
 import { useCallback, useEffect, useState } from 'react'
 
 import { useQueryClient } from '@tanstack/react-query'
+import { useQueryState } from 'nuqs'
 
 import {
   DeleteRepoWebhookErrorResponse,
@@ -12,15 +13,15 @@ import { RepoWebhookListPage } from '@harnessio/ui/views'
 
 import { useGetRepoRef } from '../../framework/hooks/useGetRepoPath'
 import usePaginationQueryStateWithStore from '../../hooks/use-pagination-query-state-with-store'
-import { useDebouncedQueryState } from '../../hooks/useDebouncedQueryState'
 import { useTranslationStore } from '../../i18n/stores/i18n-store'
 import { getErrorMessage } from '../../utils/error-utils'
 import { useWebhookStore } from './stores/webhook-store'
 
 export default function WebhookListPage() {
   const repoRef = useGetRepoRef() ?? ''
-  const { setWebhooks, page, setPage, setWebhookLoading, setError } = useWebhookStore()
-  const [query] = useDebouncedQueryState('query')
+  const { setWebhooks, page, setPage, setError } = useWebhookStore()
+  const [query, setQuery] = useQueryState('query')
+
   const queryClient = useQueryClient()
 
   const [apiError, setApiError] = useState<{ type: string; message: string } | null>(null)
@@ -41,7 +42,7 @@ export default function WebhookListPage() {
     {
       queryParams: {
         page: queryPage,
-        query
+        query: query ?? ''
       },
       repo_ref: repoRef
     },
@@ -90,18 +91,11 @@ export default function WebhookListPage() {
   useEffect(() => {
     if (webhookData) {
       setWebhooks(webhookData, headers)
-      setWebhookLoading(false)
     }
 
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [webhookData, headers, setWebhooks])
 
-  useEffect(() => {
-    if (isFetching) {
-      setWebhookLoading(isFetching)
-    }
-  }, [isFetching, setWebhookLoading])
-
   useEffect(() => {
     if (isError && error !== undefined) {
       setError(getErrorMessage(error))
@@ -114,6 +108,9 @@ export default function WebhookListPage() {
         useWebhookStore={useWebhookStore}
         useTranslationStore={useTranslationStore}
         openDeleteWebhookDialog={openDeleteWebhookDialog}
+        searchQuery={query}
+        setSearchQuery={setQuery}
+        webhookLoading={isFetching}
       />
       <DeleteAlertDialog
         open={deleteWebhookId !== null}

apps/gitness/src/routes.tsx

@@ -107,7 +107,7 @@ const repoRoutes: CustomRouteObject[] = [
               },
               {
                 path: ':commitSHA',
-                element: <RepoCommitDetailsPage />,
+                element: <RepoCommitDetailsPage showSidebar={false} />,
                 handle: {
                   breadcrumb: ({ commitSHA }: { commitSHA: string }) => (
                     <>
@@ -121,7 +121,7 @@ const repoRoutes: CustomRouteObject[] = [
                     index: true,
                     element: (
                       <ExplorerPathsProvider>
-                        <CommitDiffContainer />
+                        <CommitDiffContainer showSidebar={false} />
                       </ExplorerPathsProvider>
                     )
                   }

apps/gitness/src/utils/repo-branch-rules-utils.ts

@@ -5,8 +5,13 @@ import {
   RepoRuleAddRequestBody,
   RepoRuleGetOkResponse
 } from '@harnessio/code-service-client'
-import { RepoBranchSettingsFormFields } from '@harnessio/ui/views'
-import { BranchRuleId, MergeStrategy, PatternsButtonType, Rule } from '@harnessio/views'
+import {
+  BranchRuleId,
+  MergeStrategy,
+  PatternsButtonType,
+  RepoBranchSettingsFormFields,
+  Rule
+} from '@harnessio/ui/views'
 
 const ruleIds = [
   BranchRuleId.REQUIRE_LATEST_COMMIT,
@@ -18,7 +23,8 @@ const ruleIds = [
   BranchRuleId.BLOCK_BRANCH_CREATION,
   BranchRuleId.BLOCK_BRANCH_DELETION,
   BranchRuleId.REQUIRE_PULL_REQUEST,
-  BranchRuleId.REQUIRE_CODE_REVIEW
+  BranchRuleId.REQUIRE_CODE_REVIEW,
+  BranchRuleId.REQUIRE_CODE_OWNERS
 ]
 
 // Util to transform API response into expected-form format for branch-rules-edit
@@ -67,6 +73,9 @@ const extractBranchRules = (data: RepoRuleGetOkResponse): Rule[] => {
         checked = (definition?.pullreq?.approvals?.require_minimum_count ?? 0) > 0
         input = definition?.pullreq?.approvals?.require_minimum_count?.toString() || ''
         break
+      case BranchRuleId.REQUIRE_CODE_OWNERS:
+        checked = definition?.pullreq?.approvals?.require_code_owners || false
+        break
       default:
         continue
     }
@@ -163,7 +172,7 @@ export const transformFormOutput = (formOutput: RepoBranchSettingsFormFields): R
       },
       pullreq: {
         approvals: {
-          require_code_owners: true,
+          require_code_owners: rulesMap[BranchRuleId.REQUIRE_CODE_OWNERS]?.checked || false,
           require_latest_commit: rulesMap[BranchRuleId.REQUIRE_LATEST_COMMIT]?.checked || false,
           require_no_change_request: rulesMap[BranchRuleId.REQUIRE_NO_CHANGE_REQUEST]?.checked || false,
           require_minimum_count: rulesMap[BranchRuleId.REQUIRE_CODE_REVIEW].checked

packages/ui/locales/en/views.json

@@ -54,6 +54,8 @@
     "RequirePullRequestDescription": "Do not allow any changes to matching branches without a pull request",
     "RequireCodeReview": "Require a minimum number of reviewers",
     "RequireCodeReviewDescription": "Require approval on pull requests from a minimum number of reviewers",
+    "RequireCodeOwners": "Require review from code owners",
+    "RequireCodeOwnersDescription": "Require approval on pull requests from one reviewer for each Code Owner rule",
     "enableRule": "Enable the rule",
     "enableRuleDescription": "By enabling the toggle, the branch rule will be enforced.",
     "enterRuleName": "Enter the rule name here",

packages/ui/locales/es/views.json

@@ -54,6 +54,8 @@
     "RequirePullRequestDescription": "Do not allow any changes to matching branches without a pull request",
     "RequireCodeReview": "Require a minimum number of reviewers",
     "RequireCodeReviewDescription": "Require approval on pull requests from a minimum number of reviewers",
+    "RequireCodeOwners": "Require review from code owners",
+    "RequireCodeOwnersDescription": "Require approval on pull requests from one reviewer for each Code Owner rule",
     "enableRule": "Enable the rule",
     "enableRuleDescription": "By enabling the toggle, the branch rule will be enforced.",
     "enterRuleName": "Enter the rule name here",

packages/ui/locales/fr/views.json

@@ -54,6 +54,8 @@
     "RequirePullRequestDescription": "Interdire les modifications directes sur les branches sans requête de tirage",
     "RequireCodeReview": "Exiger un minimum de réviseurs",
     "RequireCodeReviewDescription": "Les requêtes de tirage doivent être approuvées par un nombre minimal de réviseurs",
+    "RequireCodeOwners": "Require review from code owners",
+    "RequireCodeOwnersDescription": "Require approval on pull requests from one reviewer for each Code Owner rule",
     "enableRule": "Activer la règle",
     "enableRuleDescription": "En activant cette option, la règle sera appliquée.",
     "enterRuleName": "Enter the rule name here",

packages/ui/src/components/git-commit-dialog/git-commit-dialog.tsx

@@ -208,7 +208,7 @@ export const GitCommitDialog: FC<GitCommitDialogProps> = ({
               />
             </RadioGroup>
             {violation && (
-              <Message className="ml-8 mt-0.5" theme={MessageTheme.ERROR}>
+              <Message className="ml-[26px] mt-0.5" theme={MessageTheme.ERROR}>
                 {bypassable
                   ? commitToGitRefValue === CommitToGitRefOption.DIRECTLY
                     ? 'Some rules will be bypassed to commit directly'

packages/ui/src/views/auth/signin-page.tsx

@@ -22,7 +22,7 @@ export interface SignInData {
 }
 
 const signInSchema = z.object({
-  email: z.string().email({ message: 'Invalid email address' }),
+  email: z.string(),
   password: z.string().min(1, { message: 'The field can’t be blank' })
 })
 
@@ -90,8 +90,7 @@ export function SignInPage({ handleSignIn, isLoading, error }: SignInPageProps)
           <form onSubmit={handleSubmit(onSubmit)}>
             <Input
               id="email"
-              type="email"
-              label="Email"
+              label="Username/Email"
               placeholder="Your email"
               size="md"
               {...register('email', { onChange: handleInputChange })}

packages/ui/src/views/profile-settings/profile-settings-general-page.tsx

@@ -33,11 +33,7 @@ const profileSchema = z.object({
 
 const passwordSchema = z
   .object({
-    newPassword: z
-      .string()
-      .min(6, { message: 'New password must be at least 6 characters' })
-      .regex(/[0-9]/, 'New password must contain at least one number')
-      .regex(/[A-Z]/, 'New password must contain at least one uppercase letter'),
+    newPassword: z.string().min(6, { message: 'New password must be at least 6 characters' }),
     confirmPassword: z.string().min(6, { message: 'Please confirm your new password' })
   })
   .refine(data => data.newPassword === data.confirmPassword, {

packages/ui/src/views/repo/repo-branch-rules/components/repo-branch-rules-data.tsx

@@ -101,5 +101,13 @@ export const getBranchRules = (t: TFunction): BranchRuleType[] => [
       'Require approval on pull requests from a minimum number of reviewers'
     ),
     hasInput: true
+  },
+  {
+    id: BranchRuleId.REQUIRE_CODE_OWNERS,
+    label: t('views:repos.RequireCodeOwners', 'Require review from code owners'),
+    description: t(
+      'views:repos.RequireCodeOwnersDescription',
+      'Require approval on pull requests from one reviewer for each Code Owner rule'
+    )
   }
 ]

packages/ui/src/views/repo/repo-branch-rules/repo-branch-settings-rules-page.tsx

@@ -62,7 +62,7 @@ export const RepoBranchSettingsRulesPage: FC<RepoBranchSettingsRulesPageProps> =
     setValue,
     watch,
     reset,
-    formState: { errors, isValid }
+    formState: { errors }
   } = useForm<RepoBranchSettingsFormFields>({
     resolver: zodResolver(repoBranchSettingsFormSchema),
     mode: 'onChange',
@@ -156,7 +156,7 @@ export const RepoBranchSettingsRulesPage: FC<RepoBranchSettingsRulesPageProps> =
         <Fieldset className="mt-5">
           <ControlGroup>
             <ButtonGroup>
-              <Button type="submit" disabled={!isValid || isLoading}>
+              <Button type="submit" disabled={isLoading}>
                 {!isLoading
                   ? presetRuleData
                     ? t('views:repos.updateRule', 'Update rule')

packages/ui/src/views/repo/repo-branch-rules/types.ts

@@ -60,7 +60,8 @@ export enum BranchRuleId {
   BLOCK_BRANCH_CREATION = 'create_forbidden',
   BLOCK_BRANCH_DELETION = 'delete_forbidden',
   REQUIRE_PULL_REQUEST = 'update_forbidden',
-  REQUIRE_CODE_REVIEW = 'require_minimum_count'
+  REQUIRE_CODE_REVIEW = 'require_minimum_count',
+  REQUIRE_CODE_OWNERS = 'require_code_owners'
 }
 
 export enum PatternsButtonType {
@@ -77,7 +78,7 @@ export type IBranchRulesStore = {
 
 export const repoBranchSettingsFormSchema = z.object({
   identifier: z.string().min(1, 'Name is required'),
-  description: z.string().min(1, 'Description is required'),
+  description: z.string(),
   pattern: z.string(),
   patterns: z.array(
     z.object({

packages/ui/src/views/repo/repo-list/repo-list.tsx

@@ -1,6 +1,6 @@
 import { Link } from 'react-router-dom'
 
-import { Badge, Icon, NoData, SkeletonList, StackedList } from '@/components'
+import { Badge, Icon, NoData, SkeletonList, StackedList, Text } from '@/components'
 import { cn } from '@utils/cn'
 import { TFunction } from 'i18next'
 
@@ -30,7 +30,7 @@ const Stats = ({ stars, pulls }: { stars?: number; pulls: number }) => (
 
 const Title = ({ title, isPrivate, t }: { title: string; isPrivate: boolean; t: TFunction }) => (
   <div className="inline-flex items-center gap-2.5">
-    <span className="font-medium">{title}</span>
+    <Text className="font-medium truncate max-w-full">{title}</Text>
     <Badge size="sm" disableHover borderRadius="full" theme={isPrivate ? 'muted' : 'success'}>
       {isPrivate ? t('views:repos.private', 'Private') : t('views:repos.public', 'Public')}
     </Badge>
@@ -99,9 +99,15 @@ export function RepoList({
           <StackedList.Item key={repo.name} className="pb-2.5 pt-3" isLast={repos.length - 1 === repo_idx}>
             <StackedList.Field
               primary
-              description={repo.importing ? t('views:repos.importing', 'Importing…') : repo.description}
+              description={
+                repo.importing ? (
+                  t('views:repos.importing', 'Importing…')
+                ) : (
+                  <Text className="truncate max-w-full">{repo.description}</Text>
+                )
+              }
               title={<Title title={repo.name} isPrivate={repo.private} t={t} />}
-              className="line-clamp-1 flex gap-1.5 text-wrap"
+              className="max-w-[80%] flex gap-1.5 text-wrap"
             />
             {!repo.importing && (
               <StackedList.Field

packages/ui/src/views/repo/repo-summary/components/summary-panel.tsx

@@ -1,6 +1,7 @@
 import { FC } from 'react'
 
 import { Badge, Button, DropdownMenu, Icon, IconProps, Spacer, Text } from '@/components'
+import { TranslationStore } from '@views/repo/repo-list/types'
 
 import { EditRepoDetails } from './edit-repo-details-dialog'
 
@@ -16,22 +17,27 @@ interface SummaryPanelProps {
   details: DetailItem[]
   timestamp?: string
   description?: string
+  is_public?: boolean
   saveDescription: (description: string) => void
   updateRepoError?: string
   isEditDialogOpen: boolean
   setEditDialogOpen: (value: boolean) => void
+  useTranslationStore: () => TranslationStore
 }
 
 const SummaryPanel: FC<SummaryPanelProps> = ({
   title,
   details,
   timestamp,
   description = '',
+  is_public,
   saveDescription,
   updateRepoError,
   isEditDialogOpen,
-  setEditDialogOpen
+  setEditDialogOpen,
+  useTranslationStore
 }) => {
+  const { t } = useTranslationStore()
   const onClose = () => {
     setEditDialogOpen(false)
   }
@@ -62,13 +68,24 @@ const SummaryPanel: FC<SummaryPanelProps> = ({
             <span className="text-13 text-foreground-4">Created {timestamp}</span>
           </>
         )}
+        <Spacer size={3} />
+        <Badge
+          size="md"
+          disableHover
+          borderRadius="full"
+          theme={!is_public ? 'muted' : 'success'}
+          className="w-[25%] items-center justify-center"
+        >
+          {!is_public ? t('views:repos.private', 'Private') : t('views:repos.public', 'Public')}
+        </Badge>
         {!!description?.length && (
           <>
             <Spacer size={3} />
             <span className="line-clamp-6 border-y border-borders-4 py-1 text-14 text-foreground-2">{description}</span>
           </>
         )}
         <Spacer size={5} />
+
         <div className="flex flex-col gap-3">
           {details &&
             details.map(item => (

packages/ui/src/views/repo/repo-summary/repo-summary.tsx

@@ -45,6 +45,7 @@ export interface RepoSummaryViewProps extends Partial<RoutingProps> {
         description?: string
         created?: number
         default_branch?: string
+        is_public?: boolean
       }
     | undefined
   handleCreateToken: () => void
@@ -295,6 +296,8 @@ export function RepoSummaryView({
               updateRepoError={updateRepoError}
               isEditDialogOpen={isEditDialogOpen}
               setEditDialogOpen={setEditDialogOpen}
+              is_public={repository?.is_public}
+              useTranslationStore={useTranslationStore}
             />
           </SandboxLayout.Content>
         </SandboxLayout.Column>