Research
Security News
Quasar RAT Disguised as an npm Package for Detecting Vulnerabilities in Ethereum Smart Contracts
Socket researchers uncover a malicious npm package posing as a tool for detecting vulnerabilities in Etherium smart contracts.
@ngxs-contrib/emitter
Advanced tools
This package allows you to get rid of actions to make changes to the store. You're able to use decorators to register actions directly in your state, you should not create any actions in your project, as they don't give any profit, only bring extra boiler
This package allows you to get rid of actions to make changes to the store. You're able to use decorators to register actions directly in your state, you should not create any actions in your project, as they don't give any profit, only bring extra boilerplate files.
To get started install this package from npm.
npm install @ngxs-contrib/emitter
# or with yarn
yarn add @ngxs-contrib/emitter
After installation - import the NgxsEmitPluginModule
into your app.module.ts
:
import { NgModule } from '@angular/core';
import { NgxsEmitPluginModule } from '@ngxs-contrib/emitter';
@NgModule({
imports: [
...,
NgxsEmitPluginModule.forRoot()
]
})
export class AppModule {}
Emitter is just a single function that can be used to decorate static methods of your states, this will add extra static metadata.
import { State } from '@ngxs/store';
import { Emitter, EmitterAction } from '@ngxs-contrib/emitter';
export interface CounterStateModel {
value: number;
}
@State<CounterStateModel>({
name: 'counter',
defaults: {
value: 0
}
})
export class CounterState {
@Emitter()
public static setValue({ setState }, { payload }: EmitterAction<number>) {
setState({
value: payload
});
}
}
@PayloadEmitter
is a decorator that will define getter for the decorated property. You will get an
access to the emittable object.
import { Select } from '@ngxs/store';
import { PayloadEmitter, Emittable } from '@ngxs-contrib/emitter';
@Component({
selector: 'app-counter',
template: `
<ng-container *ngIf="count$ | async as count">
<h3>Count is {{ count.value }}</h3>
<div class="add-counter">
<button (click)="counterValue.emit(count.value + 1)">Increment (+1)</button>
<button (click)="counterValue.emit(count.value - 1)">Decrement (-1)</button>
</div>
</ng-container>
`
})
export class CounterComponent {
// Reads the name of the state from the state class
@Select(CounterState)
public count$: Observable<number>;
// Use in components to emit asynchronously payload
@PayloadEmitter(CounterState.setValue)
public counterValue: Emittable<number>;
}
@Emitter
decoratorIf you want to subscribe to the changes, you can easily do this. You can also use the action method in store. Also you can access the dependencies with the injector.
import { State } from '@ngxs/store';
import { Injector } from '@angular/core';
import { Emitter } from '@ngxs-contrib/emitter';
@State<CounterStateModel>({
name: 'counter',
defaults: {
value: 0
}
})
export class CounterState {
public static api: ApiService;
constructor(injector: Injector) {
CounterState.api = injector.get<ApiService>(ApiService);
}
@Emitter()
public static loadData({ setState }) {
// Some heavy function
return this.api.getValueFromServer().pipe(
tap((value: number) => setState({ value }))
);
}
}
import { Select } from '@ngxs/store';
import { PayloadEmitter, Emittable } from '@ngxs-contrib/emitter';
@Component({
selector: 'app-count'
template: `
<ng-container *ngIf="count$ | async as count">
<h3>
Count is {{ count.value }}
<span *ngIf="isLoading">loading...</span>
</h3>
<div class="add-counter">
<button (click)="loadData()">Load data from server</button>
</div>
</ng-container>
`
})
export class CounterComponent {
@Select(CounterState)
public count$: Observable<CounterStateModel>;
public isLoading = false;
@PayloadEmitter(CounterState.loadData)
public loadData: Emittable<void>;
public loadCountData() {
this.isLoading = true;
this.loadData.emit().subscribe(() => {
this.isLoading = false;
});
}
}
FAQs
Unknown package
The npm package @ngxs-contrib/emitter receives a total of 1 weekly downloads. As such, @ngxs-contrib/emitter popularity was classified as not popular.
We found that @ngxs-contrib/emitter demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 3 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Research
Security News
Socket researchers uncover a malicious npm package posing as a tool for detecting vulnerabilities in Etherium smart contracts.
Security News
Research
A supply chain attack on Rspack's npm packages injected cryptomining malware, potentially impacting thousands of developers.
Research
Security News
Socket researchers discovered a malware campaign on npm delivering the Skuld infostealer via typosquatted packages, exposing sensitive data.