@truedat/qx 7.13.9 → 7.14.0

package/src/components/dataViews/__tests__/DataViewSummary.spec.js

@@ -0,0 +1,820 @@
+import { render, waitForLoad } from "@truedat/test/render";
+import DataViewSummary from "../DataViewSummary";
+
+const messages = {
+  "dataViews.form.queryable.from": "FROM",
+  "dataViews.form.queryable.join": "JOIN",
+  "dataViews.form.queryable.where": "WHERE",
+  "dataViews.form.queryable.having": "HAVING",
+  "dataViews.form.queryable.group_by": "GROUP BY",
+  "dataViews.form.queryable.select": "SELECT",
+  "queryables.resource.selector.data_structure": "Data Structure",
+  "queryables.resource.selector.data_view": "Data View",
+  "queryables.resource.selector.reference_dataset": "Reference Dataset",
+  "queryables.group_by.form.group_fields": "Group Fields",
+  "queryables.group_by.form.aggregate_fields": "Aggregate Fields",
+  "dataViews.summary.field.unnamed": "(unnamed)",
+  "dataViews.summary.group_by.empty": "No group by fields",
+  "dataViews.summary.where.empty": "No conditions",
+  "joinType.inner": "Inner Join",
+  "joinType.left": "Left Join",
+  "joinType.right": "Right Join",
+  "joinType.full_outer": "Full Outer Join",
+};
+
+const renderOpts = { messages };
+
+const createDataView = (queryables = [], select = null) => ({
+  name: "Test Data View",
+  queryables,
+  select,
+});
+
+describe("<DataViewSummary />", () => {
+  it("returns null when data view has no valid structure", async () => {
+    const dataView = createDataView([]);
+    const rendered = render(
+      <DataViewSummary dataView={dataView} />,
+      renderOpts
+    );
+    await waitForLoad(rendered);
+    expect(rendered.container).toBeEmptyDOMElement();
+  });
+
+  it("returns null when data view is null", async () => {
+    const rendered = render(<DataViewSummary dataView={null} />, renderOpts);
+    await waitForLoad(rendered);
+    expect(rendered.container).toBeEmptyDOMElement();
+  });
+
+  it("matches snapshot for simple FROM only", async () => {
+    const dataView = createDataView([
+      {
+        id: 0,
+        type: "from",
+        alias: "users",
+        properties: {
+          resource: {
+            id: 100,
+            type: "data_structure",
+            embedded: {
+              name: "USERS_TABLE",
+            },
+          },
+        },
+      },
+    ]);
+
+    const rendered = render(
+      <DataViewSummary dataView={dataView} />,
+      renderOpts
+    );
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
+  });
+
+  it("matches snapshot for FROM with JOIN", async () => {
+    const dataView = createDataView([
+      {
+        id: 0,
+        type: "from",
+        alias: "users",
+        properties: {
+          resource: {
+            id: 100,
+            type: "data_structure",
+            embedded: {
+              name: "USERS_TABLE",
+            },
+          },
+        },
+      },
+      {
+        id: 1,
+        type: "join",
+        alias: "orders",
+        properties: {
+          type: "left",
+          resource: {
+            id: 101,
+            type: "data_structure",
+            embedded: {
+              name: "ORDERS_TABLE",
+            },
+          },
+          clauses: [
+            {
+              expressions: [
+                {
+                  shape: "function",
+                  value: {
+                    name: "eq",
+                    type: "boolean",
+                    args: {
+                      arg1: {
+                        shape: "field",
+                        value: {
+                          id: 1,
+                          name: "user_id",
+                          type: "number",
+                          parent_id: 0,
+                        },
+                      },
+                      arg2: {
+                        shape: "field",
+                        value: {
+                          id: 2,
+                          name: "user_id",
+                          type: "number",
+                          parent_id: 1,
+                        },
+                      },
+                    },
+                  },
+                },
+              ],
+            },
+          ],
+        },
+      },
+    ]);
+
+    const rendered = render(
+      <DataViewSummary dataView={dataView} />,
+      renderOpts
+    );
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
+  });
+
+  it("matches snapshot for FROM with WHERE clause", async () => {
+    const dataView = createDataView([
+      {
+        id: 0,
+        type: "from",
+        alias: "users",
+        properties: {
+          resource: {
+            id: 100,
+            type: "data_structure",
+            embedded: {
+              name: "USERS_TABLE",
+            },
+          },
+        },
+      },
+      {
+        id: 1,
+        type: "where",
+        properties: {
+          clauses: [
+            {
+              expressions: [
+                {
+                  shape: "function",
+                  value: {
+                    name: "gt",
+                    type: "boolean",
+                    args: {
+                      arg1: {
+                        shape: "field",
+                        value: {
+                          id: 1,
+                          name: "age",
+                          type: "number",
+                          parent_id: 0,
+                        },
+                      },
+                      arg2: {
+                        shape: "constant",
+                        value: {
+                          value: 18,
+                          type: "number",
+                        },
+                      },
+                    },
+                  },
+                },
+              ],
+            },
+          ],
+        },
+      },
+    ]);
+
+    const rendered = render(
+      <DataViewSummary dataView={dataView} />,
+      renderOpts
+    );
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
+  });
+
+  it("matches snapshot for FROM with GROUP BY", async () => {
+    const dataView = createDataView([
+      {
+        id: 0,
+        type: "from",
+        alias: "sales",
+        properties: {
+          resource: {
+            id: 100,
+            type: "data_structure",
+            embedded: {
+              name: "SALES_TABLE",
+            },
+          },
+        },
+      },
+      {
+        id: 1,
+        type: "group_by",
+        alias: "",
+        properties: {
+          group_fields: [
+            {
+              id: 0,
+              alias: "category",
+              expression: {
+                shape: "field",
+                value: {
+                  id: 1,
+                  name: "category",
+                  type: "string",
+                  parent_id: 0,
+                },
+              },
+            },
+          ],
+          aggregate_fields: [
+            {
+              id: 1,
+              alias: "total_sales",
+              expression: {
+                shape: "function",
+                value: {
+                  name: "sum",
+                  type: "number",
+                  args: {
+                    arg1: {
+                      shape: "field",
+                      value: {
+                        id: 2,
+                        name: "amount",
+                        type: "number",
+                        parent_id: 0,
+                      },
+                    },
+                  },
+                },
+              },
+            },
+          ],
+        },
+      },
+    ]);
+
+    const rendered = render(
+      <DataViewSummary dataView={dataView} />,
+      renderOpts
+    );
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
+  });
+
+  it("matches snapshot for complete data view with all queryable types", async () => {
+    const dataView = createDataView(
+      [
+        {
+          id: 0,
+          type: "from",
+          alias: "users",
+          properties: {
+            resource: {
+              id: 100,
+              type: "data_structure",
+              embedded: {
+                name: "USERS_TABLE",
+              },
+            },
+          },
+        },
+        {
+          id: 1,
+          type: "join",
+          alias: "orders",
+          properties: {
+            type: "inner",
+            resource: {
+              id: 101,
+              type: "data_structure",
+              embedded: {
+                name: "ORDERS_TABLE",
+              },
+            },
+            clauses: [
+              {
+                expressions: [
+                  {
+                    shape: "function",
+                    value: {
+                      name: "eq",
+                      type: "boolean",
+                      args: {
+                        arg1: {
+                          shape: "field",
+                          value: {
+                            id: 1,
+                            name: "user_id",
+                            type: "number",
+                            parent_id: 0,
+                          },
+                        },
+                        arg2: {
+                          shape: "field",
+                          value: {
+                            id: 2,
+                            name: "user_id",
+                            type: "number",
+                            parent_id: 1,
+                          },
+                        },
+                      },
+                    },
+                  },
+                ],
+              },
+            ],
+          },
+        },
+        {
+          id: 2,
+          type: "where",
+          properties: {
+            clauses: [
+              {
+                expressions: [
+                  {
+                    shape: "function",
+                    value: {
+                      name: "gt",
+                      type: "boolean",
+                      args: {
+                        arg1: {
+                          shape: "field",
+                          value: {
+                            id: 3,
+                            name: "total",
+                            type: "number",
+                            parent_id: 1,
+                          },
+                        },
+                        arg2: {
+                          shape: "constant",
+                          value: {
+                            value: 100,
+                            type: "number",
+                          },
+                        },
+                      },
+                    },
+                  },
+                ],
+              },
+            ],
+          },
+        },
+        {
+          id: 3,
+          type: "group_by",
+          alias: "",
+          properties: {
+            group_fields: [
+              {
+                id: 0,
+                alias: "user_name",
+                expression: {
+                  shape: "field",
+                  value: {
+                    id: 4,
+                    name: "name",
+                    type: "string",
+                    parent_id: 0,
+                  },
+                },
+              },
+            ],
+            aggregate_fields: [
+              {
+                id: 1,
+                alias: "order_count",
+                expression: {
+                  shape: "function",
+                  value: {
+                    name: "count",
+                    type: "number",
+                  },
+                },
+              },
+            ],
+          },
+        },
+      ],
+      {
+        type: "select",
+        properties: {
+          fields: [
+            {
+              id: 0,
+              alias: "user_name",
+              expression: {
+                shape: "field",
+                value: {
+                  id: 4,
+                  name: "name",
+                  type: "string",
+                  parent_id: 0,
+                },
+              },
+            },
+            {
+              id: 1,
+              alias: "total_orders",
+              expression: {
+                shape: "field",
+                value: {
+                  id: 1,
+                  name: "order_count",
+                  type: "number",
+                  parent_id: 3,
+                },
+              },
+            },
+          ],
+        },
+      }
+    );
+
+    const rendered = render(
+      <DataViewSummary dataView={dataView} />,
+      renderOpts
+    );
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
+  });
+
+  it("matches snapshot with HAVING clause (where after group_by)", async () => {
+    const dataView = createDataView([
+      {
+        id: 0,
+        type: "from",
+        alias: "sales",
+        properties: {
+          resource: {
+            id: 100,
+            type: "data_structure",
+            embedded: {
+              name: "SALES_TABLE",
+            },
+          },
+        },
+      },
+      {
+        id: 1,
+        type: "group_by",
+        alias: "",
+        properties: {
+          group_fields: [
+            {
+              id: 0,
+              alias: "category",
+              expression: {
+                shape: "field",
+                value: {
+                  id: 1,
+                  name: "category",
+                  type: "string",
+                  parent_id: 0,
+                },
+              },
+            },
+          ],
+          aggregate_fields: [
+            {
+              id: 1,
+              alias: "total",
+              expression: {
+                shape: "function",
+                value: {
+                  name: "sum",
+                  type: "number",
+                  args: {
+                    arg1: {
+                      shape: "field",
+                      value: {
+                        id: 2,
+                        name: "amount",
+                        type: "number",
+                        parent_id: 0,
+                      },
+                    },
+                  },
+                },
+              },
+            },
+          ],
+        },
+      },
+      {
+        id: 2,
+        type: "where",
+        properties: {
+          clauses: [
+            {
+              expressions: [
+                {
+                  shape: "function",
+                  value: {
+                    name: "gt",
+                    type: "boolean",
+                    args: {
+                      arg1: {
+                        shape: "field",
+                        value: {
+                          id: 3,
+                          name: "total",
+                          type: "number",
+                          parent_id: 1,
+                        },
+                      },
+                      arg2: {
+                        shape: "constant",
+                        value: {
+                          value: 1000,
+                          type: "number",
+                        },
+                      },
+                    },
+                  },
+                },
+              ],
+            },
+          ],
+        },
+      },
+    ]);
+
+    const rendered = render(
+      <DataViewSummary dataView={dataView} />,
+      renderOpts
+    );
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
+  });
+
+  it("matches snapshot for data view without alias", async () => {
+    const dataView = createDataView([
+      {
+        id: 0,
+        type: "from",
+        alias: "",
+        properties: {
+          resource: {
+            id: 100,
+            type: "data_structure",
+            embedded: {
+              name: "USERS_TABLE",
+            },
+          },
+        },
+      },
+    ]);
+
+    const rendered = render(
+      <DataViewSummary dataView={dataView} />,
+      renderOpts
+    );
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
+  });
+
+  it("matches snapshot with reference dataset resource", async () => {
+    const dataView = createDataView([
+      {
+        id: 0,
+        type: "from",
+        alias: "countries",
+        properties: {
+          resource: {
+            id: 200,
+            type: "reference_dataset",
+            embedded: {
+              name: "COUNTRIES",
+            },
+          },
+        },
+      },
+    ]);
+
+    const rendered = render(
+      <DataViewSummary dataView={dataView} />,
+      renderOpts
+    );
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
+  });
+
+  it("matches snapshot with data_view resource", async () => {
+    const dataView = createDataView([
+      {
+        id: 0,
+        type: "from",
+        alias: "base_view",
+        properties: {
+          resource: {
+            id: 300,
+            type: "data_view",
+            embedded: {
+              name: "BASE_DATA_VIEW",
+            },
+          },
+        },
+      },
+    ]);
+
+    const rendered = render(
+      <DataViewSummary dataView={dataView} />,
+      renderOpts
+    );
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
+  });
+
+  it("matches snapshot with select in dataView.select", async () => {
+    const dataView = createDataView(
+      [
+        {
+          id: 0,
+          type: "from",
+          alias: "users",
+          properties: {
+            resource: {
+              id: 100,
+              type: "data_structure",
+              embedded: {
+                name: "USERS_TABLE",
+              },
+            },
+          },
+        },
+      ],
+      {
+        type: "select",
+        properties: {
+          fields: [
+            {
+              id: 0,
+              alias: "user_name",
+              expression: {
+                shape: "field",
+                value: {
+                  id: 1,
+                  name: "name",
+                  type: "string",
+                  parent_id: 0,
+                },
+              },
+            },
+            {
+              id: 1,
+              alias: "user_email",
+              expression: {
+                shape: "field",
+                value: {
+                  id: 2,
+                  name: "email",
+                  type: "string",
+                  parent_id: 0,
+                },
+              },
+            },
+          ],
+        },
+      }
+    );
+
+    const rendered = render(
+      <DataViewSummary dataView={dataView} />,
+      renderOpts
+    );
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
+  });
+
+  it("matches snapshot with multiple joins", async () => {
+    const dataView = createDataView([
+      {
+        id: 0,
+        type: "from",
+        alias: "users",
+        properties: {
+          resource: {
+            id: 100,
+            type: "data_structure",
+            embedded: {
+              name: "USERS_TABLE",
+            },
+          },
+        },
+      },
+      {
+        id: 1,
+        type: "join",
+        alias: "orders",
+        properties: {
+          type: "inner",
+          resource: {
+            id: 101,
+            type: "data_structure",
+            embedded: {
+              name: "ORDERS_TABLE",
+            },
+          },
+          clauses: [],
+        },
+      },
+      {
+        id: 2,
+        type: "join",
+        alias: "products",
+        properties: {
+          type: "left",
+          resource: {
+            id: 102,
+            type: "data_structure",
+            embedded: {
+              name: "PRODUCTS_TABLE",
+            },
+          },
+          clauses: [],
+        },
+      },
+    ]);
+
+    const rendered = render(
+      <DataViewSummary dataView={dataView} />,
+      renderOpts
+    );
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
+  });
+
+  it("matches snapshot for fields without alias", async () => {
+    const dataView = createDataView([
+      {
+        id: 0,
+        type: "from",
+        alias: "users",
+        properties: {
+          resource: {
+            id: 100,
+            type: "data_structure",
+            embedded: {
+              name: "USERS_TABLE",
+            },
+          },
+        },
+      },
+      {
+        id: 1,
+        type: "group_by",
+        alias: "",
+        properties: {
+          group_fields: [
+            {
+              id: 0,
+              alias: "", // Empty alias
+              expression: {
+                shape: "field",
+                value: {
+                  id: 1,
+                  name: "category",
+                  type: "string",
+                  parent_id: 0,
+                },
+              },
+            },
+          ],
+          aggregate_fields: [],
+        },
+      },
+    ]);
+
+    const rendered = render(
+      <DataViewSummary dataView={dataView} />,
+      renderOpts
+    );
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
+  });
+});