feat: tooltip (#7634)

web/app/(commonLayout)/app/(appDetailLayout)/[appId]/overview/tracing/config-popup.tsx

@@ -10,7 +10,7 @@ import { TracingProvider } from './type'
 import ProviderConfigModal from './provider-config-modal'
 import Indicator from '@/app/components/header/indicator'
 import Switch from '@/app/components/base/switch'
-import TooltipPlus from '@/app/components/base/tooltip-plus'
+import Tooltip from '@/app/components/base/tooltip'
 
 const I18N_PREFIX = 'app.tracing'
 
@@ -121,12 +121,11 @@ const ConfigPopup: FC<PopupProps> = ({
             <>
               {providerAllNotConfigured
                 ? (
-                  <TooltipPlus
+                  <Tooltip
                     popupContent={t(`${I18N_PREFIX}.disabledTip`)}
                   >
                     {switchContent}
-
-                  </TooltipPlus>
+                  </Tooltip>
                 )
                 : switchContent}
             </>

web/app/(commonLayout)/app/(appDetailLayout)/[appId]/overview/tracing/toggle-fold-btn.tsx

@@ -3,7 +3,7 @@ import { ChevronDoubleDownIcon } from '@heroicons/react/20/solid'
 import type { FC } from 'react'
 import { useTranslation } from 'react-i18next'
 import React, { useCallback } from 'react'
-import TooltipPlus from '@/app/components/base/tooltip-plus'
+import Tooltip from '@/app/components/base/tooltip'
 
 const I18N_PREFIX = 'app.tracing'
 
@@ -25,9 +25,8 @@ const ToggleFoldBtn: FC<Props> = ({
   return (
     // text-[0px] to hide spacing between tooltip elements
     <div className='shrink-0 cursor-pointer text-[0px]' onClick={handleFoldChange}>
-      <TooltipPlus
+      <Tooltip
         popupContent={t(`${I18N_PREFIX}.${isFold ? 'expand' : 'collapse'}`)}
-        hideArrow
       >
         {isFold && (
           <div className='p-1 rounded-md text-gray-500 hover:text-gray-800 hover:bg-black/5'>
@@ -39,7 +38,7 @@ const ToggleFoldBtn: FC<Props> = ({
             <ChevronDoubleDownIcon className='w-4 h-4 transform rotate-180' />
           </div>
         )}
-      </TooltipPlus>
+      </Tooltip>
     </div>
   )
 }