# ComponentCanDeactivate

**Kind:** Class

**Source:** `Pams/Web/Pams.Web/Client/app/pipes/CanDeactivateGuard.ts` (line 5)

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

`ComponentCanDeactivate` defines a `canDeactivate()` check for components that participate in deactivation decisions. Callers use the boolean result to determine whether the current component can be left.

## Methods

| Method | Signature | Returns |
|---|---|---|
| `canDeactivate` | `canDeactivate()` | `boolean` |

## Diagram

```mermaid
graph LR
  Component[ComponentCanDeactivate] --> Check[canDeactivate()]
  Check --> Result{boolean result}
  Result -->|true| Allow[Allow deactivation]
  Result -->|false| Block[Block deactivation]
```

## Usage

```ts
import { ComponentCanDeactivate } from "./CanDeactivateGuard";

class EditorComponent extends ComponentCanDeactivate {
  private hasUnsavedChanges = true;

  canDeactivate(): boolean {
    return !this.hasUnsavedChanges;
  }
}

const editor = new EditorComponent();

if (editor.canDeactivate()) {
  console.log("Component can be deactivated.");
} else {
  console.log("Stay on the current component.");
}
```

## AI Coding Instructions

- Keep `canDeactivate()` synchronous and return a boolean.
- Override `canDeactivate()` in components that need to prevent leaving when state is incomplete or unsaved.
- Return `true` only when the component may be deactivated; return `false` to block the action.
- Keep deactivation checks focused on component state rather than navigation side effects.

## Used by

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

### Imported by (20)

- `NewBranchComponent` — `Pams/Web/Pams.Web/Client/app/components/configuration/company/main-branch/new.branch.component.ts`:1
- `DashboardSettingsDetailsComponent` — `Pams/Web/Pams.Web/Client/app/components/configuration/dashboard-settings/dashboard-settings-details/dashboard-settings-details.component.ts`:1
- `ReportsSettingsDetailsComponent` — `Pams/Web/Pams.Web/Client/app/components/configuration/reports-settings/reports-settings-details/reports-settings-details.component.ts`:1
- `ProductSerialCombinationComponent` — `Pams/Web/Pams.Web/Client/app/components/configuration/serials-compinations/product-serial-combination/product-serial-combination.component.ts`:1
- `SerialCombinationFormComponent` — `Pams/Web/Pams.Web/Client/app/components/configuration/serials-compinations/serial-combination/serial-combination-form/serial-combination-form.component.ts`:1
- `NewActivityComponent` — `Pams/Web/Pams.Web/Client/app/components/dashboard/my-desk/activities/new-activity/new-activity.component.ts`:1
- `NewTasksComponent` — `Pams/Web/Pams.Web/Client/app/components/dashboard/my-desk/tasks/new-tasks/new-tasks.component.ts`:1
- `InvoiceDetailsComponent` — `Pams/Web/Pams.Web/Client/app/components/invoices/invoice-details/invoice-details.component.ts`:1

…and 12 more.