# AlertsComponent

**Kind:** Class

**Source:** `Pams/Web/Pams.Web/Client/app/components/shared/alerts/alerts.component.ts` (line 14)

**Part of:** [Pams](subsystem-pams)

`AlertsComponent` is an Angular shared component that exposes actions for displaying standard, error, and translated alerts. It initializes alert-related behavior during `ngOnInit` and releases subscriptions or related resources during `ngOnDestroy`.

**Implements:** `OnInit`

## Methods

| Method | Signature | Returns |
|---|---|---|
| `ngOnInit` | `ngOnInit()` | `void` |
| `goAlertError` | `goAlertError(type: string, msg: any, msgList: string[], icon: boolean, timeOut: number, withCloseButton: boolean)` | `void` |
| `goAlert` | `goAlert(type: string, msg: any, icon: boolean, timeOut: number, withCloseButton: boolean)` | `void` |
| `goTranslatedAlert` | `goTranslatedAlert(type: string, msg: AlertMsg, icon: boolean, timeOut: number, withCloseButton: boolean)` | `void` |
| `ngOnDestroy` | `ngOnDestroy()` | `void` |

## Properties

| Property | Type |
|---|---|
| `openedAlert` | `boolean` |
| `isLoading` | `boolean` |
| `alertsHolder` | `ElementRef` |
| `subscription` | `Subscription` |

## Diagram

```mermaid
graph LR
    Template[Angular Template] --> Component[AlertsComponent]
    Component --> Init[ngOnInit]
    Component --> Error[goAlertError]
    Component --> Alert[goAlert]
    Component --> Translated[goTranslatedAlert]
    Component --> Destroy[ngOnDestroy]
    Error --> AlertSystem[Alert handling]
    Alert --> AlertSystem
    Translated --> AlertSystem
```

## Usage

```html
<!-- alerts.component.html -->
<button type="button" (click)="goAlert()">
  Show alert
</button>

<button type="button" (click)="goAlertError()">
  Show error alert
</button>

<button type="button" (click)="goTranslatedAlert()">
  Show translated alert
</button>
```

```ts
import { Component } from '@angular/core';

@Component({
  selector: 'app-alert-demo',
  templateUrl: './alerts.component.html',
})
export class AlertDemoComponent {
  // AlertsComponent methods are intended to be called from its template.
}
```

## AI Coding Instructions

- Keep alert-triggering behavior in `goAlertError`, `goAlert`, and `goTranslatedAlert` rather than duplicating alert logic in templates.
- Preserve Angular lifecycle handling in `ngOnInit` and `ngOnDestroy`, especially when adding subscriptions or event listeners.
- Use `goTranslatedAlert` when alert text must pass through the application translation flow.
- Keep template click handlers mapped to public component methods.

## Used by

99 references from 99 files. Each is a place in this repository where the symbol is actually used — go read one rather than trusting an example.

### Imported by (99)

- `AppComponent` — `Pams/Web/Pams.Web/Client/app/app.component.ts`:1
- `TranslateHandler` — `Pams/Web/Pams.Web/Client/app/app.module.ts`:1
- `MrqInquiryComponent` — `Pams/Web/Pams.Web/Client/app/components/MRQ/mrq-details/mrq-inquiry/mrq-inquiry.component.ts`:1
- `MrqListComponent` — `Pams/Web/Pams.Web/Client/app/components/MRQ/mrq-list/mrq-list.component.ts`:1
- `BillOfMaterialsListComponent` — `Pams/Web/Pams.Web/Client/app/components/bill-of-materials/bill-of-materials-list/bill-of-materials-list.component.ts`:1
- `BlogsComponent` — `Pams/Web/Pams.Web/Client/app/components/blogs/blogs.component.ts`:1
- `AccountManagersComponent` — `Pams/Web/Pams.Web/Client/app/components/configuration/account-managers/account-managers.component.ts`:1
- `BillingSettingsComponent` — `Pams/Web/Pams.Web/Client/app/components/configuration/billing-settings/billing-settings.component.ts`:1

…and 91 more.