Where to place closely related typescript types?

Question

typescript

For example, there is a structure such a structure of components:

/Grid
  Grid.tsx
  GridItem.tsx

GridItem has a type:

type GridItemProps = {
  title: string;
  description: string;
}

Grid.tsx is of the following type:

type GridProps = {
  title: string;
  items: Array<GridItemProps>;
}

How correct is it in Grid to import the type from GridItem and use it. In which direction should the dependence be directed here? Or declare a type in Grid, and then customize the GridItem component to fit its requirements.

Answer 1

On a good note, the new type should be used here, not the existing GridItemProps.
Declare 1 more GridItem that will have the desired set of properties

Answer 2

Do not listen to Vasily Bannikov , you definitely don’t need to produce copy-paste types.
And in terms of the placement of types, the logic is exactly the same as with ordinary modules. So it's perfectly fine to import related types from a related module. All theories and design patterns apply here.
For good, of course, you should stick to SOLID or something like that.
Those. to Gridmake a type IGridItemPropswith those properties that are exactly needed for work Grid, and to GridIteminherit from it already a specific implementation

interface GridItemProps extends IGridItemProps { ... }

. However, this is only necessary if, theoretically, more GridItemSuperand can appear GrigItemNice, but if this cannot be and the modules (components) themselves are closely connected, then you should not bother.