@teselagen/ui 0.8.4 → 0.8.6-beta.10

package/src/DataTable/utils/queryParams.js

@@ -1,21 +1,13 @@
 import queryString from "qs";
+import { uniqBy, clone, camelCase } from "lodash-es";
 import {
-  uniqBy,
-  uniq,
-  get,
-  clone,
-  camelCase,
-  startsWith,
-  endsWith,
-  last,
-  orderBy,
-  take,
-  drop,
-  isEmpty,
-  isInteger
-} from "lodash-es";
-import dayjs from "dayjs";
-import { flatMap } from "lodash-es";
+  getFieldsMappedByCCDisplayName,
+  tableQueryParamsToHasuraClauses
+} from "./tableQueryParamsToHasuraClauses";
+import { filterLocalEntitiesToHasura } from "./filterLocalEntitiesToHasura";
+import {
+  initializeHasuraWhereAndFilter
+} from "./initializeHasuraWhereAndFilter";
 
 const defaultPageSizes = [5, 10, 15, 25, 50, 100, 200, 400];
 
@@ -64,447 +56,6 @@ function safeParse(val) {
   }
 }
 
-/**
- *
- * @param {object} field
- * @returns the camelCase display name of the field, to be used for filters, sorting, etc
- */
-export function getCCDisplayName(field) {
-  return camelCase(
-    typeof field.displayName === "string" ? field.displayName : field.path
-  );
-}
-
-/**
- * Takes a schema and returns an object with the fields mapped by their camelCased display name.
- * If the displayName is not set or is a jsx element, the path is used instead.
- * The same conversion must be done when using the result of this method
- */
-function getFieldsMappedByCCDisplayName(schema) {
-  return schema.fields.reduce((acc, field) => {
-    const ccDisplayName = getCCDisplayName(field);
-    acc[ccDisplayName] = field;
-    return acc;
-  }, {});
-}
-
-function orderEntitiesLocal(orderArray, entities, schema, ownProps) {
-  if (orderArray?.length) {
-    const orderFuncs = [];
-    const ascOrDescArray = [];
-    orderArray.forEach(order => {
-      const ccDisplayName = order.replace(/^-/gi, ""); // "-updatedAt" => "updatedAt"
-      const ccFields = getFieldsMappedByCCDisplayName(schema);
-      const field = ccFields[ccDisplayName];
-      if (!field) {
-        throw new Error(
-          "Ruh roh, there should have been a column to sort on for " +
-            order +
-            " but none was found in " +
-            schema.fields
-        );
-      }
-      const { path, getValueToFilterOn, sortFn } = field;
-      if (field.type === "timestamp") {
-        //with the timestamp logic below, make sure empty dates always end up on the bottom of the stack
-        ascOrDescArray.push("desc");
-      }
-      ascOrDescArray.push(ccDisplayName === order ? "asc" : "desc");
-      //push the actual sorting function
-      if (field.type === "timestamp") {
-        //with the timestamp logic above, make sure empty dates always end up on the bottom of the stack
-        orderFuncs.push(r => {
-          const val = get(r, path);
-          return !!val;
-        });
-      }
-      if (path && endsWith(path.toLowerCase(), "id")) {
-        orderFuncs.push(o => {
-          return parseInt(get(o, path), 10);
-        });
-      } else if (sortFn) {
-        const toOrder = Array.isArray(sortFn) ? sortFn : [sortFn];
-        orderFuncs.push(...toOrder);
-      } else if (getValueToFilterOn) {
-        orderFuncs.push(o => {
-          return getValueToFilterOn(o, ownProps);
-        });
-      } else {
-        orderFuncs.push(r => {
-          const val = get(r, path);
-          return val && val.toLowerCase ? val.toLowerCase() : val;
-        });
-      }
-    });
-    entities = orderBy(entities, orderFuncs, ascOrDescArray);
-  }
-  return entities;
-}
-
-function getAndAndOrFilters(allFilters) {
-  const orFilters = [];
-  const andFilters = [];
-  const otherOrFilters = [];
-
-  allFilters.forEach(filter => {
-    if (
-      filter.isOrFilter &&
-      typeof filter.filterValue === "string" &&
-      filter.filterValue.includes(",")
-    ) {
-      // handle comma separated filters by adding more orWheres
-      const allFilterValues = filter.filterValue.split(",");
-      allFilterValues.forEach((filterValue, i) => {
-        filterValue = filterValue.trim();
-        if (!filterValue) return;
-        const newFilter = {
-          ...filter,
-          filterValue
-        };
-        if (i === 0) {
-          orFilters.push(newFilter);
-        } else {
-          const iMinus = i - 1;
-          if (!otherOrFilters[iMinus]) otherOrFilters[iMinus] = [];
-          otherOrFilters[iMinus].push(newFilter);
-        }
-      });
-    } else if (filter.isOrFilter) {
-      orFilters.push(filter);
-    } else {
-      andFilters.push(filter);
-    }
-  });
-  return {
-    orFilters,
-    andFilters,
-    otherOrFilters
-  };
-}
-
-function filterEntitiesLocal(
-  filters = [],
-  searchTerm,
-  entities,
-  schema,
-  ownProps
-) {
-  const allFilters = getAllFilters(filters, searchTerm, schema);
-
-  if (allFilters.length) {
-    const ccFields = getFieldsMappedByCCDisplayName(schema);
-    const { andFilters, orFilters, otherOrFilters } =
-      getAndAndOrFilters(allFilters);
-    //filter ands first
-    andFilters.forEach(filter => {
-      entities = getEntitiesForGivenFilter(
-        entities,
-        filter,
-        ccFields,
-        ownProps
-      );
-    });
-    //then filter ors
-    if (orFilters.length) {
-      let orEntities = [];
-      orFilters.concat(...otherOrFilters).forEach(filter => {
-        orEntities = orEntities.concat(
-          getEntitiesForGivenFilter(entities, filter, ccFields, ownProps)
-        );
-      });
-      entities = uniq(orEntities);
-    }
-  }
-  return entities;
-}
-
-function cleanFilterValue(_filterValue, type) {
-  let filterValue = _filterValue;
-  if (type === "number" || type === "integer") {
-    filterValue = Array.isArray(filterValue)
-      ? filterValue.map(val => Number(val))
-      : Number(filterValue);
-  }
-  return filterValue;
-}
-
-function getEntitiesForGivenFilter(entities, filter, ccFields, ownProps) {
-  const { filterOn, filterValue: _filterValue, selectedFilter } = filter;
-  const field = ccFields[filterOn];
-  const { path, getValueToFilterOn } = field;
-  const filterValue = cleanFilterValue(_filterValue, field.type);
-  const subFilter = getSubFilter(false, selectedFilter, filterValue);
-  entities = entities.filter(entity => {
-    const fieldVal = getValueToFilterOn
-      ? getValueToFilterOn(entity, ownProps)
-      : get(entity, path);
-    const shouldKeep = subFilter(fieldVal);
-    return shouldKeep;
-  });
-  return entities;
-}
-
-function getFiltersFromSearchTerm(searchTerm, schema) {
-  const searchTermFilters = [];
-  if (searchTerm) {
-    const sharedFields = {
-      isOrFilter: true,
-      isSearchTermFilter: true
-    };
-    schema.fields.forEach(field => {
-      const { type, searchDisabled } = field;
-      if (searchDisabled || field.filterDisabled || type === "color") return;
-      const ccDisplayName = getCCDisplayName(field);
-      const filterValue = cleanFilterValue(searchTerm, type);
-      if (type === "string" || type === "lookup") {
-        searchTermFilters.push({
-          ...sharedFields,
-          filterOn: ccDisplayName,
-          filterValue: searchTerm,
-          selectedFilter: "contains"
-        });
-      } else if (type === "boolean") {
-        let regex;
-        try {
-          regex = new RegExp("^" + searchTerm, "ig");
-        } catch (error) {
-          //ignore
-        }
-        if (regex) {
-          if ("true".replace(regex, "") !== "true") {
-            searchTermFilters.push({
-              ...sharedFields,
-              filterOn: ccDisplayName,
-              filterValue: true,
-              selectedFilter: "true"
-            });
-          } else if ("false".replace(regex, "") !== "false") {
-            searchTermFilters.push({
-              ...sharedFields,
-              filterOn: ccDisplayName,
-              filterValue: false,
-              selectedFilter: "false"
-            });
-          }
-        }
-      } else if (
-        (type === "number" || type === "integer") &&
-        !isNaN(filterValue)
-      ) {
-        if (type === "integer" && !isInteger(filterValue)) {
-          return;
-        }
-        searchTermFilters.push({
-          ...sharedFields,
-          filterOn: ccDisplayName,
-          filterValue: filterValue,
-          selectedFilter: "equalTo"
-        });
-      }
-    });
-  }
-  return searchTermFilters;
-}
-
-function getSubFilter(
-  qb, //if no qb is passed, it means we are filtering locally and want to get a function back that can be used in an array filter
-  selectedFilter,
-  filterValue
-) {
-  const ccSelectedFilter = camelCase(selectedFilter);
-  let stringFilterValue =
-    filterValue && filterValue.toString ? filterValue.toString() : filterValue;
-  if (stringFilterValue === false) {
-    // we still want to be able to search for the string "false" which will get parsed to false
-    stringFilterValue = "false";
-  } else {
-    stringFilterValue = stringFilterValue || "";
-  }
-  const filterValLower =
-    stringFilterValue.toLowerCase && stringFilterValue.toLowerCase();
-  const arrayFilterValue = Array.isArray(filterValue)
-    ? filterValue
-    : stringFilterValue.split(";");
-  if (ccSelectedFilter === "startsWith") {
-    return qb
-      ? qb.startsWith(stringFilterValue) //filter using qb (aka we're backend connected)
-      : fieldVal => {
-          //filter using plain old javascript (aka we've got a local table that isn't backend connected)
-          if (!fieldVal || !fieldVal.toLowerCase) return false;
-          return startsWith(fieldVal.toLowerCase(), filterValLower);
-        };
-  } else if (ccSelectedFilter === "endsWith") {
-    return qb
-      ? qb.endsWith(stringFilterValue) //filter using qb (aka we're backend connected)
-      : fieldVal => {
-          //filter using plain old javascript (aka we've got a local table that isn't backend connected)
-          if (!fieldVal || !fieldVal.toLowerCase) return false;
-          return endsWith(fieldVal.toLowerCase(), filterValLower);
-        };
-  } else if (
-    ccSelectedFilter === "contains" ||
-    ccSelectedFilter === "notContains"
-  ) {
-    return qb
-      ? ccSelectedFilter === "contains"
-        ? qb.contains(stringFilterValue.replace(/_/g, "\\_"))
-        : qb.notContains(stringFilterValue.replace(/_/g, "\\_"))
-      : fieldVal => {
-          if (!fieldVal || !fieldVal.toLowerCase) return false;
-          return ccSelectedFilter === "contains"
-            ? fieldVal.toLowerCase().replace(filterValLower, "") !==
-                fieldVal.toLowerCase()
-            : fieldVal.toLowerCase().replace(filterValLower, "") ===
-                fieldVal.toLowerCase();
-        };
-  } else if (ccSelectedFilter === "inList") {
-    return qb
-      ? qb.inList(arrayFilterValue) //filter using qb (aka we're backend connected)
-      : fieldVal => {
-          //filter using plain old javascript (aka we've got a local table that isn't backend connected)
-          if (!fieldVal?.toString) return false;
-          return (
-            arrayFilterValue
-              .map(val => {
-                if (val) {
-                  if (val.toString) return val.toString().toLowerCase();
-                  return val.toLowerCase();
-                }
-                return undefined;
-              })
-              .indexOf(fieldVal.toString().toLowerCase()) > -1
-          );
-        };
-  } else if (ccSelectedFilter === "notInList") {
-    return qb
-      ? qb.notInList(arrayFilterValue) //filter using qb (aka we're backend connected)
-      : fieldVal => {
-          //filter using plain old javascript (aka we've got a local table that isn't backend connected)
-          if (!fieldVal?.toString) return false;
-          return (
-            arrayFilterValue
-              .map(val => {
-                if (val) {
-                  if (val.toString) return val.toString().toLowerCase();
-                  return val.toLowerCase();
-                }
-                return undefined;
-              })
-              .indexOf(fieldVal.toString().toLowerCase()) === -1
-          );
-        };
-  } else if (ccSelectedFilter === "isEmpty") {
-    return qb
-      ? qb.isEmpty()
-      : fieldVal => {
-          return !fieldVal;
-        };
-  } else if (ccSelectedFilter === "notEmpty") {
-    return qb
-      ? [qb.notNull(), qb.notEquals("")]
-      : fieldVal => {
-          return !!fieldVal;
-        };
-  } else if (ccSelectedFilter === "isExactly") {
-    return qb
-      ? filterValue
-      : fieldVal => {
-          return fieldVal === filterValue;
-        };
-  } else if (ccSelectedFilter === "true") {
-    return qb
-      ? qb.equals(true) //filter using qb (aka we're backend connected)
-      : fieldVal => {
-          //filter using plain old javascript (aka we've got a local table that isn't backend connected)
-          return !!fieldVal;
-        };
-  } else if (ccSelectedFilter === "false") {
-    return qb
-      ? qb.equals(false) //filter using qb (aka we're backend connected)
-      : fieldVal => {
-          //filter using plain old javascript (aka we've got a local table that isn't backend connected)
-          return !fieldVal;
-        };
-  } else if (ccSelectedFilter === "isBetween") {
-    return qb
-      ? qb.between(
-          new Date(arrayFilterValue[0]),
-          new Date(new Date(arrayFilterValue[1]).setHours(23, 59)) // set end of day for more accurate filtering
-        )
-      : fieldVal => {
-          return (
-            dayjs(arrayFilterValue[0]).valueOf() <= dayjs(fieldVal).valueOf() &&
-            dayjs(fieldVal).valueOf() <= dayjs(arrayFilterValue[1]).valueOf()
-          );
-        };
-  } else if (ccSelectedFilter === "notBetween") {
-    return qb
-      ? qb.notBetween(
-          new Date(arrayFilterValue[0]),
-          new Date(new Date(arrayFilterValue[1]).setHours(23, 59)) // set end of day for more accurate filtering
-        )
-      : fieldVal => {
-          return (
-            dayjs(arrayFilterValue[0]).valueOf() > dayjs(fieldVal).valueOf() ||
-            dayjs(fieldVal).valueOf() > dayjs(arrayFilterValue[1]).valueOf()
-          );
-        };
-  } else if (ccSelectedFilter === "isBefore") {
-    return qb
-      ? qb.lessThan(new Date(filterValue))
-      : fieldVal => {
-          return dayjs(fieldVal).valueOf() < dayjs(filterValue).valueOf();
-        };
-  } else if (ccSelectedFilter === "isAfter") {
-    return qb
-      ? qb.greaterThan(new Date(new Date(filterValue).setHours(23, 59))) // set end of day for more accurate filtering
-      : fieldVal => {
-          return dayjs(fieldVal).valueOf() > dayjs(filterValue).valueOf();
-        };
-  } else if (ccSelectedFilter === "greaterThan") {
-    return qb
-      ? qb.greaterThan(filterValue)
-      : fieldVal => {
-          return fieldVal > filterValue;
-        };
-  } else if (ccSelectedFilter === "lessThan") {
-    return qb
-      ? qb.lessThan(filterValue)
-      : fieldVal => {
-          return fieldVal < filterValue;
-        };
-  } else if (ccSelectedFilter === "inRange") {
-    return qb
-      ? qb.between(filterValue[0], filterValue[1])
-      : fieldVal => {
-          return filterValue[0] <= fieldVal && fieldVal <= filterValue[1];
-        };
-  } else if (ccSelectedFilter === "outsideRange") {
-    return qb
-      ? qb.notBetween(filterValue[0], filterValue[1])
-      : fieldVal => {
-          return filterValue[0] > fieldVal || fieldVal > filterValue[1];
-        };
-  } else if (ccSelectedFilter === "equalTo") {
-    return qb
-      ? filterValue
-      : fieldVal => {
-          return fieldVal === filterValue;
-        };
-  } else if (ccSelectedFilter === "regex") {
-    return qb
-      ? qb.matchesRegex(filterValue)
-      : fieldVal => {
-          new RegExp(filterValue).test(fieldVal);
-          return fieldVal;
-        };
-  }
-
-  throw new Error(
-    `Unsupported filter ${selectedFilter}. Please make a new filter if you need one`
-  );
-}
-
 export function getCurrentParamsFromUrl(location, isSimple) {
   let { search } = location;
   if (isSimple) {
@@ -585,23 +136,6 @@ function parseFilters(newParams) {
   };
 }
 
-function buildRef(qb, reference, searchField, expression) {
-  if (reference.reference) {
-    // qb[reference.target] = {}
-    return qb.related(reference.target).whereAny({
-      [reference.sourceField]: buildRef(
-        qb,
-        reference.reference,
-        searchField,
-        expression
-      )
-    });
-  }
-  return qb.related(reference.target).whereAny({
-    [searchField]: expression
-  });
-}
-
 export function makeDataTableHandlers({
   setNewParams,
   defaults,
@@ -707,36 +241,6 @@ export function makeDataTableHandlers({
   };
 }
 
-// if an inList value only has two items like
-// 2.3 then it will get parsed to a number and
-// break, convert it back to a string here
-function cleanupFilter(filter) {
-  let filterToUse = filter;
-  if (
-    filterToUse.selectedFilter === "inList" &&
-    typeof filterToUse.filterValue === "number"
-  ) {
-    filterToUse = {
-      ...filterToUse,
-      filterValue: filterToUse.filterValue.toString()
-    };
-  }
-  return filterToUse;
-}
-
-function getAllFilters(filters, searchTerm, schema) {
-  let allFilters = [
-    ...filters,
-    ...getFiltersFromSearchTerm(searchTerm, schema)
-  ];
-
-  allFilters = allFilters.filter(val => {
-    return val !== "";
-  }); //get rid of erroneous filters
-
-  return allFilters.map(cleanupFilter);
-}
-
 export function getQueryParams({
   currentParams,
   urlConnected,
@@ -746,115 +250,50 @@ export function getQueryParams({
   entities,
   isLocalCall,
   additionalFilter,
-  additionalOrFilter,
   doNotCoercePageSize,
   noOrderError,
   isCodeModel,
   ownProps
 }) {
-  Object.keys(currentParams).forEach(function (key) {
-    if (currentParams[key] === undefined) {
-      delete currentParams[key]; //we want to use the default value if any of these are undefined
-    }
-  });
-  const tableQueryParams = {
-    ...defaults,
-    ...currentParams
-  };
-  let { page, pageSize, searchTerm, filters, order } = tableQueryParams;
-  if (page <= 0 || isNaN(page)) {
-    page = undefined;
-  }
-  if (isInfinite) {
-    page = undefined;
-    pageSize = undefined;
-  }
-  if (pageSize !== undefined && !doNotCoercePageSize) {
-    //pageSize might come in as an unexpected number so we coerce it to be one of the nums in our pageSizes array
-    const closest = clone(window.tgPageSizes || defaultPageSizes).sort(
-      (a, b) => Math.abs(pageSize - a) - Math.abs(pageSize - b)
-    )[0];
-    pageSize = closest;
-  }
-  const toReturn = {
-    //these are values that might be generally useful for the wrapped component
-    page,
-    pageSize: ownProps.controlled_pageSize || pageSize,
-    order,
-    filters,
-    searchTerm
-  };
-
-  if (isLocalCall) {
-    let newEntities = entities;
-    //if the table is local (aka not directly connected to a db) then we need to
-    //handle filtering/paging/sorting all on the front end
-    newEntities = filterEntitiesLocal(
-      filters,
-      searchTerm,
-      newEntities,
-      schema,
-      ownProps
-    );
-    newEntities = orderEntitiesLocal(order, newEntities, schema, ownProps);
+  let errorParsingUrlString;
 
-    const entitiesAcrossPages = newEntities;
-
-    const newEntityCount = newEntities.length;
-    //calculate the sorted, filtered, paged entities for the local table
-    if (!isInfinite && !ownProps.controlled_pageSize) {
-      const offset = (page - 1) * pageSize;
-      newEntities = take(drop(newEntities, offset), pageSize);
-    }
-    toReturn.entities = newEntities;
-    toReturn.entitiesAcrossPages = entitiesAcrossPages;
-    toReturn.entityCount = newEntityCount;
-    //if this call is being made by a local-data only connected datatable component,
-    //we don't want to do the following gql stuff
-    return toReturn;
-  } else {
-    const graphqlQueryParams = {
-      // need to make sure sort exists because of https://github.com/apollographql/apollo-client/issues/3077
-      sort: []
+  try {
+    Object.keys(currentParams).forEach(function (key) {
+      if (currentParams[key] === undefined) {
+        delete currentParams[key]; //we want to use the default value if any of these are undefined
+      }
+    });
+    const tableQueryParams = {
+      ...defaults,
+      ...currentParams
     };
+    let { page, pageSize, searchTerm, filters, order } = tableQueryParams;
+    if (page <= 0 || isNaN(page)) {
+      page = undefined;
+    }
     if (isInfinite) {
-      graphqlQueryParams.pageSize = 999;
-      graphqlQueryParams.pageNumber = 1;
-    } else {
-      graphqlQueryParams.pageNumber = Number(page);
-      graphqlQueryParams.pageSize =
-        ownProps.controlled_pageSize || Number(pageSize);
+      page = undefined;
+      pageSize = undefined;
+    }
+    if (pageSize !== undefined && !doNotCoercePageSize) {
+      //pageSize might come in as an unexpected number so we coerce it to be one of the nums in our pageSizes array
+      const closest = clone(window.tgPageSizes || defaultPageSizes).sort(
+        (a, b) => Math.abs(pageSize - a) - Math.abs(pageSize - b)
+      )[0];
+      pageSize = closest;
     }
 
-    const { model } = schema;
-    if (!window.QueryBuilder) return toReturn;
-    const qb = new window.QueryBuilder(model);
-    // qb = qb.filter('user')
-    // qb = qb.whereAny({
-    //   userStatus: qb.related('userStatus').whereAny({
-    //     code: qb.contains('pending')
-    //   })
-    // })
-    // qb = qb.andWhere({
-    //   age: qb.lessThan(12)
-    // })
-    // qb.toJSON()
-    // let filterBuilder = qb.filter(model); //start filter on model
-
-    const ccFields = getFieldsMappedByCCDisplayName(schema);
-
-    if (tableQueryParams.order && tableQueryParams.order.length) {
-      tableQueryParams.order.forEach(orderVal => {
+    const cleanedOrder = [];
+    if (order && order.length) {
+      const ccFields = getFieldsMappedByCCDisplayName(schema);
+      order.forEach(orderVal => {
         const ccDisplayName = orderVal.replace(/^-/gi, "");
         const schemaForField = ccFields[ccDisplayName];
         if (schemaForField) {
           const { path } = schemaForField;
           const reversed = ccDisplayName !== orderVal;
           const prefix = reversed ? "-" : "";
-          graphqlQueryParams.sort = [
-            ...(graphqlQueryParams.sort || []),
-            prefix + path
-          ];
+          cleanedOrder.push(prefix + path);
         } else {
           !noOrderError &&
             console.error(
@@ -865,194 +304,77 @@ export function getQueryParams({
         }
       });
     }
-
-    let errorParsingUrlString;
-
-    const additionalFilterToUse = additionalFilter(qb, currentParams);
-    let additionalOrFilterToUse = additionalOrFilter(qb, currentParams);
-    if (additionalOrFilterToUse && additionalOrFilterToUse.ignoreSearchTerm) {
-      searchTerm = "";
-      additionalOrFilterToUse = additionalOrFilterToUse.additionalOrFilterToUse;
-    }
-
-    const allFilters = getAllFilters(filters, searchTerm, schema);
-    const { andFilters, orFilters, otherOrFilters } =
-      getAndAndOrFilters(allFilters);
-    try {
-      const flattenFilters = filterObj => {
-        return flatMap(Object.keys(filterObj), key => {
-          return filterObj[key].map(filter => ({
-            [key]: filter
-          }));
-        });
-      };
-      const orFiltersObject = getQueries(orFilters, qb, ccFields);
-      let allOrFilters = flattenFilters(orFiltersObject);
-
-      otherOrFilters.forEach(orFilters => {
-        const otherOrFiltersObject = getQueries(orFilters, qb, ccFields);
-        allOrFilters = allOrFilters.concat(
-          flattenFilters(otherOrFiltersObject)
-        );
-      });
-      allOrFilters.push(additionalOrFilterToUse);
-      allOrFilters = allOrFilters.filter(obj => !isEmpty(obj));
-
-      const unflattenedAndQueries = getQueries(andFilters, qb, ccFields);
-      let allAndFilters = flattenFilters(unflattenedAndQueries);
-      allAndFilters.push(additionalFilterToUse);
-      allAndFilters = allAndFilters.filter(obj => !isEmpty(obj));
-      if (allAndFilters.length) {
-        qb.whereAll(...allAndFilters);
-      }
-      if (allOrFilters.length) {
-        qb.andWhereAny(...allOrFilters);
-      }
-      const columnCustomFilters = getColumnCustomFilters(
-        andFilters,
-        qb,
-        ccFields
-      );
-      if (columnCustomFilters.length) {
-        qb.whereAll(...columnCustomFilters);
-      }
-    } catch (e) {
-      if (urlConnected) {
-        errorParsingUrlString = e;
-        console.error(
-          "The following error occurred when trying to build the query params. This is probably due to a malformed URL:",
-          e
-        );
-      } else {
-        console.error("Error building query params from filter:");
-        throw e;
-      }
-    }
-
-    if (qb.query.filters.length) {
-      graphqlQueryParams.filter = qb.toJSON();
-    }
-
     // by default make sort by updated at
-    if (!graphqlQueryParams.sort.length) {
-      graphqlQueryParams.sort.push("-updatedAt");
+    if (!cleanedOrder.length) {
+      cleanedOrder.push("-updatedAt");
     }
 
     // in case entries that have the same value in the column being sorted on
     // fall back to id as a secondary sort to make sure ordering happens correctly
-    graphqlQueryParams.sort.push(
-      isCodeModel ? "code" : window.__sortId || "id"
-    );
+    cleanedOrder.push(isCodeModel ? "code" : window.__sortId || "id");
 
-    return {
-      ...toReturn,
-      //the query params will get passed directly to as variables to the graphql query
-      variables: graphqlQueryParams,
-      errorParsingUrlString
+    let toRet = {
+      //these are values that might be generally useful for the wrapped component
+      page,
+      pageSize: ownProps.controlled_pageSize || pageSize,
+      order: cleanedOrder,
+      filters,
+      searchTerm
     };
-  }
-}
 
-function getSubFiltersAndPath(filter, qb, ccFields) {
-  const { selectedFilter, filterValue, filterOn } = filter;
-  const fieldSchema = ccFields[filterOn];
-  let filterValueToUse = filterValue;
-
-  if (fieldSchema) {
-    if (fieldSchema.normalizeFilter) {
-      filterValueToUse = fieldSchema.normalizeFilter(
-        filterValue,
-        selectedFilter,
-        filterOn
-      );
+    const { where, order_by, limit, offset } = tableQueryParamsToHasuraClauses({
+      page,
+      pageSize,
+      searchTerm,
+      filters,
+      order: cleanedOrder,
+      schema
+    });
+    initializeHasuraWhereAndFilter(additionalFilter, where, currentParams);
+    if (isLocalCall) {
+      //if the table is local (aka not directly connected to a db) then we need to
+      //handle filtering/paging/sorting all on the front end
+      toRet = {
+        ...toRet,
+        ...filterLocalEntitiesToHasura(entities, {
+          where,
+          order_by,
+          limit,
+          offset,
+          isInfinite
+        })
+      };
+      return toRet;
+    } else {
+      return {
+        ...toRet,
+        variables: {
+          where,
+          order_by,
+          limit,
+          offset
+        }
+      };
     }
-  }
-  const _subFilters = getSubFilter(qb, selectedFilter, filterValueToUse);
-
-  let filterField;
-  if (fieldSchema) {
-    const { path, reference } = fieldSchema;
-    if (reference) {
-      filterField = reference.sourceField;
+  } catch (e) {
+    if (urlConnected) {
+      errorParsingUrlString = e;
+      console.error(
+        "The following error occurred when trying to build the query params. This is probably due to a malformed URL:",
+        e
+      );
+      return {
+        errorParsingUrlString,
+        variables: {
+          where: {},
+          order_by: [],
+          limit: 0,
+          offset: 0
+        }
+      };
     } else {
-      filterField = path;
+      console.error("Error building query params from filter:");
+      throw e;
     }
-  } else if (filterOn === "id") {
-    filterField = filterOn;
-  } else {
-    console.error("Trying to filter on unknown field");
   }
-  const subFiltersToUse = [];
-  const subFilters = Array.isArray(_subFilters) ? _subFilters : [_subFilters];
-  subFilters.forEach(subFilter => {
-    let subFilterToUse = subFilter;
-    if (fieldSchema) {
-      const { path, reference } = fieldSchema;
-      if (reference) {
-        subFilterToUse = buildRef(
-          qb,
-          reference,
-          last(path.split(".")),
-          subFilter
-        );
-      }
-    }
-    subFiltersToUse.push(subFilterToUse);
-  });
-
-  return {
-    path: filterField,
-    subFilters: subFiltersToUse
-  };
-}
-
-function getQueries(filters, qb, ccFields) {
-  const subQueries = filters.reduce((acc, filter) => {
-    if (!filter) {
-      console.warn("We should always have a filter object!");
-      return acc;
-    }
-    const { filterOn } = filter;
-    const fieldSchema = ccFields[filterOn];
-    // will be handled below
-    if (!filter.isSearchTermFilter && fieldSchema?.additionalColumnFilter)
-      return acc;
-    const { path, subFilters } = getSubFiltersAndPath(filter, qb, ccFields);
-    acc[path] = subFilters;
-    return acc;
-  }, {});
-  return subQueries;
-}
-
-function getColumnCustomFilters(filters, qb, ccFields) {
-  const subQueries = filters.reduce((acc, filter) => {
-    if (!filter) {
-      console.warn("We should always have a filter object!");
-      return acc;
-    }
-    const { filterOn } = filter;
-    const fieldSchema = ccFields[filterOn];
-    if (filter.isSearchTermFilter || !fieldSchema?.additionalColumnFilter) {
-      return acc;
-    }
-    const { path, subFilters } = getSubFiltersAndPath(filter, qb, ccFields);
-    /* the column filters need to have access to this sub filter but also be able to add additional
-     filter logic.
-    ex.
-    qb.whereAny({
-      id: qb.related("extendedStringValueView.buildSampleId").whereAll({
-          value: "something",
-          extendedPropertyId: "myId"
-        })
-      ...
-      })
-
-      is possible because the returned accumulator will be passed to whereAny
-  */
-    subFilters.forEach(subFilter => {
-      acc.push(fieldSchema.additionalColumnFilter(qb, subFilter, path));
-    });
-    return acc;
-  }, []);
-  return subQueries;
 }