forwardRef warning when supplying custom row component

[tomgallagher]

Hi

Great library!

I'm trying to use the library with Semantic React. Then working through your examples.

So the key bits of code are

import { Table } from 'semantic-ui-react';

//create the custom row component, with click handler
const SemanticRow = ({ row, ...rest }) => {
    return (
        <Table.Row
            onClick={() => console.log(row)}
            {...rest}
        />
    );
};

//then pass the row to the table
<Html5Table
       // ...other props
       Row={SemanticRow}
/>

This results in warning, even when I remove all semantic react components

Warning: Function components cannot be given refs. Attempts to access this ref will fail. Did you mean to use React.forwardRef()?

So with the additional of

import React, { forwardRef } from 'react';

The following code works raises no warnings

const SemanticRow = forwardRef(
    ({ index, row, ...rest }, ref) => {
        return (
            <Table.Row
                onClick={() => console.log(row)}
                {...rest}
            />
        );
    }
);

I'm a bit of a React beginner but I had a few questions.

Is the warning raised because the Semantic React Table.Row is a complex component?

Am I going to create performance concerns by passing a complex component in this manner?

Is there a better approach because I could end up with forwardRef nested inside useMemo hooks and then I'm starting to feel a bit out of my depth!!!

Thanks

Tom

[gabrielbezerra81]

I have this warning too and dont have any idea how to fix. Tried with fowardRef like you but didn't fix. Did you understood why this occurs?

Table code:

<WindowTable Row={(props) => ( <StripedRow tableSize={tableSize} props={props} /> )} />

Striped Row code:

const StripedRow = forwardRef(({ tableSize, props }, ref) => { return ( <div {...props} className={makeRowStriped(tableSize)} /> ); } );

[tomgallagher]

No, sorry I don't. I was hoping to get some feedback from the repo owner but it's been months now.

[pupudu]

Sorry guys, I've been busy with some work lately. I'm getting back at the queued issues this week and next week. Hopefully, I will have an answer soon. Help is always appreciated.

[tomgallagher]

Understood. I'd love to help out as I think it's a great project. This particular problem is a bit above my pay grade though!