Merge pull request #497 from opendatalab/release

Update package version
opendatalab · Apr 23, 2024 · cf58b95 · cf58b95
2 parents 901ad02 + ee42b16
commit cf58b95
Show file tree

Hide file tree

Showing 21 changed files with 224 additions and 151 deletions.
diff --git a/.releaserc.json b/.releaserc.json
@@ -14,7 +14,8 @@
     [
       "@semantic-release/github",
       {
-        "successComment": false
+        "successComment": false,
+        "failTitle": false
       }
     ],
     [

diff --git a/apps/frontend/.releaserc.json b/apps/frontend/.releaserc.json
@@ -19,7 +19,8 @@
       "@semantic-release/github",
       {
         "assets": [{ "path": "./*.zip", "label": "labelu-frontend-${nextRelease.version}.zip" }],
-        "successComment": false
+        "successComment": false,
+        "failTitle": false
       }
     ],
     [

diff --git a/apps/frontend/package.json b/apps/frontend/package.json
@@ -1,17 +1,17 @@
 {
   "name": "@labelu/frontend",
-  "version": "5.1.0",
+  "version": "5.2.1",
   "private": true,
   "dependencies": {
     "@ant-design/icons": "^4.6.2",
-    "@labelu/audio-annotator-react": "1.5.0",
-    "@labelu/components-react": "1.4.1",
+    "@labelu/audio-annotator-react": "1.5.2",
+    "@labelu/components-react": "1.4.2",
     "@labelu/image": "1.1.0",
     "@labelu/formatter": "1.0.2",
-    "@labelu/image-annotator-react": "2.1.0",
+    "@labelu/image-annotator-react": "2.1.1",
     "@labelu/interface": "1.3.1",
-    "@labelu/video-annotator-react": "1.3.4-alpha.3",
-    "@labelu/video-react": "1.3.1",
+    "@labelu/video-annotator-react": "1.3.4",
+    "@labelu/video-react": "1.3.3",
     "@tanstack/react-query": "^5.0.0",
     "antd": "5.10.1",
     "axios": "^1.3.4",

diff --git a/apps/frontend/src/hooks/useScrollFetch.ts b/apps/frontend/src/hooks/useScrollFetch.ts
@@ -23,7 +23,7 @@ export function useScrollFetch<T extends any[] | undefined>(
   service: (isReset: boolean) => Promise<T>,
   container?: HTMLDivElement | (() => HTMLDivElement | null) | undefined,
   options?: Option<T>,
-): [T, boolean, Dispatch<SetStateAction<T>>] {
+): [T, boolean, Dispatch<SetStateAction<T>>, () => Promise<unknown>] {
   const { threshold, afterFetching, isEnd, watch } = {
     threshold: 0,
     ...options,
@@ -122,5 +122,5 @@ export function useScrollFetch<T extends any[] | undefined>(
     };
   }, [container, handleOnScroll]);
 
-  return [data, isLoading, setData];
+  return [data, isLoading, setData, wrappedService];
 }
diff --git a/apps/frontend/src/initialize.tsx b/apps/frontend/src/initialize.tsx
@@ -18,6 +18,17 @@ declare global {
     IS_ONLINE: boolean;
 
     AnalyzeWiz: typeof AnalyzeWiz;
+
+    __backend: {
+      version: string;
+      build_time: string;
+      name: 'labelu';
+      commit: string;
+    };
+    __frontend: {
+      version: string;
+      deps: Record<string, string>;
+    };
   }
 }
 

diff --git a/apps/frontend/src/loaders/task.loader.ts b/apps/frontend/src/loaders/task.loader.ts
@@ -4,7 +4,7 @@ import { sampleKey, taskKey } from '@/api/queryKeyFactories';
 import { getTaskList, getTask } from '@/api/services/task';
 import queryClient from '@/api/queryClient';
 import { getSamples } from '@/api/services/samples';
-import type { SampleListResponse, TaskResponseWithStatics } from '@/api/types';
+import type { ListByApiV1TasksTaskIdSamplesGetParams, SampleListResponse, TaskResponseWithStatics } from '@/api/types';
 import type { ToolsConfigState } from '@/types/toolConfig';
 import { preAnnotationKey } from '@/api/queryKeyFactories/preAnnotation';
 import { getPreAnnotations } from '@/api/services/preAnnotations';
@@ -55,7 +55,12 @@ export async function taskLoader({ params, request }: LoaderFunctionArgs) {
   const queryParams = {
     task_id: +params.taskId,
     ...Object.fromEntries(searchParams.entries()),
-  };
+  } as ListByApiV1TasksTaskIdSamplesGetParams;
+
+  // task page
+  if (params.taskId && !params.sampleId && !queryParams.pageSize) {
+    queryParams.pageSize = 10;
+  }
 
   const sampleQueryKey = sampleKey.list(queryParams);
 
@@ -67,6 +72,8 @@ export async function taskLoader({ params, request }: LoaderFunctionArgs) {
   if (searchParams.get('isNew') !== 'true') {
     const preAnnotationQueryKey = preAnnotationKey.list({ task_id: +params.taskId });
 
+    delete queryParams.sort;
+
     result.preAnnotations = await queryClient.fetchQuery({
       queryKey: preAnnotationQueryKey,
       queryFn: () => getPreAnnotations(queryParams),

diff --git a/apps/frontend/src/pages/tasks.[id].samples.[id]/components/annotationRightCorner/index.tsx b/apps/frontend/src/pages/tasks.[id].samples.[id]/components/annotationRightCorner/index.tsx
@@ -18,10 +18,12 @@ import { message } from '@/StaticAnt';
 import AnnotationContext from '../../annotation.context';
 
 interface AnnotationRightCornerProps {
-  isLastSample: boolean;
-  isFirstSample: boolean;
   // 用于标注预览
   noSave?: boolean;
+
+  fetchNext?: () => void;
+
+  totalSize: number;
 }
 
 export const SAMPLE_CHANGED = 'sampleChanged';
@@ -56,7 +58,7 @@ export interface AnnotationLoaderData {
   samples: SampleListResponse;
 }
 
-const AnnotationRightCorner = ({ isLastSample, isFirstSample, noSave }: AnnotationRightCornerProps) => {
+const AnnotationRightCorner = ({ noSave, fetchNext, totalSize }: AnnotationRightCornerProps) => {
   const isFetching = useIsFetching();
   const isMutating = useIsMutating();
   const isGlobalLoading = isFetching > 0 || isMutating > 0;
@@ -67,10 +69,20 @@ const AnnotationRightCorner = ({ isLastSample, isFirstSample, noSave }: Annotati
   const sampleId = routeParams.sampleId;
   const { samples, setSamples, task } = useContext(AnnotationContext);
   const sampleIndex = _.findIndex(samples, (sample: SampleResponse) => sample.id === +sampleId!);
+  const isLastSample = _.findIndex(samples, { id: +sampleId! }) === samples.length - 1;
+  const isFirstSample = _.findIndex(samples, { id: +sampleId! }) === 0;
   const currentSample = samples[sampleIndex];
   const isSampleSkipped = currentSample?.state === SampleState.SKIPPED;
   const [searchParams] = useSearchParams();
 
+  // 第一次进入就是40的倍数时，获取下一页数据
+  useEffect(() => {
+    if (isLastSample && samples.length < totalSize) {
+      // TODO: fetchNext 调用两次
+      fetchNext?.();
+    }
+  }, [fetchNext, isLastSample, samples.length, totalSize]);
+
   const navigateWithSearch = useCallback(
     (to: string) => {
       const searchStr = searchParams.toString();
@@ -84,78 +96,6 @@ const AnnotationRightCorner = ({ isLastSample, isFirstSample, noSave }: Annotati
     [navigate, searchParams],
   );
 
-  const handleCancelSkipSample = async () => {
-    if (noSave) {
-      return;
-    }
-
-    await updateSampleState(
-      {
-        task_id: +taskId!,
-        sample_id: +sampleId!,
-      },
-      {
-        ...currentSample,
-        state: SampleState.NEW,
-      },
-    );
-
-    setSamples(
-      samples.map((sample: SampleResponse) =>
-        sample.id === +sampleId! ? { ...sample, state: SampleState.NEW } : sample,
-      ),
-    );
-  };
-
-  const handleSkipSample = async () => {
-    if (noSave) {
-      return;
-    }
-
-    await updateSampleState(
-      {
-        task_id: +taskId!,
-        sample_id: +sampleId!,
-      },
-      {
-        ...currentSample,
-        state: SampleState.SKIPPED,
-      },
-    );
-
-    setSamples(
-      samples.map((sample: SampleResponse) =>
-        sample.id === +sampleId! ? { ...sample, state: SampleState.SKIPPED } : sample,
-      ),
-    );
-    // 切换到下一个文件
-    if (!isLastSample) {
-      navigateWithSearch(`/tasks/${taskId}/samples/${_.get(samples, `[${sampleIndex + 1}].id`)}`);
-    } else {
-      navigateWithSearch(`/tasks/${taskId}/samples/finished`);
-    }
-  };
-
-  useHotkeys(
-    'ctrl+space, meta+space',
-    () => {
-      if (noSave) {
-        return;
-      }
-
-      if (currentSample.state === SampleState.SKIPPED) {
-        handleCancelSkipSample();
-      } else {
-        handleSkipSample();
-      }
-    },
-    {
-      keyup: true,
-      keydown: false,
-    },
-    [handleSkipSample, handleCancelSkipSample, currentSample],
-  );
-
   const saveCurrentSample = useCallback(async () => {
     if (currentSample?.state === SampleState.SKIPPED || noSave || !task?.media_type) {
       return;
@@ -301,7 +241,66 @@ const AnnotationRightCorner = ({ isLastSample, isFirstSample, noSave }: Annotati
     setTimeout(revalidator.revalidate);
   }, [saveCurrentSample, navigateWithSearch, taskId, revalidator.revalidate]);
 
+  const handleCancelSkipSample = async () => {
+    if (noSave) {
+      return;
+    }
+
+    await updateSampleState(
+      {
+        task_id: +taskId!,
+        sample_id: +sampleId!,
+      },
+      {
+        ...currentSample,
+        state: SampleState.NEW,
+      },
+    );
+
+    setSamples(
+      samples.map((sample: SampleResponse) =>
+        sample.id === +sampleId! ? { ...sample, state: SampleState.NEW } : sample,
+      ),
+    );
+  };
+
+  const handleSkipSample = async () => {
+    if (noSave) {
+      return;
+    }
+
+    await updateSampleState(
+      {
+        task_id: +taskId!,
+        sample_id: +sampleId!,
+      },
+      {
+        ...currentSample,
+        state: SampleState.SKIPPED,
+      },
+    );
+
+    setSamples(
+      samples.map((sample: SampleResponse) =>
+        sample.id === +sampleId! ? { ...sample, state: SampleState.SKIPPED } : sample,
+      ),
+    );
+
+    await saveCurrentSample();
+    // 切换到下一个文件
+    if (!isLastSample) {
+      navigateWithSearch(`/tasks/${taskId}/samples/${_.get(samples, `[${sampleIndex + 1}].id`)}`);
+    } else {
+      navigateWithSearch(`/tasks/${taskId}/samples/finished`);
+    }
+  };
+
   const handleNextSample = useCallback(() => {
+    // 到达分页边界，触发加载下一页
+    if (sampleIndex === samples.length - 2 && samples.length < totalSize) {
+      fetchNext?.();
+    }
+
     if (noSave) {
       navigateWithSearch(`/tasks/${taskId}/samples/${_.get(samples, `[${sampleIndex + 1}].id`)}`);
 
@@ -315,7 +314,18 @@ const AnnotationRightCorner = ({ isLastSample, isFirstSample, noSave }: Annotati
         navigateWithSearch(`/tasks/${taskId}/samples/${_.get(samples, `[${sampleIndex + 1}].id`)}`);
       });
     }
-  }, [noSave, isLastSample, navigateWithSearch, taskId, samples, sampleIndex, handleComplete, saveCurrentSample]);
+  }, [
+    sampleIndex,
+    samples,
+    totalSize,
+    noSave,
+    isLastSample,
+    fetchNext,
+    navigateWithSearch,
+    taskId,
+    handleComplete,
+    saveCurrentSample,
+  ]);
 
   const handlePrevSample = useCallback(async () => {
     if (sampleIndex === 0) {
@@ -344,6 +354,26 @@ const AnnotationRightCorner = ({ isLastSample, isFirstSample, noSave }: Annotati
     500,
   );
 
+  useHotkeys(
+    'ctrl+space, meta+space',
+    () => {
+      if (noSave) {
+        return;
+      }
+
+      if (currentSample.state === SampleState.SKIPPED) {
+        handleCancelSkipSample();
+      } else {
+        handleSkipSample();
+      }
+    },
+    {
+      keyup: true,
+      keydown: false,
+    },
+    [handleSkipSample, handleCancelSkipSample, currentSample],
+  );
+
   useEffect(() => {
     document.addEventListener('keydown', onKeyDown);
 

diff --git a/apps/frontend/src/pages/tasks.[id].samples.[id]/components/sliderCard/index.tsx b/apps/frontend/src/pages/tasks.[id].samples.[id]/components/sliderCard/index.tsx
@@ -55,16 +55,18 @@ const SliderCard = ({ type, cardInfo, index, onClick }: SliderCardProps) => {
 
   if (type === MediaType.VIDEO) {
     return (
-      <VideoCard
-        src={url!}
-        title={inner_id}
-        active={id === sampleId}
-        onClick={() => handleOnClick(cardInfo)}
-        showPlayIcon
-        showDuration
-        completed={state === 'DONE'}
-        skipped={state === 'SKIPPED'}
-      />
+      <div style={{ paddingLeft: '1rem', paddingRight: '1rem' }}>
+        <VideoCard
+          src={url!}
+          title={inner_id}
+          active={id === sampleId}
+          onClick={() => handleOnClick(cardInfo)}
+          showPlayIcon
+          showDuration
+          completed={state === 'DONE'}
+          skipped={state === 'SKIPPED'}
+        />
+      </div>
     );
   }