Feature/modal component

[hermannleboss]

Description

Demo of refactoring modal component with an usage

Fixes # (issue)

Type of change

Please delete options that are not relevant.

• [ ] Bug fix (non-breaking change which fixes an issue)
• [ ] New feature (non-breaking change which adds functionality)
• [ ] Breaking change (fix or feature that would cause existing functionality to not work as expected)
• [ ] This change requires a documentation update

Checklist:

• Please check if the PR fulfills these requirements

• [ ] The commit message follows our guidelines

• [ ] Tests for the changes have been added (for bug fixes/features)

• [ ] Docs have been added / updated (for bug fixes / features)

[codecov[bot]]

Codecov Report

Attention: Patch coverage is 47.72727% with 23 lines in your changes missing coverage. Please review.

Project coverage is 25.88%. Comparing base (6ff7427) to head (92c51ac). Report is 1 commits behind head on develop.

Files	Patch %	Lines
app/src/components/ModalComponent.vue	16.66%	7 Missing and 3 partials :warning:
app/src/App.vue	36.36%	5 Missing and 2 partials :warning:
app/src/components/modals/EditUserForm.vue	58.33%	4 Missing and 1 partial :warning:
app/src/components/TheDrawer.vue	88.88%	1 Missing :warning:

Additional details and impacted files

```diff @@ Coverage Diff @@ ## develop #195 +/- ## =========================================== - Coverage 26.97% 25.88% -1.09% =========================================== Files 82 67 -15 Lines 1583 1240 -343 Branches 345 280 -65 =========================================== - Hits 427 321 -106 + Misses 983 788 -195 + Partials 173 131 -42 ``` | [Flag](https://app.codecov.io/gh/globe-and-citizen/cnc-portal/pull/195/flags?src=pr&el=flags&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=globe-and-citizen) | Coverage Δ | | |---|---|---| | [api-unit-tests](https://app.codecov.io/gh/globe-and-citizen/cnc-portal/pull/195/flags?src=pr&el=flag&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=globe-and-citizen) | `?` | | | [app-unit-tests](https://app.codecov.io/gh/globe-and-citizen/cnc-portal/pull/195/flags?src=pr&el=flag&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=globe-and-citizen) | `25.88% <47.72%> (-0.90%)` | :arrow_down: | Flags with carried forward coverage won't be shown. [Click here](https://docs.codecov.io/docs/carryforward-flags?utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=globe-and-citizen#carryforward-flags-in-the-pull-request-comment) to find out more.

:umbrella: View full report in Codecov by Sentry.
:loudspeaker: Have feedback on the report? Share it here.