fix: dashboard usage display datas for last 30 days

src/components/markdown-viewer/index.less

@@ -25,6 +25,10 @@
     font-weight: var(--font-weight-bold);
   }
 
+  pre {
+    white-space: pre-wrap;
+  }
+
   h1,
   h2,
   h3,

src/pages/dashboard/components/usage-inner/use-usage-data.ts

@@ -1,5 +1,4 @@
 import dayjs from 'dayjs';
-import _ from 'lodash';
 import { useMemo } from 'react';
 
 const baseColorMap = {
@@ -29,36 +28,15 @@ interface TopUserData {
   topUserList: string[];
 }
 
-const getAdjustedDateRange = (startDate: number, endDate: number): string[] => {
+const getLast30Days = () => {
-  const start = dayjs(startDate);
+  const dates: string[] = [];
-  const end = dayjs(endDate);
-  const diff = end.diff(start, 'day') + 1;
 
-  const targetRange = 30;
+  for (let i = 29; i >= 0; i--) {
-  const diffDays = targetRange - diff;
+    const date = dayjs().subtract(i, 'day').format('YYYY-MM-DD');
-
+    dates.push(date);
-  let preDays = Math.ceil(diffDays / 2);
-  let postDays = Math.floor(diffDays / 2);
-
-  // if the difference is more than 30 days, adjust the start and end dates
-  if (diff >= targetRange) {
-    return Array.from({ length: targetRange }, (_, i) =>
-      end.subtract(i, 'day').format('YYYY-MM-DD')
-    ).reverse();
   }
 
-  const adjustedStart = start.subtract(preDays, 'day');
+  return dates;
-  const adjustedEnd = end.add(postDays, 'day');
-
-  const totalDays = adjustedEnd.diff(adjustedStart, 'day') + 1;
-
-  const dateRange: string[] = [];
-
-  for (let i = 0; i < totalDays; i++) {
-    dateRange.push(adjustedStart.add(i, 'day').format('YYYY-MM-DD'));
-  }
-
-  return dateRange;
 };
 
 const generateValueMap = (list: { timestamp: number; value: number }[]) => {
@@ -85,14 +63,7 @@ export default function useUseageData(data: any) {
     requestTokenData: RequestTokenData;
     topUserData: TopUserData;
   }>(() => {
-    const startDate = _.get(data?.api_request_history, '0.timestamp', 0);
+    const dateRange = getLast30Days();
-    const endDate = _.get(
-      data?.api_request_history || [],
-      data?.api_request_history?.length - 1,
-      0
-    ).timestamp;
-
-    const dateRange = getAdjustedDateRange(startDate * 1000, endDate * 1000);
 
     const completionTokenHistory = data.completion_token_history || [];
     const promptTokenHistory = data.prompt_token_history || [];

src/pages/llmodels/components/deploy-modal.tsx

@@ -97,6 +97,8 @@ const AddModal: FC<AddModalProps> = (props) => {
   const [selectedModel, setSelectedModel] = useState<any>({});
   const [collapsed, setCollapsed] = useState<boolean>(false);
   const [isGGUF, setIsGGUF] = useState<boolean>(false);
+  const [isEvaluatModel, setIsEvaluatModel] = useState<boolean>(false);
+  const [isEvaluatModelFile, setIsEvaluatModelFile] = useState<boolean>(false);
   const modelFileRef = useRef<any>(null);
 
   const getDefaultSpec = (item: any) => {
@@ -114,7 +116,7 @@ const AddModal: FC<AddModalProps> = (props) => {
     }
     return categories || null;
   };
-  const handleSelectModelFile = (item: any) => {
+  const handleSelectModelFile = (item: any, evaluate?: boolean) => {
     form.current?.form?.resetFields(resetFields);
     const modelInfo = onSelectModel(selectedModel, props.source);
     form.current?.setFieldsValue?.({
@@ -129,7 +131,7 @@ const AddModal: FC<AddModalProps> = (props) => {
     }
   };
 
-  const handleOnSelectModel = (item: any) => {
+  const handleOnSelectModel = (item: any, evaluate?: boolean) => {
     setSelectedModel(item);
     if (!item.isGGUF) {
       setIsGGUF(false);
@@ -209,7 +211,6 @@ const AddModal: FC<AddModalProps> = (props) => {
   }, [onCancel]);
 
   const handleOnOpen = () => {
-    console.log('handleOnOpen----------', props.source, props.deploymentType);
     if (props.deploymentType === 'modelFiles') {
       form.current?.form?.setFieldsValue({
         ...props.initialValues
@@ -233,6 +234,27 @@ const AddModal: FC<AddModalProps> = (props) => {
     return warningStatus.show && warningStatus.type !== 'success';
   }, [warningStatus.show, warningStatus.type]);
 
+  const displayEvaluateStatus = () => {
+    console.log('displayEvaluateStatus===');
+    setWarningStatus({
+      show: true,
+      title: '',
+      type: 'transition',
+      message: intl.formatMessage({ id: 'models.form.evaluating' })
+    });
+  };
+
+  useEffect(() => {
+    if (isEvaluatModel || isEvaluatModelFile) {
+      setWarningStatus({
+        show: true,
+        title: '',
+        type: 'transition',
+        message: intl.formatMessage({ id: 'models.form.evaluating' })
+      });
+    }
+  }, [isEvaluatModel, isEvaluatModelFile]);
+
   useEffect(() => {
     if (open) {
       handleOnOpen();
@@ -289,6 +311,7 @@ const AddModal: FC<AddModalProps> = (props) => {
                     hasLinuxWorker={hasLinuxWorker}
                     modelSource={props.source}
                     onSelectModel={handleOnSelectModel}
+                    displayEvaluateStatus={displayEvaluateStatus}
                   ></SearchModel>
                 </ColumnWrapper>
                 <Separator></Separator>
@@ -309,6 +332,7 @@ const AddModal: FC<AddModalProps> = (props) => {
                       modelSource={props.source}
                       onSelectFile={handleSelectModelFile}
                       collapsed={collapsed}
+                      displayEvaluateStatus={displayEvaluateStatus}
                     ></HFModelFile>
                   )}
                 </ColumnWrapper>

src/pages/llmodels/components/hf-model-file.tsx

@@ -39,7 +39,8 @@ interface HFModelFileProps {
   loadingModel?: boolean;
   modelSource: string;
   ref: any;
-  onSelectFile?: (file: any) => void;
+  onSelectFile?: (file: any, evaluate?: boolean) => void;
+  displayEvaluateStatus?: (show?: boolean) => void;
 }
 
 const pattern = /^(.*)-(\d+)-of-(\d+)\.(.*)$/;
@@ -49,7 +50,7 @@ const includeReg = /\.(safetensors|gguf)$/i;
 const filterRegGGUF = /\.(gguf)$/i;
 
 const HFModelFile: React.FC<HFModelFileProps> = forwardRef((props, ref) => {
-  const { collapsed, modelSource, isDownload } = props;
+  const { collapsed, modelSource, isDownload, displayEvaluateStatus } = props;
   const intl = useIntl();
   const [isEvaluating, setIsEvaluating] = useState(false);
   const [dataSource, setDataSource] = useState<any>({
@@ -73,8 +74,8 @@ const HFModelFile: React.FC<HFModelFileProps> = forwardRef((props, ref) => {
   const checkTokenRef = useRef<any>(null);
   const timer = useRef<any>(null);
 
-  const handleSelectModelFile = (item: any) => {
+  const handleSelectModelFile = (item: any, evaluate?: boolean) => {
-    props.onSelectFile?.(item);
+    props.onSelectFile?.(item, evaluate);
     setCurrent(item.path);
     currentPathRef.current = item.path;
   };
@@ -243,7 +244,7 @@ const HFModelFile: React.FC<HFModelFileProps> = forwardRef((props, ref) => {
       });
 
       setIsEvaluating(true);
-
+      displayEvaluateStatus?.(true);
       const evaluationList = await getEvaluateResults(evaluateFileList);
 
       const resultList = _.map(list, (item: any, index: number) => {
@@ -257,7 +258,7 @@ const HFModelFile: React.FC<HFModelFileProps> = forwardRef((props, ref) => {
         (item: any) => item.path === currentPathRef.current
       );
       if (currentItem) {
-        handleSelectModelFile(currentItem);
+        handleSelectModelFile(currentItem, true);
       }
       setDataSource({ fileList: resultList, loading: false });
       setIsEvaluating(false);

src/pages/llmodels/components/search-model.tsx

@@ -41,7 +41,8 @@ interface SearchInputProps {
   isDownload?: boolean;
   setLoadingModel?: (flag: boolean) => void;
   onSourceChange?: (source: string) => void;
-  onSelectModel: (model: any) => void;
+  onSelectModel: (model: any, evaluate?: boolean) => void;
+  displayEvaluateStatus?: (show?: boolean) => void;
 }
 
 const SearchModel: React.FC<SearchInputProps> = (props) => {
@@ -51,7 +52,8 @@ const SearchModel: React.FC<SearchInputProps> = (props) => {
     isDownload,
     hasLinuxWorker,
     setLoadingModel,
-    onSelectModel
+    onSelectModel,
+    displayEvaluateStatus
   } = props;
   const [dataSource, setDataSource] = useState<{
     repoOptions: any[];
@@ -108,8 +110,8 @@ const SearchModel: React.FC<SearchInputProps> = (props) => {
     return isGGUF || isGGUFFromMs;
   };
 
-  const handleOnSelectModel = (item: any) => {
+  const handleOnSelectModel = (item: any, evaluate?: boolean) => {
-    onSelectModel(item);
+    onSelectModel(item, evaluate);
     setCurrent(item.id);
     currentRef.current = item.id;
   };
@@ -232,6 +234,7 @@ const SearchModel: React.FC<SearchInputProps> = (props) => {
         };
       });
       setIsEvaluating(true);
+      displayEvaluateStatus?.(true);
       const evaluations = await getEvaluateResults(repoList);
       const resultList = list.map((item, index) => {
         return {
@@ -251,7 +254,7 @@ const SearchModel: React.FC<SearchInputProps> = (props) => {
         (item) => item.id === currentRef.current
       );
       if (currentItem) {
-        handleOnSelectModel(currentItem);
+        handleOnSelectModel(currentItem, true);
       }
     } catch (error) {
       setIsEvaluating(false);