@truedat/qx 7.5.7 → 7.5.10

package/src/components/dataViews/__tests__/__snapshots__/Queryables.spec.js.snap

@@ -26,7 +26,7 @@ exports[`<Queryables /> matches the latest snapshot with from queryable 1`] = `
                 <div
                   class="ui blue ribbon label"
                 >
-                  from
+                  dataViews.form.queryable.from
                 </div>
               </div>
               <div
@@ -36,14 +36,14 @@ exports[`<Queryables /> matches the latest snapshot with from queryable 1`] = `
                   class="field"
                 >
                   <label>
-                    alias
+                    dataViews.form.queryable.alias
                   </label>
                   <div
                     class="ui input"
                   >
                     <input
                       autocomplete="off"
-                      placeholder="alias"
+                      placeholder="dataViews.form.queryable.alias"
                       type="text"
                       value=""
                     />
@@ -57,7 +57,7 @@ exports[`<Queryables /> matches the latest snapshot with from queryable 1`] = `
                   class="required field"
                 >
                   <label>
-                    resource
+                    queryables.form.resource
                   </label>
                   <div
                     aria-expanded="false"
@@ -71,7 +71,7 @@ exports[`<Queryables /> matches the latest snapshot with from queryable 1`] = `
                       class="divider default text"
                       role="alert"
                     >
-                      type
+                      queryables.resource.type
                     </div>
                     <i
                       aria-hidden="true"
@@ -90,7 +90,7 @@ exports[`<Queryables /> matches the latest snapshot with from queryable 1`] = `
                         <span
                           class="text"
                         >
-                          data_structure
+                          queryables.resource.type.data_structure
                         </span>
                       </div>
                     </div>
@@ -112,22 +112,22 @@ exports[`<Queryables /> matches the latest snapshot with from queryable 1`] = `
         <button
           class="ui button"
         >
-          join
+          dataViews.form.queryable.join
         </button>
         <button
           class="ui button"
         >
-          where
+          dataViews.form.queryable.where
         </button>
         <button
           class="ui button"
         >
-          select
+          dataViews.form.queryable.select
         </button>
         <button
           class="ui button"
         >
-          group_by
+          dataViews.form.queryable.group_by
         </button>
       </div>
     </div>
@@ -161,7 +161,7 @@ exports[`<Queryables /> matches the latest snapshot with from queryable 2`] = `
                 <div
                   class="ui blue ribbon label"
                 >
-                  group_by
+                  dataViews.form.queryable.group_by
                 </div>
               </div>
               <div
@@ -171,14 +171,14 @@ exports[`<Queryables /> matches the latest snapshot with from queryable 2`] = `
                   class="field"
                 >
                   <label>
-                    alias
+                    dataViews.form.queryable.alias
                   </label>
                   <div
                     class="ui input"
                   >
                     <input
                       autocomplete="off"
-                      placeholder="alias"
+                      placeholder="dataViews.form.queryable.alias"
                       type="text"
                       value=""
                     />
@@ -192,7 +192,7 @@ exports[`<Queryables /> matches the latest snapshot with from queryable 2`] = `
                   class="required field"
                 >
                   <label>
-                    group_fields
+                    queryables.group_by.form.group_fields
                   </label>
                   <div
                     class="ui list"
@@ -205,7 +205,7 @@ exports[`<Queryables /> matches the latest snapshot with from queryable 2`] = `
                       <button
                         class="ui button"
                       >
-                        add_group_field
+                        queryables.group_by.form.add_group_field
                       </button>
                     </div>
                   </div>
@@ -214,7 +214,7 @@ exports[`<Queryables /> matches the latest snapshot with from queryable 2`] = `
                   class="field"
                 >
                   <label>
-                    aggregate_fields
+                    queryables.group_by.form.aggregate_fields
                   </label>
                   <div
                     class="ui list"
@@ -227,7 +227,7 @@ exports[`<Queryables /> matches the latest snapshot with from queryable 2`] = `
                       <button
                         class="ui button"
                       >
