Reuse cells in multiple components

Hi all,

Just getting started with Redwood and enjoying it so far! I’m currently trying to create a form which uses data from the db to populate a select field - “category”. I’ve already scaffolded a categories page etc. and therefore have a categories cell for that (which renders the list view on success).

I was wondering whether there was any way to reuse this cell, or if it’s best to create a new one to render the select field (even though it will be getting the same data), or even if there’s a better way.


If you’re using multiple components in the same cell, that’s not an issue. You can have many components in that cell that is getting data passed down from the cell query.

Thanks @Cromzinc, although I wouldn’t want both the categories list component and select field component rendered at the same time. Are you suggesting I use props or similar to conditionally render the desired component?

Currently I’ve gone for the second option of creating a separate cell for the select field. Seems a bit of duplication but perhaps not a huge problem…

You could extract the gql query and reuse/import that in your CategoriesCell that renders the list view and select list (if you want).

But, I suggest having a separate cell CategeoriesSelectList that fetches and renders the select list in the Success component.

1 Like

If I may expand this example
if I wanted to fetch multiple objects in the graphQl query and create a cell to do this i.e.

When generating a cell i.e. BoardOrganizationCell
perhaps the graphql looks similar to

export const QUERY = gql`
  query FindBoardOrganizationQuery(
    $orgRouteName: String!
    $boardRouteName: String!
  ) {
    board: board(routeName: $boardRouteName) {
    organization: organization(routeName: $orgRouteName) {

in the CLI we’ll get

↓ Generating types ... [skipped]
    → Skipping type generation: no SDL defined for "BoardOrganization". To generate types, run 'yarn rw g sdl BoardOrganization'.

And so the type definition generated is broken

import type {
} from 'types/graphql'

What is the right way to deal with this?