feat(UI):Support force-push type, loading position adjustment

moon/apps/web/components/DiffView/parsedDiffs.ts

@@ -1,4 +1,5 @@
 const extensionToLangMap: Record<string, string> = {
+  // Note that the key here is lowercase
   '.ts': 'typescript',
   '.tsx': 'tsx',
   '.js': 'javascript',
@@ -28,6 +29,9 @@ const extensionToLangMap: Record<string, string> = {
   '.env': 'plaintext',
   'license-third-party': 'plaintext',
   'license-apache': 'plaintext',
+  'workspace': 'plaintext', 
+  '.buckroot': 'plaintext',
+  '.buckconfig': 'plaintext',
 }
 
 function getLangFromPath(path: string): string {

moon/apps/web/components/MrView/MergedItem.tsx

@@ -1,14 +1,34 @@
 import { ConversationItem } from '@gitmono/types/generated';
 import HandleTime from './components/HandleTime'
+import { useGetOrganizationMember } from '@/hooks/useGetOrganizationMember';
+import { ConditionalWrap } from '@gitmono/ui'
+import { MemberHovercard } from '../InlinePost/MemberHovercard';
+import { MemberAvatar } from '../MemberAvatar';
+import { UserLinkByName } from './components/UserLinkByName';
 
 interface MergedItemProps {
   conv: ConversationItem
 }
 const MergedItem = ({ conv }: MergedItemProps) => {
-
+  const { data: member } = useGetOrganizationMember({ username: conv.username })
+
   return (
     <>
       <div className='flex items-center space-x-2'>
+        <div className='cursor-pointer'>
+          <ConditionalWrap
+            condition={true}
+            wrap={(c) => (
+              <MemberHovercard username={conv?.username}>
+                <UserLinkByName username={conv?.username} className='relative'>
+                  {c}
+                </UserLinkByName>
+              </MemberHovercard>
+            )}
+          >
+            {member ? <MemberAvatar member={member} size='sm' /> : 'Avatar not found'}
+          </ConditionalWrap>
+        </div>
         <div>Merged via the queue into main</div>
         <div className='text-sm text-gray-500 hover:text-gray-700'>
             <HandleTime created_at={conv.created_at}/>

moon/apps/web/components/MrView/TimelineItems.tsx

@@ -7,7 +7,8 @@ import {
   FeedMergedIcon,
   FeedPullRequestClosedIcon,
   FeedPullRequestOpenIcon,
-  FeedTagIcon
+  FeedTagIcon,
+  RepoPushIcon
 } from '@primer/octicons-react'
 import { BaseStyles, ThemeProvider, Timeline } from '@primer/react'
 
@@ -19,6 +20,7 @@ import CloseItem from './CloseItem'
 import MergedItem from './MergedItem'
 import ReopenItem from './ReopenItem'
 import LabelItem from '@/components/MrView/LabelItem'
+import ForcePushItem from './item/ForcePushItem'
 
 interface TimelineItemProps {
   badge?: React.ReactNode
@@ -98,6 +100,10 @@ const TimelineItems: React.FC<{ detail: any; id: string; type: string }> = ({ de
         icon = <FeedTagIcon size={24} className='text-cyan-500' />
         children = <LabelItem conv={conv} />
         break
+      case 'ForcePush':
+        icon = <RepoPushIcon />
+        children = <ForcePushItem conv={conv} />
+        break
     }
 
     return { badge: icon, children, isOver, id: conv.id }

moon/apps/web/components/MrView/item/ForcePushItem.tsx

@@ -0,0 +1,22 @@
+import { ConversationItem } from '@gitmono/types/generated'
+import HandleTime from '../components/HandleTime'
+
+
+interface ReopenItemProps {
+  conv: ConversationItem
+}
+const ReopenItem = ({ conv }: ReopenItemProps) => {
+
+  return (
+    <>
+      <div className='flex items-center space-x-2'>
+        <div>{conv.comment}</div>
+        <div className='text-sm text-gray-500 hover:text-gray-700'>
+            <HandleTime created_at={conv.created_at}/>
+        </div>
+      </div>
+    </>
+  )
+}
+
+export default ReopenItem

moon/apps/web/pages/[org]/mr/[link]/[id].tsx

@@ -210,7 +210,7 @@ const MRDetailPage: PageWithLayout<any> = () => {
             <div className='flex gap-40'>
               <div className='mt-3 flex w-[60%] flex-col'>
                 {detailIsLoading ? (
-                  <div className='flex items-center justify-center'>
+                  <div className='flex items-center justify-center h-16'>
                     <LoadingSpinner />
                   </div>
                 ) : (
@@ -238,7 +238,6 @@ const MRDetailPage: PageWithLayout<any> = () => {
                       ref={editorRef}
                       editable='all'
                       content={EMPTY_HTML}
-                      autofocus={true}
                       onKeyDown={onKeyDownScrollHandler}
                       onChange={(html) => handleChange(html)}
                     />
@@ -365,7 +364,7 @@ const MRDetailPage: PageWithLayout<any> = () => {
           </UnderlinePanels.Panel>
           <UnderlinePanels.Panel>
             {fileChgIsLoading ? (
-              <div className='flex items-center justify-center'>
+              <div className='align-center container absolute left-1/2 top-1/2 flex -translate-x-1/2 -translate-y-1/2 justify-center'>
                 <LoadingSpinner />
               </div>
             ) : MrFilesChangedData?.data?.content ? (