@authing/react-ui-components 2.4.55-alpha.5 → 2.4.57

package/package.json

@@ -1,12 +1,12 @@
 {
   "name": "@authing/react-ui-components",
-  "version": "2.4.55-alpha.5",
+  "version": "2.4.57",
   "private": false,
   "main": "lib/index.min.js",
   "typings": "lib/index.d.ts",
   "dependencies": {
     "antd": "^4.8.0",
-    "authing-js-sdk": "4.22.26-alpha.9",
+    "authing-js-sdk": "4.22.24-alpha",
     "qs": "^6.9.4"
   },
   "peerDependencies": {

package/src/components/AuthingGuard/Forms/QrCodeLoginForm/index.tsx

@@ -14,7 +14,6 @@ export const QrCodeLoginForm: FC<QrLoginFormProps> = ({
   onFail,
   onSuccess,
   type,
-  idpId,
 }) => {
   const {
     state: { authClient, config },
@@ -32,7 +31,6 @@ export const QrCodeLoginForm: FC<QrLoginFormProps> = ({
 
   useEffect(() => {
     client.startScanning('authingGuardQrcode', {
-      extIdpConnId: idpId,
       autoExchangeUserInfo: true,
       ...config.qrCodeScanOptions,
       onStart(timer) {
@@ -48,7 +46,7 @@ export const QrCodeLoginForm: FC<QrLoginFormProps> = ({
       },
     })
     return () => clearInterval(timerRef.current)
-  }, [client, config.qrCodeScanOptions, idpId, onFail, onSuccess])
+  }, [client, config.qrCodeScanOptions, onFail, onSuccess])
 
   return (
     <div className="authing-guard-qr-form">

package/src/components/AuthingGuard/Forms/SocialAndIdpLogin/index.tsx

@@ -218,7 +218,7 @@ export const SocialAndIdpLogin: FC<SocialAndIdpLoginProps> = ({
       }
 
       const onLogin = () => {
-        authClient.social.authorize(item.identifier, {
+        authClient.social.authorize(item.provider, {
           onSuccess(user) {
             onSuccess(user)
           },
@@ -254,12 +254,12 @@ export const SocialAndIdpLogin: FC<SocialAndIdpLoginProps> = ({
           }
           onClick={onLogin}
         >
-          {item.tooltip?.[i18n.language as Lang] || item.displayName}
+          {item.tooltip?.[i18n.language as Lang] || item.name}
         </Button>
       ) : (
         <Tooltip
           key={item.provider}
-          title={item.tooltip?.[i18n.language as Lang] || item.displayName}
+          title={item.tooltip?.[i18n.language as Lang] || item.name}
         >
           <div className="authing-social-login-item" onClick={onLogin}>
             <IconFont type={iconType} />

package/src/components/AuthingGuard/GuardLayout/index.tsx

@@ -156,6 +156,9 @@ const useGuardConfig = () => {
       appConfig.loginTabs?.list ||
       defaultGuardConfig.loginMethods
 
+    // 扫码多源配置
+    const qrcodeTabsSettings = appConfig.qrcodeTabsSettings
+
     // 账密登录的登录拆分
     const passwordLoginMethods =
       userConfig.passwordLoginMethods ||
@@ -165,12 +168,9 @@ const useGuardConfig = () => {
     // 默认登录方式
     const defaultLoginMethod =
       userConfig.defaultLoginMethod ||
-      appConfig.loginTabs?.defaultV2 ||
       appConfig.loginTabs?.default ||
       defaultGuardConfig.defaultLoginMethod
 
-    const loginMethodTitleMapping = appConfig.loginTabs?.title
-
     // 注册方式
     const registerMethods =
       userConfig.registerMethods ||
@@ -236,16 +236,16 @@ const useGuardConfig = () => {
         defaultRegisterMethod,
         enterpriseConnectionObjs,
         publicKey: appConfig.publicKey,
+        qrcodeTabsSettings,
         agreementEnabled: appConfig.agreementEnabled,
         agreements: appConfig.agreements,
-        loginMethodTitleMapping: loginMethodTitleMapping,
       }
     )
   }, [
     userConfig,
     appConfig.loginTabs?.list,
     appConfig.loginTabs?.default,
-    appConfig.loginTabs?.title,
+    appConfig.qrcodeTabsSettings,
     appConfig.passwordTabConfig?.enabledLoginMethods,
     appConfig.registerTabs?.list,
     appConfig.registerTabs?.default,

package/src/components/AuthingGuard/LoginLayout/index.tsx

@@ -75,36 +75,36 @@ const useNormalLoginTabs = ({ onSuccess, onFail }: BaseFormProps) => {
   }
 
   const LOGIN_FORM_MAP = {
-    [LoginMethods.Password]: (props: any) => (
+    [LoginMethods.Password]: (
       <PasswordLoginForm
-        {...props}
+        {...formProps}
         ref={(v) => (formRef.current[LoginMethods.Password] = v!)}
       />
     ),
-    [LoginMethods.PhoneCode]: (props: any) => (
+    [LoginMethods.PhoneCode]: (
       <PhoneCodeLoginForm
-        {...props}
+        {...formProps}
         ref={(v) => (formRef.current[LoginMethods.PhoneCode] = v!)}
       />
     ),
-    [LoginMethods.AppQr]: (props: any) => (
-      <QrCodeLoginForm type={LoginMethods.AppQr} {...props} />
+    [LoginMethods.AppQr]: (
+      <QrCodeLoginForm type={LoginMethods.AppQr} {...formProps} />
     ),
-    [LoginMethods.WxMinQr]: (props: any) => (
-      <QrCodeLoginForm type={LoginMethods.WxMinQr} {...props} />
+    [LoginMethods.WxMinQr]: (
+      <QrCodeLoginForm type={LoginMethods.WxMinQr} {...formProps} />
     ),
-    [LoginMethods.LDAP]: (props: any) => (
+    [LoginMethods.LDAP]: (
       <LdapLoginForm
-        {...props}
+        {...formProps}
         ref={(v) => (formRef.current[LoginMethods.LDAP] = v!)}
       />
     ),
-    [LoginMethods.WechatMpQrcode]: (props: any) => (
-      <QrCodeLoginForm type={LoginMethods.WechatMpQrcode} {...props} />
+    [LoginMethods.WechatMpQrcode]: (
+      <QrCodeLoginForm type={LoginMethods.WechatMpQrcode} {...formProps} />
     ),
-    [LoginMethods.AD]: (props: any) => (
+    [LoginMethods.AD]: (
       <ADLoginForm
-        {...props}
+        {...formProps}
         ref={(v) => (formRef.current[LoginMethods.AD] = v!)}
       />
     ),
@@ -113,38 +113,13 @@ const useNormalLoginTabs = ({ onSuccess, onFail }: BaseFormProps) => {
   const {
     state: { config },
   } = useGuardContext()
-  const { loginMethods = [], loginMethodTitleMapping } = config
-
-  const tabs = loginMethods
-    .map((tab) => {
-      if (
-        !loginMethods.every(
-          (item) => !(item.split(':').length > 1 && item.split(':')[0] === tab)
-        )
-      )
-        return undefined
-
-      const idpId = tab.split(':').length > 1 ? tab.split(':')[1] : undefined
-
-      if (idpId) {
-        const type = tab.split(':')[0] as LoginMethods
-        return {
-          key: tab,
-          label: loginMethodTitleMapping[tab]!,
-          component: LOGIN_FORM_MAP[type]({
-            ...formProps,
-            idpId: idpId,
-          }),
-        }
-      } else {
-        return {
-          key: tab,
-          label: LOGIN_METHODS_MAP()?.[tab]!,
-          component: LOGIN_FORM_MAP[tab](formProps),
-        }
-      }
-    })
-    .filter((i) => i !== undefined)
+  const { loginMethods = [] } = config
+
+  const tabs = loginMethods.map((item) => ({
+    key: item,
+    label: LOGIN_METHODS_MAP()?.[item]!,
+    component: LOGIN_FORM_MAP[item],
+  }))
 
   return {
     tabs,
@@ -168,13 +143,7 @@ export const LoginLayout = () => {
   return (
     <>
       <AuthingTabs
-        tabs={
-          tabs as {
-            key: LoginMethods
-            label: string
-            component: JSX.Element
-          }[]
-        }
+        tabs={tabs}
         onTabClick={(t) =>
           setValue('activeTabs', {
             ...activeTabs,

package/src/components/AuthingGuard/api/appConfig.ts

@@ -1,5 +1,9 @@
 import { requestClient } from './http'
-import { Lang, Protocol } from '../../../components/AuthingGuard/types'
+import {
+  Lang,
+  LoginMethods,
+  Protocol,
+} from '../../../components/AuthingGuard/types'
 import {
   IAzureAdConnectionConfig,
   ICasConnectionConfig,
@@ -25,6 +29,15 @@ export const ApplicationMfaTypeLabel: () => Record<
   [ApplicationMfaType.EMAIL]: i18n.t('common.EmailVerification'),
 })
 
+export type QrcodeTabsSettings = Record<
+  LoginMethods,
+  {
+    id: string
+    title: string
+    isDefault?: boolean
+  }
+>
+
 export interface OidcClientMetadata {
   grant_types: string[]
   client_id: string
@@ -83,10 +96,12 @@ export interface ApplicationConfig {
     default: string
     title: { [x: string]: string }
   }
+
+  qrcodeTabsSettings: QrcodeTabsSettings
+
   loginTabs: {
     list: string[]
     default: string
-    defaultV2?: string
     title: { [x: string]: string }
   }
   socialConnections: SocialConnectionItem[]

package/src/components/AuthingGuard/api/userPoolConfig.ts

@@ -72,10 +72,8 @@ export interface ICasConnectionConfig {
 }
 export interface SocialConnectionItem {
   name: string
-  displayName: string
   logo: string
   description: string
-  identifier: string
   provider: SocialConnectionProvider
   authorizationUrl: string
   tooltip: Record<Lang, string>

package/src/components/AuthingGuard/style.less

@@ -70,6 +70,7 @@
     }
   }
 }
+
 .authing-data-tips__top {
   position: relative;
   &::after {

package/src/components/AuthingGuard/types/Forms.ts

@@ -27,7 +27,6 @@ export interface LdapLoginFormProps extends BaseFormProps {
 
 export interface QrLoginFormProps extends BaseFormProps {
   type: LoginMethods.AppQr | LoginMethods.WxMinQr | LoginMethods.WechatMpQrcode
-  idpId?: string
 }
 
 export interface EmailRegisterFormProps extends BaseFormProps {

package/src/components/AuthingGuard/types/GuardConfig.ts

@@ -13,6 +13,7 @@ import {
   ApplicationConfig,
   PasswordLoginMethods,
   Agreement,
+  QrcodeTabsSettings,
 } from '../../../components/AuthingGuard/api'
 import { Lang } from './Locales'
 
@@ -412,7 +413,7 @@ export interface GuardConfig extends UserConfig {
   publicKey: ApplicationConfig['publicKey']
   agreementEnabled: boolean
   agreements: Agreement[]
-  loginMethodTitleMapping: Record<string, string>
+  qrcodeTabsSettings: QrcodeTabsSettings
 }
 
 export interface LocalesConfig {

package/src/index.tsx

@@ -21,7 +21,7 @@ const App = () => {
 
   const config: UserConfig = {
     mode: GuardMode.Modal,
-    appHost: 'https://core.dev2.authing-inc.co',
+    appHost: 'https://core.dev2.authing-inc.co/',
     // apiHost: 'http://console.authing.localhost:3000',
     // apiHost: 'http://192.168.50.57:3000',
     // loginMethods: Object.values(LoginMethods),
@@ -114,8 +114,8 @@ const App = () => {
         }}
         // onLoad={(a) => console.log(a, '加载完成')}
         // onPwdResetError={(e) => console.log(e)}
-        appId="619c7976cd38c13a2222464f"
-        tenantId="619c864928b15c6421d12e35"
+        appId="6191cf610f772aa56dc70637"
+        tenantId="6194a41abf23c1d5268b362a"
         // appId="5fd877fb0ba0421962eced94"
         config={config}
       />

package/build/asset-manifest.json

@@ -1,25 +0,0 @@
-{
-  "files": {
-    "main.css": "/static/css/main.4dd73333.chunk.css",
-    "main.js": "/static/js/main.eeb41586.chunk.js",
-    "main.js.map": "/static/js/main.eeb41586.chunk.js.map",
-    "runtime-main.js": "/static/js/runtime-main.6174f3e9.js",
-    "runtime-main.js.map": "/static/js/runtime-main.6174f3e9.js.map",
-    "static/css/2.e5f4a1ca.chunk.css": "/static/css/2.e5f4a1ca.chunk.css",
-    "static/js/2.b28e1968.chunk.js": "/static/js/2.b28e1968.chunk.js",
-    "static/js/2.b28e1968.chunk.js.map": "/static/js/2.b28e1968.chunk.js.map",
-    "static/js/3.584da164.chunk.js": "/static/js/3.584da164.chunk.js",
-    "static/js/3.584da164.chunk.js.map": "/static/js/3.584da164.chunk.js.map",
-    "index.html": "/index.html",
-    "static/css/2.e5f4a1ca.chunk.css.map": "/static/css/2.e5f4a1ca.chunk.css.map",
-    "static/css/main.4dd73333.chunk.css.map": "/static/css/main.4dd73333.chunk.css.map",
-    "static/js/2.b28e1968.chunk.js.LICENSE.txt": "/static/js/2.b28e1968.chunk.js.LICENSE.txt"
-  },
-  "entrypoints": [
-    "static/js/runtime-main.6174f3e9.js",
-    "static/css/2.e5f4a1ca.chunk.css",
-    "static/js/2.b28e1968.chunk.js",
-    "static/css/main.4dd73333.chunk.css",
-    "static/js/main.eeb41586.chunk.js"
-  ]
-}

package/build/index.html

@@ -1 +0,0 @@
-<!doctype html><html lang="en"><head><meta charset="utf-8"/><link rel="icon" href="/favicon.ico"/><meta name="viewport" content="width=device-width,initial-scale=1"/><meta name="theme-color" content="#000000"/><meta name="description" content="Web site created using create-react-app"/><link rel="apple-touch-icon" href="/logo192.png"/><link rel="manifest" href="/manifest.json"/><title>React App</title><link href="/static/css/2.e5f4a1ca.chunk.css" rel="stylesheet"><link href="/static/css/main.4dd73333.chunk.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div><script>!function(e){function t(t){for(var n,a,i=t[0],c=t[1],l=t[2],s=0,p=[];s<i.length;s++)a=i[s],Object.prototype.hasOwnProperty.call(o,a)&&o[a]&&p.push(o[a][0]),o[a]=0;for(n in c)Object.prototype.hasOwnProperty.call(c,n)&&(e[n]=c[n]);for(f&&f(t);p.length;)p.shift()();return u.push.apply(u,l||[]),r()}function r(){for(var e,t=0;t<u.length;t++){for(var r=u[t],n=!0,i=1;i<r.length;i++){var c=r[i];0!==o[c]&&(n=!1)}n&&(u.splice(t--,1),e=a(a.s=r[0]))}return e}var n={},o={1:0},u=[];function a(t){if(n[t])return n[t].exports;var r=n[t]={i:t,l:!1,exports:{}};return e[t].call(r.exports,r,r.exports,a),r.l=!0,r.exports}a.e=function(e){var t=[],r=o[e];if(0!==r)if(r)t.push(r[2]);else{var n=new Promise((function(t,n){r=o[e]=[t,n]}));t.push(r[2]=n);var u,i=document.createElement("script");i.charset="utf-8",i.timeout=120,a.nc&&i.setAttribute("nonce",a.nc),i.src=function(e){return a.p+"static/js/"+({}[e]||e)+"."+{3:"584da164"}[e]+".chunk.js"}(e);var c=new Error;u=function(t){i.onerror=i.onload=null,clearTimeout(l);var r=o[e];if(0!==r){if(r){var n=t&&("load"===t.type?"missing":t.type),u=t&&t.target&&t.target.src;c.message="Loading chunk "+e+" failed.\n("+n+": "+u+")",c.name="ChunkLoadError",c.type=n,c.request=u,r[1](c)}o[e]=void 0}};var l=setTimeout((function(){u({type:"timeout",target:i})}),12e4);i.onerror=i.onload=u,document.head.appendChild(i)}return Promise.all(t)},a.m=e,a.c=n,a.d=function(e,t,r){a.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},a.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},a.t=function(e,t){if(1&t&&(e=a(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(a.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var n in e)a.d(r,n,function(t){return e[t]}.bind(null,n));return r},a.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return a.d(t,"a",t),t},a.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},a.p="/",a.oe=function(e){throw console.error(e),e};var i=this["webpackJsonp@authing/react-ui-components"]=this["webpackJsonp@authing/react-ui-components"]||[],c=i.push.bind(i);i.push=t,i=i.slice();for(var l=0;l<i.length;l++)t(i[l]);var f=c;r()}([])</script><script src="/static/js/2.b28e1968.chunk.js"></script><script src="/static/js/main.eeb41586.chunk.js"></script></body></html>

package/build/manifest.json

@@ -1,25 +0,0 @@
-{
-  "short_name": "React App",
-  "name": "Create React App Sample",
-  "icons": [
-    {
-      "src": "favicon.ico",
-      "sizes": "64x64 32x32 24x24 16x16",
-      "type": "image/x-icon"
-    },
-    {
-      "src": "logo192.png",
-      "type": "image/png",
-      "sizes": "192x192"
-    },
-    {
-      "src": "logo512.png",
-      "type": "image/png",
-      "sizes": "512x512"
-    }
-  ],
-  "start_url": ".",
-  "display": "standalone",
-  "theme_color": "#000000",
-  "background_color": "#ffffff"
-}

package/build/robots.txt

@@ -1,3 +0,0 @@
-# https://www.robotstxt.org/robotstxt.html
-User-agent: *
-Disallow: