Angular Modal Service Pattern

A custom service wraps Angular Material's MatDialog and exposes two semantically distinct methods:

• openModal(component, options) — full-width/full-height overlay, reserved for edit and modify actions
• openPopup(component, options) — developer-controlled width/height, used for warnings and secondary overlays stacked on top of an already-open modal

Both methods accept:

• The component to render inside the overlay
• An options object controlling title, subtitle, width/height (popup only), data bound to the wrapped component via Angular Material's MAT_DIALOG_DATA injectable, and disableClose (whether outside clicks dismiss the overlay)

The abstraction centralizes dialog configuration and enforces a consistent semantic distinction across the application: modals own the full viewport for significant edits; popups are lightweight and stackable.