npm - @lobehub/chat - Versions diffs - 1.83.8 → 1.84.0 - Mend

@lobehub/chat 1.83.8 → 1.84.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (661) hide show

package/src/features/ChatInput/ActionBar/Upload/ServerMode.tsx CHANGED Viewed

@@ -1,5 +1,5 @@
-import { ActionIcon, Icon, Tooltip } from '@lobehub/ui';
-import { Dropdown, MenuProps, Upload } from 'antd';
+import { ActionIcon, MenuProps, Tooltip } from '@lobehub/ui';
+import { Upload } from 'antd';
 import { css, cx } from 'antd-style';
 import { FileUp, FolderUp, ImageUp, Paperclip } from 'lucide-react';
 import { memo } from 'react';
@@ -10,6 +10,8 @@ import { useAgentStore } from '@/store/agent';
 import { agentSelectors } from '@/store/agent/slices/chat';
 import { useFileStore } from '@/store/file';
+import ActionDropdown from '../../components/ActionDropdown';
 const hotArea = css`
   &::before {
     content: '';
@@ -32,7 +34,7 @@ const FileUpload = memo(() => {
   const items: MenuProps['items'] = [
     {
       disabled: !canUploadImage,
-      icon: <Icon icon={ImageUp} style={{ fontSize: '16px' }} />,
+      icon: ImageUp,
       key: 'upload-image',
       label: canUploadImage ? (
         <Upload
@@ -54,7 +56,7 @@ const FileUpload = memo(() => {
       ),
     },
     {
-      icon: <Icon icon={FileUp} style={{ fontSize: '16px' }} />,
+      icon: FileUp,
       key: 'upload-file',
       label: (
         <Upload
@@ -73,7 +75,7 @@ const FileUpload = memo(() => {
       ),
     },
     {
-      icon: <Icon icon={FolderUp} style={{ fontSize: '16px' }} />,
+      icon: FolderUp,
       key: 'upload-folder',
       label: (
         <Upload
@@ -95,9 +97,15 @@ const FileUpload = memo(() => {
   ];
   return (
-    <Dropdown menu={{ items }} placement="top">
-      <ActionIcon icon={Paperclip} placement={'bottom'} title={t('upload.action.tooltip')} />
-    </Dropdown>
+    <ActionDropdown menu={{ items }}>
+      <ActionIcon
+        icon={Paperclip}
+        title={t('upload.action.tooltip')}
+        tooltipProps={{
+          placement: 'bottom',
+        }}
+      />
+    </ActionDropdown>
   );
 });

package/src/features/ChatInput/ActionBar/index.tsx CHANGED Viewed

@@ -1,4 +1,4 @@
-import { ChatInputActionBar } from '@lobehub/ui';
+import { ChatInputActionBar } from '@lobehub/ui/chat';
 import { ReactNode, memo } from 'react';
 import { ActionKeys, actionMap } from './config';
@@ -24,7 +24,7 @@ export interface ActionBarProps {
 const ActionBar = memo<ActionBarProps>(
   ({
-    padding = '0 16px',
+    padding = '0 8px',
     rightAreaStartRender,
     rightAreaEndRender,
     leftAreaStartRender,

package/src/features/ChatInput/ActionBar/styles.ts ADDED Viewed

@@ -0,0 +1,14 @@
+import { createStyles } from 'antd-style';
+export const useStyles = createStyles(({ css, prefixCls }) => ({
+  dropdownMenu: css`
+    &.${prefixCls}-dropdown-menu {
+      .${prefixCls}-dropdown-menu-item-group-list {
+        margin: 0;
+      }
+      .${prefixCls}-avatar {
+        margin-inline-end: var(--ant-margin-xs);
+      }
+    }
+  `,
+}));

package/src/features/ChatInput/Desktop/InputArea/index.tsx CHANGED Viewed

@@ -19,7 +19,7 @@ const useStyles = createStyles(({ css }) => {
       height: 100% !important;
       padding-block: 0;
-      padding-inline: 24px;
+      padding-inline: 16px;
       line-height: 1.5;
@@ -117,8 +117,8 @@ const InputArea = memo<InputAreaProps>(({ onSend, value, loading, onChange }) =>
         }}
         placeholder={t('sendPlaceholder')}
         ref={ref}
-        type={'pure'}
         value={value}
+        variant={'borderless'}
       />
     </div>
   );

package/src/features/ChatInput/Desktop/index.tsx CHANGED Viewed

@@ -60,7 +60,7 @@ const DesktopChatInput = memo<DesktopChatInputProps>(
           <Flexbox
             gap={8}
             height={'100%'}
-            padding={'12px 0 16px'}
+            paddingBlock={'4px 16px'}
             style={{ minHeight: CHAT_TEXTAREA_HEIGHT, position: 'relative' }}
           >
             <Head

package/src/features/ChatInput/STT/common.tsx CHANGED Viewed

@@ -1,5 +1,4 @@
-import { ActionIcon, Alert, Highlighter } from '@lobehub/ui';
-import { Button, Dropdown } from 'antd';
+import { ActionIcon, Alert, Button, Dropdown, Highlighter } from '@lobehub/ui';
 import { createStyles } from 'antd-style';
 import { Mic, MicOff } from 'lucide-react';
 import { memo, useState } from 'react';
@@ -63,7 +62,11 @@ const CommonSTT = memo<{
                   closable
                   extra={
                     error.body && (
-                      <Highlighter copyButtonSize={'small'} language={'json'} type={'pure'}>
+                      <Highlighter
+                        actionIconSize={'small'}
+                        language={'json'}
+                        variant={'borderless'}
+                      >
                         {JSON.stringify(error.body, null, 2)}
                       </Highlighter>
                     )
@@ -107,10 +110,12 @@ const CommonSTT = memo<{
           active={isRecording}
           icon={isLoading ? MicOff : Mic}
           onClick={handleTriggerStartStop}
-          placement={'bottom'}
-          size={mobile ? { blockSize: 36, fontSize: 16 } : { fontSize: 22 }}
+          size={mobile ? { blockSize: 36, size: 16 } : 22}
           style={{ flex: 'none' }}
           title={dropdownOpen ? '' : desc}
+          tooltipProps={{
+            placement: 'bottom',
+          }}
         />
       </Dropdown>
     );

package/src/features/ChatInput/Topic/index.tsx CHANGED Viewed

@@ -1,5 +1,5 @@
-import { ActionIcon, Hotkey, Icon, Tooltip } from '@lobehub/ui';
-import { Button, Popconfirm } from 'antd';
+import { ActionIcon, Button, Hotkey, Tooltip } from '@lobehub/ui';
+import { Popconfirm } from 'antd';
 import { LucideGalleryVerticalEnd, LucideMessageSquarePlus } from 'lucide-react';
 import { memo, useState } from 'react';
 import { useTranslation } from 'react-i18next';
@@ -55,12 +55,7 @@ const SaveTopic = memo<{ mobile?: boolean }>(({ mobile }) => {
   } else {
     return (
       <Tooltip hotkey={hotkey} title={desc}>
-        <Button
-          aria-label={desc}
-          icon={<Icon icon={icon} />}
-          loading={isValidating}
-          onClick={() => mutate()}
-        />
+        <Button aria-label={desc} icon={icon} loading={isValidating} onClick={() => mutate()} />
       </Tooltip>
     );
   }

package/src/features/ChatInput/components/ActionDropdown.tsx ADDED Viewed

@@ -0,0 +1,62 @@
+'use client';
+import { Dropdown, DropdownProps } from '@lobehub/ui';
+import { createStyles } from 'antd-style';
+import { memo } from 'react';
+import { useIsMobile } from '@/hooks/useIsMobile';
+const useStyles = createStyles(({ css, prefixCls }) => ({
+  dropdownMenu: css`
+    &.${prefixCls}-dropdown-menu {
+      .${prefixCls}-dropdown-menu-item-group-list {
+        margin: 0;
+      }
+      .${prefixCls}-avatar {
+        margin-inline-end: var(--ant-margin-xs);
+      }
+    }
+  `,
+}));
+interface ActionDropdownProps extends DropdownProps {
+  maxHeight?: number;
+  maxWidth?: number;
+  minWidth?: number;
+}
+const ActionDropdown = memo<ActionDropdownProps>(
+  ({ menu, maxHeight, minWidth, maxWidth, children, placement = 'top', ...rest }) => {
+    const { cx, styles } = useStyles();
+    const isMobile = useIsMobile();
+    return (
+      <Dropdown
+        arrow={false}
+        menu={{
+          ...menu,
+          className: cx(styles.dropdownMenu, menu.className),
+          onClick: (e) => {
+            e.domEvent.preventDefault();
+            menu.onClick?.(e);
+          },
+          style: {
+            maxHeight,
+            maxWidth: isMobile ? undefined : maxWidth,
+            minWidth: isMobile ? undefined : minWidth,
+            overflowX: 'hidden',
+            overflowY: 'scroll',
+            width: isMobile ? '100vw' : undefined,
+            ...menu.style,
+          },
+        }}
+        placement={isMobile ? 'top' : placement}
+        {...rest}
+      >
+        {children}
+      </Dropdown>
+    );
+  },
+);
+export default ActionDropdown;

package/src/features/ChatInput/components/ActionPopover.tsx ADDED Viewed

@@ -0,0 +1,84 @@
+'use client';
+import { Popover, PopoverProps } from 'antd';
+import { createStyles } from 'antd-style';
+import { ReactNode, memo } from 'react';
+import { Flexbox } from 'react-layout-kit';
+import UpdateLoading from '@/components/Loading/UpdateLoading';
+import { useIsMobile } from '@/hooks/useIsMobile';
+const useStyles = createStyles(({ css, prefixCls }) => ({
+  popoverContent: css`
+    .${prefixCls}-form {
+      .${prefixCls}-form-item:first-child {
+        padding-block: 0 4px;
+      }
+      .${prefixCls}-form-item:last-child {
+        padding-block: 4px 0;
+      }
+    }
+  `,
+}));
+interface ActionPopoverProps extends Omit<PopoverProps, 'title'> {
+  extra?: ReactNode;
+  loading?: boolean;
+  maxHeight?: number;
+  maxWidth?: number;
+  minWidth?: number;
+  title?: ReactNode;
+}
+const ActionPopover = memo<ActionPopoverProps>(
+  ({
+    styles: customStyles,
+    maxHeight,
+    maxWidth,
+    minWidth,
+    children,
+    classNames,
+    title,
+    placement,
+    loading,
+    extra,
+    ...rest
+  }) => {
+    const { cx, styles, theme } = useStyles();
+    const isMobile = useIsMobile();
+    return (
+      <Popover
+        arrow={false}
+        classNames={{
+          ...classNames,
+          body: cx(styles.popoverContent, classNames?.body),
+        }}
+        placement={isMobile ? 'top' : placement}
+        styles={{
+          ...customStyles,
+          body: {
+            maxHeight,
+            maxWidth: isMobile ? undefined : maxWidth,
+            minWidth: isMobile ? undefined : minWidth,
+            width: isMobile ? '100vw' : undefined,
+            ...customStyles?.body,
+          },
+        }}
+        title={
+          title && (
+            <Flexbox gap={8} horizontal justify={'space-between'} style={{ marginBottom: 16 }}>
+              {title}
+              {extra}
+              {loading && <UpdateLoading style={{ color: theme.colorTextSecondary }} />}
+            </Flexbox>
+          )
+        }
+        {...rest}
+      >
+        {children}
+      </Popover>
+    );
+  },
+);
+export default ActionPopover;

package/src/features/ChatInput/components/UploadDetail/UploadStatus.tsx CHANGED Viewed

@@ -25,7 +25,7 @@ const UploadStatus = memo<UploadStateProps>(({ status, size, uploadState }) => {
     case 'pending': {
       return (
         <Flexbox align={'center'} gap={4} horizontal>
-          <Icon icon={Loader2Icon} size={{ fontSize: 12 }} spin />
+          <Icon icon={Loader2Icon} size={12} spin />
           <Typography.Text style={{ fontSize: 12 }} type={'secondary'}>
             {t('upload.preview.status.pending')}
           </Typography.Text>

package/src/features/Conversation/Actions/Assistant.tsx CHANGED Viewed

@@ -1,5 +1,5 @@
 import { ActionIconGroup } from '@lobehub/ui';
-import { ActionIconGroupItems } from '@lobehub/ui/es/ActionIconGroup';
+import type { ActionIconGroupItemType } from '@lobehub/ui';
 import { memo, useContext, useMemo } from 'react';
 import { useChatStore } from '@/store/chat';
@@ -29,27 +29,18 @@ export const AssistantActionsBar: RenderAction = memo(({ onActionClick, error, t
   const items = useMemo(() => {
     if (hasTools) return [delAndRegenerate, copy];
-    return [edit, copy, inThread ? null : branching].filter(Boolean) as ActionIconGroupItems[];
+    return [edit, copy, inThread ? null : branching].filter(Boolean) as ActionIconGroupItemType[];
   }, [inThread, hasTools]);
   if (error) return <ErrorActionsBar onActionClick={onActionClick} />;
   return (
     <ActionIconGroup
-      dropdownMenu={[
-        edit,
-        copy,
-        divider,
-        tts,
-        translate,
-        divider,
-        regenerate,
-        delAndRegenerate,
-        del,
-      ]}
       items={items}
+      menu={{
+        items: [edit, copy, divider, tts, translate, divider, regenerate, delAndRegenerate, del],
+      }}
       onActionClick={onActionClick}
-      type="ghost"
     />
   );
 });

package/src/features/Conversation/Actions/Error.tsx CHANGED Viewed

@@ -1,11 +1,11 @@
 import { ActionIconGroup } from '@lobehub/ui';
-import { ActionsBarProps } from '@lobehub/ui/es/chat/ChatList/ActionsBar';
+import type { ChatActionsBarProps } from '@lobehub/ui/chat';
 import { memo } from 'react';
 import { useChatListActionsBar } from '../hooks/useChatListActionsBar';
-export const ErrorActionsBar = memo<ActionsBarProps>(({ onActionClick }) => {
+export const ErrorActionsBar = memo<ChatActionsBarProps>(({ onActionClick }) => {
   const { regenerate, del } = useChatListActionsBar();
-  return <ActionIconGroup items={[regenerate, del]} onActionClick={onActionClick} type="ghost" />;
+  return <ActionIconGroup items={[regenerate, del]} onActionClick={onActionClick} />;
 });

package/src/features/Conversation/Actions/Fallback.tsx CHANGED Viewed

@@ -2,12 +2,18 @@ import { ActionIconGroup } from '@lobehub/ui';
 import { memo } from 'react';
 import { useChatListActionsBar } from '../hooks/useChatListActionsBar';
-import { RenderAction } from '../types';
+import type { RenderAction } from '../types';
 export const DefaultActionsBar: RenderAction = memo(({ onActionClick }) => {
   const { del } = useChatListActionsBar();
   return (
-    <ActionIconGroup dropdownMenu={[del]} items={[]} onActionClick={onActionClick} type="ghost" />
+    <ActionIconGroup
+      items={[]}
+      menu={{
+        items: [del],
+      }}
+      onActionClick={onActionClick}
+    />
   );
 });

package/src/features/Conversation/Actions/Tool.tsx CHANGED Viewed

@@ -28,7 +28,6 @@ export const ToolActionsBar: RenderAction = memo(({ id }) => {
           }
         }
       }}
-      type="ghost"
     />
   );
 });

package/src/features/Conversation/Actions/User.tsx CHANGED Viewed

@@ -1,5 +1,5 @@
 import { ActionIconGroup } from '@lobehub/ui';
-import { ActionIconGroupItems } from '@lobehub/ui/es/ActionIconGroup';
+import { ActionIconGroupItemType } from '@lobehub/ui/es/ActionIconGroup';
 import { memo, useContext, useMemo } from 'react';
 import { useChatStore } from '@/store/chat';
@@ -22,16 +22,18 @@ export const UserActionsBar: RenderAction = memo(({ onActionClick, id }) => {
   const inThread = isThreadMode || inPortalThread;
   const items = useMemo(
-    () => [regenerate, edit, inThread ? null : branching].filter(Boolean) as ActionIconGroupItems[],
+    () =>
+      [regenerate, edit, inThread ? null : branching].filter(Boolean) as ActionIconGroupItemType[],
     [inThread],
   );
   return (
     <ActionIconGroup
-      dropdownMenu={[edit, copy, divider, tts, translate, divider, regenerate, del]}
       items={items}
+      menu={{
+        items: [edit, copy, divider, tts, translate, divider, regenerate, del],
+      }}
       onActionClick={onActionClick}
-      type="ghost"
     />
   );
 });

package/src/features/Conversation/Actions/customAction.ts CHANGED Viewed

@@ -1,4 +1,4 @@
-import { ActionIconGroupItems } from '@lobehub/ui/es/ActionIconGroup';
+import type { ActionIconGroupItemType } from '@lobehub/ui';
 import { css, cx } from 'antd-style';
 import { LanguagesIcon, Play } from 'lucide-react';
 import { useMemo } from 'react';
@@ -25,13 +25,13 @@ export const useCustomActions = () => {
     key: 'translate',
     label: t('translate.action'),
     popupClassName: cx(translateStyle),
-  } as ActionIconGroupItems;
+  } as ActionIconGroupItemType;
   const tts = {
     icon: Play,
     key: 'tts',
     label: t('tts.action'),
-  } as ActionIconGroupItems;
+  } as ActionIconGroupItemType;
   return useMemo(() => ({ translate, tts }), []);
 };

package/src/features/Conversation/Error/APIKeyForm/Bedrock.tsx CHANGED Viewed

@@ -1,6 +1,5 @@
 import { Aws } from '@lobehub/icons';
-import { Icon } from '@lobehub/ui';
-import { Button, Input, Select } from 'antd';
+import { Button, Icon, InputPassword, Select } from '@lobehub/ui';
 import { useTheme } from 'antd-style';
 import { Network, ShieldPlus } from 'lucide-react';
 import { memo, useState } from 'react';
@@ -32,38 +31,38 @@ const BedrockForm = memo(() => {
       description={t('bedrock.unlock.description')}
       title={t('bedrock.unlock.title')}
     >
-      <Input.Password
+      <InputPassword
         autoComplete={'new-password'}
         onChange={(e) => {
           setConfig(ModelProvider.Bedrock, { accessKeyId: e.target.value });
         }}
         placeholder={'Aws Access Key Id'}
-        type={'block'}
         value={accessKeyId}
+        variant={'filled'}
       />
-      <Input.Password
+      <InputPassword
         autoComplete={'new-password'}
         onChange={(e) => {
           setConfig(ModelProvider.Bedrock, { secretAccessKey: e.target.value });
         }}
         placeholder={'Aws Secret Access Key'}
-        type={'block'}
         value={secretAccessKey}
+        variant={'filled'}
       />
       {showSessionToken ? (
-        <Input.Password
+        <InputPassword
           autoComplete={'new-password'}
           onChange={(e) => {
             setConfig(ModelProvider.Bedrock, { sessionToken: e.target.value });
           }}
           placeholder={'Aws Session Token'}
-          type={'block'}
           value={sessionToken}
+          variant={'filled'}
         />
       ) : (
         <Button
           block
-          icon={<Icon icon={ShieldPlus} />}
+          icon={ShieldPlus}
           onClick={() => {
             setShowSessionToken(true);
           }}

package/src/features/Conversation/Error/APIKeyForm/ProviderApiKeyForm.tsx CHANGED Viewed

@@ -1,5 +1,4 @@
-import { Icon } from '@lobehub/ui';
-import { Button } from 'antd';
+import { Button, Icon } from '@lobehub/ui';
 import { Loader2Icon, Network } from 'lucide-react';
 import { ReactNode, memo, useContext, useState } from 'react';
 import { useTranslation } from 'react-i18next';

package/src/features/Conversation/Error/APIKeyForm/index.tsx CHANGED Viewed

@@ -1,5 +1,5 @@
 import { ProviderIcon } from '@lobehub/icons';
-import { Button } from 'antd';
+import { Button } from '@lobehub/ui';
 import { memo, useMemo, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { Center, Flexbox } from 'react-layout-kit';

package/src/features/Conversation/Error/AccessCodeForm.tsx CHANGED Viewed

@@ -1,4 +1,4 @@
-import { Button, Input } from 'antd';
+import { Button, InputPassword } from '@lobehub/ui';
 import { memo } from 'react';
 import { useTranslation } from 'react-i18next';
 import { Flexbox } from 'react-layout-kit';
@@ -28,14 +28,14 @@ const AccessCodeForm = memo<AccessCodeFormProps>(({ id }) => {
         description={t('unlock.password.description')}
         title={t('unlock.password.title')}
       >
-        <Input.Password
+        <InputPassword
           autoComplete={'new-password'}
           onChange={(e) => {
             updateKeyVaults({ password: e.target.value });
           }}
           placeholder={t('unlock.password.placeholder')}
-          type={'block'}
           value={password}
+          variant={'filled'}
         />
       </FormAction>
       <Flexbox gap={12}>

package/src/features/Conversation/Error/ClerkLogin/index.tsx CHANGED Viewed

@@ -1,4 +1,4 @@
-import { Button } from 'antd';
+import { Button } from '@lobehub/ui';
 import { memo } from 'react';
 import { useTranslation } from 'react-i18next';

package/src/features/Conversation/Error/ErrorJsonViewer.tsx CHANGED Viewed

@@ -16,7 +16,7 @@ const ErrorJsonViewer = memo<ErrorJSONViewerProps>(({ error, id }) => {
   return (
     <Flexbox id={id} style={{ maxWidth: 600 }}>
-      <Highlighter copyButtonSize={'small'} language={'json'}>
+      <Highlighter actionIconSize={'small'} language={'json'}>
         {JSON.stringify(errorBody, null, 2)}
       </Highlighter>
     </Flexbox>

package/src/features/Conversation/Error/InvalidAccessCode.tsx CHANGED Viewed

@@ -1,5 +1,4 @@
-import { Icon } from '@lobehub/ui';
-import { Segmented } from 'antd';
+import { Icon, Segmented } from '@lobehub/ui';
 import { SegmentedLabeledOption } from 'antd/es/segmented';
 import { AsteriskSquare, KeySquare, ScanFace } from 'lucide-react';
 import { memo, useState } from 'react';
@@ -64,6 +63,7 @@ const InvalidAccessCode = memo<InvalidAccessCodeProps>(({ id, provider }) => {
           }
           style={{ width: '100%' }}
           value={mode}
+          variant={'filled'}
         />
       )}

package/src/features/Conversation/Error/OAuthForm.tsx CHANGED Viewed

@@ -1,5 +1,5 @@
-import { Icon } from '@lobehub/ui';
-import { App, Button } from 'antd';
+import { Button, Icon } from '@lobehub/ui';
+import { App } from 'antd';
 import { ScanFace } from 'lucide-react';
 import { memo, useCallback } from 'react';
 import { useTranslation } from 'react-i18next';

package/src/features/Conversation/Error/OllamaBizError/InvalidOllamaModel.tsx CHANGED Viewed

@@ -1,4 +1,4 @@
-import { Button } from 'antd';
+import { Button } from '@lobehub/ui';
 import { memo } from 'react';
 import { useTranslation } from 'react-i18next';

package/src/features/Conversation/Error/OllamaDesktopSetupGuide/index.tsx CHANGED Viewed

@@ -1,5 +1,5 @@
 import { Ollama } from '@lobehub/icons';
-import { Button } from 'antd';
+import { Button } from '@lobehub/ui';
 import { useTheme } from 'antd-style';
 import Link from 'next/link';
 import { memo } from 'react';

package/src/features/Conversation/Extras/TTS/Player.tsx CHANGED Viewed

@@ -1,6 +1,5 @@
 import { AudioPlayer, AudioPlayerProps } from '@lobehub/tts/react';
-import { ActionIcon, Alert, Highlighter } from '@lobehub/ui';
-import { Button } from 'antd';
+import { ActionIcon, Alert, Button, Highlighter } from '@lobehub/ui';
 import { TrashIcon } from 'lucide-react';
 import { memo } from 'react';
 import { useTranslation } from 'react-i18next';
@@ -29,7 +28,7 @@ const Player = memo<PlayerProps>(({ onRetry, error, onDelete, audio, isLoading,
           closable
           extra={
             error.body && (
-              <Highlighter copyButtonSize={'small'} language={'json'} type={'pure'}>
+              <Highlighter actionIconSize={'small'} language={'json'} variant={'borderless'}>
                 {JSON.stringify(error.body, null, 2)}
               </Highlighter>
             )

package/src/features/Conversation/Extras/Usage/UsageDetail/ModelCard.tsx CHANGED Viewed

@@ -1,6 +1,5 @@
 import { ModelIcon } from '@lobehub/icons';
-import { Icon, Tooltip } from '@lobehub/ui';
-import { Segmented } from 'antd';
+import { Icon, Segmented, Tooltip } from '@lobehub/ui';
 import { createStyles } from 'antd-style';
 import { ArrowDownToDot, ArrowUpFromDot, BookUp2Icon, CircleFadingArrowUp } from 'lucide-react';
 import { memo } from 'react';

package/src/features/Conversation/Extras/Usage/UsageDetail/TokenProgress.tsx CHANGED Viewed

@@ -3,7 +3,6 @@ import numeral from 'numeral';
 import { memo } from 'react';
 import { Flexbox } from 'react-layout-kit';
 export interface TokenProgressItem {
   color: string;
   id: string;