Merge branch 'release' of github.com:opendatalab/labelU-Kit into online

opendatalab · Apr 18, 2024 · 6723ffc · 6723ffc
2 parents 72fcd1d + 8359a37
commit 6723ffc
Show file tree

Hide file tree

Showing 20 changed files with 533 additions and 136 deletions.
diff --git a/apps/frontend/package.json b/apps/frontend/package.json
@@ -1,17 +1,17 @@
 {
   "name": "@labelu/frontend",
-  "version": "5.0.0",
+  "version": "5.1.0",
   "private": true,
   "dependencies": {
     "@ant-design/icons": "^4.6.2",
-    "@labelu/audio-annotator-react": "1.4.1",
-    "@labelu/components-react": "1.4.0",
+    "@labelu/audio-annotator-react": "1.5.0",
+    "@labelu/components-react": "1.4.1",
     "@labelu/image": "1.1.0",
     "@labelu/formatter": "1.0.2",
-    "@labelu/image-annotator-react": "2.0.0",
+    "@labelu/image-annotator-react": "2.1.0",
     "@labelu/interface": "1.3.1",
-    "@labelu/video-annotator-react": "1.3.2",
-    "@labelu/video-react": "1.3.0",
+    "@labelu/video-annotator-react": "1.3.4-alpha.3",
+    "@labelu/video-react": "1.3.1",
     "@tanstack/react-query": "^5.0.0",
     "antd": "5.10.1",
     "axios": "^1.3.4",

diff --git a/apps/frontend/src/api/types.ts b/apps/frontend/src/api/types.ts
@@ -207,6 +207,7 @@ export interface PatchSampleCommand {
 export interface SampleResponse {
   /** Id description: annotation id */
   id?: number;
+  inner_id: number;
   /** State description: sample file state, NEW is has not start yet, DONE is completed, SKIPPED is skipped */
   state?: SampleState;
   /** Data description: sample data, include filename, file url, or result */

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
@@ -24,7 +24,7 @@ interface SliderCardProps {
 }
 
 const SliderCard = ({ type, cardInfo, index, onClick }: SliderCardProps) => {
-  const { id, state, file } = cardInfo;
+  const { id, inner_id, state, file } = cardInfo;
   const filename = file.filename;
   const url = file.url;
   const routeParams = useParams();
@@ -44,7 +44,7 @@ const SliderCard = ({ type, cardInfo, index, onClick }: SliderCardProps) => {
         src={url!}
         active={id === sampleId}
         onClick={() => handleOnClick(cardInfo)}
-        title={filename}
+        title={filename.substring(9)}
         no={index! + 1}
         showNo
         completed={state === 'DONE'}
@@ -57,7 +57,7 @@ const SliderCard = ({ type, cardInfo, index, onClick }: SliderCardProps) => {
     return (
       <VideoCard
         src={url!}
-        title={id}
+        title={inner_id}
         active={id === sampleId}
         onClick={() => handleOnClick(cardInfo)}
         showPlayIcon
@@ -81,7 +81,7 @@ const SliderCard = ({ type, cardInfo, index, onClick }: SliderCardProps) => {
         {state === 'DONE' && <CheckIcon />}
         {state === 'SKIPPED' && <SkipWrapper>跳过</SkipWrapper>}
       </ContentWrapper>
-      <IdWrapper>{id}</IdWrapper>
+      <IdWrapper>{inner_id}</IdWrapper>
     </Wrapper>
   );
 };

diff --git a/apps/frontend/src/pages/tasks.[id].samples.[id]/index.tsx b/apps/frontend/src/pages/tasks.[id].samples.[id]/index.tsx
@@ -233,6 +233,27 @@ const AnnotationPage = () => {
     [config, task],
   );
 
+  const [currentTool, setCurrentTool] = useState<any>();
+  const [labelMapping, setLabelMapping] = useState<Record<any, string>>();
+
+  const handleLabelChange = useCallback((toolName: any, label: ILabel) => {
+    // 缓存当前标签
+    setLabelMapping((prev) => {
+      return {
+        ...prev,
+        [toolName]: label.value,
+      };
+    });
+  }, []);
+
+  const handleToolChange = useCallback((toolName: any) => {
+    setCurrentTool(toolName);
+  }, []);
+
+  const currentLabel = useMemo(() => {
+    return labelMapping?.[currentTool];
+  }, [currentTool, labelMapping]);
+
   if (task?.media_type === MediaType.IMAGE) {
     content = (
       <ImageAnnotator
@@ -244,6 +265,10 @@ const AnnotationPage = () => {
         editingSample={editingSample}
         config={config}
         requestEdit={requestEdit}
+        onLabelChange={handleLabelChange}
+        onToolChange={handleToolChange}
+        selectedTool={currentTool}
+        selectedLabel={currentLabel}
         preAnnotationLabels={preAnnotationConfig}
         preAnnotations={preAnnotations}
       />
@@ -259,6 +284,10 @@ const AnnotationPage = () => {
         toolbarRight={topActionContent}
         renderSidebar={renderSidebar}
         requestEdit={requestEdit}
+        onLabelChange={handleLabelChange}
+        onToolChange={handleToolChange}
+        selectedTool={currentTool}
+        selectedLabel={currentLabel}
         preAnnotationLabels={preAnnotationConfig}
         preAnnotations={preAnnotations}
       />
@@ -274,6 +303,10 @@ const AnnotationPage = () => {
         toolbarRight={topActionContent}
         renderSidebar={renderSidebar}
         requestEdit={requestEdit}
+        onLabelChange={handleLabelChange}
+        onToolChange={handleToolChange}
+        selectedTool={currentTool}
+        selectedLabel={currentLabel}
         preAnnotationLabels={preAnnotationConfig}
         preAnnotations={preAnnotations}
       />

diff --git a/apps/frontend/src/pages/tasks.[id]/index.tsx b/apps/frontend/src/pages/tasks.[id]/index.tsx
@@ -70,8 +70,8 @@ const Samples = () => {
   const columns: ColumnsType<SampleResponse> = [
     {
       title: '数据ID',
-      dataIndex: 'id',
-      key: 'id',
+      dataIndex: 'inner_id',
+      key: 'inner_id',
       align: 'left',
     },
     {
@@ -80,16 +80,18 @@ const Samples = () => {
       key: 'filename',
       align: 'left',
       render: (filename, record) => {
-        if (record.file?.filename?.endsWith('.jsonl')) {
+        const _filename = (record.file?.filename ?? '').substring(9);
+
+        if (_filename.endsWith('.jsonl')) {
           return (
             <span>
-              {formatter.format('ellipsis', filename, { maxWidth: 160, type: 'tooltip' })}
+              {formatter.format('ellipsis', _filename, { maxWidth: 160, type: 'tooltip' })}
               &nbsp;
               <Tag color="processing">预标注</Tag>
             </span>
           );
         }
-        return formatter.format('ellipsis', filename, { maxWidth: 160, type: 'tooltip' });
+        return formatter.format('ellipsis', _filename, { maxWidth: 160, type: 'tooltip' });
       },
     },
     {
@@ -347,7 +349,12 @@ const Samples = () => {
   }, [task?.media_type]);
 
   const data = useMemo(() => {
-    return [...(preAnnotations ?? []), ...(samples ?? [])];
+    return [
+      ...(preAnnotations ?? []),
+      ...(samples ?? []).sort(
+        (a, b) => new Date(b.created_at ?? '').valueOf() - new Date(a.created_at ?? '').valueOf(),
+      ),
+    ];
   }, [preAnnotations, samples]);
 
   return (

diff --git a/apps/website/src/constant/index.tsx b/apps/website/src/constant/index.tsx
@@ -4,17 +4,17 @@ import { ReactComponent as ImageIcon } from '@/assets/image.svg';
 
 export const MENU = [
   {
-    name: 'Image',
+    name: '图片',
     path: '/image',
     icon: <ImageIcon className="text-lg" />,
   },
   {
-    name: 'Audio',
+    name: '音频',
     path: '/audio',
     icon: <AudioIcon className="text-lg" />,
   },
   {
-    name: 'Video',
+    name: '视频',
     path: '/video',
     icon: <VideoIcon className="text-lg" />,
   },