useFilter

This hooks provides a simple way to bind a filter string or object to some state. Whenever the filter parameter changes, the data object will refresh with the new filter. If the filter equals false, the data object will not refresh. The default filter parameter is filterString.

If you also want to use the data returned, use useData, which accepts the same filter options. For backwards compatibility you can also use useDataWithFilter.

Careful! If this hooks is used in multiple components at the same time, an infinite loop can occur.

Example

import { useFilter } from "@olenbetong/appframe-react";

function MyComponent({ id }) {
  useFilter(dsMyDataObject, id ? `[ID] = ${id}` : false);

  return <p>Getting data for id {id}</p>;
}

Or with a filter object:

import { useFilter } from "@olenbetong/appframe-react";

function MyComponent({ id }) {
  useFilter(
    dsMyDataObject,
    id ? { type: "expression", column: "ID", operator: "equals", value: id, valueType: "number" } : false,
    "filterObject"
  );

  return <p>Getting data for id {id}</p>;
}

Disable auto load

If data has not been loaded previously in the data object, this hook will run refreshDataSource even if the filter has not changed. This may not always be the desired behaviour, so you can disable this by setting the autoLoad option to false.

Notably this is used by the AfGrid component to prevent extra data loads in cases where the where clause will be immediately set in another component.

Example

import { useFilter } from "@olenbetong/appframe-react";

function MyComponent() {
  useFilter(
    dsMyDataObject,
    {
      type: "filterString",
      filter: "",
      autoLoad: false
    }
  );

  return <p>Getting data</p>;
}

API

Hook parameters

Name	Type	Optional	Description
dataObject	DataObject	no	The data object whose filter will be set
filterOrOptions	FilterOrOptions	no	A filter expression, filter object, or an options object
typeParam	FilterType	yes	Which filter parameter should be updated (default: filterString)

FilterOrOptions

type FilterType = "filterString" | "filterObject" | "whereClause" | "whereObject";
type FilterParameter = {
  filter: false | string | FilterObject;
  type: "filterString" | "whereClause" | "filterObject" | "whereObject";
  autoLoad?: boolean;
};
type FilterOrOptions = false | string | FilterObject | FilterParameter;