mirror of
https://github.com/bitwarden/browser.git
synced 2024-12-20 16:07:45 +01:00
* Rename service-factory folder
* Move cryptographic service factories
* Move crypto models
* Move crypto services
* Move domain base class
* Platform code owners
* Move desktop log services
* Move log files
* Establish component library ownership
* Move background listeners
* Move background background
* Move localization to Platform
* Move browser alarms to Platform
* Move browser state to Platform
* Move CLI state to Platform
* Move Desktop native concerns to Platform
* Move flag and misc to Platform
* Lint fixes
* Move electron state to platform
* Move web state to Platform
* Move lib state to Platform
* Fix broken tests
* Rename interface to idiomatic TS
* `npm run prettier` 🤖
* Resolve review feedback
* Set platform as owners of web core and shared
* Expand moved services
* Fix test types
---------
Co-authored-by: Hinton <hinton@users.noreply.github.com>
104 lines
2.7 KiB
TypeScript
104 lines
2.7 KiB
TypeScript
import { Component } from "@angular/core";
|
|
import { action } from "@storybook/addon-actions";
|
|
import { Meta, StoryObj, moduleMetadata } from "@storybook/angular";
|
|
import { delay, of } from "rxjs";
|
|
|
|
import { LogService } from "@bitwarden/common/platform/abstractions/log.service";
|
|
import { ValidationService } from "@bitwarden/common/platform/abstractions/validation.service";
|
|
|
|
import { ButtonModule } from "../button";
|
|
import { IconButtonModule } from "../icon-button";
|
|
|
|
import { BitActionDirective } from "./bit-action.directive";
|
|
|
|
const template = `
|
|
<button bitButton buttonType="primary" [bitAction]="action" class="tw-mr-2">
|
|
Perform action
|
|
</button>
|
|
<button bitIconButton="bwi-trash" buttonType="danger" [bitAction]="action"></button>`;
|
|
|
|
@Component({
|
|
template,
|
|
selector: "app-promise-example",
|
|
})
|
|
class PromiseExampleComponent {
|
|
action = async () => {
|
|
await new Promise<void>((resolve, reject) => {
|
|
setTimeout(resolve, 2000);
|
|
});
|
|
};
|
|
}
|
|
|
|
@Component({
|
|
template,
|
|
selector: "app-observable-example",
|
|
})
|
|
class ObservableExampleComponent {
|
|
action = () => {
|
|
return of("fake observable").pipe(delay(2000));
|
|
};
|
|
}
|
|
|
|
@Component({
|
|
template,
|
|
selector: "app-rejected-promise-example",
|
|
})
|
|
class RejectedPromiseExampleComponent {
|
|
action = async () => {
|
|
await new Promise<void>((resolve, reject) => {
|
|
setTimeout(() => reject(new Error("Simulated error")), 2000);
|
|
});
|
|
};
|
|
}
|
|
|
|
export default {
|
|
title: "Component Library/Async Actions/Standalone",
|
|
decorators: [
|
|
moduleMetadata({
|
|
declarations: [
|
|
BitActionDirective,
|
|
PromiseExampleComponent,
|
|
ObservableExampleComponent,
|
|
RejectedPromiseExampleComponent,
|
|
],
|
|
imports: [ButtonModule, IconButtonModule],
|
|
providers: [
|
|
{
|
|
provide: ValidationService,
|
|
useValue: {
|
|
showError: action("ValidationService.showError"),
|
|
} as Partial<ValidationService>,
|
|
},
|
|
{
|
|
provide: LogService,
|
|
useValue: {
|
|
error: action("LogService.error"),
|
|
} as Partial<LogService>,
|
|
},
|
|
],
|
|
}),
|
|
],
|
|
} as Meta;
|
|
|
|
type PromiseStory = StoryObj<PromiseExampleComponent>;
|
|
type ObservableStory = StoryObj<ObservableExampleComponent>;
|
|
|
|
export const UsingPromise: PromiseStory = {
|
|
render: (args) => ({
|
|
props: args,
|
|
template: `<app-promise-example></app-promise-example>`,
|
|
}),
|
|
};
|
|
|
|
export const UsingObservable: ObservableStory = {
|
|
render: (args) => ({
|
|
template: `<app-observable-example></app-observable-example>`,
|
|
}),
|
|
};
|
|
|
|
export const RejectedPromise: ObservableStory = {
|
|
render: (args) => ({
|
|
template: `<app-rejected-promise-example></app-rejected-promise-example>`,
|
|
}),
|
|
};
|