diff --git a/packages/ui/src/containers/SocialSignIn/SecondarySocialSignIn.test.tsx b/packages/ui/src/containers/SocialSignIn/SecondarySocialSignIn.test.tsx index 5be4574ab..1fe3aa341 100644 --- a/packages/ui/src/containers/SocialSignIn/SecondarySocialSignIn.test.tsx +++ b/packages/ui/src/containers/SocialSignIn/SecondarySocialSignIn.test.tsx @@ -28,7 +28,10 @@ describe('SecondarySocialSignIn', () => { platform: 'web', getPostMessage: jest.fn(() => jest.fn()), callbackLink: '/logto:', - supportedSocialConnectorTargets: socialConnectors.map(({ id }) => id), + supportedConnector: { + universal: true, + nativeTargets: socialConnectors.map(({ target }) => target), + }, }; /* eslint-enable @silverhand/fp/no-mutation */ }); diff --git a/packages/ui/src/hooks/utils.test.ts b/packages/ui/src/hooks/utils.test.ts index 43fd344a1..bb52f65e2 100644 --- a/packages/ui/src/hooks/utils.test.ts +++ b/packages/ui/src/hooks/utils.test.ts @@ -20,7 +20,7 @@ describe('filterSocialConnectors', () => { expect(filterSocialConnectors()).toEqual([]); }); - it('filter web connectors', () => { + it('filter Web Connectors', () => { expect(filterSocialConnectors(mockConnectors)).toEqual([ { platform: 'Web', target: 'facebook' }, { platform: 'Web', target: 'google' }, @@ -28,12 +28,15 @@ describe('filterSocialConnectors', () => { ]); }); - it('filter Native connectors', () => { + it('filter Native Connectors', () => { /* eslint-disable @silverhand/fp/no-mutation */ // @ts-expect-error mock global object globalThis.logtoNativeSdk = { platform: 'ios', - supportedSocialConnectorTargets: ['Web', 'WeChat'], + supportedConnector: { + universal: true, + nativeTargets: ['Web', 'WeChat'], + }, }; /* eslint-enable @silverhand/fp/no-mutation */ @@ -42,4 +45,21 @@ describe('filterSocialConnectors', () => { { platform: 'Native', target: 'WeChat' }, ]); }); + + it('filter Native & Universal Connectors', () => { + /* eslint-disable @silverhand/fp/no-mutation */ + // @ts-expect-error mock global object + globalThis.logtoNativeSdk = { + platform: 'ios', + supportedConnector: { + universal: false, + nativeTargets: ['Web', 'WeChat'], + }, + }; + /* eslint-enable @silverhand/fp/no-mutation */ + + expect(filterSocialConnectors(mockConnectors)).toEqual([ + { platform: 'Native', target: 'WeChat' }, + ]); + }); }); diff --git a/packages/ui/src/hooks/utils.ts b/packages/ui/src/hooks/utils.ts index 304600c39..902c1607f 100644 --- a/packages/ui/src/hooks/utils.ts +++ b/packages/ui/src/hooks/utils.ts @@ -68,6 +68,13 @@ export const filterSocialConnectors = (socialConnectors?: ConnectorData[]) => { const connectorMap = new Map(); + /** + * Browser Environment + * Accepts both web and universal platform connectors. + * Insert universal connectors only if there is no web platform connector provided with the same target. + * Web platform has higher priority. + **/ + if (!isNativeWebview()) { for (const connector of socialConnectors) { const { platform, target } = connector; @@ -76,11 +83,6 @@ export const filterSocialConnectors = (socialConnectors?: ConnectorData[]) => { continue; } - /** - * Accepts both web and universal platform connectors. - * Insert universal connectors only if there is no web platform connector provided with the same target. - * Web platform has higher priority. - **/ if (platform === 'Web' || !connectorMap.get(target)) { connectorMap.set(target, connector); continue; @@ -90,6 +92,13 @@ export const filterSocialConnectors = (socialConnectors?: ConnectorData[]) => { return Array.from(connectorMap.values()); } + /** + * Native Webview Environment + * Accepts both native and universal platform connectors. + * Insert universal connectors only if there is no native platform connector provided with the same target. + * Native platform has higher priority. + **/ + for (const connector of socialConnectors) { const { platform, target } = connector; @@ -97,20 +106,19 @@ export const filterSocialConnectors = (socialConnectors?: ConnectorData[]) => { continue; } - /** - * Accepts both Native and universal platform connectors. - * Insert universal connectors only if there is no Native platform connector provided with the same target. - * Native platform has higher priority. - **/ - if ( - platform === 'Native' && - getLogtoNativeSdk()?.supportedSocialConnectorTargets.includes(target) - ) { + const { supportedConnector } = getLogtoNativeSdk() ?? {}; + + // No native supportedConnector settings found + if (!supportedConnector) { + continue; + } + + if (platform === 'Native' && supportedConnector.nativeTargets.includes(target)) { connectorMap.set(target, connector); continue; } - if (platform === 'Universal' && !connectorMap.get(target)) { + if (platform === 'Universal' && supportedConnector.universal && !connectorMap.get(target)) { connectorMap.set(target, connector); continue; } diff --git a/packages/ui/src/include.d/global.d.ts b/packages/ui/src/include.d/global.d.ts index c93138775..ce00e0c80 100644 --- a/packages/ui/src/include.d/global.d.ts +++ b/packages/ui/src/include.d/global.d.ts @@ -4,7 +4,10 @@ type LogtoNativeSdkInfo = { platform: 'ios' | 'android'; callbackLink: string; getPostMessage: () => (data: { callbackUri?: string; redirectTo?: string }) => void; - supportedSocialConnectorTargets: string[]; + supportedConnector: { + universal: boolean; + nativeTargets: string[]; + }; }; declare const logtoNativeSdk: LogtoNativeSdkInfo | undefined;