# tester-ai

> [![Bintray](https://img.shields.io/badge/npm-cool-green)](https://www.npmjs.com/package/ng-conversational-ui) [![Bintray](https://img.shields.io/twitter/url?url=https%3A%2F%2Fgithub.com%2FAliShamin%2Fjs-async-operators)](https://twitter.com/ali_sshamin)

Latest version **0.0.25** (published 2021-09-29) · 0 weekly downloads

## Install

```sh
npm install tester-ai
pnpm add tester-ai
yarn add tester-ai
bun add tester-ai
```

## Health

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

Positive: has types; esm support; no vulnerabilities.

Warnings: low downloads; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.0.25 |
| Published | 2021-09-29 |
| First published | 2021-09-29 |
| Weekly downloads | 0 |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 5 |
| Unpacked size | 281.3 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Maintainers | ligeh |

## Links

- npm: https://www.npmjs.com/package/tester-ai
- npm.io page: https://npm.io/package/tester-ai

## Dependencies (5)

- [rxjs](https://npm.io/package/rxjs.md) ^7.3.0
- [tslib](https://npm.io/package/tslib.md) ^2.0.0
- [@angular/material](https://npm.io/package/@angular/material.md) ^11.2.13
- [@ngx-translate/core](https://npm.io/package/@ngx-translate/core.md) ^13.0.0
- [@ngx-translate/http-loader](https://npm.io/package/@ngx-translate/http-loader.md) ^6.0.0

## Recent versions

- 0.0.25 (latest) — 2021-09-29
- 0.0.23 — 2021-09-29
- 0.0.22 — 2021-09-29
- 0.0.21 — 2021-09-29
- 0.0.12 — 2021-09-29
- 0.0.11 — 2021-09-29
- 0.0.7 — 2021-09-29
- 0.0.4 — 2021-09-29
- 0.0.3 — 2021-09-29
- 0.0.2 — 2021-09-29
- 0.0.1 — 2021-09-29

## README

[![Bintray](https://img.shields.io/badge/npm-cool-green)](https://www.npmjs.com/package/ng-conversational-ui)
[![Bintray](https://img.shields.io/twitter/url?url=https%3A%2F%2Fgithub.com%2FAliShamin%2Fjs-async-operators)](https://twitter.com/ali_sshamin)

# ng-conversational-ui

NgConversationalUi is Cool !!

## Install

```
$ npm install ng-conversational-ui
```

## Usage

app.component.ts

```js
import { Component } from '@angular/core';
import { Message } from 'dist/ng-conversational-ui/lib/api/message.interface';
import { SendMessageEvent } from 'dist/ng-conversational-ui/lib/api/send-message-event';
import { User } from 'dist/ng-conversational-ui/lib/api/user.interface';
import { from, merge, Observable, Subject } from 'rxjs';
import { map, scan } from 'rxjs/operators';
import { ChatService } from './chat.service';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css'],
  providers: [ChatService],
})
export class AppComponent {

  feed: Observable<Message[]>;
  title = 'ngx-conversational-ui';
  user: User = { id: 1, name: 'Alexa' };
  operatorAvatarUrl:string = "assets/images/chat-bot.svg";
  visitorAvatarUrl:string = "assets/images/user.png";

  messages: Message[] = [
    {
      author: { id: 0,avatarUrl:this.operatorAvatarUrl },
      text: 'Hello',
      suggestedActions: [
        { type: 'reply', value: 'How are you?' },
        { type: 'reply', value: 'How is all going?' }
      ],
    },
    {
      author: { id: 1,avatarUrl:this.visitorAvatarUrl },
      text: 'Hi',
    },
  ];

  private local: Subject<Message> = new Subject<Message>();

  constructor(private svc: ChatService) {
    // Merge local and remote messages into a single stream
    this.feed = merge(
      from(this.messages),
      this.local,
      this.svc.response.pipe(
        map(
          (response): Message => ({
            author: { id: 0 ,avatarUrl:this.operatorAvatarUrl},
            text: response,
          })
        )
      )
    ).pipe(
      // ... and emit an array of all messages
      scan((acc: Message[], x: Message) => [...acc, x], [])
    );
  }

  sendMessage(e: SendMessageEvent) {
    const msg: Message = {
      author: { id: 0,avatarUrl:this.operatorAvatarUrl},
      typing: true,
      
    };
    this.local.next(e.message);
    setTimeout(() => {      
      this.local.next(msg);
    }, 1000);
    this.svc.submit(e.message.text ?? '');
  }
}

```
app.component.html

```html
     <lib-ng-conversational-ui [user]="user" [messages]="feed | async" (sendMessage)="sendMessage($event)">
        </lib-ng-conversational-ui>
```

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