Merge pull request #1 from Bandwidth-Samples/v1

SWI-3542 Clean up for V1 Release

Author: ckoegel

LICENSE

@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2022 Bandwidth Samples
+Copyright (c) 2023 Bandwidth Samples
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

Logo Icon.png

@@ -6,18 +6,14 @@
 * [Pre-Requisites](#pre-requisites)
 * [Running the Application](#running-the-application)
 * [Environmental Variables](#environmental-variables)
-* [Callback URLs](#callback-urls)
-  * [Ngrok](#ngrok)
 
 # Description
 
-A short description of your sample app and its capabilities.
+A simple dial pad application used to create calls using our WebRTC SDK.
 
 # Pre-Requisites
 
-In order to use the Bandwidth API users need to set up the appropriate application at the [Bandwidth Dashboard](https://dashboard.bandwidth.com/) and create API tokens.
-
-To create an application log into the [Bandwidth Dashboard](https://dashboard.bandwidth.com/) and navigate to the `Applications` tab.  Fill out the **New Application** form selecting the service (Messaging or Voice) that the application will be used for.  All Bandwidth services require publicly accessible Callback URLs, for more information on how to set one up see [Callback URLs](#callback-urls).
+In order to use this sample app, your account must have In-App Calling enabled. You will also have to generate an auth token using our Identity API.
 
 For more information about API credentials see our [Account Credentials](https://dev.bandwidth.com/docs/account/credentials) page.
 
@@ -26,40 +22,14 @@ For more information about API credentials see our [Account Credentials](https:/
 Use the following command/s to run the application:
 
 ```sh
-# start command here
+yarn start
 ```
 
 # Environmental Variables
 
 The sample app uses the below environmental variables.
 
 ```sh
-BW_ACCOUNT_ID                        # Your Bandwidth Account Id
-BW_USERNAME                          # Your Bandwidth API Username
-BW_PASSWORD                          # Your Bandwidth API Password
-BW_NUMBER                            # The Bandwidth phone number involved with this application
-USER_NUMBER                          # The user's phone number involved with this application
-BW_VOICE_APPLICATION_ID              # Your Voice Application Id created in the dashboard
-BW_MESSAGING_APPLICATION_ID          # Your Messaging Application Id created in the dashboard
-BASE_CALLBACK_URL                    # Your public base url to receive Bandwidth Webhooks. No trailing '/'
-LOCAL_PORT                           # The port number you wish to run the sample on
-```
-
-# Callback URLs
-
-For a detailed introduction, check out our [Bandwidth Product Specific Callbacks](https://dev.bandwidth.com/docs/messaging/webhooks) page.
-
-Below are the callback paths:
-* **Should follow `/callbacks/{direction}/{service}` conventions**
-* `<add other callbacks>`
-
-## Ngrok
-
-A simple way to set up a local callback URL for testing is to use the free tool [ngrok](https://ngrok.com/).  
-After you have downloaded and installed `ngrok` run the following command to open a public tunnel to your port (`$LOCAL_PORT`)
-
-```sh
-ngrok http $LOCAL_PORT
+REACT_APP_IN_APP_CALLING_TOKEN             # You Identity Token
+REACT_APP_IN_APP_CALLING_NUMBER            # A valid phone number on your account
 ```
-
-You can view your public URL at `http://127.0.0.1:{LOCAL_PORT}` after ngrok is running.  You can also view the status of the tunnel and requests/responses here.

README.md

@@ -9,7 +9,6 @@
       name="In-App Calling Dialpad Sample App"
       content=""
     />
-    <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
     <link href="https://fonts.googleapis.com/icon?family=Material+Icons+Outlined"
       rel="stylesheet">
     <!--

public/index.html

@@ -10,9 +10,8 @@ import { BandwidthUA } from "@bandwidth/bw-webrtc-sdk";
 import { useStopwatch } from 'react-timer-hook';
 
 export default function DialPad() {
-  const authToken = process.env.REACT_APP_IDENTITY_TOKEN;
-  const defaultSourceNumber = process.env.BW_NUMBER; //?.replace(/\D/g, "");
-  console.log(defaultSourceNumber)
+  const authToken = process.env.REACT_APP_IN_APP_CALLING_TOKEN;
+  const defaultSourceNumber = process.env.REACT_APP_IN_APP_CALLING_NUMBER;
   const destinationNumberNote = "Call international or domestic. Include area code and country code, but don't add the '+'";
   const sourceNumberNote = "Enter a number on your BW account. Include area code and country code, but don't add the '+'";
   const {
@@ -26,7 +25,7 @@ export default function DialPad() {
   } = useStopwatch({ autoStart: false });
 
   const [destNumber, setDestNumber] = useState('');
-  const [sourceNumber, setSourceNumber] = useState(`${defaultSourceNumber}`); // TODO: grab this from an env variable
+  const [sourceNumber, setSourceNumber] = useState(`${defaultSourceNumber}`);
   const [destNumberValid, setDestNumberValid] = useState(false);
   const [allowHangup, setAllowHangup] = useState(false);
   const [phone, setPhone] = useState(new BandwidthUA());
@@ -51,7 +50,7 @@ export default function DialPad() {
       serverConfig.iceServers
     );
 
-    newPhone.setOAuthToken(authToken);  // TODO: get this from the identity api
+    newPhone.setOAuthToken(authToken);
     setPhone(newPhone);
   },[authToken]);
 
@@ -62,10 +61,7 @@ export default function DialPad() {
         switch ('cause' + cause) {
           case "connected":
             console.log("phone>>> loginStateChanged: connected");
-          
             setWebrtcStatus({ color: 'var(--green50)', text: "Connected to WebRTC Service" });
-           
-
             break;
           case "disconnected":
             console.log("phone>>> loginStateChanged: disconnected");