update comments

client/src/components/grid/Table.tsx

@@ -88,7 +88,7 @@ const useStyles = makeStyles(theme => ({
       textOverflow: 'ellipsis',
       whiteSpace: 'nowrap',
       maxWidth: (props: { tableCellMaxWidth: string }) =>
-        props.tableCellMaxWidth ? props.tableCellMaxWidth : '300px',
+        props.tableCellMaxWidth,
       fontSize: '14px',
       lineHeight: '20px',
     },
@@ -110,15 +110,21 @@ const EnhancedTable: FC<TableType> = props => {
     rows = [],
     colDefinitions,
     primaryKey,
+    // whether show checkbox in the first column
+    // set true as default
     openCheckBox = true,
     disableSelect,
     noData,
+    // whether change table row background color when mouse hover
+    // set true as default
     showHoverStyle = true,
     isLoading,
     setPageSize,
     headEditable = false,
+    // editable heads required param, contains heads components and its value
     editHeads = [],
-    tableCellMaxWidth = '',
+    // if table cell max width not be passed, table row will use 300px as default
+    tableCellMaxWidth = '300px',
   } = props;
   const classes = useStyles({ tableCellMaxWidth });
   const [order, setOrder] = React.useState('asc');

client/src/components/insert/Container.tsx

@@ -60,17 +60,23 @@ const InsertContainer: FC<InsertContentProps> = ({
     InsertStatusEnum.init
   );
   // const [nextDisabled, setNextDisabled] = useState<boolean>(false);
+
+  // selected collection name
   const [collectionValue, setCollectionValue] =
     useState<string>(selectedCollection);
+  // selected partition name
   const [partitionValue, setPartitionValue] =
     useState<string>(selectedPartition);
   // use contain field names yes as default
   const [isContainFieldNames, setIsContainFieldNames] = useState<number>(1);
+  // uploaded file name
   const [fileName, setFileName] = useState<string>('');
+  // uploaded csv data (type: string)
   const [csvData, setCsvData] = useState<any[]>([]);
 
   const BackIcon = icons.back;
 
+  // modal actions part, buttons label text or component
   const { confirm, cancel } = useMemo(() => {
     const labelMap: {
       [key in InsertStepperEnum]: {
@@ -111,6 +117,7 @@ const InsertContainer: FC<InsertContentProps> = ({
   };
 
   const previewData = useMemo(() => {
+    // we only show top 4 results of uploaded csv data
     const end = isContainFieldNames ? 5 : 4;
     return csvData.slice(0, end);
   }, [csvData, isContainFieldNames]);
@@ -129,13 +136,11 @@ const InsertContainer: FC<InsertContentProps> = ({
     setCsvData(data);
   };
 
-  const handleInsertData = () => {
-    // mock status change
+  const handleInsertData = async () => {
     setInsertStauts(InsertStatusEnum.loading);
-    handleInsert();
-    setTimeout(() => {
-      setInsertStauts(InsertStatusEnum.success);
-    }, 1000);
+    const res = await handleInsert();
+    const status = res ? InsertStatusEnum.success : InsertStatusEnum.error;
+    setInsertStauts(status);
   };
 
   const handleNext = () => {

client/src/components/insert/Preview.tsx

@@ -128,24 +128,7 @@ const InsertPreview: FC<InsertPreviewProps> = ({
         component: (
           <SimpleMenu
             label={head || insertTrans('requiredFieldName')}
-            // menuItems={schemaOptions.map(schema => ({
-            //   label: schema.label,
-            //   callback: () => handleTableHeadChange(index, schema.label),
-            //   wrapperClass: `${classes.menuItem} ${
-            //     head === schema.label ? classes.menuActive : ''
-            //   }`,
-            // }))}
-            menuItems={[
-              { label: 'type', value: 'type' },
-              {
-                label: 'field1',
-                value: 'field1',
-              },
-              {
-                label: 'field2',
-                value: 'field2',
-              },
-            ].map(schema => ({
+            menuItems={schemaOptions.map(schema => ({
               label: schema.label,
               callback: () => handleTableHeadChange(index, schema.label),
               wrapperClass: `${classes.menuItem} ${
@@ -166,7 +149,7 @@ const InsertPreview: FC<InsertPreviewProps> = ({
       classes.menuItem,
       classes.menuActive,
       ArrowIcon,
-      // schemaOptions,
+      schemaOptions,
       insertTrans,
       handleTableHeadChange,
     ]

client/src/components/insert/Types.ts

@@ -9,7 +9,7 @@ export interface InsertContentProps {
   partitions: PartitionData[];
   selectedPartition: string;
   schema: FieldData[];
-  handleInsert: () => void;
+  handleInsert: () => Promise<boolean>;
 }
 
 export enum InsertStepperEnum {