# Ibex Dashboard [![Build Status](https://travis-ci.org/Azure/ibex-dashboard.png?branch=master)](https://travis-ci.org/Azure/ibex-dashboard)
[Ibex](http://aka.ms/ibex) is a dashboarding application that enables building dashboard and templates.
It mainly supports **Application Insights** but data sources and visual components are easily extendable.
## Changes
### Version 1.3 (January 22, 2018)
Version 1.3 contains the following changes:
* Moving application insights queries from client to server
* Updated tests to answer some security risks presented by GitHub
* Updated tests to accommodate the new approach
* Added masking/unmasking of connection parameters (so that client side can only update API KEY but not see what it is)
* Fixed small bugs with Firefox rendering
### Version 1.2 (October 16, 2017)
Version 1.2 breaks the persitency paths of dashboard files and custom templates. If you are upgrading to this version, copy your private dashboards from `/dashboards` into `/dashboards/persistent/` as follows:
> Private Files: Move files from `/dashboards/*.private.js` to `/dashboards/persistent/private`.
> Custom Templates: Move files from `/dashboards/customTemplates/*.private.ts` to `/dashboards/persistent/customTemplates`.
# Preview
[![Preview](/docs/images/bot-fmk-dashboard.png)](/docs/images/bot-fmk-dashboard.png)
[![Preview](/docs/images/bot-fmk-dashboard-msgs.png)](/docs/images/bot-fmk-dashboard-msgs.png)
[![Preview](/docs/images/bot-fmk-dashboard-intent.png)](/docs/images/bot-fmk-dashboard-intent.png)
# Installation
```bash
npm install yarn -g
git clone https://github.com/Azure/ibex-dashboard
cd ibex-dashboard
yarn
yarn start
```
### Using Bot Analytics Instrumented Dashboard
1. Open **http://localhost:4000**
2. Create a new template from **Bot Analytics Instrumented Dashboard**
3. Run through the **Application Insights** setup and fill in **API Key** and **Application ID** according to the application insights account associated with your registered bot.
### Installation on Ubuntu
Use the following to install yarn on Ubuntu:
```bash
curl -sS https://dl.yarnpkg.com/debian/pubkey.gpg | sudo apt-key add -
echo "deb https://dl.yarnpkg.com/debian/ stable main" | sudo tee /etc/apt/sources.list.d/yarn.list
sudo apt-get update && sudo apt-get install yarn
```
# Development
```bash
yarn start:dev
```
Open **http://localhost:3000**
For contribution and code documentation follow:
[DEVELOPMENT & CONTRIBUTION](/docs/README.md).
# Deploy To Azure
There are 3 ways to deploy to Azure:
### 1. Web App - Automated
1. Fork this repo (to be able to automatically create github deployment key)
2. Copy the fork url and use it with the following deployment button:
### 2. Web App On Linux - Automated with Docker Hub
### 3. Manual
1. Fork this repo (to be able to automatically create github deployment key)
2. Clone & Deploy:
3. [Create a new Web App in Azure](https://docs.microsoft.com/en-us/azure/app-service-web/app-service-continuous-deployment)
# Deploy With Docker
1. `docker build -t **image name** .`
2. `docker run -d -e PORT=80 **image name** `
3. Docker image is also available at Docker Hub - `docker pull morshemesh/ibex-dashboard`
# Application Insights Integration
Since application insights API doesn't support ARM yet, we need to manually [create an API Key](https://dev.applicationinsights.io/documentation/Authorization/API-key-and-App-ID) for the application insights service.
The full instructions are also available when you create a new dashboard.
You can also follow the next headline.
### Create new API Key and Application ID
The following steps explain how to connect **Application Insights** bot with your bot and your dashboard:
[you can also follow the [official Application Insights article](https://dev.applicationinsights.io/documentation/Authorization/API-key-and-App-ID)].
1. Go to [azure portal](https://portal.azure.com)
2. Select: **Resource Groups** > **[new resource group]** > **App Insights Service**
3. Copy **Instrumentation Key** and paste into your bot registration page (on the bottom)
4. Click: **API Access** > **Create New Key** > **+ Read Telemetry**
5. Copy `Application ID` + `API Key`
6. Open the URL of your web app
7. Under **AppId**/**ApiKey** set the values you created.
### Adding Application Insights instrumentation to your bot
- [Instrumentation for Node.js bots](https://github.com/Azure/botbuilder-instrumentation)
- [Instrumentation for C# bots](https://github.com/Azure/botbuilder-instrumentation-cs)
# Testing
The test watcher is integrated into the create-react-app mechanism and runs tests related to files changes since the last commit.
To run the test watcher in an interactive mode:
```bash
cd client
yarn test
```
Alternatively, you can also run the full commands that the Travis CI server
will run to validate any changes.
```bash
.travis/ci.sh
```
# Build
Our CI server Travis creates new production builds automatically for changes
to master. If you need to create a build locally, you can execute the same
commands as the CI server.
```bash
yarn build
```
Or
```bash
.travis/build.sh
```
# Resources
### Technologies In Use
* https://facebook.github.io/react/
* https://github.com/facebookincubator/create-react-app
* http://recharts.org/
* https://react-md.mlaursen.com/
### Design and Patterns
This project is built using:
* https://github.com/facebookincubator/create-react-app
The server approach was added using:
* https://www.fullstackreact.com/articles/using-create-react-app-with-a-server/
Thinking about integrating with:
* https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md
### Engines
* Running node version 6.11 or above.
# License
MIT