feat: add dynamic table columns on resource page #181
Conversation
…e-page' of https://github.com/tenseijs/tensei into malikoabdulaziz/cms-17-dynamic-table-columns-on-resource-page
| @@ -26,6 +26,7 @@ import { | |||
| filterClauses, | |||
| FilterClause | |||
| } from '../../../store/resource' | |||
| import { truncate } from 'lodash' | |||
There was a problem hiding this comment.
I don't think we need this function here. Also quick note, you won't wanna use lodash in your project coz there's most likely a better way. And ... if you were actually gonna use lodash, its better to import using import truncate from 'lodash/truncate', that way we enjoy tree shaking from webpack, pulling in only required functions from the package.
But yeah, we don't need it in this case 😅
There was a problem hiding this comment.
it was auto import, lol forgot to clear it.
| field: 'nationality' | ||
| }, | ||
| ...(resource?.fields | ||
| .filter((resource, idx) => resource.showOnIndex && idx != 0) |
There was a problem hiding this comment.
We are looping through resource?.fields, so a better variable name should be field and not resource. Also, even if it was supposed to be resource, we'll have to give it another name, so as to avoid shadow variables. since we have another variable called resource, it's not easily understandable to have another variable with same name.
So here, I suggest we have (resource?.fields.filter((field, idx) => field.showOnIndex)
There was a problem hiding this comment.
Thanks, i will implement.
| field: 'nationality' | ||
| }, | ||
| ...(resource?.fields | ||
| .filter((resource, idx) => resource.showOnIndex && idx != 0) |
There was a problem hiding this comment.
Quick question, why idx != 0? Also, in future, it's much recommended to check using !== if you need to. Its a much more exact search and better for code predictability.
There was a problem hiding this comment.
I noticed the ID field was not shown in the example, so I filtered it. I can put it back if it is required.
| ...(resource?.fields | ||
| .filter((resource, idx) => resource.showOnIndex && idx != 0) | ||
| .map(resource => ({ | ||
| field: resource.name, |
There was a problem hiding this comment.
So the field here would be the name of how the data is returned from the API, it'll be field: field.databaseField.
|
@Placeholder30 one more thing to note. In the Filter component we have, have a look at the |
| ...(resource?.fields | ||
| .filter(field => field.showOnIndex) | ||
| .map(field => ({ | ||
| field: field.name, |
There was a problem hiding this comment.
You mixed it up 😬 . field is field.databaseField and name is field.name
There was a problem hiding this comment.
sorry, I'll fix it.
No description provided.