ben.carrasco/jambonz-webapp
1
0
Fork 0
mirror of https://github.com/jambonz/jambonz-webapp.git synced 2026-07-24 21:12:26 +00:00
Code Issues Packages Projects Releases Wiki Activity

regions field added to aws, default to us-east-1 (#50)

Browse Source 
* regions field added to aws, default to us-east-1

* added aws_region to post request

* no default setting on aws region

* aws_region required before saving

* no longer showing default on dropdown

Co-authored-by: Conner Luzier <connerluzier@outlook.com>
This commit is contained in:
Conner Luzier
2022-04-21 13:33:04 -04:00
committed by GitHub
parent bf88a27330
commit 536b183535
2 changed files with 85 additions and 47 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.env
+1
View File
@@ -1 +1,2 @@
REACT_APP_API_BASE_URL=http://127.0.0.1:3002/v1
GENERATE_SOURCEMAP=false
src/components/forms/SpeechForm.js
+84 -47
View File
@@ -21,6 +21,7 @@ import Button from '../elements/Button';
import Loader from '../blocks/Loader';
import { ServiceProviderValueContext } from '../../contexts/ServiceProviderContext';
import AwsRegions from '../../data/AwsRegions';
import MicrosoftAzureRegions from '../../data/MicrosoftAzureRegions';
import { APP_API_BASE_URL } from "../../constants";
@@ -78,39 +79,42 @@ const SpeechServicesAddEdit = (props) => {
const refUseForStt = useRef(null);
const refApiKey = useRef(null);
const refRegion = useRef(null);
const refAwsRegion = useRef(null);
// Form inputs
const [ vendor, setVendor ] = useState('');
const [ serviceKey, setServiceKey ] = useState('');
const [ displayedServiceKey, setDisplayedServiceKey ] = useState('');
const [ accessKeyId, setAccessKeyId ] = useState('');
const [ secretAccessKey, setSecretAccessKey ] = useState('');
const [ useForTts, setUseForTts ] = useState(false);
const [ useForStt, setUseForStt ] = useState(false);
const [ accounts, setAccounts ] = useState([]);
const [ accountSid, setAccountSid ] = useState('');
const [ apiKey, setApiKey ] = useState('');
const [ region, setRegion ] = useState('');
const [vendor, setVendor] = useState('');
const [serviceKey, setServiceKey] = useState('');
const [displayedServiceKey, setDisplayedServiceKey] = useState('');
const [accessKeyId, setAccessKeyId] = useState('');
const [secretAccessKey, setSecretAccessKey] = useState('');
const [useForTts, setUseForTts] = useState(false);
const [useForStt, setUseForStt] = useState(false);
const [accounts, setAccounts] = useState([]);
const [accountSid, setAccountSid] = useState('');
const [apiKey, setApiKey] = useState('');
const [region, setRegion] = useState('');
const [awsregion, setAwsRegion] = useState('');
// Invalid form inputs
const [ invalidVendorGoogle, setInvalidVendorGoogle ] = useState(false);
const [ invalidVendorAws, setInvalidVendorAws ] = useState(false);
const [ invalidVendorMs, setInvalidVendorMs ] = useState(false);
const [ invalidVendorWellSaid, setInvalidVendorWellSaid ] = useState(false);
const [ invalidAccessKeyId, setInvalidAccessKeyId ] = useState(false);
const [ invalidSecretAccessKey, setInvalidSecretAccessKey ] = useState(false);
const [ invalidUseForTts, setInvalidUseForTts ] = useState(false);
const [ invalidUseForStt, setInvalidUseForStt ] = useState(false);
const [ invalidApiKey, setInvalidApiKey ] = useState(false);
const [ invalidRegion, setInvalidRegion ] = useState(false);
const [invalidVendorGoogle, setInvalidVendorGoogle] = useState(false);
const [invalidVendorAws, setInvalidVendorAws] = useState(false);
const [invalidVendorMs, setInvalidVendorMs] = useState(false);
const [invalidVendorWellSaid, setInvalidVendorWellSaid] = useState(false);
const [invalidAccessKeyId, setInvalidAccessKeyId] = useState(false);
const [invalidSecretAccessKey, setInvalidSecretAccessKey] = useState(false);
const [invalidUseForTts, setInvalidUseForTts] = useState(false);
const [invalidUseForStt, setInvalidUseForStt] = useState(false);
const [invalidApiKey, setInvalidApiKey] = useState(false);
const [invalidRegion, setInvalidRegion] = useState(false);
const [invalidAwsRegion, setInvalidAwsRegion] = useState(false);
const [ originalTtsValue, setOriginalTtsValue ] = useState(null);
const [ originalSttValue, setOriginalSttValue ] = useState(null);
const [originalTtsValue, setOriginalTtsValue] = useState(null);
const [originalSttValue, setOriginalSttValue] = useState(null);
const [ validServiceKey, setValidServiceKey ] = useState(false);
const [validServiceKey, setValidServiceKey] = useState(false);
const [ showLoader, setShowLoader ] = useState(true);
const [ errorMessage, setErrorMessage ] = useState('');
const [showLoader, setShowLoader] = useState(true);
const [errorMessage, setErrorMessage] = useState('');
useEffect(() => {
const getAPIData = async () => {
@@ -146,18 +150,19 @@ const SpeechServicesAddEdit = (props) => {
} catch (err) {
}
setAccountSid( speechCredential.data.account_sid || '');
setVendor( speechCredential.data.vendor || undefined);
setServiceKey( serviceKeyJson || '');
setDisplayedServiceKey( displayedServiceKeyJson || '');
setAccessKeyId( speechCredential.data.access_key_id || '');
setSecretAccessKey( speechCredential.data.secret_access_key || '');
setApiKey( speechCredential.data.api_key || '');
setRegion( speechCredential.data.region || '');
setUseForTts( speechCredential.data.use_for_tts || false);
setUseForStt( speechCredential.data.use_for_stt || false);
setOriginalTtsValue( speechCredential.data.use_for_tts || false);
setOriginalSttValue( speechCredential.data.use_for_stt || false);
setAccountSid(speechCredential.data.account_sid || '');
setVendor(speechCredential.data.vendor || undefined);
setServiceKey(serviceKeyJson || '');
setDisplayedServiceKey(displayedServiceKeyJson || '');
setAccessKeyId(speechCredential.data.access_key_id || '');
setSecretAccessKey(speechCredential.data.secret_access_key || '');
setApiKey(speechCredential.data.api_key || '');
setRegion(speechCredential.data.region || '');
setAwsRegion(speechCredential.data.aws_region || '');
setUseForTts(speechCredential.data.use_for_tts || false);
setUseForStt(speechCredential.data.use_for_stt || false);
setOriginalTtsValue(speechCredential.data.use_for_tts || false);
setOriginalSttValue(speechCredential.data.use_for_stt || false);
}
setShowLoader(false);
} catch (err) {
@@ -265,6 +270,15 @@ const SpeechServicesAddEdit = (props) => {
}
}
if (vendor === 'aws' && !awsregion) {
errorMessages.push('Please select a region.');
setInvalidAwsRegion(true);
if (!focusHasBeenSet) {
refAwsRegion.current.focus();
focusHasBeenSet = true;
}
}
if (vendor === 'microsoft' && !apiKey) {
errorMessages.push('Please provide an API key.');
setInvalidApiKey(true);
@@ -323,6 +337,7 @@ const SpeechServicesAddEdit = (props) => {
service_key: vendor === 'google' ? JSON.stringify(serviceKey) : null,
access_key_id: vendor === 'aws' ? accessKeyId : null,
secret_access_key: vendor === 'aws' ? secretAccessKey : null,
aws_region: vendor === 'aws' ? awsregion : null,
api_key: ['microsoft', 'wellsaid'].includes(vendor) ? apiKey : null,
region: vendor === 'microsoft' ? region : null,
use_for_tts: useForTts,
@@ -463,7 +478,7 @@ const SpeechServicesAddEdit = (props) => {
return (
showLoader ? (
<Loader height={props.type === 'add' ? '424px' : '376px'}/>
<Loader height={props.type === 'add' ? '424px' : '376px'} />
) : (
<Form
large
@@ -582,6 +597,28 @@ const SpeechServicesAddEdit = (props) => {
ref={refSecretAccessKey}
disabled={type === 'edit'}
/>
<Label htmlFor="regions">Region</Label>
<Select
name="regions"
id="regions"
value={awsregion}
onChange={e => setAwsRegion(e.target.value)}
ref={refAwsRegion}
invalid={invalidAwsRegion}
>
<option value="">
Select a region
</option>
{AwsRegions.map(r => (
<option
key={r.value}
value={r.value}
>
{r.name}
</option>
))}
</Select>
</>
) : vendor === 'microsoft' ? (
<>
@@ -619,7 +656,7 @@ const SpeechServicesAddEdit = (props) => {
))}
</Select>
</>
) : vendor === 'wellsaid' ? (
) : vendor === 'wellsaid' ? (
<>
<Label htmlFor="apiKey">API Key</Label>
<Input
@@ -639,7 +676,7 @@ const SpeechServicesAddEdit = (props) => {
{['google', 'aws', 'microsoft', 'wellsaid'].includes(vendor) ? (
<>
<div/>
<div />
<Checkbox
noLeftMargin
name="useForTts"
@@ -650,7 +687,7 @@ const SpeechServicesAddEdit = (props) => {
invalid={invalidUseForTts}
ref={refUseForTts}
/>
<div/>
<div />
<Checkbox
noLeftMargin
name="useForStt"
@@ -664,9 +701,9 @@ const SpeechServicesAddEdit = (props) => {
/>
</>
) :
(
null
)}
(
null
)}
{errorMessage && (
<FormError grid message={errorMessage} />
@@ -682,7 +719,7 @@ const SpeechServicesAddEdit = (props) => {
dispatch({
type: 'ADD',
level: 'info',
message: type === 'add' ? 'New speech service canceled' :'Changes canceled',
message: type === 'add' ? 'New speech service canceled' : 'Changes canceled',
});
}}
>
@@ -701,4 +738,4 @@ const SpeechServicesAddEdit = (props) => {
);
};
export default SpeechServicesAddEdit;
export default SpeechServicesAddEdit;