// @flow
import React, { Component } from 'react';
// import { Link } from 'react-router';
import styles from './Home.css';


export default class Home extends Component {
  render() {
    return (
      <div>
        <button onClick={getToken}>Get Token</button>
        <button onClick={sendCall}>Make call</button>
        <button onClick={endCall}>End call</button>
        <div className={styles.container} data-tid="container" />
      </div>
    );
  }
}
var twilio_token = {};

async function getToken() {
  let request = await fetch('https://serene-island-28717.herokuapp.com/api/generateToken', {
    method: 'POST'
  });

  twilio_token = await request.json();
  console.log(twilio_token.token);
  Twilio.Device.setup(twilio_token.token);
  console.log(twilio_token);
}

Twilio.Device.ready(() => {
  console.log('Its ready');
});

Twilio.Device.incoming((connection) => {
  // send a system notification
  notifier.notify('test');
  connection.accept(() => {
    console.log('oh yaaaa');
  });
});

function sendCall() {
  var phone = {"phoneNumber": "4323498373"};
  Twilio.Device.connect(phone);
  console.log(twilio_token);
}

function endCall() {
  // hang up call in progress
  Twilio.Device.disconnectAll();
  console.log('call ended');
}

@@ -118,16 +118,96 @@
 .css';%0A%0A
+import notifier from 'notifier';%0Aconst nc = new notifier.NotificationCenter();%0A%0A
 %0Aexport 
@@ -995,32 +995,402 @@
 n%0A  
+nc.
 notif
-ier.notify('test');
+y(%7B%0A    title: 'Incoming Call from ' + connection.parameters.From,%0A    message: 'Would you like to:',%0A    closeLabel: 'Decline',%0A    actions: 'Accept',%0A    wait: true%0A  %7D, function(err, response, metadata) %7B%0A    if(response == 'activate')%7B%0A      connection.accept();%0A    %7Delse if (response == 'closed') %7B%0A      connection.ignore();%0A    %7D%0A  %7D);%0A  // call back for when a call is accepted
 %0A  c
@@ -1435,16 +1435,17 @@
 og('
-oh yaaaa
+In a call
 ');%0A

Add call notification