Skip to content

Commit 686c02f

Browse files
committed
OAuth / API authorization workflows
1 parent d08d086 commit 686c02f

20 files changed

+642
-26
lines changed

src/Umbraco.Cms.Integrations.Crm.Hubspot/App_Plugins/UmbracoCms.Integrations/Crm/Hubspot/js/formpicker.controller.js

Lines changed: 46 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,58 @@
11
angular.module("umbraco")
22
.controller("Umbraco.Cms.Integrations.Crm.Hubspot.FormPickerController",
3-
function ($scope, editorService, umbracoCmsIntegrationsCrmHubspotResource) {
3+
function ($scope, editorService, notificationsService, umbracoCmsIntegrationsCrmHubspotResource) {
44
var vm = this;
55
vm.loading = true;
66
vm.hubspotFormsList = [];
77
vm.searchTerm = "";
88
vm.error = "";
99

10-
umbracoCmsIntegrationsCrmHubspotResource.getHubspotFormsList().then(function (data) {
11-
vm.hubspotFormsList = data;
10+
if ($scope.model.config !== undefined && $scope.model.config.settings !== undefined) {
11+
vm.config = {
12+
useApi: $scope.model.config.settings.useApi,
13+
useOAuth: $scope.model.config.settings.useOAuth,
14+
isOverlay: false
15+
};
16+
}
17+
if ($scope.model.overlayConfig !== undefined && $scope.model.overlayConfig.isOverlay !== undefined) {
18+
vm.config = {
19+
useApi: $scope.model.overlayConfig.useApi,
20+
useOAuth: $scope.model.overlayConfig.useOAuth,
21+
isOverlay: true
22+
};
23+
}
24+
25+
if (vm.config !== undefined && vm.config.useApi === false && vm.config.useOAuth === false) {
1226
vm.loading = false;
27+
notificationsService.warning("Authorization", "No authorization setup has been selected.");
28+
return;
29+
}
30+
31+
if (vm.config.useApi === true) {
32+
umbracoCmsIntegrationsCrmHubspotResource.getHubspotFormsList().then(function (data) {
33+
vm.hubspotFormsList = data;
34+
vm.loading = false;
1335

14-
//errorcheck
15-
console.log(data);
16-
});
36+
//errorcheck
37+
console.log(data);
38+
});
39+
} else if (vm.config.useOAuth === true) {
40+
umbracoCmsIntegrationsCrmHubspotResource.validateAccessToken().then(function(response) {
41+
if (response.isAccessTokenExpired === true || response.isAccessTokenValid === true) {
42+
notificationsService.warning("Acccess Token", "Invalid access token");
43+
return;
44+
}
45+
46+
umbracoCmsIntegrationsCrmHubspotResource.getHubspotFormsListOAuth().then(function(data) {
1747

48+
vm.loading = false;
49+
vm.hubspotFormsList = data;
50+
51+
console.log(data);
52+
});
53+
});
54+
}
55+
1856
vm.remove = function () {
1957
$scope.model.value = null;
2058
};
@@ -24,12 +62,13 @@
2462
};
2563

2664
vm.openHubspotFormPickerOverlay = function () {
27-
65+
vm.config.isOverlay = true;
2866
var options = {
2967
title: "Hubspot forms",
3068
subtitle: "Select a form",
3169
view: "/App_Plugins/UmbracoCms.Integrations/Crm/Hubspot/views/formpickereditor.html",
3270
size: "medium",
71+
overlayConfig: vm.config,
3372
pickForm: function (form) {
3473
vm.saveForm(form);
3574
editorService.close();

src/Umbraco.Cms.Integrations.Crm.Hubspot/App_Plugins/UmbracoCms.Integrations/Crm/Hubspot/js/hubspot.resource.js

Lines changed: 36 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,44 @@
11
angular.module('umbraco.resources').factory('umbracoCmsIntegrationsCrmHubspotResource',
2-
function ($q, $http, umbRequestHelper) {
2+
function ($http, umbRequestHelper) {
33
return {
44
getHubspotFormsList: function (id) {
55
return umbRequestHelper.resourcePromise(
66
$http.get("backoffice/UmbracoCmsIntegrationsCrmHubspot/Forms/GetAll"), "");
7+
},
8+
checkApiConfiguration: function() {
9+
return umbRequestHelper.resourcePromise(
10+
$http.get("backoffice/UmbracoCmsIntegrationsCrmHubspot/Forms/CheckApiConfiguration"),
11+
"Failed to get resource");
12+
},
13+
checkOAuthConfiguration: function () {
14+
return umbRequestHelper.resourcePromise(
15+
$http.get("backoffice/UmbracoCmsIntegrationsCrmHubspot/Forms/CheckOAuthConfiguration"),
16+
"Failed to get resource");
17+
},
18+
getAuthorizationUrl: function() {
19+
return umbRequestHelper.resourcePromise(
20+
$http.get("backoffice/UmbracoCmsIntegrationsCrmHubspot/Forms/GetAuthorizationUrl"),
21+
"Failed");
22+
},
23+
getAccessToken: function(authorizationCode) {
24+
return umbRequestHelper.resourcePromise(
25+
$http.post("backoffice/UmbracoCmsIntegrationsCrmHubspot/Forms/GetAccessToken", { code: authorizationCode }),
26+
"Failed");
27+
},
28+
refreshAccessToken: function () {
29+
return umbRequestHelper.resourcePromise(
30+
$http.post("backoffice/UmbracoCmsIntegrationsCrmHubspot/Forms/RefreshAccessToken"),
31+
"Failed");
32+
},
33+
validateAccessToken: function () {
34+
return umbRequestHelper.resourcePromise(
35+
$http.get("backoffice/UmbracoCmsIntegrationsCrmHubspot/Forms/ValidateAccessToken"),
36+
"Failed");
37+
},
38+
getHubspotFormsListOAuth: function () {
39+
return umbRequestHelper.resourcePromise(
40+
$http.get("backoffice/UmbracoCmsIntegrationsCrmHubspot/Forms/GetAllOAuth"),
41+
"Failed");
742
}
843
};
944
}
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,126 @@
1+
function settingsController($scope, notificationsService, umbracoCmsIntegrationsCrmHubspotResource) {
2+
3+
var vm = this;
4+
5+
vm.settingsValidation = {
6+
isValid: true,
7+
message: "Invalid configuration. Please review your website's configurations."
8+
};
9+
10+
vm.useApi = $scope.model.value.useApi;
11+
vm.useOAuth = $scope.model.value.useOAuth;
12+
vm.oauthSetup = {};
13+
14+
if (vm.useOAuth) {
15+
// validate token
16+
validateOAuthAccessToken();
17+
}
18+
19+
init();
20+
21+
$scope.$on('formSubmitting', function () {
22+
23+
$scope.model.value.useApi = vm.useApi;
24+
$scope.model.value.useOAuth = vm.useOAuth;
25+
26+
});
27+
28+
vm.toggleAuthType = function (item) {
29+
30+
let selectedItem = vm.items.find(el => el.name === item.name);
31+
32+
var deselectedItem = vm.items.find(el => el.name !== item.name);
33+
deselectedItem.disabled = false;
34+
deselectedItem.checked = false;
35+
36+
vm.useApi = selectedItem.name === "API Key";
37+
if (vm.useApi === true) {
38+
handleApiConfiguration();
39+
}
40+
41+
vm.useOAuth = selectedItem.name === "OAuth";
42+
if (vm.useOAuth === true) {
43+
handleOAuthConfiguration();
44+
45+
validateOAuthAccessToken();
46+
}
47+
}
48+
49+
vm.onConnectClick = function () {
50+
51+
umbracoCmsIntegrationsCrmHubspotResource.getAuthorizationUrl().then(function (response) {
52+
vm.authWindow = window.open(response,
53+
"Authorize", "width=900,height=700,modal=yes,alwaysRaised=yes");
54+
55+
});
56+
}
57+
58+
// authorization listener
59+
window.addEventListener("message", function (event) {
60+
if (event.data.type === "hubspot:oauth:success") {
61+
62+
umbracoCmsIntegrationsCrmHubspotResource.getAccessToken(event.data.code).then(function (response) {
63+
console.log(response);
64+
65+
vm.isOAuthConnected = true;
66+
});
67+
68+
}
69+
}, false);
70+
71+
72+
// custom handlers
73+
function handleApiConfiguration() {
74+
umbracoCmsIntegrationsCrmHubspotResource.checkApiConfiguration().then(function (response) {
75+
handleConfigurationValidation(response);
76+
});
77+
}
78+
79+
function handleOAuthConfiguration() {
80+
umbracoCmsIntegrationsCrmHubspotResource.checkOAuthConfiguration().then(function (response) {
81+
handleConfigurationValidation(response);
82+
});
83+
}
84+
85+
function handleConfigurationValidation(result) {
86+
if (result === false) {
87+
vm.settingsValidation.isValid = false;
88+
notificationsService.warning("Settings", vm.settingsValidation.message);
89+
} else
90+
vm.settingsValidation.isValid = true;
91+
}
92+
93+
function init() {
94+
vm.items = [{
95+
name: "API Key",
96+
description: "Use API key based setup.",
97+
checked: vm.useApi
98+
}, {
99+
name: "OAuth",
100+
description: "Use OAuth setup.",
101+
checked: vm.useOAuth
102+
}];
103+
}
104+
105+
function validateOAuthAccessToken() {
106+
umbracoCmsIntegrationsCrmHubspotResource.validateAccessToken().then(function (response) {
107+
108+
vm.oauthSetup = {
109+
isConnected: response.isAccessTokenValid,
110+
isAccessTokenExpired: response.isAccessTokenExpired,
111+
isAccessTokenValid: response.isAccessTokenValid
112+
}
113+
114+
// refresh access token
115+
if (vm.oauthSetup.isAccessTokenExpired === true) {
116+
umbracoCmsIntegrationsCrmHubspotResource.refreshAccessToken().then(function (response) {
117+
console.log(response);
118+
});
119+
}
120+
121+
});
122+
}
123+
}
124+
125+
angular.module("umbraco")
126+
.controller("Umbraco.Cms.Integrations.Crm.Hubspot.SettingsController", settingsController);
Lines changed: 16 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,21 +1,22 @@
11
{
2-
"propertyEditors": [
3-
{
4-
"alias": "Umbraco.Cms.Integrations.Crm.Hubspot.FormPicker",
5-
"name": "Hubspot Form Picker",
6-
"isParameterEditor": true,
7-
"group": "Pickers",
8-
"icon": "icon-handshake",
9-
"editor": {
10-
"view": "~/App_Plugins/UmbracoCms.Integrations/Crm/Hubspot/views/formpicker.html"
11-
}
12-
}
13-
],
14-
"css": [
15-
"~/App_Plugins/UmbracoCms.Integrations/Crm/Hubspot/css/styles.css"
16-
],
2+
//"propertyEditors": [
3+
// {
4+
// "alias": "Umbraco.Cms.Integrations.Crm.Hubspot.FormPicker",
5+
// "name": "Hubspot Form Picker",
6+
// "isParameterEditor": true,
7+
// "group": "Pickers",
8+
// "icon": "icon-handshake",
9+
// "editor": {
10+
// "view": "~/App_Plugins/UmbracoCms.Integrations/Crm/Hubspot/views/formpicker.html"
11+
// }
12+
// }
13+
//],
1714
"javascript": [
1815
"~/App_Plugins/UmbracoCms.Integrations/Crm/Hubspot/js/formpicker.controller.js",
16+
"~/App_Plugins/UmbracoCms.Integrations/Crm/Hubspot/js/settings.controller.js",
1917
"~/App_Plugins/UmbracoCms.Integrations/Crm/Hubspot/js/hubspot.resource.js"
18+
],
19+
"css": [
20+
"~/App_Plugins/UmbracoCms.Integrations/Crm/Hubspot/css/styles.css"
2021
]
2122
}

src/Umbraco.Cms.Integrations.Crm.Hubspot/App_Plugins/UmbracoCms.Integrations/Crm/Hubspot/views/formpicker.html

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,8 +7,7 @@
77
name="model.value.name"
88
icon="model.icon"
99
description="model.value.fields"
10-
allow-remove="true",
11-
10+
allow-remove="true" ,
1211
on-remove="vm.remove()">
1312
</umb-node-preview>
1413

Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
<div ng-controller="Umbraco.Cms.Integrations.Crm.Hubspot.SettingsController as vm">
2+
<umb-toggle-group items="vm.items" on-click="vm.toggleAuthType(item)">
3+
</umb-toggle-group>
4+
5+
<umb-box ng-if="vm.useOAuth">
6+
<umb-box-header title="OAuth Based Setup">
7+
<umb-button action="vm.onConnectClick()"
8+
type="button"
9+
button-style="primary"
10+
state="init"
11+
label="Connect"
12+
disabled="vm.oauthSetup.isConnected || !vm.settingsValidation.isValid">
13+
</umb-button>
14+
</umb-box-header>
15+
<umb-box-content>
16+
<p ng-if="!vm.settingsValidation.isValid">{{ vm.settingsValidation.message }}</p>
17+
</umb-box-content>
18+
</umb-box>
19+
</div>

0 commit comments

Comments
 (0)