Skip to content

Commit 1df781e

Browse files
anwarulislamjamesgeorge007
authored andcommitted
feat(common): support advanced parameters in OAuth grant types (hoppscotch#5287)
Adds support for advanced parameters in `implicit`, `password`, and `client_credentials` grant types.
1 parent 6f942a7 commit 1df781e

File tree

9 files changed

+1676
-1396
lines changed

9 files changed

+1676
-1396
lines changed

packages/hoppscotch-common/src/components/http/authorization/OAuth2.vue

Lines changed: 195 additions & 1204 deletions
Large diffs are not rendered by default.
Lines changed: 301 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,301 @@
1+
import { HoppGQLAuthOAuth2, HoppRESTAuthOAuth2 } from "@hoppscotch/data"
2+
import { Ref, ref, watch } from "vue"
3+
4+
export type AuthRequestParam = {
5+
id: number
6+
key: string
7+
value: string
8+
active: boolean
9+
sendIn?: "headers" | "url" | "body"
10+
}
11+
12+
export type TokenRequestParam = {
13+
id: number
14+
key: string
15+
value: string
16+
active: boolean
17+
sendIn: "headers" | "url" | "body"
18+
}
19+
20+
let paramsIdCounter = 1000
21+
22+
export const useOAuth2AdvancedParams = (
23+
auth: Ref<HoppRESTAuthOAuth2 | HoppGQLAuthOAuth2>
24+
) => {
25+
// Auth Request Parameters
26+
const workingAuthRequestParams = ref<AuthRequestParam[]>([
27+
{ id: paramsIdCounter++, key: "", value: "", active: true },
28+
])
29+
30+
// Token Request Parameters
31+
const workingTokenRequestParams = ref<TokenRequestParam[]>([
32+
{
33+
id: paramsIdCounter++,
34+
key: "",
35+
value: "",
36+
sendIn: "body",
37+
active: true,
38+
},
39+
])
40+
41+
// Refresh Request Parameters
42+
const workingRefreshRequestParams = ref<TokenRequestParam[]>([
43+
{
44+
id: paramsIdCounter++,
45+
key: "",
46+
value: "",
47+
sendIn: "body",
48+
active: true,
49+
},
50+
])
51+
52+
// Watch for changes in working auth request params
53+
watch(
54+
workingAuthRequestParams,
55+
(newParams: AuthRequestParam[]) => {
56+
// Auto-add empty row when the last row is filled
57+
if (newParams.length > 0 && newParams[newParams.length - 1].key !== "") {
58+
workingAuthRequestParams.value.push({
59+
id: paramsIdCounter++,
60+
key: "",
61+
value: "",
62+
active: true,
63+
})
64+
}
65+
66+
// Update auth.value.grantTypeInfo with non-empty params
67+
const nonEmptyParams = newParams.filter(
68+
(p: AuthRequestParam) => p.key !== "" || p.value !== ""
69+
)
70+
71+
if ("authRequestParams" in auth.value.grantTypeInfo) {
72+
auth.value.grantTypeInfo.authRequestParams = nonEmptyParams.map(
73+
(param) => ({
74+
id: param.id,
75+
key: param.key,
76+
value: param.value,
77+
active: param.active,
78+
})
79+
)
80+
}
81+
},
82+
{ deep: true }
83+
)
84+
85+
// Watch for changes in working token request params
86+
watch(
87+
workingTokenRequestParams,
88+
(newParams: TokenRequestParam[]) => {
89+
// Auto-add empty row when the last row is filled
90+
if (newParams.length > 0 && newParams[newParams.length - 1].key !== "") {
91+
workingTokenRequestParams.value.push({
92+
id: paramsIdCounter++,
93+
key: "",
94+
value: "",
95+
sendIn: "body",
96+
active: true,
97+
})
98+
}
99+
100+
// Update auth.value.grantTypeInfo with non-empty params
101+
const nonEmptyParams = newParams.filter(
102+
(p: TokenRequestParam) => p.key !== "" || p.value !== ""
103+
)
104+
105+
if ("tokenRequestParams" in auth.value.grantTypeInfo) {
106+
auth.value.grantTypeInfo.tokenRequestParams = nonEmptyParams.map(
107+
(param) => ({
108+
id: param.id,
109+
key: param.key,
110+
value: param.value,
111+
sendIn: param.sendIn,
112+
active: param.active,
113+
})
114+
)
115+
}
116+
},
117+
{ deep: true }
118+
)
119+
120+
// Watch for changes in working refresh request params
121+
watch(
122+
workingRefreshRequestParams,
123+
(newParams: TokenRequestParam[]) => {
124+
// Auto-add empty row when the last row is filled
125+
if (newParams.length > 0 && newParams[newParams.length - 1].key !== "") {
126+
workingRefreshRequestParams.value.push({
127+
id: paramsIdCounter++,
128+
key: "",
129+
value: "",
130+
sendIn: "body",
131+
active: true,
132+
})
133+
}
134+
135+
// Update auth.value.grantTypeInfo with non-empty params
136+
const nonEmptyParams = newParams.filter(
137+
(p: TokenRequestParam) => p.key !== "" || p.value !== ""
138+
)
139+
140+
if ("refreshRequestParams" in auth.value.grantTypeInfo) {
141+
auth.value.grantTypeInfo.refreshRequestParams = nonEmptyParams.map(
142+
(param) => ({
143+
id: param.id,
144+
key: param.key,
145+
value: param.value,
146+
sendIn: param.sendIn,
147+
active: param.active,
148+
})
149+
)
150+
}
151+
},
152+
{ deep: true }
153+
)
154+
155+
// Functions for auth request params management
156+
const addAuthRequestParam = () => {
157+
workingAuthRequestParams.value.push({
158+
id: paramsIdCounter++,
159+
key: "",
160+
value: "",
161+
active: true,
162+
})
163+
}
164+
165+
const updateAuthRequestParam = (index: number, payload: AuthRequestParam) => {
166+
workingAuthRequestParams.value[index] = payload
167+
}
168+
169+
const deleteAuthRequestParam = (index: number) => {
170+
if (workingAuthRequestParams.value.length > 1) {
171+
workingAuthRequestParams.value.splice(index, 1)
172+
}
173+
}
174+
175+
// Functions for token request params management
176+
const addTokenRequestParam = () => {
177+
workingTokenRequestParams.value.push({
178+
id: paramsIdCounter++,
179+
key: "",
180+
value: "",
181+
sendIn: "body",
182+
active: true,
183+
})
184+
}
185+
186+
const updateTokenRequestParam = (
187+
index: number,
188+
payload: TokenRequestParam
189+
) => {
190+
workingTokenRequestParams.value[index] = payload
191+
}
192+
193+
const deleteTokenRequestParam = (index: number) => {
194+
if (workingTokenRequestParams.value.length > 1) {
195+
workingTokenRequestParams.value.splice(index, 1)
196+
}
197+
}
198+
199+
// Functions for refresh request params management
200+
const addRefreshRequestParam = () => {
201+
workingRefreshRequestParams.value.push({
202+
id: paramsIdCounter++,
203+
key: "",
204+
value: "",
205+
sendIn: "body",
206+
active: true,
207+
})
208+
}
209+
210+
const updateRefreshRequestParam = (
211+
index: number,
212+
payload: TokenRequestParam
213+
) => {
214+
workingRefreshRequestParams.value[index] = payload
215+
}
216+
217+
const deleteRefreshRequestParam = (index: number) => {
218+
if (workingRefreshRequestParams.value.length > 1) {
219+
workingRefreshRequestParams.value.splice(index, 1)
220+
}
221+
}
222+
223+
// Initialize advanced parameters from the auth object when component mounts
224+
const initializeParams = () => {
225+
if (
226+
"authRequestParams" in auth.value.grantTypeInfo &&
227+
auth.value.grantTypeInfo.authRequestParams &&
228+
auth.value.grantTypeInfo.authRequestParams.length > 0
229+
) {
230+
workingAuthRequestParams.value =
231+
auth.value.grantTypeInfo.authRequestParams.map((param) => ({
232+
id: param.id || paramsIdCounter++,
233+
key: param.key,
234+
value: param.value,
235+
active: param.active,
236+
}))
237+
}
238+
239+
if (
240+
"tokenRequestParams" in auth.value.grantTypeInfo &&
241+
auth.value.grantTypeInfo.tokenRequestParams &&
242+
auth.value.grantTypeInfo.tokenRequestParams.length > 0
243+
) {
244+
workingTokenRequestParams.value = [
245+
...auth.value.grantTypeInfo.tokenRequestParams.map((param) => ({
246+
id: param.id || paramsIdCounter++,
247+
key: param.key,
248+
value: param.value,
249+
sendIn: param.sendIn || "body",
250+
active: param.active,
251+
})),
252+
{
253+
id: paramsIdCounter++,
254+
key: "",
255+
value: "",
256+
sendIn: "body",
257+
active: true,
258+
},
259+
]
260+
}
261+
262+
if (
263+
"refreshRequestParams" in auth.value.grantTypeInfo &&
264+
auth.value.grantTypeInfo.refreshRequestParams &&
265+
auth.value.grantTypeInfo.refreshRequestParams.length > 0
266+
) {
267+
workingRefreshRequestParams.value = [
268+
...auth.value.grantTypeInfo.refreshRequestParams.map((param) => ({
269+
id: param.id || paramsIdCounter++,
270+
key: param.key,
271+
value: param.value,
272+
sendIn: param.sendIn || "body",
273+
active: param.active,
274+
})),
275+
{
276+
id: paramsIdCounter++,
277+
key: "",
278+
value: "",
279+
sendIn: "body",
280+
active: true,
281+
},
282+
]
283+
}
284+
}
285+
286+
return {
287+
workingAuthRequestParams,
288+
workingTokenRequestParams,
289+
workingRefreshRequestParams,
290+
addAuthRequestParam,
291+
updateAuthRequestParam,
292+
deleteAuthRequestParam,
293+
addTokenRequestParam,
294+
updateTokenRequestParam,
295+
deleteTokenRequestParam,
296+
addRefreshRequestParam,
297+
updateRefreshRequestParam,
298+
deleteRefreshRequestParam,
299+
initializeParams,
300+
}
301+
}

0 commit comments

Comments
 (0)