scottk/chatwoot
1
0
Fork 0
mirror of https://github.com/lingble/chatwoot.git synced 2025-11-02 20:18:08 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: Add support for API key authentication in Twilio (#7523)

Browse Source 
Co-authored-by: Sivin Varghese <64252451+iamsivin@users.noreply.github.com>
This commit is contained in:
Pranav Raj S
2023-07-14 19:20:54 -07:00
committed by GitHub
parent 1a81245987
commit ec65b43993
6 changed files with 93 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

79
app/javascript/dashboard/routes/dashboard/settings/inbox/channels/Twilio.vue
View File

@@ -81,18 +81,45 @@
}}</span>
</label>
</div>
<div class="medium-8 columns messagingServiceHelptext">
<label for="useAPIKey">
<input
id="useAPIKey"
v-model="useAPIKey"
type="checkbox"
class="checkbox"
/>
{{ $t('INBOX_MGMT.ADD.TWILIO.API_KEY.USE_API_KEY') }}
</label>
</div>
<div v-if="useAPIKey" class="medium-8 columns">
<label :class="{ error: $v.apiKeySID.$error }">
{{ $t('INBOX_MGMT.ADD.TWILIO.API_KEY.LABEL') }}
<input
v-model.trim="apiKeySID"
type="text"
:placeholder="$t('INBOX_MGMT.ADD.TWILIO.API_KEY.PLACEHOLDER')"
@blur="$v.apiKeySID.$touch"
/>
<span v-if="$v.apiKeySID.$error" class="message">{{
$t('INBOX_MGMT.ADD.TWILIO.API_KEY.ERROR')
}}</span>
</label>
</div>
<div class="medium-8 columns">
<label :class="{ error: $v.authToken.$error }">
{{ $t('INBOX_MGMT.ADD.TWILIO.AUTH_TOKEN.LABEL') }}
{{ $t(`INBOX_MGMT.ADD.TWILIO.${authTokeni18nKey}.LABEL`) }}
<input
v-model.trim="authToken"
type="text"
:placeholder="$t('INBOX_MGMT.ADD.TWILIO.AUTH_TOKEN.PLACEHOLDER')"
:placeholder="
$t(`INBOX_MGMT.ADD.TWILIO.${authTokeni18nKey}.PLACEHOLDER`)
"
@blur="$v.authToken.$touch"
/>
<span v-if="$v.authToken.$error" class="message">{{
$t('INBOX_MGMT.ADD.TWILIO.AUTH_TOKEN.ERROR')
}}</span>
<span v-if="$v.authToken.$error" class="message">
{{ $t(`INBOX_MGMT.ADD.TWILIO.${authTokeni18nKey}.ERROR`) }}
</span>
</label>
</div>
@@ -123,11 +150,13 @@ export default {
data() {
return {
accountSID: '',
apiKeySID: '',
authToken: '',
medium: this.type,
channelName: '',
messagingServiceSID: '',
useMessagingService: false,
useAPIKey: false,
phoneNumber: '',
};
},
@@ -135,26 +164,39 @@ export default {
...mapGetters({
uiFlags: 'inboxes/getUIFlags',
}),
authTokeni18nKey() {
return this.useAPIKey ? 'API_KEY_SECRET' : 'AUTH_TOKEN';
},
},
validations() {
if (this.phoneNumber) {
return {
channelName: { required },
messagingServiceSID: {},
phoneNumber: { required, isPhoneE164OrEmpty },
authToken: { required },
accountSID: { required },
medium: { required },
};
}
return {
let validations = {
channelName: { required },
messagingServiceSID: { required },
phoneNumber: {},
authToken: { required },
accountSID: { required },
medium: { required },
};
if (this.phoneNumber) {
validations = {
...validations,
phoneNumber: { required, isPhoneE164OrEmpty },
messagingServiceSID: {},
};
} else {
validations = {
...validations,
messagingServiceSID: { required },
phoneNumber: {},
};
}
if (this.useAPIKey) {
validations = {
...validations,
apiKeySID: { required },
};
}
return validations;
},
methods: {
async createChannel() {
@@ -171,6 +213,7 @@ export default {
name: this.channelName,
medium: this.medium,
account_sid: this.accountSID,
api_key_sid: this.apiKeySID,
auth_token: this.authToken,
messaging_service_sid: this.messagingServiceSID,
phone_number: this.messagingServiceSID