@vtex/styleguide/lib/EXPERIMENTAL_Table/hooks/useTableVisibility.js

> VTEX Styleguide React components ([Docs](https://vtex.github.io/styleguide))

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = useTableVisibility;

var _react = require("react");

function useTableVisibility(_ref) {
  var columns = _ref.columns,
      _ref$hiddenColumns = _ref.hiddenColumns,
      initHiddenColumns = _ref$hiddenColumns === void 0 ? [] : _ref$hiddenColumns;

  var _useState = (0, _react.useState)(initHiddenColumns),
      hiddenColumns = _useState[0],
      setHiddenColumns = _useState[1];

  var visibleColumns = (0, _react.useMemo)(function () {
    var reducer = function reducer(acc, col) {
      return hiddenColumns.includes(col.id) ? acc : [].concat(acc, [col]);
    };

    return columns.reduce(reducer, []);
  }, [hiddenColumns, columns]);
  var toggleColumn = (0, _react.useCallback)(function (id) {
    setHiddenColumns(function (col) {
      return col.includes(id) ? col.filter(function (col) {
        return col !== id;
      }) : [].concat(col, [id]);
    });
  }, []);
  var showColumn = (0, _react.useCallback)(function (id) {
    setHiddenColumns(function (col) {
      return col.includes(id) ? col.filter(function (col) {
        return col !== id;
      }) : col;
    });
  }, []);
  var hideColumn = (0, _react.useCallback)(function (id) {
    setHiddenColumns(function (col) {
      return col.includes(id) ? col : [].concat(col, [id]);
    });
  }, []);
  var showAllColumns = (0, _react.useCallback)(function () {
    setHiddenColumns([]);
  }, []);
  var hideAllColumns = (0, _react.useCallback)(function () {
    setHiddenColumns(columns.map(function (col) {
      return col.id;
    }));
  }, [columns]);
  return {
    columns: columns,
    visibleColumns: visibleColumns,
    hiddenColumns: hiddenColumns,
    showColumn: showColumn,
    hideColumn: hideColumn,
    toggleColumn: toggleColumn,
    showAllColumns: showAllColumns,
    hideAllColumns: hideAllColumns
  };
}