docs(dialog): Add information about await and simultaneous usage (#2084)

* docs(dialog): Add information about await and simultaneous usage

* Update components/dialog/predefined.md

Co-authored-by: Yordan <[email protected]>

* docs(dialog): Polish new content

---------

Co-authored-by: Yordan <[email protected]>

components/dialog/header.md

@@ -26,10 +26,6 @@ You can control the close action via the `ShowCloseButton` parameter. Its defaul
 
 The following example demonstrates how to set up the title through a template. The close action button is also hidden.
 
->caption The result from the code snippet.
-
-![Blazor Dialog Header](images/dialog-header.png)
-
 >caption Title template and no close button in the Telerik Dialog.
 
 ````CSHTML

components/dialog/predefined.md

@@ -10,9 +10,12 @@ position: 2
 
 # Predefined Dialogs - Alert, Confirm, Prompt
 
-Telerik UI for Blazor provides styled substitutes to the standard confirm, alert, and prompt dialogs. These Blazor popup messages match the Theme of the components to make it obvious to the user that the modal dialog is coming from your application.
+Telerik UI for Blazor provides styled substitutes to the standard alert, confirm, and prompt dialogs of the browser. These Blazor popup messages match the Theme of the components to make it obvious to the user that the modal dialog is coming from your application.
 
-To use these dialogs (popup messages), receive a cascading parameter of type `Telerik.Blazor.DialogFactory`. It exposes the methods you can use in your method calls.
+
+## Using Predefined Dialogs
+
+To use the alert, confirm, and prompt dialogs (popup messages), receive a cascading parameter of type `Telerik.Blazor.DialogFactory`. This object exposes the methods you can use to display the predefined dialogs.
 
 <div class="skip-repl"></div>
 
@@ -21,14 +24,28 @@ To use these dialogs (popup messages), receive a cascading parameter of type `Te
 public DialogFactory Dialogs { get; set; }
 ````
 
-The predefined dialogs can only be used inside child Razor components of the [`TelerikRootComponent`]({%slug rootcomponent-overview%}). This is easily achieved in standard Blazor apps where the `TelerikRootComponent` resides inside the layout file. When [using UI for Blazor in ASP.NET apps]({%slug telerik-blazor-in-asp-net-app%}), an additional child component is needed.
-
 There are three available ready-made dialogs:
 
 * [Alert](#alert)
 * [Confirm](#confirm)
 * [Prompt](#prompt)
 
+### TelerikRootComponent Dependency
+
+The `DialogFactory` cascading parameter can only be consumed inside child Razor components of the [`TelerikRootComponent`]({%slug rootcomponent-overview%}#purpose). This is easily achieved in standard Blazor apps where the `TelerikRootComponent` resides inside the layout file.
+
+* To show predefined dialogs in `MainLayout.razor`, [add the `TelerikRootComponent` in a parent layout]({%slug rootcomponent-overview%}#using-telerikrootcomponent).
+* When [using UI for Blazor in ASP.NET apps]({%slug telerik-blazor-in-asp-net-app%}), an additional child component is needed.
+
+### Using await
+
+The `DialogFactory` methods must be awaited. Do not use them with [discard variables (`_`)](https://learn.microsoft.com/en-us/dotnet/csharp/fundamentals/functional/discards). If you don't need to await the user response, then [use the `<TelerikDialog>` component]({%slug dialog-overview%}) declaratively. 
+
+### Showing Multiple Predefined Dialogs
+
+The `DialogFactory` supports only one open popup dialog at a time. Showing multiple predefined dialogs simultaneously can result in unexpected app behavior. If a long asyncronous operation can end with the display of a `DialogFactory` popup, the application should prevent the user from triggering additional predefined dialogs before the time consuming operation completes. Consider a [LoaderContainer]({%slug loadercontainer-overview%}) to block the whole user interface or a [specific component]({%slug loadercontainer-overview%}#fill-a-parent-container).
+
+
 ## Alert
 
 The alert dialog is a Blazor popup message. It shows the user that something went wrong, such as a major error that requires their attention and blocks the UI, as opposed to a [notification]({%slug notification-overview%}) that is not modal and is small.
@@ -69,7 +86,6 @@ The alert dialog is a Blazor popup message. It shows the user that something wen
 }
 ````
 
-![Telerik Alert dialog first look](images/alert-first-look.gif)
 
 ## Confirm
 
@@ -118,8 +134,6 @@ The confirm dialog returns a `bool` value that indicates which button the user c
 }
 ````
 
-![Telerik Confirm dialog first look](images/confirm-first-look.gif)
-
 
 ## Prompt
 
@@ -176,10 +190,8 @@ The prompt dialog returns a `string` that the user enters when they press `OK`,
 }
 ````
 
-![Telerik Prompt dialog first look](images/prompt-first-look.gif)
-
 
 ## See Also
 
 * [Live Demo: Predefined Dialogs](https://demos.telerik.com/blazor-ui/dialog/predefined-dialogs)
-
+* [Using the `<TelerikDialog>` Component Declaratively]({%slug dialog-overview%})