# Getting the error when using EuiDataGrid inside Kibana plugin

**URL:** https://discuss.elastic.co/t/getting-the-error-when-using-euidatagrid-inside-kibana-plugin/259613
**Category:** Kibana
**Created:** [December 25, 2020, 2:21am UTC](https://discuss.elastic.co/t/getting-the-error-when-using-euidatagrid-inside-kibana-plugin/259613 "2020-12-25T02:21:13Z")
**Posts on this page:** 5
**Page:** 1

<div class="post-metadata">

### Author: ![zixon89](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/zixon89/32/81386_2.png) [@zixon89](https://discuss.elastic.co/u/zixon89)
#### Post date: [December 25, 2020, 2:21am UTC](https://discuss.elastic.co/t/getting-the-error-when-using-euidatagrid-inside-kibana-plugin/259613/1 "2020-12-25T02:21:13Z")

</div>

Hi there,

I hope it's the right place to ask the following question...

I'm new with Kibana plugin development, and I figure out most of the back-end part.  
However, now comes the tricky part for me - the EUI framework.

I want to display some data I got from Elasticache inside EUI [Datagrid](https://elastic.github.io/eui/#/tabular-content/data-grid).  
I was able to successfully prepare my UI dev work on code sandbox [here](https://codesandbox.io/s/keen-margulis-v6snz?file=/index.js) using some dummy data.

But, when I tried to use that same code inside my plugin, I'm getting the following error:

> react-dom.development.js:55 Uncaught Invariant Violation: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.  
> Check the render method of `GridViewDataTable

I was able to handle files and methods references connection, optimization runs successfully, kibana in dev mode started successfully.

Here is my plugin folder structure located inside kibana's plugins directory:  
 ![image](https://us1.discourse-cdn.com/elastic/original/3X/3/c/3c77b2821931527a3e08931edd3f5aab8421a9a1.png)

The issue is occurring inside [gridviewdata.js file](https://github.com/nikola6789/kibana_plugin/blob/main/public/components/main/gridviewdata.js#L255) where I'm trying to create a EuiDataGrid with dummy set of data.  
What is strange, is if I put anything else to return here at line [255 of my gridviewdata.js file](https://github.com/nikola6789/kibana_plugin/blob/main/public/components/main/gridviewdata.js#L255) instead of EuiDataGrid, it renders perfectly, but it wont with EuiDataGrid and I cannot figure it out why. I tried various changes, none of them worked - I tried even to render that same dummy grid table directly inside [render()](https://github.com/nikola6789/kibana_plugin/blob/main/public/components/main/main.js#L87) method of my Main class, didn't work either.

You can find whole plugin structure on my [github repo](https://github.com/nikola6789/kibana_plugin).

Am I missing something?

Thanks,  
Nikola

---

<div class="post-metadata">

### Author: ![corey.robertson](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/corey.robertson/32/54611_2.png) [@corey.robertson](https://discuss.elastic.co/u/corey.robertson)
#### Post date: [December 28, 2020, 2:28pm UTC](https://discuss.elastic.co/t/getting-the-error-when-using-euidatagrid-inside-kibana-plugin/259613/2 "2020-12-28T14:28:36Z")

</div>

Hi @zixon89

What version of Kibana are you building your plugin against?

Do other components from `Eui` work as expected? `EuiDatagrid` was released ~a year ago, so if you have an older version of Kibana, the provided Eui package might not yet have the datagrid.

---

<div class="post-metadata">

### Author: ![zixon89](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/zixon89/32/81386_2.png) [@zixon89](https://discuss.elastic.co/u/zixon89)
#### Post date: [December 28, 2020, 4:27pm UTC](https://discuss.elastic.co/t/getting-the-error-when-using-euidatagrid-inside-kibana-plugin/259613/3 "2020-12-28T16:27:48Z")

</div>

Hi @corey.robertson,

I should've check the version compatibility... You are right.

I'm using Kibana [v7.4.0.](https://github.com/elastic/kibana/tree/v7.4.0) and I can see the `EuiDatagrid` was released with _elastic/ui_ version **14.8.0** from [changelog page](https://elastic.github.io/eui/#/package/changelog).  
The _elastic/ui_ dependency for Kibana 7.4.0. is set in [package.json file](https://github.com/elastic/kibana/blob/v7.4.0/package.json#L107) to be **13.6.1**.

So, that's was the problem here.  
I apologize, my bad for rushing here with question before checking versioning capability, it was not professional at all from my side as developer. 🙃

Since I'm limited with this Kibana version, I will use pure React to develop my own data grid.

Thanks again,  
Nikola

---

<div class="post-metadata">

### Author: ![wylie](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/wylie/32/81794_2.png) [@wylie](https://discuss.elastic.co/u/wylie)
#### Post date: [December 28, 2020, 7:37pm UTC](https://discuss.elastic.co/t/getting-the-error-when-using-euidatagrid-inside-kibana-plugin/259613/4 "2020-12-28T19:37:37Z")

</div>

@zixon89 There is also EuiBasicTable, which was available in the prior version of EUI. It's definitely not as powerful, but for most uses it's similar.

---

<div class="post-metadata">

### Author: ![system](https://us1.discourse-cdn.com/elastic/original/3X/1/a/1ac57faf039f6b580b3f104ef42a2a89e41014de.png) [@system](https://discuss.elastic.co/u/system)
#### Post date: [January 25, 2021, 7:37pm UTC](https://discuss.elastic.co/t/getting-the-error-when-using-euidatagrid-inside-kibana-plugin/259613/5 "2021-01-25T19:37:46Z")

</div>

This topic was automatically closed 28 days after the last reply. New replies are no longer allowed.
