Improve getTags().

web/src/DatasetListPage.js

@@ -105,21 +105,29 @@ class DatasetListPage extends React.Component {
         // width: '120px',
         sorter: (a, b) => a.vectors.localeCompare(b.vectors),
         render: (text, record, index) => {
-          const tags = text.map(vector => vector.name);
-          const tooltips = text.map(vector => JSON.stringify(vector.data));
-          return Setting.getTags(tags, tooltips);
+          return Setting.getTags(text);
         }
       },
       {
-        title: i18next.t("dataset:Vector count"),
-        dataIndex: 'vectorCount',
-        key: 'vectorCount',
+        title: i18next.t("dataset:All vectors"),
+        dataIndex: 'allVectors',
+        key: 'allVectors',
         width: '140px',
-        sorter: (a, b) => a.vectorCount - b.vectorCount,
+        sorter: (a, b) => a.allVectors - b.allVectors,
         render: (text, record, index) => {
           return record.vectors.length;
         }
       },
+      {
+        title: i18next.t("dataset:Valid vectors"),
+        dataIndex: 'validVectors',
+        key: 'validVectors',
+        width: '140px',
+        sorter: (a, b) => a.validVectors - b.validVectors,
+        render: (text, record, index) => {
+          return record.vectors.filter(vector => vector.data.length !== 0).length;
+        }
+      },
       {
         title: i18next.t("general:Action"),
         dataIndex: 'action',

web/src/Setting.js

@@ -227,22 +227,22 @@ export function getTagColor(s) {
   return "processing";
 }
 
-export function getTags(tags, tooltips) {
+export function getTags(vectors) {
   let res = [];
-  if (!tags) return res;
-  tags.forEach((tag, i) => {
-    if (tooltips !== undefined) {
+  if (!vectors) return res;
+  vectors.forEach((vector, i) => {
+    if (vector.data.length !== 0) {
       res.push(
-        <Tooltip placement="top" title={tooltips[i]}>
-          <Tag color={getTagColor(tag)}>
-            {tag}
+        <Tooltip placement="top" title={JSON.stringify(vector.data)}>
+          <Tag color={"success"}>
+            {vector.name}
           </Tag>
         </Tooltip>
       );
     } else {
       res.push(
-        <Tag color={getTagColor(tag)}>
-          {tag}
+        <Tag color={"warning"}>
+          {vector.name}
         </Tag>
       );
     }