Breaking when the header field is a component instead of a string

[samkim28]

Hi Patrick! First of all, thanks for your work on this package! It looks great. I did find one minor issue: if you look at the following code snippet, the two objects have different header types. When all the headers are just strings, it works fine, but when I use a component, it seems to break. I tried using the onDragImage and added a className, but that didn't seem to work either. Any thoughts on what I can do? Thanks!

        Header: 'Name',
        accessor: 'name',
        width: 300,
        Cell: (row: any) => {
          const { original: { name, email } } = row;
          return (
            <TableCell type='stacked' content={{ main: name, sub: email }} />
          )
        }
      },

      {
        Header: <TableCell type='headerIcon' content={{ icon: 'team', title: 'Groups'}} />,
        accessor: 'groups',
        width: 300,
        Cell: (row: any) => {
          const { original: { groups } } = row;
          return (
            <TableCell type='list' content={groups} />
          )
        }
      },

[samkim28]

After doing some more experimenting, seems that it happens when there is a SVG nested inside the column header.

[patricktran]

Hi @samkim28

Just released version 1.2.0. Please try that out and let me know.

I also updated the demo page to render a SVG icon for the Vin Header. It seems to be working find.

https://patricktran.github.io/react-table-hoc-draggable-columns/?path=/story/reacttabledraggablecolumns--reorder-columns

[samkim28]

hi @patricktran i just upgraded to 1.2.0 and now i'm getting the following before adding any svg's or modifying anything else:

headers.forEach is not a function var headers = DomHelper.findChildrenWithClassName(this.containerRef.current, this.uniqueId + ' draggable-header'); headers.forEach(function (header, i) {

[patricktran]

That is really weird as the Demo page is using version 1.2.0 https://patricktran.github.io/react-table-hoc-draggable-columns/?path=/story/reacttabledraggablecolumns--reorder-columns

Can you please reproduce the error in codesandbox?

[patricktran]

@samkim28

I think I found the culprit. Try version 1.2.1

[samkim28]

Weird, working fine without the svg but breaking with the svg again. iIll try to repro in code sandbox tomorrow when i get a chance! Thanks for the help so far.

[patricktran]

Closing due to inactivity.