Issue: Something in nocodb code has changed that is causing use of v-treeview in nocodb gui to break

[AztrexDX]

So i had created few components to show data in treeview using v-treeview. It has started breaking in recent release. After lot of debugging I took fresh nocodb code and tried to run simple example of v-treeview from https://vuetifyjs.com/en/components/treeview/#usage in nocodb gui. That too is breaking. Earlier it was working fine. I have attached below screenshot of error and console logs. PathTree is just wraper around example that I imported in RowsXcDataTable

[Vue warn]: Method "open" has already been defined as a prop.
found in
--->
at components/project/spreadsheet/PathTree.vue
at components/project/spreadsheet/RowsXcDataTable.vue



at components/project/Table.vue



at components/ProjectTabs.vue


<Pages/nc/ProjectId.vue> at pages/nc/_project_id.vue



<Layouts/default.vue> at layouts/default.vue
vue.runtime.esm.js:619
[Vue warn]: Avoid mutating a prop directly since the value will be overwritten whenever the parent component re-renders. Instead, use a data or computed property based on the prop's value. Prop being mutated: "open"

found in

--->
at components/project/spreadsheet/PathTree.vue
at components/project/spreadsheet/RowsXcDataTable.vue



at components/project/Table.vue



at components/ProjectTabs.vue


<Pages/nc/ProjectId.vue> at pages/nc/_project_id.vue



<Layouts/default.vue> at layouts/default.vue
vue.runtime.esm.js:619
TypeError: this.open.forEach is not a function
mounted VTreeview.ts:178
VueJS 12
client.js:103:14
TypeError: rootState.project.unserializedList[0] is undefined
_callee$ meta.js:45
tryCatch vue-tour.umd.js:1951
invoke vue-tour.umd.js:2177
method vue-tour.umd.js:2003
Babel 4
ActLoadMeta meta.js:27
wrappedActionHandler vuex.esm.js:851
dispatch vuex.esm.js:516
boundDispatch vuex.esm.js:406
_callee18$ RowsXcDataTable.vue:1409
tryCatch vue-tour.umd.js:1951
invoke vue-tour.umd.js:2177
method vue-tour.umd.js:2003
Babel 4
loadMeta RowsXcDataTable.vue:1407
_callee4$ RowsXcDataTable.vue:945
tryCatch vue-tour.umd.js:1951
invoke vue-tour.umd.js:2177
method vue-tour.umd.js:2003
Babel 2
RowsXcDataTable.vue:948
Uncaught (in promise) TypeError: _this2.meta is undefined
_callee$ PathTree.vue:414
tryCatch vue-tour.umd.js:1951
invoke vue-tour.umd.js:2177
method vue-tour.umd.js:2003
Babel 4
getPathTree PathTree.vue:411
initPathTreeItems PathTree.vue:400
created PathTree.vue:257
VueJS 40

Node: **v12.22.7**
Arch: **x64**
Platform: **win32**
Docker: **false**
Database: **sqlite3**
ProjectOnRootDB: **false**
RootDB: **sqlite3**
PackageVersion: **0.91.0**

or provide the following info

NocoDB used as docker : true / false
NocoDB version : 
Database used in NC_DB URL  : mysql | pg | mssql | sqlite3 / (defaults to sqlite3 if empty)
Project was created  by clicking : New Project | New Project by connecting to external database
Database on which spreadsheet is created : mysql | pg | mssql | sqlite3 / (defaults to sqlite3 if empty)
OS on which NocoDB is running : 
Node.js version if running as node : 
Database version : 

Steps To Reproduce

1. Use v-treeview in nocodb gui
2. Access that gui page where it is used
3. Page will break

[o1lab]

Sorry, if this is custom implementation you would have to debug this yourself.

[o1lab]

Moving to discussion.

[AztrexDX]

I am just saying something in code has changed that breaks using of v-treeview in nocodb. Even using it is breaking the code. I will debug it

[o1lab]

We moved away from treeview sometime ago. We use v-listview. Hope that clarifies.