Skip to content

Commit

Permalink
update app architecture
Browse files Browse the repository at this point in the history
added InstitutionList to component tree
  • Loading branch information
skorphil committed Feb 9, 2024
1 parent 0fcdd63 commit c11b6c4
Show file tree
Hide file tree
Showing 3 changed files with 19 additions and 5 deletions.
1 change: 1 addition & 0 deletions .env
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
CHROMATIC_KEY="chpt_9d08845ed76c2f2"
2 changes: 1 addition & 1 deletion README.md
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ Educational project to practice React form handling.

## Table Of Contents
- [Project Task](docs/project-task.md)
- [Project Architecture](docs/project-architecture.md)
- [App Architecture](docs/app-architecture.md)
- [Project Structure](docs/project-structure.md)
- [Learned topics](docs/learned-topics.md)
- [Project Management](https://github.com/users/skorphil/projects/4)
Expand Down
21 changes: 17 additions & 4 deletions docs/project-architecture.md → docs/app-architecture.md
Original file line number Diff line number Diff line change
@@ -1,39 +1,52 @@
# Project architecture
# App architecture


## Component tree
```mermaid
flowchart TB
RecordForm -->
TabsList & FormHeader
TabsList -->
InstitutionTab & InstitutionContainer
InstitutionsList & FormHeader
InstitutionsList -->
TabsList & InstitutionContainer
TabsList --> InstitutionTab
InstitutionContainer -->
AssetContainer
```


### RecordForm
Structural component. Will render Header Tabs, InstitutionContainer accordingly to state:
- `isKeyboardOpen`
- `isInstitutionContainerExpanded`


### FormHeader
Stateless component. Contains *submit* and *cancel* buttons


### TabsList
Statless component. Can be `collapsed` and `expanded`


### InstitutionTab
Statless component. Can show institution states:
- `new`
- `updated`
- `deleted`


### InstitutionContainer
Can be `collapsed` and `expanded`


### AssetContainer
Can be `collapsed` and `expanded`


### InstitutionsList
Wrap `InstitutionContainer`s and `TabsList`.
Basically `Tabs` component from ChakraUI


## Fetching initial data
I wanna try RSC for this

0 comments on commit c11b6c4

Please sign in to comment.