-                        add_aggregate_field
+                        queryables.group_by.form.add_aggregate_field
                       </button>
                     </div>
                   </div>
@@ -248,22 +248,22 @@ exports[`<Queryables /> matches the latest snapshot with from queryable 2`] = `
         <button
           class="ui button"
         >
-          join
+          dataViews.form.queryable.join
         </button>
         <button
           class="ui button"
         >
-          where
+          dataViews.form.queryable.where
         </button>
         <button
           class="ui button"
         >
-          select
+          dataViews.form.queryable.select
         </button>
         <button
           class="ui button"
         >
-          group_by
+          dataViews.form.queryable.group_by
         </button>
       </div>
     </div>
@@ -297,7 +297,7 @@ exports[`<Queryables /> matches the latest snapshot with join queryable 1`] = `
                 <div
                   class="ui blue ribbon label"
                 >
-                  join
+                  dataViews.form.queryable.join
                 </div>
               </div>
               <div
@@ -307,14 +307,14 @@ exports[`<Queryables /> matches the latest snapshot with join queryable 1`] = `
                   class="field"
                 >
                   <label>
-                    alias
+                    dataViews.form.queryable.alias
                   </label>
                   <div
                     class="ui input"
                   >
                     <input
                       autocomplete="off"
-                      placeholder="alias"
+                      placeholder="dataViews.form.queryable.alias"
                       type="text"
                       value=""
                     />
@@ -328,7 +328,7 @@ exports[`<Queryables /> matches the latest snapshot with join queryable 1`] = `
                   class="required field"
                 >
                   <label>
-                    resource
+                    queryables.form.resource
                   </label>
                   <div
                     aria-expanded="false"
@@ -342,7 +342,7 @@ exports[`<Queryables /> matches the latest snapshot with join queryable 1`] = `
                       class="divider default text"
                       role="alert"
                     >
-                      type
+                      queryables.resource.type
                     </div>
                     <i
                       aria-hidden="true"
@@ -361,7 +361,7 @@ exports[`<Queryables /> matches the latest snapshot with join queryable 1`] = `
                         <span
                           class="text"
                         >
-                          data_structure
+                          queryables.resource.type.data_structure
                         </span>
                       </div>
                     </div>
@@ -374,12 +374,12 @@ exports[`<Queryables /> matches the latest snapshot with join queryable 1`] = `
                     class="field"
                   >
                     <label>
-                      type
+                      queryables.form.join.type
                     </label>
                     <div
                       aria-expanded="false"
                       class="ui selection dropdown select-field-dropdown"
-                      label="alias"
+                      label="dataViews.form.queryable.alias"
                       role="listbox"
                       tabindex="0"
                     >
@@ -403,7 +403,7 @@ exports[`<Queryables /> matches the latest snapshot with join queryable 1`] = `
                             class="circle circle-right"
                           />
                         </div>
-                        inner
+                        joinType.inner
                       </div>
                       <i
                         aria-hidden="true"
@@ -436,7 +436,7 @@ exports[`<Queryables /> matches the latest snapshot with join queryable 1`] = `
                           <span
                             class="text"
                           >
-                            inner
+                            joinType.inner
                           </span>
                         </div>
                         <div
@@ -463,7 +463,7 @@ exports[`<Queryables /> matches the latest snapshot with join queryable 1`] = `
                           <span
                             class="text"
                           >
-                            left
+                            joinType.left
                           </span>
                         </div>
                         <div
@@ -490,7 +490,7 @@ exports[`<Queryables /> matches the latest snapshot with join queryable 1`] = `
                           <span
                             class="text"
                           >
-                            right
+                            joinType.right
                           </span>
                         </div>
                         <div
@@ -517,7 +517,7 @@ exports[`<Queryables /> matches the latest snapshot with join queryable 1`] = `
                           <span
                             class="text"
                           >
