Replace pascalcase by camelcase (#43)

* Rename services attributes

* Update storybook components

* Update reporting-api version

* Set reporting-api version that only accept patch versions

.env.sample

@@ -1,13 +1,11 @@
-BASE_URL="http://<baseURL>/API"
+GXQUERY_BASE_URL="http://<baseURL>/API/v1"
 
-REPOSITORY_NAME=""
-USER_NAME=""
-USER_PASSWORD=""
+GXQUERY_REPOSITORY_NAME=""
+GXQUERY_USER_NAME=""
+GXQUERY_USER_PASSWORD=""
 
-API_VERSION_PATH=""
+GXQUERY_METADATA_NAME=""
 
-METADATA_NAME=""
+GXQUERY_SESSION_LIMIT=10
 
-SESSION_LIMIT=10
-
-DEFAULT_GENERATOR="net"
+GXQUERY_DEFAULT_GENERATOR="net"

package.json

@@ -66,7 +66,7 @@
   },
   "license": "MIT",
   "dependencies": {
-    "@genexus/reporting-api": "~0.4.1",
+    "@genexus/reporting-api": "~1.1.0",
     "@genexus/web-controls-library": "2.3.0",
     "date-fns": "^2.30.0",
     "highcharts": "^11.1.0",

src/common/basic-types.ts

@@ -605,94 +605,47 @@ export type QueryViewerPivotCollectionProperties = {
  */
 export type GxError = { Code: number; Message: string };
 
-export type GxQueryItem = Omit<QueryViewerBase, "Modified"> & {
-  Id: string;
-  Name: string;
-  Description: string;
-  Expression: string;
-  Modified: Date;
-  differenceInDays: number;
-};
-
-export type GxQueryListResponse = {
-  Queries: GxQueryItem[];
-  Errors: GxError[];
-};
-
 export type ChatMessage = {
   role: "user" | "assistant";
   content: string;
 };
 
-export type GxChatMessage = {
-  id: string;
-  content: string;
-  messageType: "user" | "assistant";
-  expression: string;
-  suggested?: string[];
-};
-
-export type GxChatMessageResponse = {
-  ChatMessage: GxChatMessage;
-  Errors: GxError[];
-  Query?: GxQueryItem;
-};
-
-export type GxCommonErrorResponse = {
-  Errors: GxError[];
-};
-
-export type GxGetQueryResponse = {
-  Query: GxQueryItem;
-  Errors: GxError[];
-};
-
-/**
- * This is the minimum information required to display a query from GXquery
- */
-export type GxQueryOptions = {
-  baseUrl: string;
-  metadataName: string;
-  queryName?: string;
-  query?: QueryViewerBase;
-};
-
 /**
  * Represents query in GXquery @Todo: extend the QueryViewer class with this interface
  */
-export interface QueryViewerBase {
-  Id: string;
-  Name: string;
-  Description: string;
-  Expression: string;
-  Modified: string;
-  RemoveDuplicates: boolean;
-  MaxRows: string;
-  TextForNullValues: string;
-  OutputType: QueryViewerOutputType;
-  Title: string;
-  ShowValues: boolean;
-  ShowDataAs: QueryViewerShowDataAs;
-  Orientation: QueryViewerOrientation;
-  IncludeTrend: boolean;
-  IncludeSparkline: boolean;
-  IncludeMaxAndMin: boolean;
-  ChartType: QueryViewerChartType;
-  PlotSeries: QueryViewerPlotSeries;
-  XAxisLabels: QueryViewerXAxisLabels;
-  XAxisIntersectionAtZero: boolean;
-  XAxisTitle: string;
-  YAxisTitle: string;
-  MapType: QueryViewerMapType;
-  Region: QueryViewerRegion;
-  Continent: QueryViewerContinent;
-  Country: QueryViewerCountry;
-  Paging: boolean;
-  PageSize: number;
-  ShowDataLabelsIn: QueryViewerShowDataLabelsIn;
-  TotalForRows: QueryViewerTotal;
-  TotalForColumns: QueryViewerTotal;
-}
+// export interface QueryViewerBase {
+//   Id: string;
+//   Name: string;
+//   Description: string;
+//   Expression: string;
+//   Modified: string;
+//   RemoveDuplicates: boolean;
+//   MaxRows: string;
+//   TextForNullValues: string;
+//   OutputType: QueryViewerOutputType;
+//   Title: string;
+//   ShowValues: boolean;
+//   ShowDataAs: QueryViewerShowDataAs;
+//   Orientation: QueryViewerOrientation;
+//   IncludeTrend: boolean;
+//   IncludeSparkline: boolean;
+//   IncludeMaxAndMin: boolean;
+//   ChartType: QueryViewerChartType;
+//   PlotSeries: QueryViewerPlotSeries;
+//   XAxisLabels: QueryViewerXAxisLabels;
+//   XAxisIntersectionAtZero: boolean;
+//   XAxisTitle: string;
+//   YAxisTitle: string;
+//   MapType: QueryViewerMapType;
+//   Region: QueryViewerRegion;
+//   Continent: QueryViewerContinent;
+//   Country: QueryViewerCountry;
+//   Paging: boolean;
+//   PageSize: number;
+//   ShowDataLabelsIn: QueryViewerShowDataLabelsIn;
+//   TotalForRows: QueryViewerTotal;
+//   TotalForColumns: QueryViewerTotal;
+// }
 
 export enum QueryViewerAxisType {
   Rows = "Rows",

src/components.d.ts

@@ -7,9 +7,9 @@
 import { HTMLStencilElement, JSXBase } from "@stencil/core/internal";
 import { QueryRequest } from "./components/gx-query/query-chat/query-chat";
 import { GeneratorType, GxQueryItem, QueryViewerAutoResizeType, QueryViewerBase, QueryViewerChartType, QueryViewerContinent, QueryViewerCountry, QueryViewerMapType, QueryViewerOrientation, QueryViewerOutputType, QueryViewerPlotSeries, QueryViewerRegion, QueryViewerShowDataAs, QueryViewerShowDataLabelsIn, QueryViewerTotal, QueryViewerTranslations, QueryViewerTrendPeriod, QueryViewerXAxisLabels } from "@genexus/reporting-api/dist/types/basic-types";
-import { GxQueryItem as GxQueryItem1, QueryViewerChartType as QueryViewerChartType1, QueryViewerOrientation as QueryViewerOrientation1, QueryViewerPivotCollection, QueryViewerPivotParameters, QueryViewerPlotSeries as QueryViewerPlotSeries1, QueryViewerShowDataAs as QueryViewerShowDataAs1, QueryViewerShowDataLabelsIn as QueryViewerShowDataLabelsIn1, QueryViewerSliderRange, QueryViewerTotal as QueryViewerTotal1, QueryViewerTranslations as QueryViewerTranslations1, QueryViewerTrendPeriod as QueryViewerTrendPeriod1, QueryViewerXAxisLabels as QueryViewerXAxisLabels1, TrendIcon } from "./common/basic-types";
 import { QueryViewerAttributesValuesForPivot, QueryViewerCalculatePivottableData, QueryViewerPageDataForPivot, QueryViewerPageDataForTable, QueryViewerPivotTableDataSync, QueryViewerServiceData, QueryViewerServiceMetaData, QueryViewerServiceResponse, QueryViewerServiceResponsePivotTable } from "@genexus/reporting-api/dist/types/service-result";
 import { QueryViewerDragAndDropData, QueryViewerFilterChangedData, QueryViewerItemClickData, QueryViewerItemExpandAndCollapseData } from "./global/types";
+import { QueryViewerChartType as QueryViewerChartType1, QueryViewerOrientation as QueryViewerOrientation1, QueryViewerPivotCollection, QueryViewerPivotParameters, QueryViewerPlotSeries as QueryViewerPlotSeries1, QueryViewerShowDataAs as QueryViewerShowDataAs1, QueryViewerShowDataLabelsIn as QueryViewerShowDataLabelsIn1, QueryViewerSliderRange, QueryViewerTotal as QueryViewerTotal1, QueryViewerTranslations as QueryViewerTranslations1, QueryViewerTrendPeriod as QueryViewerTrendPeriod1, QueryViewerXAxisLabels as QueryViewerXAxisLabels1, TrendIcon } from "./common/basic-types";
 import { Axis, ChartOptions, LegendOptions, PaneOptions, PlotOptions, SeriesLineOptions, SeriesOptionsType, SubtitleOptions, TitleOptions, TooltipOptions, XAxisOptions, YAxisOptions } from "highcharts";
 import { QueryViewerParameterChangedEvent } from "./components/query-viewer-parameter/query-viewer-parameter";
 export namespace Components {
@@ -100,7 +100,7 @@ export namespace Components {
         /**
           * This property specify the title of the item.
          */
-        "item": GxQueryItem1;
+        "item": GxQueryItem;
         "setFocus": () => Promise<void>;
     }
     interface GxQueryRender {
@@ -1433,19 +1433,19 @@ declare namespace LocalJSX {
         /**
           * This property specify the title of the item.
          */
-        "item"?: GxQueryItem1;
+        "item"?: GxQueryItem;
         /**
           * Trigger the action to delete the item
          */
-        "onDeleteItem"?: (event: GxQueryMenuItemCustomEvent<GxQueryItem1>) => void;
+        "onDeleteItem"?: (event: GxQueryMenuItemCustomEvent<any>) => void;
         /**
           * Trigger the action to delete the item
          */
-        "onRenameItem"?: (event: GxQueryMenuItemCustomEvent<GxQueryItem1>) => void;
+        "onRenameItem"?: (event: GxQueryMenuItemCustomEvent<any>) => void;
         /**
           * Trigger the action to select an item
          */
-        "onSelectItem"?: (event: GxQueryMenuItemCustomEvent<GxQueryItem1>) => void;
+        "onSelectItem"?: (event: GxQueryMenuItemCustomEvent<any>) => void;
     }
     interface GxQueryRender {
         /**

src/components/gx-query/query-chat/__test__/query-chat.spec.ts

@@ -0,0 +1,48 @@
+// query-chat.spec.ts
+
+import { SpecPage, newSpecPage } from "@stencil/core/testing";
+import { QueryChat } from "../query-chat";
+
+describe("query chat", () => {
+  const value = "Hello World";
+  let page: SpecPage;
+
+  beforeEach(async () => {
+    page = await newSpecPage({
+      components: [QueryChat],
+      html: `<gx-query-chat main-title="${value}"></gx-query-chat>`
+    });
+  });
+
+  it("builds", () => {
+    expect(new QueryChat()).toBeTruthy();
+  });
+
+  it("should render the title", async () => {
+    // Act
+    const chatTitle = page.body
+      .querySelector("gx-query-chat")
+      .shadowRoot.querySelector<HTMLDivElement>("[part=query-chat__title]");
+
+    // Assert
+    expect(chatTitle).toEqualHtml(`
+      <h1 part="query-chat__title">${value}</h1>
+    `);
+  });
+
+  it("should render controls", async () => {
+    // Act
+    const chatTitle = page.body
+      .querySelector("gx-query-chat")
+      .shadowRoot.querySelector<HTMLDivElement>("[part=query-chat__controls]");
+
+    // Assert
+    expect(chatTitle).toEqualHtml(`
+      <div part="query-chat__controls">
+        <gx-button accessible-name="unlocked" height="20px" image-position="below" main-image-src="./assets/undock.svg" role="button" tabindex="0" width="20px"></gx-button>
+        <gx-button accessible-name="minimize" height="20px" image-position="below" main-image-src="./assets/minimize.svg" role="button"
+        tabindex="0" width="20px"></gx-button>
+      </div>
+    `);
+  });
+});

src/components/gx-query/query-chat/query-chat.tsx

@@ -80,7 +80,7 @@ export class QueryChat implements GxComponent {
   checkQuerySelect(event: CustomEvent<QueryViewerBase>) {
     const lastQuery = this.queryItems.length - 1;
     const chatItemId = lastQuery > 0 ? this.queryItems[lastQuery].id : "";
-    if (chatItemId !== event.detail.Id) {
+    if (chatItemId !== event.detail.id) {
       this.resetChat(true);
     }
   }
@@ -131,7 +131,7 @@ export class QueryChat implements GxComponent {
       console.error(Errors);
     } else {
       this.queryItems = [...this.queryItems, ChatMessage];
-      if (Query?.Id) {
+      if (Query?.id) {
         this.gxAssistantResponse.emit(Query);
       }
     }

src/components/gx-query/query-menu-item/query-menu-item.stories.ts

@@ -1,5 +1,5 @@
+import { GxQueryItem } from "@genexus/reporting-api/dist/types/basic-types";
 import type { Meta, StoryObj } from "@storybook/web-components";
-import { GxQueryItem } from "../../../common/basic-types";
 
 const meta: Meta<{ item: GxQueryItem }> = {
   component: "gx-query-menu-item"
@@ -12,11 +12,11 @@ const modified = new Date();
 export const Primary: Story = {
   args: {
     item: {
-      Id: "123",
-      Name: "Query item 1",
-      Description: "string",
-      Expression: "string",
-      Modified: modified,
+      id: "123",
+      name: "Query item 1",
+      description: "string",
+      expression: "string",
+      modified: modified,
       differenceInDays: 1
     } as GxQueryItem
   }

src/components/gx-query/query-menu-item/query-menu-item.tsx

@@ -10,9 +10,9 @@ import {
   Watch,
   h
 } from "@stencil/core";
-import { GxQueryItem } from "../../../common/basic-types";
 import { Component as GxComponent } from "../../../common/interfaces";
 import { KEY_CODES } from "../../../common/reserverd-names";
+import { GxQueryItem } from "@genexus/reporting-api/dist/types/basic-types";
 
 export type QueryMenuElement = {
   id: number;
@@ -54,15 +54,15 @@ export class QueryMenuItem implements GxComponent {
   /**
    * Trigger the action to delete the item
    */
-  @Event() deleteItem: EventEmitter<GxQueryItem>;
+  @Event() deleteItem: EventEmitter;
   /**
    * Trigger the action to delete the item
    */
-  @Event() renameItem: EventEmitter<GxQueryItem>;
+  @Event() renameItem: EventEmitter;
   /**
    * Trigger the action to select an item
    */
-  @Event() selectItem: EventEmitter<GxQueryItem>;
+  @Event() selectItem: EventEmitter;
 
   @Watch("isActive")
   focusItem(newValue: boolean) {
@@ -90,8 +90,8 @@ export class QueryMenuItem implements GxComponent {
   }
 
   componentWillLoad() {
-    this.backupInputValue = this.item.Name;
-    this.editControlId = `edit-control-${this.item.Id}`;
+    this.backupInputValue = this.item.name;
+    this.editControlId = `edit-control-${this.item.id}`;
   }
 
   componentDidRender() {
@@ -168,12 +168,12 @@ export class QueryMenuItem implements GxComponent {
       template = (
         <gx-edit
           ref={el => (this.inputRef = el) && el.click()}
-          value={this.item.Name}
+          value={this.item.name}
           tabIndex={0}
         ></gx-edit>
       );
     } else {
-      template = <span>{this.item.Name}</span>;
+      template = <span>{this.item.name}</span>;
     }
 
     return (