domLayout does not update dymanically

[shauncullen]

When changing the domLayout either via the prop or the api method setDomLayout, the divs enclosing the data do not update dynamically when the change is made, only when the grid is first rendered on the page.

[denisgursky]

As mentioned above, this doesn't work

function TestCmp({ domLayout }) {
  return (
    <AgGridReact
      // other props here
      domLayout={domLayout}
    />
  );
}

setDomLayout doesn't works either

function TestCmp({ domLayout }) {
  const [gridApi, setGridApi] = useState<GridApi>();

  const onGridReady = useCallback(params => {
    setGridApi(params.api);
  }, []);

  useEffect(() => {
    if (gridApi) {
      gridApi.setDomLayout(domLayout);
    }
  }, [domLayout, gridApi]);

  return (
    <AgGridReact
      // other props
      domLayout={domLayout}
    />
  );
}

But setDomLayout does work if you always set the layout to normal or don't pass it at all.

function TestCmp({ domLayout }) {
  const [gridApi, setGridApi] = useState<GridApi>();

  const onGridReady = useCallback(params => {
    setGridApi(params.api);
  }, []);

  useEffect(() => {
    if (gridApi) {
      gridApi.setDomLayout(domLayout);
    }
  }, [domLayout, gridApi]);

  return (
    <AgGridReact
      // other props
      domLayout='normal'
    />
  );
}