Merge branch 'main' into account-settings

apps/design-system/src/pages/view-preview/view-preview.tsx

@@ -21,6 +21,7 @@ import { RepoBranchesView } from '@subjects/views/repo-branches'
 import { RepoCommitsView } from '@subjects/views/repo-commits'
 import { CreateRepoView } from '@subjects/views/repo-create'
 import { RepoCreateRule } from '@subjects/views/repo-create-rule'
+import { RepoEmpty } from '@subjects/views/repo-empty/repo-empty-view'
 import { RepoFilesEditView } from '@subjects/views/repo-files/repo-files-edit-view'
 import { RepoFilesJsonView } from '@subjects/views/repo-files/repo-files-json-view'
 import { RepoFilesList } from '@subjects/views/repo-files/repo-files-list'
@@ -65,6 +66,11 @@ export const viewPreviews: Record<string, ReactNode> = {
       <RepoSummaryViewWrapper />
     </RepoViewWrapper>
   ),
+  'repo-empty': (
+    <RepoViewWrapper>
+      <RepoEmpty />
+    </RepoViewWrapper>
+  ),
   'repo-list': (
     <RootViewWrapper>
       <RepoListWrapper />

apps/design-system/src/subjects/views/pull-request-compare/pull-request-compare.tsx

@@ -25,6 +25,8 @@ const PullRequestCompareWrapper: FC<Partial<PullRequestComparePageProps>> = prop
 
   return (
     <PullRequestComparePage
+      desc=""
+      setDesc={noop}
       handleDeleteReviewer={noop}
       handleAddReviewer={noop}
       onFormSubmit={noop}

apps/design-system/src/subjects/views/pull-request-conversation/pull-request-conversation.tsx

@@ -201,7 +201,6 @@ const PullRequestConversation: FC<PullRequestConversationProps> = ({ state }) =>
               handleSaveComment={noop}
               currentUser={{ display_name: currentUserData?.display_name, uid: currentUserData?.uid }}
               onCopyClick={noop}
-              onCommentSaveAndStatusChange={noop}
               toggleConversationStatus={noop}
               onCommitSuggestion={noop}
               addSuggestionToBatch={noop}

apps/design-system/src/subjects/views/pull-request-conversation/pull-request-panelData.ts

@@ -164,6 +164,144 @@ export const mockPullRequestActions = [
 ]
 
 export const mockActivities = [
+  {
+    id: 795,
+    created: 1737660580605,
+    updated: 1737660580605,
+    edited: 1737660580605,
+    parent_id: null,
+    repo_id: 22,
+    pullreq_id: 174,
+    order: 2,
+    sub_order: 0,
+    type: 'code-comment',
+    kind: 'change-comment',
+    text: 'We should add type checking for this function to improve type safety',
+    payload: {
+      title: '@@ -0,0 +1,4 @@',
+      lines: [
+        "+import tailwindcssAnimate from 'tailwindcss-animate'",
+        "+import { PluginAPI } from 'tailwindcss/types/config'",
+        '+',
+        '+export default {'
+      ],
+      line_start_new: true,
+      line_end_new: true
+    },
+    author: {
+      id: 3,
+      uid: 'admin',
+      display_name: 'Administrator',
+      email: '[email protected]',
+      type: 'user',
+      created: 1699863416002,
+      updated: 1699863416002
+    },
+    resolved: 1737660580605,
+    resolver: {
+      id: 3,
+      uid: 'admin',
+      display_name: 'Administrator',
+      email: '[email protected]',
+      type: 'user',
+      created: 1699863416002,
+      updated: 1699863416002
+    },
+    code_comment: {
+      outdated: false,
+      merge_base_sha: '12421f51a7cca90376cba8de0fe9b3289eb6e218',
+      source_sha: '34f4d7bbfeda153e4965395ac6a20e80dec63e57',
+      path: 'packages/canary/configs/tailwind.ts',
+      line_new: 2,
+      span_new: 1,
+      line_old: 0,
+      span_old: 0
+    }
+  },
+  {
+    id: 796,
+    created: 1737660580605,
+    updated: 1737660580605,
+    edited: 1737660580605,
+    parent_id: null,
+    repo_id: 22,
+    pullreq_id: 174,
+    order: 2,
+    sub_order: 0,
+    type: 'comment',
+    kind: 'comment',
+    text: 'Should we consider adding unit tests for the new animation components?',
+    payload: {},
+    author: {
+      id: 3,
+      uid: 'admin',
+      display_name: 'Administrator',
+      email: '[email protected]',
+      type: 'user',
+      created: 1699863416002,
+      updated: 1699863416002
+    },
+    resolved: 1737660580607,
+    resolver: {
+      id: 3,
+      uid: 'admin',
+      display_name: 'Administrator',
+      email: '[email protected]',
+      type: 'user',
+      created: 1699863416002,
+      updated: 1699863416002
+    }
+  },
+
+  {
+    id: 797,
+    created: 1737660580606,
+    updated: 1737660580606,
+    edited: 1737660580606,
+    parent_id: 796,
+    repo_id: 22,
+    pullreq_id: 174,
+    order: 2,
+    sub_order: 1,
+    type: 'comment',
+    kind: 'comment',
+    text: 'Yes, I agree. I will add tests for basic animations first.',
+    payload: {},
+    author: {
+      id: 3,
+      uid: 'admin',
+      display_name: 'Administrator',
+      email: '[email protected]',
+      type: 'user',
+      created: 1699863416002,
+      updated: 1699863416002
+    }
+  },
+
+  {
+    id: 798,
+    created: 1737660580607,
+    updated: 1737660580607,
+    edited: 1737660580607,
+    parent_id: 796,
+    repo_id: 22,
+    pullreq_id: 174,
+    order: 2,
+    sub_order: 2,
+    type: 'comment',
+    kind: 'comment',
+    text: 'Tests have been added in PR #123. We can close this discussion.',
+    payload: {},
+    author: {
+      id: 3,
+      uid: 'admin',
+      display_name: 'Administrator',
+      email: '[email protected]',
+      type: 'user',
+      created: 1699863416002,
+      updated: 1699863416002
+    }
+  },
   {
     id: 792,
     created: 1737660563002,

apps/design-system/src/subjects/views/repo-empty/repo-empty-view.tsx

@@ -0,0 +1,12 @@
+import { RepoEmptyView } from '@harnessio/ui/views'
+
+export const RepoEmpty = () => {
+  return (
+    <RepoEmptyView
+      httpUrl="https://github.com/mock-repo"
+      repoName="mock-repo"
+      projName="mock-project"
+      sshUrl="[email protected]:mock-repo.git"
+    />
+  )
+}

apps/gitness/src/AppMFE.tsx

@@ -17,26 +17,27 @@ import { MFEContext } from './framework/context/MFEContext'
 import { NavigationProvider } from './framework/context/NavigationContext'
 import { ThemeProvider, useThemeStore } from './framework/context/ThemeContext'
 import { queryClient } from './framework/queryClient'
+import { extractRedirectRouteObjects } from './framework/routing/utils'
 import { useLoadMFEStyles } from './hooks/useLoadMFEStyles'
 import i18n from './i18n/i18n'
-import { extractRedirectRouteObjects, mfeRoutes, repoRoutes } from './routes'
+import { mfeRoutes, repoRoutes } from './routes'
 
 export interface MFERouteRendererProps {
   renderUrl: string
   parentLocationPath: string
   onRouteChange: (updatedLocationPathname: string) => void
 }
 
-const filteredRoutes = extractRedirectRouteObjects(repoRoutes)
-const isRouteMatchingRedirectRoutes = (pathToValidate: string) => {
-  return filteredRoutes.every(route => !matchPath(`/${route.path}` as string, pathToValidate))
+const filteredRedirectRoutes = extractRedirectRouteObjects(repoRoutes)
+const isRouteNotMatchingRedirectRoutes = (pathToValidate: string) => {
+  return filteredRedirectRoutes.every(route => !matchPath(`/${route.path}` as string, pathToValidate))
 }
 
 function MFERouteRenderer({ renderUrl, parentLocationPath, onRouteChange }: MFERouteRendererProps) {
   const navigate = useNavigate()
   const location = useLocation()
   const parentPath = parentLocationPath.replace(renderUrl, '')
-  const isNotRedirectPath = isRouteMatchingRedirectRoutes(location.pathname)
+  const isNotRedirectPath = isRouteNotMatchingRedirectRoutes(location.pathname)
 
   /**
    * renderUrl ==> base URL of parent application
@@ -50,20 +51,18 @@ function MFERouteRenderer({ renderUrl, parentLocationPath, onRouteChange }: MFER
   )
 
   // Handle location change detected from parent route
-
   useEffect(() => {
     if (canNavigate) {
-      const pathToNavigate = parentLocationPath.replace(renderUrl, '')
-      navigate(pathToNavigate, { replace: true })
+      navigate(parentPath, { replace: true })
     }
-  }, [parentLocationPath])
+  }, [parentPath])
 
   // Notify parent about route change
   useEffect(() => {
     if (canNavigate) {
       onRouteChange?.(`${renderUrl}${location.pathname}`)
     }
-  }, [location])
+  }, [location.pathname])
 
   return null
 }

apps/gitness/src/components-v2/app-shell.tsx

@@ -216,7 +216,7 @@ export const AppShellMFE = () => {
 function BreadcrumbsAndOutlet({ className }: { className?: string }) {
   return (
     <div className={cn('flex flex-col', className)}>
-      <div className="layer-high bg-background-1 sticky top-0">
+      <div className="layer-high sticky top-0 bg-background-1">
         <Breadcrumbs />
       </div>
       <Outlet />

apps/gitness/src/framework/context/AppContext.tsx

@@ -14,6 +14,7 @@ import {
 import { ProfileSettingsErrorType } from '@harnessio/ui/views'
 
 import useLocalStorage from '../hooks/useLocalStorage'
+import usePageTitle from '../hooks/usePageTitle'
 
 interface AppContextType {
   spaces: TypesSpace[]
@@ -45,6 +46,7 @@ const AppContext = createContext<AppContextType>({
 })
 
 export const AppProvider: FC<{ children: ReactNode }> = ({ children }) => {
+  usePageTitle()
   const [spaces, setSpaces] = useState<TypesSpace[]>([])
   const [currentUser, setCurrentUser] = useLocalStorage<TypesUser>('currentUser', {})
   const [isLoadingUser, setIsLoadingUser] = useState(false)
@@ -89,14 +91,18 @@ export const AppProvider: FC<{ children: ReactNode }> = ({ children }) => {
   }
 
   useEffect(() => {
-    Promise.all([
+    Promise.allSettled([
       membershipSpaces({
         queryParams: { page: 1, limit: 100, sort: 'identifier', order: 'asc' }
       }),
       fetchUser()
     ])
-      .then(([membershipResponse]) => {
-        setSpaces(membershipResponse.body.filter(item => item?.space).map(item => item.space as TypesSpace))
+      .then(results => {
+        const [membershipResult] = results
+
+        if (membershipResult.status === 'fulfilled') {
+          setSpaces(membershipResult.value.body.filter(item => item?.space).map(item => item.space as TypesSpace))
+        }
       })
       .catch(() => {
         // Optionally handle error or show toast

apps/gitness/src/framework/hooks/usePageTitle.ts

@@ -0,0 +1,28 @@
+import { useEffect } from 'react'
+import { useMatches } from 'react-router-dom'
+
+import { useTranslationStore } from '../../i18n/stores/i18n-store'
+import { CustomHandle } from '../routing/types'
+
+const usePageTitle = () => {
+  const { t } = useTranslationStore()
+  const matches = useMatches()
+
+  useEffect(() => {
+    const fullPageTitle = matches
+      .reduce<string[]>((titles, match) => {
+        const { pageTitle } = (match.handle || {}) as CustomHandle
+        if (typeof pageTitle === 'string') {
+          titles.push(pageTitle)
+        } else if (typeof pageTitle === 'function') {
+          titles.push(pageTitle(match.params))
+        }
+        return titles
+      }, [])
+      .join(' | ')
+
+    document.title = fullPageTitle || t('views:app.harnessOpenSource', 'Harness Open Source')
+  }, [matches, t])
+}
+
+export default usePageTitle

apps/gitness/src/framework/routing/types.ts

@@ -7,6 +7,7 @@ export enum RouteConstants {
   toSignIn = 'toSignIn',
   toCreateRepo = 'toCreateRepo',
   toImportRepo = 'toImportRepo',
+  toImportMultipleRepos = 'toImportMultipleRepos',
   toRepositories = 'toRepositories',
   toRepoSummary = 'toRepoSummary',
   toRepoCommits = 'toRepoCommits',
@@ -88,7 +89,7 @@ export interface CustomHandle {
   /**
    * Defines the breadcrumb text or label using route parameters.
    */
-  breadcrumb?: (params: Params<string>) => string
+  breadcrumb?: (params: Params<string>) => string | JSX.Element
 
   /**
    * Renders the breadcrumb as a custom React component instead of a link.
@@ -99,6 +100,11 @@ export interface CustomHandle {
    * Associated route name for the breadcrumb.
    */
   routeName?: string
+
+  /**
+   * Updates the document title based on route parameters.
+   */
+  pageTitle?: string | ((params: Params<string>) => string)
 }
 
 // Intersection of RouteObject with the custom handle

apps/gitness/src/framework/routing/utils.ts

@@ -1,4 +1,4 @@
-import { Params } from 'react-router-dom'
+import { Navigate, Params } from 'react-router-dom'
 
 import '../context/NavigationContext'
 
@@ -77,3 +77,20 @@ export const getRouteMapping = ({
   const routeEntries = generateRouteEntries({ routes, parentPath, parentName })
   return generateRouteNameToPathFunctions(routeEntries)
 }
+
+export const extractRedirectRouteObjects = (routes: CustomRouteObject[]): CustomRouteObject[] => {
+  const navigateObjects: CustomRouteObject[] = []
+  const traverseRoutes = (routes: CustomRouteObject[], currentPath: string = '') => {
+    for (const route of routes) {
+      const newPath = currentPath ? `${currentPath}${route.path ? `/${route.path}` : ''}` : (route.path ?? '')
+      if ((route.element as JSX.Element)?.type === Navigate) {
+        navigateObjects.push({ ...route, path: newPath })
+      }
+      if (route.children) {
+        traverseRoutes(route.children, newPath)
+      }
+    }
+  }
+  traverseRoutes(routes)
+  return navigateObjects
+}