-                            full_outer
+                            joinType.full_outer
                           </span>
                         </div>
                       </div>
@@ -531,7 +531,7 @@ exports[`<Queryables /> matches the latest snapshot with join queryable 1`] = `
                     class="field"
                   >
                     <label>
-                      clause
+                      expression.form.clause
                     </label>
                     <div
                       class="ui horizontal divider"
@@ -539,7 +539,7 @@ exports[`<Queryables /> matches the latest snapshot with join queryable 1`] = `
                       <button
                         class="ui mini button"
                       >
-                        addGroup
+                        expression.clause.action.addGroup
                       </button>
                     </div>
                   </div>
@@ -560,22 +560,22 @@ exports[`<Queryables /> matches the latest snapshot with join queryable 1`] = `
         <button
           class="ui button"
         >
-          join
+          dataViews.form.queryable.join
         </button>
         <button
           class="ui button"
         >
-          where
+          dataViews.form.queryable.where
         </button>
         <button
           class="ui button"
         >
-          select
+          dataViews.form.queryable.select
         </button>
         <button
           class="ui button"
         >
-          group_by
+          dataViews.form.queryable.group_by
         </button>
       </div>
     </div>
@@ -609,7 +609,7 @@ exports[`<Queryables /> matches the latest snapshot with select queryable 1`] =
                 <div
                   class="ui blue ribbon label"
                 >
-                  select
+                  dataViews.form.queryable.select
                 </div>
               </div>
               <div
@@ -619,14 +619,14 @@ exports[`<Queryables /> matches the latest snapshot with select queryable 1`] =
                   class="field"
                 >
                   <label>
-                    alias
+                    dataViews.form.queryable.alias
                   </label>
                   <div
                     class="ui input"
                   >
                     <input
                       autocomplete="off"
-                      placeholder="alias"
+                      placeholder="dataViews.form.queryable.alias"
                       type="text"
                       value=""
                     />
@@ -647,14 +647,14 @@ exports[`<Queryables /> matches the latest snapshot with select queryable 1`] =
                     <button
                       class="ui button"
                     >
-                      add_select_field
+                      queryables.select.form.add_select_field
                     </button>
                     <button
                       class="ui disabled button"
                       disabled=""
                       tabindex="-1"
                     >
-                      add_all_select_fields
+                      queryables.select.form.add_all_select_fields
                     </button>
                   </div>
                 </div>
@@ -674,22 +674,22 @@ exports[`<Queryables /> matches the latest snapshot with select queryable 1`] =
         <button
           class="ui button"
         >
-          join
+          dataViews.form.queryable.join
         </button>
         <button
           class="ui button"
         >
-          where
+          dataViews.form.queryable.where
         </button>
         <button
           class="ui button"
         >
-          select
+          dataViews.form.queryable.select
         </button>
         <button
           class="ui button"
         >
-          group_by
+          dataViews.form.queryable.group_by
         </button>
       </div>
     </div>
@@ -723,7 +723,7 @@ exports[`<Queryables /> test delete queryable 1`] = `
                 <div
                   class="ui blue ribbon label"
                 >
-                  from
+                  dataViews.form.queryable.from
                 </div>
               </div>
               <div
@@ -733,14 +733,14 @@ exports[`<Queryables /> test delete queryable 1`] = `
                   class="field"
                 >
                   <label>
-                    alias
+                    dataViews.form.queryable.alias
                   </label>
                   <div
                     class="ui input"
                   >
                     <input
                       autocomplete="off"
-                      placeholder="alias"
+                      placeholder="dataViews.form.queryable.alias"
                       type="text"
                       value=""
                     />
@@ -754,7 +754,7 @@ exports[`<Queryables /> test delete queryable 1`] = `
                   class="required field"
                 >
                   <label>
-                    resource
+                    queryables.form.resource
                   </label>
                   <div
                     aria-expanded="false"
