Skip to content

Commit 2c574b3

Browse files
sherzod-bakhodirovEthella
sherzod-bakhodirov
and
Ethella
authored
feat: implement event listener for oauth popup (#952)
* feat: implement event listener for oauth popup * chore: update yarn.lock * feat: implement promi event for login with popup * feat: emit popup url event * chore: add logs * feat: create intermediary event for telegram result * chore: move oauth types to magic-sdk * feat: add a new flag shouldReturnURI * feat: handle cancel event * fix: handle cancel event * chore: add logs * chore: remove logs --------- Co-authored-by: Jerry Liu <[email protected]>
1 parent 0f078fe commit 2c574b3

File tree

6 files changed

+94
-36
lines changed

6 files changed

+94
-36
lines changed

‎packages/@magic-ext/oauth2/src/index.ts‎

Lines changed: 38 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { Extension } from '@magic-sdk/provider';
1+
import { createPromiEvent, Extension } from '@magic-sdk/provider';
22
import {
33
OAuthErrorData,
44
OAuthRedirectError,
@@ -9,6 +9,7 @@ import {
99
OAuthPopupConfiguration,
1010
OAuthVerificationConfiguration,
1111
} from './types';
12+
import { OAuthPopupEventEmit, OAuthPopupEventHandlers, OAuthPopupEventOnReceived } from '@magic-sdk/types';
1213

1314
declare global {
1415
interface Window {
@@ -89,12 +90,47 @@ export class OAuthExtension extends Extension.Internal<'oauth2'> {
8990
const requestPayload = this.utils.createJsonRpcRequestPayload(OAuthPayloadMethods.Popup, [
9091
{
9192
...configuration,
93+
returnTo: window.location.href,
9294
apiKey: this.sdk.apiKey,
9395
platform: 'web',
9496
},
9597
]);
9698

97-
return this.request<OAuthRedirectResult | OAuthRedirectError>(requestPayload);
99+
const promiEvent = createPromiEvent<OAuthRedirectResult, OAuthPopupEventHandlers>(async (resolve, reject) => {
100+
try {
101+
const oauthPopupRequest = this.request<OAuthRedirectResult | OAuthRedirectError, OAuthPopupEventHandlers>(
102+
requestPayload,
103+
);
104+
105+
const redirectEvent = (event: MessageEvent) => {
106+
this.createIntermediaryEvent(OAuthPopupEventEmit.PopupEvent, requestPayload.id as string)(event.data);
107+
};
108+
109+
if (configuration.shouldReturnURI) {
110+
oauthPopupRequest.on(OAuthPopupEventOnReceived.PopupUrl, popupUrl => {
111+
window.addEventListener('message', redirectEvent);
112+
promiEvent.emit(OAuthPopupEventOnReceived.PopupUrl, popupUrl);
113+
});
114+
}
115+
116+
const result = await oauthPopupRequest;
117+
window.removeEventListener('message', redirectEvent);
118+
119+
if ((result as OAuthRedirectError).error) {
120+
reject(result);
121+
} else {
122+
resolve(result as OAuthRedirectResult);
123+
}
124+
} catch (error) {
125+
reject(error);
126+
}
127+
});
128+
129+
promiEvent.on(OAuthPopupEventEmit.Cancel, () => {
130+
this.createIntermediaryEvent(OAuthPopupEventEmit.Cancel, requestPayload.id as string)();
131+
});
132+
133+
return promiEvent;
98134
}
99135

100136
protected seamlessTelegramLogin() {

‎packages/@magic-ext/oauth2/src/types.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -116,6 +116,7 @@ export interface OAuthPopupConfiguration {
116116
scope?: string[];
117117
loginHint?: string;
118118
providerParams?: Record<string, string | number | boolean>;
119+
shouldReturnURI?: boolean;
119120
}
120121

121122
export enum OAuthErrorCode {

‎packages/@magic-sdk/types/src/index.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -15,3 +15,4 @@ export * from './modules/intermediary-types';
1515
export * from './modules/nft-types';
1616
export * from './modules/wallet-types';
1717
export * from './modules/common-types';
18+
export * from './modules/oauth-types';

‎packages/@magic-sdk/types/src/modules/intermediary-types.ts‎

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -29,6 +29,7 @@ import {
2929
RecoveryFactorEventEmit,
3030
RecoveryFactorEventOnReceived,
3131
} from './user-types';
32+
import { OAuthPopupEventEmit, OAuthPopupEventOnReceived } from './oauth-types';
3233

3334
export type IntermediaryEvents =
3435
// EmailOTP
@@ -73,4 +74,7 @@ export type IntermediaryEvents =
7374
| `${DisableMFAEventEmit}`
7475
// Recover Account Events
7576
| `${RecoverAccountEventOnReceived}`
76-
| `${RecoverAccountEventEmit}`;
77+
| `${RecoverAccountEventEmit}`
78+
// OAuth Events
79+
| `${OAuthPopupEventEmit}`
80+
| `${OAuthPopupEventOnReceived}`;

‎packages/@magic-sdk/types/src/modules/oauth-types.ts‎

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
export enum OAuthPopupEventOnReceived {
2+
PopupUrl = 'popup-url',
3+
}
4+
5+
export enum OAuthPopupEventEmit {
6+
PopupEvent = 'popup-event',
7+
Cancel = 'cancel',
8+
}
9+
10+
export type OAuthPopupEventHandlers = {
11+
// Event sent
12+
[OAuthPopupEventEmit.PopupEvent]: (eventData: unknown) => void;
13+
[OAuthPopupEventEmit.Cancel]: () => void;
14+
// Event Received
15+
[OAuthPopupEventOnReceived.PopupUrl]: (event: { popupUrl: string; provider: string }) => void;
16+
};

‎yarn.lock‎

Lines changed: 33 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -3035,7 +3035,7 @@ __metadata:
30353035
version: 0.0.0-use.local
30363036
resolution: "@magic-ext/algorand@workspace:packages/@magic-ext/algorand"
30373037
dependencies:
3038-
"@magic-sdk/provider": ^30.0.0
3038+
"@magic-sdk/provider": ^31.0.0
30393039
languageName: unknown
30403040
linkType: soft
30413041

@@ -3044,7 +3044,7 @@ __metadata:
30443044
resolution: "@magic-ext/aptos@workspace:packages/@magic-ext/aptos"
30453045
dependencies:
30463046
"@aptos-labs/wallet-adapter-core": ^2.2.0
3047-
"@magic-sdk/provider": ^30.0.0
3047+
"@magic-sdk/provider": ^31.0.0
30483048
aptos: ^1.8.5
30493049
peerDependencies:
30503050
"@aptos-labs/wallet-adapter-core": ^2.2.0
@@ -3056,39 +3056,39 @@ __metadata:
30563056
version: 0.0.0-use.local
30573057
resolution: "@magic-ext/avalanche@workspace:packages/@magic-ext/avalanche"
30583058
dependencies:
3059-
"@magic-sdk/provider": ^30.0.0
3059+
"@magic-sdk/provider": ^31.0.0
30603060
languageName: unknown
30613061
linkType: soft
30623062

30633063
"@magic-ext/bitcoin@workspace:packages/@magic-ext/bitcoin":
30643064
version: 0.0.0-use.local
30653065
resolution: "@magic-ext/bitcoin@workspace:packages/@magic-ext/bitcoin"
30663066
dependencies:
3067-
"@magic-sdk/provider": ^30.0.0
3067+
"@magic-sdk/provider": ^31.0.0
30683068
languageName: unknown
30693069
linkType: soft
30703070

30713071
"@magic-ext/conflux@workspace:packages/@magic-ext/conflux":
30723072
version: 0.0.0-use.local
30733073
resolution: "@magic-ext/conflux@workspace:packages/@magic-ext/conflux"
30743074
dependencies:
3075-
"@magic-sdk/provider": ^30.0.0
3075+
"@magic-sdk/provider": ^31.0.0
30763076
languageName: unknown
30773077
linkType: soft
30783078

30793079
"@magic-ext/cosmos@workspace:packages/@magic-ext/cosmos":
30803080
version: 0.0.0-use.local
30813081
resolution: "@magic-ext/cosmos@workspace:packages/@magic-ext/cosmos"
30823082
dependencies:
3083-
"@magic-sdk/provider": ^30.0.0
3083+
"@magic-sdk/provider": ^31.0.0
30843084
languageName: unknown
30853085
linkType: soft
30863086

30873087
"@magic-ext/ed25519@workspace:packages/@magic-ext/ed25519":
30883088
version: 0.0.0-use.local
30893089
resolution: "@magic-ext/ed25519@workspace:packages/@magic-ext/ed25519"
30903090
dependencies:
3091-
"@magic-sdk/provider": ^30.0.0
3091+
"@magic-sdk/provider": ^31.0.0
30923092
languageName: unknown
30933093
linkType: soft
30943094

@@ -3105,7 +3105,7 @@ __metadata:
31053105
version: 0.0.0-use.local
31063106
resolution: "@magic-ext/farcaster@workspace:packages/@magic-ext/farcaster"
31073107
dependencies:
3108-
"@magic-sdk/provider": ^30.0.0
3108+
"@magic-sdk/provider": ^31.0.0
31093109
"@magic-sdk/types": ^25.0.0
31103110
languageName: unknown
31113111
linkType: soft
@@ -3114,7 +3114,7 @@ __metadata:
31143114
version: 0.0.0-use.local
31153115
resolution: "@magic-ext/flow@workspace:packages/@magic-ext/flow"
31163116
dependencies:
3117-
"@magic-sdk/provider": ^30.0.0
3117+
"@magic-sdk/provider": ^31.0.0
31183118
"@onflow/fcl": ^1.4.1
31193119
"@onflow/types": ^1.1.0
31203120
peerDependencies:
@@ -3127,7 +3127,7 @@ __metadata:
31273127
version: 0.0.0-use.local
31283128
resolution: "@magic-ext/gdkms@workspace:packages/@magic-ext/gdkms"
31293129
dependencies:
3130-
"@magic-sdk/provider": ^30.0.0
3130+
"@magic-sdk/provider": ^31.0.0
31313131
"@magic-sdk/types": ^25.0.0
31323132
languageName: unknown
31333133
linkType: soft
@@ -3136,7 +3136,7 @@ __metadata:
31363136
version: 0.0.0-use.local
31373137
resolution: "@magic-ext/harmony@workspace:packages/@magic-ext/harmony"
31383138
dependencies:
3139-
"@magic-sdk/provider": ^30.0.0
3139+
"@magic-sdk/provider": ^31.0.0
31403140
languageName: unknown
31413141
linkType: soft
31423142

@@ -3154,31 +3154,31 @@ __metadata:
31543154
version: 0.0.0-use.local
31553155
resolution: "@magic-ext/icon@workspace:packages/@magic-ext/icon"
31563156
dependencies:
3157-
"@magic-sdk/provider": ^30.0.0
3157+
"@magic-sdk/provider": ^31.0.0
31583158
languageName: unknown
31593159
linkType: soft
31603160

31613161
"@magic-ext/kadena@workspace:packages/@magic-ext/kadena":
31623162
version: 0.0.0-use.local
31633163
resolution: "@magic-ext/kadena@workspace:packages/@magic-ext/kadena"
31643164
dependencies:
3165-
"@magic-sdk/provider": ^30.0.0
3165+
"@magic-sdk/provider": ^31.0.0
31663166
languageName: unknown
31673167
linkType: soft
31683168

31693169
"@magic-ext/near@workspace:packages/@magic-ext/near":
31703170
version: 0.0.0-use.local
31713171
resolution: "@magic-ext/near@workspace:packages/@magic-ext/near"
31723172
dependencies:
3173-
"@magic-sdk/provider": ^30.0.0
3173+
"@magic-sdk/provider": ^31.0.0
31743174
languageName: unknown
31753175
linkType: soft
31763176

31773177
"@magic-ext/oauth2@workspace:packages/@magic-ext/oauth2":
31783178
version: 0.0.0-use.local
31793179
resolution: "@magic-ext/oauth2@workspace:packages/@magic-ext/oauth2"
31803180
dependencies:
3181-
"@magic-sdk/provider": ^30.0.0
3181+
"@magic-sdk/provider": ^31.0.0
31823182
"@types/crypto-js": 4.2.0
31833183
crypto-js: ^4.2.0
31843184
languageName: unknown
@@ -3188,23 +3188,23 @@ __metadata:
31883188
version: 0.0.0-use.local
31893189
resolution: "@magic-ext/oidc@workspace:packages/@magic-ext/oidc"
31903190
dependencies:
3191-
"@magic-sdk/provider": ^30.0.0
3191+
"@magic-sdk/provider": ^31.0.0
31923192
languageName: unknown
31933193
linkType: soft
31943194

31953195
"@magic-ext/polkadot@workspace:packages/@magic-ext/polkadot":
31963196
version: 0.0.0-use.local
31973197
resolution: "@magic-ext/polkadot@workspace:packages/@magic-ext/polkadot"
31983198
dependencies:
3199-
"@magic-sdk/provider": ^30.0.0
3199+
"@magic-sdk/provider": ^31.0.0
32003200
languageName: unknown
32013201
linkType: soft
32023202

32033203
"@magic-ext/react-native-bare-oauth@workspace:packages/@magic-ext/react-native-bare-oauth":
32043204
version: 0.0.0-use.local
32053205
resolution: "@magic-ext/react-native-bare-oauth@workspace:packages/@magic-ext/react-native-bare-oauth"
32063206
dependencies:
3207-
"@magic-sdk/react-native-bare": ^31.0.1
3207+
"@magic-sdk/react-native-bare": ^32.0.0
32083208
"@magic-sdk/types": ^25.0.0
32093209
react-native-inappbrowser-reborn: ^3.7.0
32103210
peerDependencies:
@@ -3217,7 +3217,7 @@ __metadata:
32173217
version: 0.0.0-use.local
32183218
resolution: "@magic-ext/react-native-expo-oauth@workspace:packages/@magic-ext/react-native-expo-oauth"
32193219
dependencies:
3220-
"@magic-sdk/react-native-expo": ^31.0.1
3220+
"@magic-sdk/react-native-expo": ^32.0.0
32213221
"@magic-sdk/types": ^25.0.0
32223222
"@react-native-async-storage/async-storage": ^2.1.2
32233223
"@types/crypto-js": ~4.2.0
@@ -3233,7 +3233,7 @@ __metadata:
32333233
version: 0.0.0-use.local
32343234
resolution: "@magic-ext/solana@workspace:packages/@magic-ext/solana"
32353235
dependencies:
3236-
"@magic-sdk/provider": ^30.0.0
3236+
"@magic-sdk/provider": ^31.0.0
32373237
"@solana/web3.js": ^1.87.2
32383238
peerDependencies:
32393239
"@solana/web3.js": ^1.87.2
@@ -3244,39 +3244,39 @@ __metadata:
32443244
version: 0.0.0-use.local
32453245
resolution: "@magic-ext/sui@workspace:packages/@magic-ext/sui"
32463246
dependencies:
3247-
"@magic-sdk/provider": ^30.0.0
3247+
"@magic-sdk/provider": ^31.0.0
32483248
languageName: unknown
32493249
linkType: soft
32503250

32513251
"@magic-ext/taquito@workspace:packages/@magic-ext/taquito":
32523252
version: 0.0.0-use.local
32533253
resolution: "@magic-ext/taquito@workspace:packages/@magic-ext/taquito"
32543254
dependencies:
3255-
"@magic-sdk/provider": ^30.0.0
3255+
"@magic-sdk/provider": ^31.0.0
32563256
languageName: unknown
32573257
linkType: soft
32583258

32593259
"@magic-ext/terra@workspace:packages/@magic-ext/terra":
32603260
version: 0.0.0-use.local
32613261
resolution: "@magic-ext/terra@workspace:packages/@magic-ext/terra"
32623262
dependencies:
3263-
"@magic-sdk/provider": ^30.0.0
3263+
"@magic-sdk/provider": ^31.0.0
32643264
languageName: unknown
32653265
linkType: soft
32663266

32673267
"@magic-ext/tezos@workspace:packages/@magic-ext/tezos":
32683268
version: 0.0.0-use.local
32693269
resolution: "@magic-ext/tezos@workspace:packages/@magic-ext/tezos"
32703270
dependencies:
3271-
"@magic-sdk/provider": ^30.0.0
3271+
"@magic-sdk/provider": ^31.0.0
32723272
languageName: unknown
32733273
linkType: soft
32743274

32753275
"@magic-ext/web3modal-ethers5@workspace:packages/@magic-ext/web3modal-ethers5":
32763276
version: 0.0.0-use.local
32773277
resolution: "@magic-ext/web3modal-ethers5@workspace:packages/@magic-ext/web3modal-ethers5"
32783278
dependencies:
3279-
"@magic-sdk/provider": ^30.0.0
3279+
"@magic-sdk/provider": ^31.0.0
32803280
"@magic-sdk/types": ^25.0.0
32813281
"@web3modal/ethers5": 5.0.3
32823282
ethers: 5.7.2
@@ -3287,19 +3287,19 @@ __metadata:
32873287
version: 0.0.0-use.local
32883288
resolution: "@magic-ext/webauthn@workspace:packages/@magic-ext/webauthn"
32893289
dependencies:
3290-
"@magic-sdk/provider": ^30.0.0
3290+
"@magic-sdk/provider": ^31.0.0
32913291
languageName: unknown
32923292
linkType: soft
32933293

32943294
"@magic-ext/zilliqa@workspace:packages/@magic-ext/zilliqa":
32953295
version: 0.0.0-use.local
32963296
resolution: "@magic-ext/zilliqa@workspace:packages/@magic-ext/zilliqa"
32973297
dependencies:
3298-
"@magic-sdk/provider": ^30.0.0
3298+
"@magic-sdk/provider": ^31.0.0
32993299
languageName: unknown
33003300
linkType: soft
33013301

3302-
"@magic-sdk/provider@^30.0.0, @magic-sdk/provider@workspace:packages/@magic-sdk/provider":
3302+
"@magic-sdk/provider@^31.0.0, @magic-sdk/provider@workspace:packages/@magic-sdk/provider":
33033303
version: 0.0.0-use.local
33043304
resolution: "@magic-sdk/provider@workspace:packages/@magic-sdk/provider"
33053305
dependencies:
@@ -3325,12 +3325,12 @@ __metadata:
33253325
languageName: node
33263326
linkType: hard
33273327

3328-
"@magic-sdk/react-native-bare@^31.0.1, @magic-sdk/react-native-bare@workspace:packages/@magic-sdk/react-native-bare":
3328+
"@magic-sdk/react-native-bare@^32.0.0, @magic-sdk/react-native-bare@workspace:packages/@magic-sdk/react-native-bare":
33293329
version: 0.0.0-use.local
33303330
resolution: "@magic-sdk/react-native-bare@workspace:packages/@magic-sdk/react-native-bare"
33313331
dependencies:
33323332
"@aveq-research/localforage-asyncstorage-driver": ^3.0.1
3333-
"@magic-sdk/provider": ^30.0.0
3333+
"@magic-sdk/provider": ^31.0.0
33343334
"@magic-sdk/types": ^25.0.0
33353335
"@react-native-async-storage/async-storage": ^2.1.2
33363336
"@react-native-community/netinfo": ">11.0.0"
@@ -3362,12 +3362,12 @@ __metadata:
33623362
languageName: unknown
33633363
linkType: soft
33643364

3365-
"@magic-sdk/react-native-expo@^31.0.1, @magic-sdk/react-native-expo@workspace:packages/@magic-sdk/react-native-expo":
3365+
"@magic-sdk/react-native-expo@^32.0.0, @magic-sdk/react-native-expo@workspace:packages/@magic-sdk/react-native-expo":
33663366
version: 0.0.0-use.local
33673367
resolution: "@magic-sdk/react-native-expo@workspace:packages/@magic-sdk/react-native-expo"
33683368
dependencies:
33693369
"@aveq-research/localforage-asyncstorage-driver": ^3.0.1
3370-
"@magic-sdk/provider": ^30.0.0
3370+
"@magic-sdk/provider": ^31.0.0
33713371
"@magic-sdk/types": ^25.0.0
33723372
"@react-native-async-storage/async-storage": ^1.15.5
33733373
"@react-native-community/netinfo": ">11.0.0"
@@ -14367,7 +14367,7 @@ __metadata:
1436714367
version: 0.0.0-use.local
1436814368
resolution: "magic-sdk@workspace:packages/magic-sdk"
1436914369
dependencies:
14370-
"@magic-sdk/provider": ^30.0.0
14370+
"@magic-sdk/provider": ^31.0.0
1437114371
"@magic-sdk/types": ^25.0.0
1437214372
localforage: ^1.7.4
1437314373
languageName: unknown

0 commit comments

Comments
 (0)