Fix format, update snapshots

src/Explorer/Tabs/DocumentsTabV2/DocumentsTabV2.tsx

@@ -24,7 +24,7 @@ import { usePrevious } from "Explorer/Tabs/DocumentsTabV2/SelectionHelper";
 import {
   DocumentsTabPrefs,
   readDocumentsTabPrefs,
-  saveDocumentsTabPrefsDebounced
+  saveDocumentsTabPrefsDebounced,
 } from "Explorer/Tabs/DocumentsTabV2/documentsTabPrefs";
 import { CosmosFluentProvider, LayoutConstants, cosmosShorthands, tokens } from "Explorer/Theme/ThemeUtil";
 import { useSelectedNode } from "Explorer/useSelectedNode";
@@ -1014,8 +1014,8 @@ export const DocumentsTabComponent: React.FunctionComponent<IDocumentsTabCompone
         ? `the selected ${selectedRows.size} items`
         : "the selected item"
       : isPlural
-        ? `the selected ${selectedRows.size} documents`
-        : "the selected document";
+      ? `the selected ${selectedRows.size} documents`
+      : "the selected document";
     const msg = `Are you sure you want to delete ${documentName}?`;
 
     useDialog
@@ -2029,8 +2029,8 @@ export const DocumentsTabComponent: React.FunctionComponent<IDocumentsTabCompone
               </div>
             </Allotment.Pane>
           </Allotment>
-        </div >
-      </div >
-    </CosmosFluentProvider >
+        </div>
+      </div>
+    </CosmosFluentProvider>
   );
 };

src/Explorer/Tabs/DocumentsTabV2/DocumentsTableComponent.tsx

@@ -414,20 +414,18 @@ export const DocumentsTableComponent: React.FC<IDocumentsTableComponentProps> =
               checkboxIndicator={{ "aria-label": "Select all rows " }}
             />
           )}
-          {
-            columns.map((column) => (
-              <TableHeaderCell
-                className={styles.tableCell}
-                key={column.columnId}
-                {...columnSizing.getTableHeaderCellProps(column.columnId)}
-                {...headerSortProps(column.columnId)}
-              >
-                {column.renderHeaderCell()}
-              </TableHeaderCell>
-            ))
-          }
-        </TableRow >
-      </TableHeader >
+          {columns.map((column) => (
+            <TableHeaderCell
+              className={styles.tableCell}
+              key={column.columnId}
+              {...columnSizing.getTableHeaderCellProps(column.columnId)}
+              {...headerSortProps(column.columnId)}
+            >
+              {column.renderHeaderCell()}
+            </TableHeaderCell>
+          ))}
+        </TableRow>
+      </TableHeader>
       <TableBody>
         <List
           height={size !== undefined ? size.height - LayoutConstants.rowHeight /* table header */ : 0}
@@ -440,6 +438,6 @@ export const DocumentsTableComponent: React.FC<IDocumentsTableComponentProps> =
           {RenderRow}
         </List>
       </TableBody>
-    </Table >
+    </Table>
   );
 };

src/Explorer/Tabs/DocumentsTabV2/__snapshots__/DocumentsTabV2.test.tsx.snap

@@ -76,23 +76,43 @@ exports[`Documents tab (noSql API) when rendered should render the page 1`] = `
             <div
               className="___9o87uj0_0000000 ffefeo0"
             >
-              <DocumentsTableComponent
-                columnHeaders={
+              <div
+                style={
                   {
-                    "idHeader": "id",
-                    "partitionKeyHeaders": [],
+                    "height": "100%",
+                    "width": "calc(100% + -43px)",
                   }
                 }
-                isSelectionDisabled={true}
-                items={[]}
-                onItemClicked={[Function]}
-                onSelectedRowsChange={[Function]}
-                selectedRows={
-                  Set {
-                    0,
+              >
+                <DocumentsTableComponent
+                  columnDefinitions={
+                    [
+                      {
+                        "id": "id",
+                        "isPartitionKey": false,
+                        "label": "id",
+                      },
+                    ]
                   }
-                }
-              />
+                  isSelectionDisabled={true}
+                  items={[]}
+                  onColumnResize={[Function]}
+                  onColumnSelectionChange={[Function]}
+                  onItemClicked={[Function]}
+                  onRefreshTable={[Function]}
+                  onSelectedRowsChange={[Function]}
+                  selectedColumnIds={
+                    [
+                      "id",
+                    ]
+                  }
+                  selectedRows={
+                    Set {
+                      0,
+                    }
+                  }
+                />
+              </div>
             </div>
           </div>
         </Allotment.Pane>