load cassandra query documents

src/Explorer/Tabs/QueryTablesTab/QueryTableEntityClause.tsx

@@ -13,6 +13,7 @@ import {
 import React, { FunctionComponent } from "react";
 import AddIcon from "../../../../images/Add.svg";
 import CancelIcon from "../../../../images/cancel.svg";
+import { userContext } from "../../../UserContext";
 import { IOption } from "./QueryTableTabUtils";
 const dropdownStyles: Partial<IDropdownStyles> = { dropdown: { width: 100 } };
 
@@ -73,6 +74,15 @@ export const QueryTableEntityClause: FunctionComponent<IQueryTableEntityClausePr
 
   const sectionStackTokens: IStackTokens = { childrenGap: 12 };
 
+  const validateEntityTypeOption = (): boolean => {
+    if (userContext.apiType === "Cassandra") {
+      return true;
+    } else if (selectedField === "PartitionKey" || selectedField === "RowKey" || selectedField === "Timestamp") {
+      return true;
+    }
+    return false;
+  };
+
   return (
     <>
       <Stack horizontal tokens={sectionStackTokens}>
@@ -115,7 +125,7 @@ export const QueryTableEntityClause: FunctionComponent<IQueryTableEntityClausePr
           }
           options={entityTypeOptions}
           id="entityOptionId"
-          disabled={selectedField !== "t3PN"}
+          disabled={validateEntityTypeOption()}
           styles={dropdownStyles}
         />
         <Dropdown

src/Explorer/Tabs/QueryTablesTab/QueryTablesTabComponent.tsx

@@ -38,6 +38,7 @@ import Explorer from "../../Explorer";
 import { useCommandBar } from "../../Menus/CommandBar/CommandBarComponentAdapter";
 import { AddTableEntityPanel } from "../../Panes/Tables/AddTableEntityPanel";
 import { EditTableEntityPanel } from "../../Panes/Tables/EditTableEntityPanel";
+import { getQuotedCqlIdentifier } from "../../Tables/CqlUtilities";
 import * as DataTableUtilities from "../../Tables/DataTable/DataTableUtilities";
 import TableCommands from "../../Tables/DataTable/TableCommands";
 import TableEntityListViewModel from "../../Tables/DataTable/TableEntityListViewModel";
@@ -210,7 +211,7 @@ class QueryTablesTabComponent extends Component<IQueryTablesTabComponentProps, I
           isQueryTableEntityChecked: false,
           selectedOperator: "=",
           id: "1",
-          selectedField: "PartitionKey",
+          selectedField: userContext.apiType === "Cassandra" ? "email" : "PartitionKey",
           selectedOperation: "",
           entityValue: "",
           selectedEntityType: "String",
@@ -482,9 +483,11 @@ class QueryTablesTabComponent extends Component<IQueryTablesTabComponentProps, I
       queryTableRows: queryTableRowsClone,
     });
 
