Add ADR 0009 for frontend directory structure

adr/0009-frontend-directory-structure-and-architecture.md

@@ -0,0 +1,70 @@
+# 9. Frontend directory structure and architecture
+
+Date: 2023-05-16
+
+## Status
+
+Accepted
+
+## Context
+
+Our software project has a frontend that needs to be organized to facilitate maintenance, scalability, modularity, and ease of navigation. The current directory structure is outdated and hard to manage. As software engineers, we propose a new directory structure based on some criteria.
+
+We studied [Redux' documentation](https://redux.js.org/faq/code-structure/) about common patterns for project structures.
+
+Most of the discussion happened reviewing [web/#1355](https://github.com/trento-project/web/pull/1355).
+
+## Decision
+
+We propose the following new directory structure for the frontend of our software project:
+
+```
+assets/js
+├── app.js
+├── common
+│   ├── Banners
+│   ├── Button
+│   │   ├── Button.js
+│   │   ├── Button.stories.js
+│   │   ├── Button.test.js
+│   │   └── index.js
+│   ├── ListView
+│   ├── Modal
+│   ├── ObjectTree
+│   ├── Table
+│   ├── Tags
+│   └── Tooltip
+├── pages
+│   ├── AboutPage
+│   ├── ChecksCatalog
+│   ├── ClusterDetails
+│   ├── DatabaseDetails
+│   ├── DatabasesOverview
+│   ├── ExecutionResults
+│   ├── Health
+│   ├── HealthSummary
+│   ├── Home
+│   └── HostDetails
+├── hooks
+├── lib
+├── state
+│   ├── sagas
+│   │   ├── clusters.js
+│   │   ├── clusters.test.js
+│   │   └── index.js
+│   ├── selectors
+│   │   ├── clusters.js
+│   │   ├── clusters.test.js
+│   │   └── index.js
+│   ├── clusters.js
+│   ├── clusters.test.js
+└── trento.jsx
+```
+
+Note that `/common` contains truly generic and reusable utilities and components.
+
+## Consequences
+
+There may be some overhead associated with restructuring the frontend, such as updating dependencies, fixing references, or rewriting some parts of the application. However, in the long term, this new directory structure will ensure an organized and efficient system that can be easily maintained, scaled, and navigated. The new structure will also facilitate collaboration between developers as they will have a better understanding of where everything is located.
+
+We have one drawback: action creators related to sagas now live along with slices and action creators generated by redux-toolkit. We found reasonable to have action creators all stuffed in one specific place, but it is well understood that it might not be the case for everyone.