Disabling a tablerow in react

When a user clicks a line on a tablerow on my website, it displays another page with a different table row. Here’s my code where I display the second mentioned table row:

        return (
            <>
            <TableRow key={this.props.rowData.dependency_id} onClick={() => this.setOpen(!this.state.isOpen)}>
                <TableCell>{this.props.rowData.name}</TableCell>
                <TableCell>{this.props.rowData.component}</TableCell>
                <TableCell>{this.props.rowData.version}</TableCell>
                <TableCell>{this.stringify_licenses(this.props.rowData.licenses)}</TableCell>
                <TableCell style={{paddingRight: '2px'}}>{this.props.rowData.numLowVulnerabilities}</TableCell>
                <TableCell style={{paddingRight: '2px'}}>{this.props.rowData.numMediumVulnerabilities}</TableCell>
                <TableCell style={{paddingRight: '2px'}}>{this.props.rowData.numHighVulnerabilities}</TableCell>
                <TableCell style={{paddingRight: '2px'}}>{this.props.rowData.numCriticalVulnerabilities}</TableCell>
                <TableCell style={{paddingRight: '2px'}}>{this.props.rowData.totalNumVulnerabilities}</TableCell>
                <TableCell>
                    {this.state.isOpen ? <FaAngleUp/> : <FaAngleDown/>}
                </TableCell>
            </TableRow>

I want to disable this table row if the line on the first table row has a certain tablecell value. How can I do this?