window is not defined for Table Columns

[MelikeBicerr]

What version of rsuite are you using?

5.4.4

What version of React are you using?

17.0.2

What version of TypeScript are you using (if any)?

No response

What browser are you using?

Brave, Firefox

Describe the Bug

Getting window is not defined error for Table Columns on new project. If I comment out Columns then it works.

Error

ReferenceError: window is not defined
Uncaught at isSupportTouchEvent

Sample Code

import { Table } from "rsuite";
import { useEffect } from "react";

const { Column, HeaderCell, Cell } = Table;

const CustomTable = (props) => {
  useEffect(() => {
    console.log("RTABLE");
  });
  return (
    <Table
      height={400}
      data={props.data}
    >
      <Column width={100} align="center" key={props.data.label}>
        <HeaderCell>{props.label}</HeaderCell>
        <Cell dataKey="label" />
      </Column>
    </Table>
  );
};

export default CustomTable;

props.data is valid and loaded after a loading component. Normally we are using rsuite and it's table component on several projects without an issue but this time it throws the error above and couldn't figure it out on why?

Expected Behavior

Rendering Table component without an issue

To Reproduce

https://codesandbox.io/s/thirsty-sun-pqs69?file=/src/index.js

this is working on codesandbox but not on my end

[SevenOutman]

Hi @MelikeBicerr, are you doing server-side rendering or using some frameworks like Next.js?

[fuzunspm]

I reproduced the problem on next.js and able to fix it by wrapping Table like this:

return (
...
{typeof window !== "undefined" ? (<Table ....) : null}
...
)

is this necessary or I'm missing a key point here?

[SevenOutman]

/cc @simonguo Sounds like a bug in rsuite-table at https://github.com/rsuite/rsuite-table/blob/3789a5ce1bbb9038ab9db70c49ec12d1307d1182/src/utils/isSupportTouchEvent.ts#L2

[simonguo]

I will fix it in this week's new version.