From 161c0b7b88da2347fea0f5a70db4977b8ecc34e9 Mon Sep 17 00:00:00 2001 From: Abdul Rifqi Al Abqary Date: Tue, 7 Jan 2020 18:46:16 +0900 Subject: [PATCH] added token request management --- lang/en-US.js | 7 +- pages/index.vue | 209 +++++++++++++++++++++++++++++++++++---------- store/mutations.js | 9 +- store/state.js | 3 + 4 files changed, 181 insertions(+), 47 deletions(-) diff --git a/lang/en-US.js b/lang/en-US.js index 2725ec4cc..9ad7e21a1 100644 --- a/lang/en-US.js +++ b/lang/en-US.js @@ -94,7 +94,11 @@ export default { save_token: "Save Access Token", use_token: "Use Saved Token", request_token: "Request Token", - save_token_request: "Save Token Request", + save_token_req: "Save Token Request", + manage_token_req: "Manage Token Request", + use_token_req: "Use Token Request", + token_req_name: "Request Name", + token_req_details: "Request Details", token_name: "Token Name", oidc_discovery_url: "OIDC Discovery URL", auth_url: "Auth URL", @@ -102,4 +106,5 @@ export default { client_id: "Client ID", scope: "Scope", state: "State", + token_req_list: "Token Request List" }; diff --git a/pages/index.vue b/pages/index.vue index 9d3a5294a..bcfa5f980 100644 --- a/pages/index.vue +++ b/pages/index.vue @@ -436,7 +436,7 @@ @@ -939,46 +939,6 @@
- -
-
    -
  • -
    -

    {{ $t("save_token_request") }}

    -
    - -
    -
    -
    • -
-
-
-
    -
  • - -
    • -
-
-
-
- - - - - -
-
- -
    @@ -994,7 +954,7 @@
-
+
  • @@ -1051,6 +1011,91 @@
    + + +
    +
      +
    • +
      +

      {{ $t("manage_token_req") }}

      +
      + +
      +
      +
      • +
    +
    +
    +
      +
    • +
      + +
      + + +
      +
      + + + +
      • +
    +
      +
    • + + +
      • +
    +
      +
    • + + +
      • +
    +
    +
    +
    + + + + +
    +
    +     +
@@ -1466,6 +1511,30 @@ export default { this.$store.commit("setOAuth2", { value, attribute: "tokens" }); } }, + tokenReqs: { + get() { + return this.$store.state.oauth2.tokenReqs; + }, + set(value) { + this.$store.commit("setOAuth2", { value, attribute: "tokenReqs" }); + } + }, + tokenReqSelect: { + get() { + return this.$store.state.oauth2.tokenReqSelect; + }, + set(value) { + this.$store.commit("setOAuth2", { value, attribute: "tokenReqSelect" }); + } + }, + tokenReqName: { + get() { + return this.$store.state.oauth2.tokenReqName; + }, + set(value) { + this.$store.commit("setOAuth2", { value, attribute: "tokenReqName" }); + } + }, accessTokenName: { get() { return this.$store.state.oauth2.accessTokenName; @@ -1812,6 +1881,16 @@ export default { } return requestString.join("").slice(0, -3); } + }, + tokenReqDetails() { + const details = { + oidcDiscoveryUrl: this.oidcDiscoveryUrl, + authUrl: this.authUrl, + accessTokenUrl: this.accessTokenUrl, + clientId: this.clientId, + scope: this.scope + }; + return JSON.stringify(details, null, 2); } }, methods: { @@ -2361,6 +2440,7 @@ export default { this.bearerToken = ""; this.showTokenRequest = false; this.tokens = []; + this.tokenReqs = []; break; case "headers": this.headers = []; @@ -2379,6 +2459,8 @@ export default { case "tokens": this.tokens = []; break; + case "tokenReqs": + this.tokenReqs = []; default: (this.label = ""), (this.method = "GET"), @@ -2395,6 +2477,7 @@ export default { this.rawParams = ""; this.showTokenRequest = false; this.tokens = []; + this.tokenReqs = []; this.accessTokenName = ""; this.oidcDiscoveryUrl = ""; this.authUrl = ""; @@ -2527,9 +2610,7 @@ export default { return false; }, removeOAuthToken(index) { - // .slice() gives us an entirely new array rather than giving us just the reference const oldTokens = this.tokens.slice(); - this.$store.commit("removeOAuthToken", index); this.$toast.error("Deleted", { icon: "delete", @@ -2546,8 +2627,14 @@ export default { this.bearerToken = value; this.showTokenList = false; }, - saveTokenRequest() { + addOAuthTokenReq() { try { + const name = this.tokenReqName; + const details = JSON.parse(this.tokenReqDetails); + this.$store.commit("addOAuthTokenReq", { + name, + details + }); this.$toast.info("Token request saved"); this.showTokenRequestList = false; } catch (e) { @@ -2555,6 +2642,38 @@ export default { icon: "code" }); } + }, + removeOAuthTokenReq(index) { + const oldTokenReqs = this.tokenReqs.slice(); + let targetReqIndex = this.tokenReqs.findIndex(tokenReq => tokenReq.name === this.tokenReqName); + if (targetReqIndex < 0) return; + this.$store.commit("removeOAuthTokenReq", targetReqIndex); + this.$toast.error("Deleted", { + icon: "delete", + action: { + text: "Undo", + onClick: (e, toastObject) => { + this.tokenReqs = oldTokenReqs; + toastObject.remove(); + } + } + }); + }, + tokenReqChange(event) { + let targetReq = this.tokenReqs.find(tokenReq => tokenReq.name === event.target.value); + let { + oidcDiscoveryUrl, + authUrl, + accessTokenUrl, + clientId, + scope + } = targetReq.details; + this.tokenReqName = targetReq.name; + this.oidcDiscoveryUrl = oidcDiscoveryUrl; + this.authUrl = authUrl; + this.accessTokenUrl = accessTokenUrl; + this.clientId = clientId; + this.scope = scope; } }, async mounted() { diff --git a/store/mutations.js b/store/mutations.js index 446fbef65..64d178f57 100644 --- a/store/mutations.js +++ b/store/mutations.js @@ -101,6 +101,13 @@ export default { setOAuthTokenName({ oauth2 }, { index, value }) { oauth2.tokens[index].name = value; - } + }, + addOAuthTokenReq({ oauth2 }, value) { + oauth2.tokenReqs.push(value); + }, + + removeOAuthTokenReq({ oauth2 }, index) { + oauth2.tokenReqs.splice(index, 1); + } }; diff --git a/store/state.js b/store/state.js index e5cb1c089..e6ab3b51d 100644 --- a/store/state.js +++ b/store/state.js @@ -25,6 +25,9 @@ export default () => ({ }, oauth2: { tokens: [], + tokenReqs: [], + tokenReqSelect: "", + tokenReqName: "", accessTokenName: "", oidcDiscoveryUrl: "", authUrl: "",