-    this.state.queryViewModel
-      .queryBuilderViewModel()
-      .setExample(entities.length && entities[0].PartitionKey._, entities.length && entities[0].RowKey._);
+    if (userContext.apiType !== "Cassandra") {
+      this.state.queryViewModel
+        .queryBuilderViewModel()
+        .setExample(entities.length && entities[0].PartitionKey._, entities.length && entities[0].RowKey._);
+    }
 
     this.state.queryViewModel.queryBuilderViewModel().queryClauses.children.map((clause, index) => {
       this.allQueryTableRows.push({
@@ -529,16 +532,73 @@ class QueryTablesTabComponent extends Component<IQueryTablesTabComponentProps, I
   public async loadEntities(isInitialLoad: boolean): Promise<void> {
     const { tableEntityListViewModel } = this.state;
     tableEntityListViewModel.renderNextPageAndupdateCache();
+    let headers: string[] = [];
+    let documents: any = {};
+    if (userContext.apiType === "Cassandra") {
+      const query = `SELECT * FROM ${getQuotedCqlIdentifier(
+        this.props.queryTablesTab.collection.databaseId
+      )}.${getQuotedCqlIdentifier(this.props.queryTablesTab.collection.id())}`;
+      documents = await this.props.queryTablesTab.container.tableDataClient.queryDocuments(
+        this.props.queryTablesTab.collection,
+        query,
+        true
+      );
+      headers = this.getFormattedHeaders(documents.Results);
+      this.setupIntialEntities(documents.Results, headers, isInitialLoad);
+    } else {
+      const { collection } = this.props;
+      documents = await this.getDocuments(collection, "Select * from c");
+      headers = this.getFormattedHeaders(documents.Results);
+      this.setupIntialEntities(documents.Results, headers, isInitialLoad);
+    }
 
-    // setTimeout(() => {
-    // console.log(
-    //   "🚀 ~ file: QueryTablesTabComponent.tsx ~ line 296 ~ QueryTablesTabComponent ~ componentDidMount ~ componentDidMount",
-    //   this.state.tableEntityListViewModel.items()
+    // this.columns = [];
+    // headers.map((header) => {
+    //   this.columns.push({
+    //     key: header,
+    //     name: header,
+    //     minWidth: 100,
+    //     maxWidth: 200,
+    //     data: "string",
+    //     fieldName: header,
+    //     isResizable: true,
+    //     isSorted: true,
+    //     isSortedDescending: false,
+    //     sortAscendingAriaLabel: "Sorted A to Z",
+    //     sortDescendingAriaLabel: "Sorted Z to A",
+    //   });
+    // });
+
+    // const documentItems = this.generateDetailsList(documents.Results);
+    // // const queryTableRowsClone = [...queryTableRows];
+    // // queryTableRowsClone[0].fieldOptions = getformattedOptions(headers);
+    // this.setState(
+    //   {
+    //     columns: this.columns,
+    //     headers,
+    //     operators: this.state.queryViewModel.queryBuilderViewModel().operators(),
+    //     isLoading: false,
+    //     items: documentItems,
+    //     entities: documents.Results,
+    //     originalItems: documentItems,
+    //     queryText: this.state.queryViewModel.queryText(),
+    //   },
+    //   () => {
+    //     if (isInitialLoad) {
+    //       this.loadFilterExample();
+    //       // this.setDefaultItemSelection();
+    //     }
+    //   }
     // );
-    // const { queryTableRows } = this.state;
-    const { collection } = this.props;
-    const documents = await this.getDocuments(collection, "Select * from c");
-    const headers = this.getFormattedHeaders(documents.Results);
+
+    //If
+  }
+
+  private setupIntialEntities = (
+    entities: Entities.ITableEntity[],
+    headers: string[],
+    isInitialLoad: boolean
+  ): void => {
     this.columns = [];
     headers.map((header) => {
       this.columns.push({
@@ -556,7 +616,7 @@ class QueryTablesTabComponent extends Component<IQueryTablesTabComponentProps, I
       });
     });
 
-    const documentItems = this.generateDetailsList(documents.Results);
+    const documentItems = this.generateDetailsList(entities);
     // const queryTableRowsClone = [...queryTableRows];
     // queryTableRowsClone[0].fieldOptions = getformattedOptions(headers);
     this.setState(
@@ -566,7 +626,7 @@ class QueryTablesTabComponent extends Component<IQueryTablesTabComponentProps, I
         operators: this.state.queryViewModel.queryBuilderViewModel().operators(),
         isLoading: false,
         items: documentItems,
-        entities: documents.Results,
+        entities: entities,
         originalItems: documentItems,
         queryText: this.state.queryViewModel.queryText(),
       },
@@ -577,9 +637,7 @@ class QueryTablesTabComponent extends Component<IQueryTablesTabComponentProps, I
         }
       }
     );
-
-    //If
-  }
+  };
 
   private getFormattedHeaders = (entities: Entities.ITableEntity[]): string[] => {
     const selectedHeadersUnion: string[] = DataTableUtilities.getPropertyIntersectionFromTableEntities(
@@ -980,14 +1038,23 @@ class QueryTablesTabComponent extends Component<IQueryTablesTabComponentProps, I
     // eslint-disable-next-line @typescript-eslint/ban-ts-comment
     //@ts-ignore
     cloneQueryTableRows[index][selectedOptionType] = selectedOption.text;
-    if (selectedOptionType !== "selectedOperation" && selectedOptionType !== "selectedOperator") {
-      cloneQueryTableRows[index].selectedEntityType = "String";
+    if (userContext.apiType !== "Cassandra") {
+      if (selectedOptionType !== "selectedOperation" && selectedOptionType !== "selectedOperator") {
+        cloneQueryTableRows[index].selectedEntityType = "String";
+        const { text } = selectedOption;
+        if (text === "DateTime" || text === "Timestamp") {
+          cloneQueryTableRows[index].isTimeStampSelected = true;
+          cloneQueryTableRows[index].selectedEntityType = "DateTime";
+        } else if (selectedOptionType !== "selectedTimestamp") {
+          cloneQueryTableRows[index].isTimeStampSelected = false;
+        }
+      }
+    } else {
       const { text } = selectedOption;
-      if (text === "DateTime" || text === "Timestamp") {
-        cloneQueryTableRows[index].isTimeStampSelected = true;
-        cloneQueryTableRows[index].selectedEntityType = "DateTime";
-      } else if (selectedOptionType !== "selectedTimestamp") {
-        cloneQueryTableRows[index].isTimeStampSelected = false;
+      if (text === "userid") {
+        cloneQueryTableRows[index].selectedEntityType = "Int";
+      } else {
+        cloneQueryTableRows[index].selectedEntityType = "Text";
       }
     }
     this.setState({ queryTableRows: cloneQueryTableRows });
@@ -1023,12 +1090,12 @@ class QueryTablesTabComponent extends Component<IQueryTablesTabComponentProps, I
       operatorOptions: getformattedOptions(queryViewModel.queryBuilderViewModel().operators()),
       // id: cloneQueryTableRows.length + 1,
       id: newClause._id,
-      selectedField: "PartitionKey",
+      selectedField: userContext.apiType === "Cassandra" ? "email" : "PartitionKey",
       fieldOptions: getformattedOptions(headers),
 
       entityTypeOptions: getformattedOptions(queryViewModel.queryBuilderViewModel().edmTypes()),
 
-      selectedEntityType: "String",
+      selectedEntityType: userContext.apiType === "Cassandra" ? "Text" : "String",
       operationOptions: getformattedOptions(queryViewModel.queryBuilderViewModel().clauseRules()),
       // operationOptions: queryTableRows[0].operationOptions,
       selectedOperation: "And",