[FIX] website: require a valid key for map snippet

Warn the user in case of unfilled or invalid google map API key.

task-2427575

closes odoo/odoo#72580

X-original-commit: f338d52e110bd6fa557169d370976ee35f5b56a5
Signed-off-by: Romain Derie <rdeodoo@users.noreply.github.com>
This commit is contained in:
Oussama MESSAOUDI
2021-06-22 18:48:11 +00:00
committed by Romain Derie
parent 16b6217378
commit 40efc3e646
3 changed files with 62 additions and 11 deletions
+21
View File
@@ -1947,6 +1947,13 @@ msgstr ""
msgid "Check your configuration."
msgstr ""
#. module: website
#. openerp-web
#: code:addons/website/static/src/js/editor/snippets.editor.js:0
#, python-format
msgid "Check your connexion and try again"
msgstr ""
#. module: website
#: model_terms:ir.ui.view,arch_db:website.s_product_catalog
msgid "Cheese Onion Rings"
@@ -3188,6 +3195,13 @@ msgstr ""
msgid "Enable billing on your Google Project"
msgstr ""
#. module: website
#. openerp-web
#: code:addons/website/static/src/js/editor/snippets.editor.js:0
#, python-format
msgid "Enter an API Key"
msgstr ""
#. module: website
#. openerp-web
#: code:addons/website/static/src/js/editor/snippets.options.js:0
@@ -4345,6 +4359,13 @@ msgstr ""
msgid "Intuitive system"
msgstr ""
#. module: website
#. openerp-web
#: code:addons/website/static/src/js/editor/snippets.editor.js:0
#, python-format
msgid "Invalid API Key. The following error was returned by Google:"
msgstr ""
#. module: website
#: model_terms:ir.ui.view,arch_db:website.s_company_team
msgid "Iris Joe, CFO"
@@ -70,17 +70,45 @@ weSnippetEditor.SnippetsMenu.include({
size: 'medium',
title: _t("Google Map API Key"),
buttons: [
{text: _t("Save"), classes: 'btn-primary', close: true, click: async () => {
const newAPIKey = dialog.$('#api_key_input').val() || false;
await this._rpc({
model: 'website',
method: 'write',
args: [
[websiteId],
{google_maps_api_key: newAPIKey},
],
});
invalidated = true;
{text: _t("Save"), classes: 'btn-primary', click: async (ev) => {
const $apiKeyInput = dialog.$('#api_key_input');
const valueAPIKey = $apiKeyInput.val();
const $apiKeyHelp = dialog.$('#api_key_help');
if (!valueAPIKey) {
$apiKeyInput.addClass('is-invalid');
$apiKeyHelp.text(_t("Enter an API Key"));
return;
}
const $button = $(ev.currentTarget);
$button.prop('disabled', true);
try {
const response = await fetch(`https://maps.googleapis.com/maps/api/staticmap?center=belgium&size=10x10&key=${valueAPIKey}`);
if (response.status === 200) {
await this._rpc({
model: 'website',
method: 'write',
args: [
[websiteId],
{google_maps_api_key: valueAPIKey},
],
});
invalidated = true;
dialog.close();
} else {
const text = await response.text();
$apiKeyInput.addClass('is-invalid');
$apiKeyHelp.empty().text(
_t("Invalid API Key. The following error was returned by Google:")
).append($('<i/>', {
text: text,
class: 'ml-1',
}));
}
} catch (e) {
$apiKeyHelp.text(_t("Check your connection and try again"));
} finally {
$button.prop("disabled", false);
}
}},
{text: _t("Cancel"), close: true}
],
@@ -120,6 +120,8 @@
t-att-value="apiKey or ''"
placeholder="BSgzTvR5L1GB9jriT451iTN4huVPxHmltG6T6eo"/>
</div>
<small id="api_key_help" class="text-danger">
</small>
<div class="small form-text text-muted">
Hint: How to use Google Map on your website (Contact Us page and as a snippet)
<br/>