feat(dialogs): Make dialogs look uniform

[tomfrenzel]

Every Dialog now has the same appearance

Steps how a Dialog now is being opened:

1. The displayDialog() method, which is located inside the Dialog Service, gets called.
   Currently, you'll have to add a parameter to displayDialog() that is being handled by a switch Statement.
2. The Service now opens the Dialog using the DialogsComponent as Template and passes the Dialog Configuration (such as Size, Title, Content, and Additional Data).
   As Content, a Component is being set.
   

Layout of the Dialog

The Dialog component (red) serves as the Template. It Includes title, close button, and a view container (orange). The view container displays the component which was set inside the Service.

What needs to be done/changed

1. The Profile picture enlargement dialog hast to be tested since I wasn't able to do so on my local environment.
2. The current method using a Switch Statement to open the different dialogs isn't the most elegant way to do so. Let me know if you have any ideas on how to open the Dialog and pass its parameters properly or just make commits by yourself

Closes #411

[tomfrenzel]

@all-contributors please add @tomfrenzel for code

[allcontributors]

@tomfrenzel

I've put up a pull request to add @tomfrenzel! 🎉

[mmsgithub-ci]

Preview Environment ready at https://pr-640.demo-phonebook.me

[mmsgithub-ci]

Preview Environment ready at https://pr-640.demo-phonebook.me

[mmsgithub-ci]

Preview Environment ready at https://pr-640.demo-phonebook.me

[mmsgithub-ci]

Preview Environment ready at https://pr-640.demo-phonebook.me

[mmsgithub-ci]

Preview Environment ready at https://pr-640.demo-phonebook.me

[mmsgithub-ci]

Preview Environment ready at https://pr-640.demo-phonebook.me

[mmsgithub-ci]

Preview Environment ready at https://pr-640.demo-phonebook.me

[mmsgithub-ci]

Preview Environment ready at https://pr-640.demo-phonebook.me

[mschwrdtnr]

should the code rather moved to the folder /shared @DanielHabenicht ?

[tomfrenzel]

@DanielHabenicht @mschwrdtnr would you review my code again so this PR can be merged

[mmsgithub-ci]

Preview Environment ready at https://pr-640.demo-phonebook.me

[DanielHabenicht]

should the code rather moved to the folder /shared @DanielHabenicht ?

yep I think so. There is even an existing folder shared/dialogs

[DanielHabenicht]

Overall, I think to split a dialog into different components (header, footer, main) makes it really difficult to program a dialog, as you have to think about handling events between those. (and as you may have already experienced).

Also Bundling every dialog into the service loads every dialog at startup, which loads other lazy-loaded components. Which effectively runs lazy loading useless.

Also, this shifts complexity only to a central service, which effectively does the same as before but centralized. (e.g. instead of referencing the component, you now reference a string - essentially the same).

What about an easier approach of just using a template (via Content-projection) for each dialog which enforces the layout?
And settings sensible defaults in MAT_DIALOG_DEFAULT_OPTIONS

Let's have a chat before continuing.

[tomfrenzel]

sounds good

[paule96]

this PR will be closed because we start with a new architecture. (see last comment of daniel)

[paule96]

this PR will be closed because we start with a new architecture. (see last comment of daniel)