@@ -768,7 +768,7 @@ exports[`<Queryables /> test delete queryable 1`] = `
                       class="divider default text"
                       role="alert"
                     >
-                      type
+                      queryables.resource.type
                     </div>
                     <i
                       aria-hidden="true"
@@ -787,7 +787,7 @@ exports[`<Queryables /> test delete queryable 1`] = `
                         <span
                           class="text"
                         >
-                          data_structure
+                          queryables.resource.type.data_structure
                         </span>
                       </div>
                     </div>
@@ -809,22 +809,22 @@ exports[`<Queryables /> test delete queryable 1`] = `
         <button
           class="ui button"
         >
-          join
+          dataViews.form.queryable.join
         </button>
         <button
           class="ui button"
         >
-          where
+          dataViews.form.queryable.where
         </button>
         <button
           class="ui button"
         >
-          select
+          dataViews.form.queryable.select
         </button>
         <button
           class="ui button"
         >
-          group_by
+          dataViews.form.queryable.group_by
         </button>
       </div>
     </div>

package/src/components/dataViews/queryableProperties/From.js

@@ -1,15 +1,15 @@
-import React, { useContext } from "react";
+import { use } from "react";
 
 import ResourceSelector from "@truedat/qx/components/common/ResourceSelector";
 import QxContext from "@truedat/qx/components/QxContext";
 
 export default function From() {
-  const context = useContext(QxContext);
+  const context = use(QxContext);
   const { field } = context;
 
   return (
-    <QxContext.Provider value={{ ...context, field: `${field}.resource` }}>
+    <QxContext value={{ ...context, field: `${field}.resource` }}>
       <ResourceSelector required />
-    </QxContext.Provider>
+    </QxContext>
   );
 }

package/src/components/dataViews/queryableProperties/GroupBy.js

@@ -1,5 +1,5 @@
 import _ from "lodash/fp";
-import React, { useContext } from "react";
+import { use } from "react";
 import { useIntl } from "react-intl";
 import { useFieldArray, useFormState } from "react-hook-form";
 import { Button, Form, List, Popup } from "semantic-ui-react";
@@ -9,7 +9,7 @@ import SelectField, { newSelectField } from "./SelectField";
 
 export default function GroupBy() {
   const { formatMessage } = useIntl();
-  const context = useContext(QxContext);
+  const context = use(QxContext);
   const { field } = context;
   const {
     fields: groupFields,
@@ -58,7 +58,7 @@ export default function GroupBy() {
         <List>
           {groupFields.map((selectField, index) => (
             <List.Item key={selectField.id}>
-              <QxContext.Provider
+              <QxContext
                 value={{
                   ...context,
                   field: `${field}.group_fields[${index}]`,
@@ -66,7 +66,7 @@ export default function GroupBy() {
                 }}
               >
                 <SelectField onDelete={() => removeGroupField(index)} />
-              </QxContext.Provider>
+              </QxContext>
             </List.Item>
           ))}
           <List.Item>
@@ -91,7 +91,7 @@ export default function GroupBy() {
         <List>
           {aggregateFields.map((selectField, index) => (
             <List.Item key={selectField.id}>
-              <QxContext.Provider
+              <QxContext
                 value={{
                   ...context,
                   field: `${field}.aggregate_fields[${index}]`,
@@ -100,7 +100,7 @@ export default function GroupBy() {
                 }}
               >
                 <SelectField onDelete={() => removeAggregateField(index)} />
-              </QxContext.Provider>
+              </QxContext>
             </List.Item>
           ))}
           <List.Item>

package/src/components/dataViews/queryableProperties/Join.js

@@ -1,5 +1,5 @@
 import _ from "lodash/fp";
-import React, { useContext } from "react";
+import { use } from "react";
 import { useIntl } from "react-intl";
 import { Clauses } from "@truedat/qx/components/common/expressions";
 import { Controller, useFormContext } from "react-hook-form";
@@ -10,7 +10,7 @@ import JoinTypeIcon from "./JoinTypeIcon";
 
 export default function Join() {
   const { formatMessage } = useIntl();
-  const context = useContext(QxContext);
+  const context = use(QxContext);
   const { control } = useFormContext();
   const { field } = context;
 
@@ -25,9 +25,9 @@ export default function Join() {
 
   return (
     <>
-      <QxContext.Provider value={{ ...context, field: `${field}.resource` }}>
+      <QxContext value={{ ...context, field: `${field}.resource` }}>
         <ResourceSelector required />
-      </QxContext.Provider>
+      </QxContext>
       <div className="vertical-space">
         <Controller
           control={control}
@@ -53,9 +53,9 @@ export default function Join() {
         />
       </div>
       <div className="vertical-space">
-        <QxContext.Provider value={{ ...context, field: `${field}.clauses` }}>
+        <QxContext value={{ ...context, field: `${field}.clauses` }}>
           <Clauses />
-        </QxContext.Provider>
+        </QxContext>
       </div>
     </>
   );

package/src/components/dataViews/queryableProperties/JoinTypeIcon.js

@@ -1,4 +1,3 @@
-import React from "react";
 import PropTypes from "prop-types";
 
 export const JoinTypeIcon = ({ type }) => {
@@ -7,36 +6,36 @@ export const JoinTypeIcon = ({ type }) => {
       return (
         <div className="join_type">
           <div className="circle circle-left">
-            <div className="circle circle-center fill"></div>
+            <div className="circle circle-center fill" />
           </div>
-          <div className="circle circle-right"></div>
+          <div className="circle circle-right" />
         </div>
       );
     case "left":
       return (
         <div className="join_type">
           <div className="circle circle-left fill">
-            <div className="circle circle-center fill"></div>
+            <div className="circle circle-center fill" />
           </div>
-          <div className="circle circle-right"></div>
+          <div className="circle circle-right" />
         </div>
       );
     case "right":
       return (
         <div className="join_type">
           <div className="circle circle-left">
-            <div className="circle circle-center fill"></div>
+            <div className="circle circle-center fill" />
           </div>
-          <div className="circle circle-right fill"></div>
+          <div className="circle circle-right fill" />
         </div>
       );
     case "full_outer":
       return (
         <div className="join_type">
           <div className="circle circle-left fill">
-            <div className="circle circle-center fill"></div>
+            <div className="circle circle-center fill" />
           </div>
-          <div className="circle circle-right fill"></div>
+          <div className="circle circle-right fill" />
         </div>
       );
   }

package/src/components/dataViews/queryableProperties/Select.js

@@ -1,5 +1,5 @@
 import _ from "lodash/fp";
-import React, { useContext } from "react";
+import { use } from "react";
 import { useIntl } from "react-intl";
 import { useFieldArray, useFormState } from "react-hook-form";
 import { Button, List, Popup } from "semantic-ui-react";
@@ -8,7 +8,7 @@ import SelectField, { newSelectField } from "./SelectField";
 
 export default function Select() {
   const { formatMessage } = useIntl();
-  const context = useContext(QxContext);
+  const context = use(QxContext);
   const { field, fields: ctxFields } = context;
   const { fields, append, remove } = useFieldArray({
     name: `${field}.fields`,
@@ -39,11 +39,11 @@ export default function Select() {
     <List>
       {fields.map((selectField, index) => (
         <List.Item key={selectField.key}>
-          <QxContext.Provider
+          <QxContext
             value={{ ...context, field: `${field}.fields[${index}]`, index }}
           >
             <SelectField onDelete={() => remove(index)} />
-          </QxContext.Provider>
+          </QxContext>
         </List.Item>
       ))}
       <List.Item>
@@ -59,7 +59,6 @@ export default function Select() {
         ) : (
           addFieldButton
         )}
-
         {_.size(fields) == 0 ? (
           <Button
             onClick={() => append(allFields)}