How to render custom React component within DataTable?

Hi there,

I am using Material UI as the design framework for my application and using Webix Datatable to display data in the table. In my data table I need to show a button with Material Styling. I know we can create a template and show that inside a datatable cell, however the issue I am having is that it renders [Object object] instead.

The template I created is below:

const infoButton = webix.ui({
view: “template”,
template: function (obj: UserType) {
if (!obj.userId) return ‘’;
const link = /user-info/${obj.userId};
return (
“Launch User Profile”
);
}
});

Note that Button is a material-ui button component: React Button component - MUI
Link is a React Router property for navigation: React Router: Declarative Routing for React.js

Is there a way that I can make these two work together? How can I render a React component in a template?

Thanks in advance!