Skip to content

Commit

Permalink
refactor(command): rename command without create prefix (#12)
Browse files Browse the repository at this point in the history
  • Loading branch information
stephenlautier authored Jan 21, 2025
1 parent 29c5ab6 commit a3b6213
Show file tree
Hide file tree
Showing 4 changed files with 17 additions and 19 deletions.
4 changes: 2 additions & 2 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
@@ -1,8 +1,8 @@
## 3.0.0 (2024-11-21)
## 3.0.0 (2025-01-21)

### 🚀 Features

- **command:** add `createCommand`/`createCommandAsync` which handles auto destroy with `DestroyRef`
- **command:** add `command`/`commandAsync` which handles auto destroy with `DestroyRef`
- **command:** canExecute signal support
- **deps:** update angular 17
- **ux viewport:** add module `SsvUxViewportModule`
Expand Down
4 changes: 2 additions & 2 deletions apps/test-app/src/app/command/example-command.component.ts
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ import { MatIconModule } from "@angular/material/icon";
import { MatProgressSpinnerModule } from "@angular/material/progress-spinner";

import { BehaviorSubject, timer, Observable, tap, filter, map, distinctUntilChanged } from "rxjs";
import { CommandAsync, createCommandAsync, SsvCommandModule } from "@ssv/ngx.command";
import { CommandAsync, commandAsync, SsvCommandModule } from "@ssv/ngx.command";
import { CommonModule } from "@angular/common";

interface Hero {
Expand Down Expand Up @@ -54,7 +54,7 @@ export class ExampleCommandComponent {
this.saveRedux.bind(this),
this.isValidRedux$,
);
readonly containerDestroySaveCmd = createCommandAsync(() => this.save$());
readonly containerDestroySaveCmd = commandAsync(() => this.save$());

heroes: Hero[] = [
{ key: "rexxar", name: "Rexxar" },
Expand Down
19 changes: 8 additions & 11 deletions libs/ngx.command/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -31,18 +31,15 @@ Choose the version corresponding to your Angular version:
In order to start working with Command, you need to create a new instance of it.

```ts
import { Command, CommandAsync, ICommand } from "@ssv/ngx.command";
import { command, commandAsync } from "@ssv/ngx.command";

isValid$ = new BehaviorSubject(false);

// use `CommandAsync` when execute function returns an observable/promise OR else 3rd argument must be true.
saveCmd = new Command(() => this.save()), this.isValid$);
// non async
saveCmd = command(() => this.save()), this.isValid$);

// using CommandAsync
saveCmd = new CommandAsync(() => Observable.timer(2000), this.isValid$);

// using ICommand interface
saveCmd: ICommand = new CommandAsync(() => Observable.timer(2000), this.isValid$);
// async - returns an observable/promise.
saveCmd = commandAsync(() => Observable.timer(2000), this.isValid$);
```

## Command Attribute (Directive)
Expand Down Expand Up @@ -135,12 +132,12 @@ In order to use with `NgForm` easily, you can use the following utility method.
This will make canExecute respond to `form.valid` and for `form.dirty` - also can optionally disable validity or dirty.

```ts
import { CommandAsync, canExecuteFromNgForm } from "@ssv/ngx.command";
import { commandAsync, canExecuteFromNgForm } from "@ssv/ngx.command";

loginCmd = new CommandAsync(x => this.login(), canExecuteFromNgForm(this.form));
loginCmd = commandAsync(x => this.login(), canExecuteFromNgForm(this.form));

// options - disable dirty check
loginCmd = new CommandAsync(x => this.login(), canExecuteFromNgForm(this.form, {
loginCmd = commandAsync(x => this.login(), canExecuteFromNgForm(this.form, {
dirty: false
}));

Expand Down
9 changes: 5 additions & 4 deletions libs/ngx.command/src/command.ts
Original file line number Diff line number Diff line change
Expand Up @@ -14,28 +14,29 @@ export type CanExecute = Signal<boolean> | Observable<boolean>;
/** Creates an async {@link Command}. Must be used within an injection context.
* NOTE: this auto injects `DestroyRef` and handles auto destroy. {@link ICommand.autoDestroy} should not be used.
*/
export function createCommandAsync(
export function commandAsync(
execute: ExecuteAsyncFn,
canExecute$?: CanExecute,
): Command {
return createCommand(execute, canExecute$, true);
return command(execute, canExecute$, true);
}

/** Creates a {@link Command}. Must be used within an injection context.
* NOTE: this auto injects `DestroyRef` and handles auto destroy. {@link ICommand.autoDestroy} should not be used.
*/
export function createCommand(
export function command(
execute: ExecuteFn,
canExecute$?: CanExecute,
isAsync?: boolean,
): Command {
// todo: add injector/destroyRef to the command (needs overload)
const destroyRef = inject(DestroyRef);

const cmd = new Command(execute, canExecute$, isAsync);
cmd.autoDestroy = false;

destroyRef.onDestroy(() => {
// console.warn("[createCommandAsync::destroy]");
// console.warn("[command::destroy]");
cmd.destroy();
});
return cmd;
Expand Down

0 comments on commit a3b6213

Please sign in to comment.