1
0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-12 04:37:13 +01:00
metamask-extension/ui/app/hooks/useEqualityCheck.js
Erik Marks 76a2a9bb8b
@metamask/eslint config@5.0.0 (#10358)
* @metamask/eslint-config@5.0.0
* Update eslintrc and prettierrc
* yarn lint:fix
2021-02-04 10:15:23 -08:00

28 lines
943 B
JavaScript

import { useState, useLayoutEffect } from 'react';
import { isEqual } from 'lodash';
/**
* Given a value and a function to determine equality, return a
* referentially equal value if the equality function returns true.
* This hook is helpful in avoiding re-renders and effects running
* based on an object or value that always changes references but
* infrequently changes it's value. By default, uses isEqual from
* lodash. This is typically only useful with objects and arrays.
*
* @param {T} value - any value to check equality of
* @param {(T, T) => boolean} equalityFn - A function to determine equality
* @returns {T}
*/
export function useEqualityCheck(value, equalityFn = isEqual) {
const [computedValue, setComputedValue] = useState(value);
useLayoutEffect(() => {
if (!equalityFn(value, computedValue)) {
setComputedValue(value);
}
}, [value, equalityFn, computedValue]);
return computedValue;
}