# rxjs-sub-manager

> rxjs subscription manager

Latest version **1.0.13** (published 2022-09-05) · ISC license · 0 weekly downloads

## Install

```sh
npm install rxjs-sub-manager
pnpm add rxjs-sub-manager
yarn add rxjs-sub-manager
bun add rxjs-sub-manager
```

## Health

**Score 25/100 (F)** — status: abandoned.

Positive: has types; no vulnerabilities; high quality score.

Warnings: low downloads; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.13 |
| Published | 2022-09-05 |
| First published | 2022-08-16 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | bundled |
| Module format | CommonJS |
| Dependencies | 1 |
| Unpacked size | 19.3 KB |
| Known vulnerabilities | 0 (+1 in 1 direct dependencies) |
| Install scripts | no |
| GitHub stars | 0 |
| Author | gustavo_damazio |
| Maintainers | gustavodamazio |
| Keywords | rxjs, subscription, observable, manager, angular |

## Links

- npm: https://www.npmjs.com/package/rxjs-sub-manager
- Repository: https://github.com/gustavodamazio/rxjs-subscription-manager
- Homepage: https://github.com/gustavodamazio/rxjs-subscription-manager#readme
- Issues: https://github.com/gustavodamazio/rxjs-subscription-manager/issues
- npm.io page: https://npm.io/package/rxjs-sub-manager

## Dependencies (1)

- [uuid](https://npm.io/package/uuid.md) ^8.3.2

## Recent versions

- 1.0.13 (latest) — 2022-09-05
- 1.0.12 — 2022-09-05
- 1.0.11 — 2022-09-05
- 1.0.10 — 2022-09-05
- 1.0.9 — 2022-09-05
- 1.0.8 — 2022-09-04
- 1.0.7 — 2022-09-03
- 1.0.6 — 2022-09-01
- 1.0.4 — 2022-08-16
- 1.0.3 — 2022-08-16
- 1.0.2 — 2022-08-16

## README

# rxjs-sub-manager (rxjs subscription manager)

## 💻 Description

This lib aims to:

-   Manage observable rxjs subscriptions simply and consistently.
-   Avoid memory leaks.
-   Avoid the need to unsubscribe manually.

## 🪟 Preview example

-   [Demo site](https://rxjs-sub-manager.web.app/parent-child)
-   [Demo site source Code](https://github.com/gustavodamazio/rxjs-sub-manager-site.git)

<img src="https://raw.githubusercontent.com/gustavodamazio/rxjs-subscription-manager/main/docs/img/sub-manager-demo-site-screenshoot.png" alt="sub-manager-demo-site-screenshoot" width="400"/>

## 📦 Installation

```bash
$ npm install rxjs-sub-manager
or
$ yarn add rxjs-sub-manager
```

## 🚀 Usage

-   the **examples were made using angular**, however the library is agnostic of any framework it just depends on `rxjs` to work.

### 1. Import the lib

```typescript
import { SubscriptionManager } from 'rxjs-sub-manager';
```

### 2. Create a subscription manager instance

```typescript
export class ParentComponent {
    private readonly subscriptionManager = new SubscriptionManager<string>({
        prefixId: 'ParentComponent-',
    });
}
```

### 3. Subscribe to an observable

```typescript
export class ParentComponent implments OnInit {
    // ...
    private readonly observable1$ = interval(1000);

    ngOnInit() {
        this.subscriptionManager.add({
            ref: 'observable1',
            sub: this.observable1$.subscribe((value) => {
                console.log(value);
            }),
        });
    }
}
```

### 4. Unsubscribe from an observable triggers

#### 4.1. Unsubscribe from especific observable

```typescript
this.subscriptionManager.close('observable1');
```

#### 4.2. Unsubscribe from all observables

```typescript
this.subscriptionManager.closeAll();
```

### 5. Unsubscribe from all observables when component is destroyed

```typescript
export class ParentComponent implements OnInit, OnDestroy {
    // ...
    ngOnDestroy(): void {
        this.subscriptionManager.destroy();
    }
}
```

### 6. Check observables

```typescript
this.subscriptionManager.hasActive('observable1'); // true
this.subscriptionManager.hasActive('observable2'); // false

this.subscriptionManager.activeSubs$; // Observable<Map<string, SubscriptionManagerRef<string>[]>>;
this.subscriptionManager.activeSubsValue; // Map<string, SubscriptionManagerRef<string>[]>;

this.subscriptionManager.closedSubs$; // Observable<Map<string, SubscriptionManagerRef<string>[]>>;
this.subscriptionManager.closedSubsValue; // Map<string, SubscriptionManagerRef<string>[]>;

this.subscriptionManager.allSubs$; // Observable<{
//    active: Map<string, SubscriptionManagerRef<string>[]>;
//    closed: Map<string, SubscriptionManagerRef<string>[]>;
//}>
```

### 7. check instance ID

```typescript
this.subscriptionManager.instanceId; // string
```

### 8. (Extra) check and control global public context

```typescript
import { SubscriptionManagerPublicContext } from 'rxjs-sub-manager';
export class AppComponent implements OnInit {
    private readonly subscriptionManager = new SubscriptionManager({
        prefixId: 'AppComponent-',
    });
    public readonly rootSubsSize$ = new BehaviorSubject<number>(0); // <-- this is total
    // number of active subscriptions in the app global context
    ngOnInit(): void {
        const sub =
            SubscriptionManagerPublicContext.subscriptionManagerInstances.subscribe(
                (instances) => {
                    this.subscriptionManager.close('rootSubsSize$');
                    const sub = combineLatest(
                        Array.from(instances.values()).map((v) => v.activeSubs$)
                    )
                        .pipe(debounceTime(100))
                        .subscribe((v) => {
                            const size = v.reduce((acc, sm) => {
                                return acc + sm.size;
                            }, 0);
                            this.rootSubsSize$.next(size);
                        });
                    this.subscriptionManager.add({ ref: 'rootSubsSize$', sub });
                }
            );
        this.subscriptionManager.add({
            ref: 'subscriptionManagerInstances$',
            sub,
        });
    }
    ngOnDestroy(): void {
        this.subscriptionManager.destroy();
    }
}
```

## 📝 License

[MIT](LICENSE)

## 👨🏻‍💻 Author

-   Made with ❤️ by [Gustavo Damazio](https://github.com/gustavodamazio)👋🏻

---
_Source: https://npm.io/package/rxjs-sub-manager · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._