@bunnyapp/components 1.6.0-beta.1 → 1.6.0-beta.11

package/README.md

@@ -30,6 +30,56 @@ Ensure all peer dependencies in the package.json are installed.
 
 To run the development server, run `npm run dev`.
 
+### Folder structure
+
+Unfortunately, the current folder structure isn't perfect. The goal is to progressively (whenever making changes) to begin to follow a module oriented structure.
+
+This folder structure is inspired by [Twenty's frontend development folder architecture](https://docs.twenty.com/developers/frontend-development/folder-architecture-front#ui).
+
+**Structure**
+
+By following this folder architecture convention, it's easier to find the files related to specific features and ensure that the components are scalable and maintainable.
+
+```
+src/
+└───modules
+│   └───module1
+│   │   └───submodule1
+│   └───module2
+│   └───components
+│   │   └───display
+│   │   └───inputs
+│   │   │   └───buttons
+│   │   └───...
+└───...
+```
+
+**Modules**
+
+Each module represents a feature or a group of feature, comprising its specific components, states, and operational logic. They should all follow the structure below. You can nest modules within modules (referred to as submodules) and the same rules will apply.
+
+```
+module1
+├── components/
+│   └───stories/
+│   ├── component1/
+│   └── component2/
+├── constants/
+├── contexts/
+├── graphql/
+│   ├── fragments/
+│   ├── queries/
+│   └── mutations/
+├── hooks/
+├── types/
+└── utils/
+└── ...
+```
+
+**Interface and dependencies**
+
+You can import other module code from any module except for components exported in the index.ts file in the components folder. This will keep its code easy to test and maintain.
+
 ### Using gql.tada for typed queries and mutations
 
 We use [gql.tada](https://gql-tada.0no.co/get-started/) to automatically derive types from GraphQL queries and mutations.
@@ -54,6 +104,27 @@ npm run codegen
 npx gql-tada doctor
 ```
 
+### Deprecating @bunnyapp/common
+
+We are gradually deprecating `@bunnyapp/common` and moving types and enums locally to this repository. When something is moved from `@bunnyapp/common`, follow this pattern:
+
+1. **Create local definitions**:
+
+   - **Enums** → Create in `src/enums/` directory (e.g., `src/enums/SubscriptionState.ts`)
+   - **Types** → Create in `src/types/` directory (e.g., `src/types/billingDetails.ts`)
+
+2. **Update imports incrementally**: Only update the files that need the change. Other files can continue importing from `@bunnyapp/common` until they need to be updated.
+
+3. **Example pattern**:
+
+   ```typescript
+   // Before (from @bunnyapp/common)
+   import { SubscriptionState } from '@bunnyapp/common';
+
+   // After (local enum)
+   import SubscriptionState from '../enums/SubscriptionState';
+   ```
+
 ### Storybook stories
 
 To view the storybook stories, run `npx storybook dev`.