add toast login
This commit is contained in:
		
							
								
								
									
										42
									
								
								src/toast/ToastLogin.tsx
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										42
									
								
								src/toast/ToastLogin.tsx
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,42 @@ | |||||||
|  | import { toast } from 'react-toastify'; | ||||||
|  | import { useTranslation } from 'react-i18next'; | ||||||
|  | // Custom message component | ||||||
|  | const LoginMessage = (props: ToastLoginProps) => { | ||||||
|  |   const { t } = useTranslation(); | ||||||
|  |   const handleClick = () => { | ||||||
|  |     const currentUrl = window.location.href; | ||||||
|  |     const redirect = encodeURIComponent(props?.redirectUrl || currentUrl); | ||||||
|  |     const loginUrl = props?.loginUrl || '/user/login/'; | ||||||
|  |     const newUrl = location.origin + loginUrl + '?redirect=' + redirect; | ||||||
|  |     window.open(newUrl, '_self'); | ||||||
|  |   }; | ||||||
|  |  | ||||||
|  |   return ( | ||||||
|  |     <div className='msg-container' onClick={handleClick} style={{ cursor: 'pointer' }}> | ||||||
|  |       <p className='msg-title'>{t('Please login')}</p> | ||||||
|  |       <p className='msg-description'>{t('Click here to go to the login page.')}</p> | ||||||
|  |     </div> | ||||||
|  |   ); | ||||||
|  | }; | ||||||
|  | type ToastLoginProps = { | ||||||
|  |   /** | ||||||
|  |    * 登录页面地址, /user/login | ||||||
|  |    */ | ||||||
|  |   loginUrl?: string; | ||||||
|  |   /** | ||||||
|  |    * 登录成功后跳转的地址, 默认是当前页面 | ||||||
|  |    */ | ||||||
|  |   redirectUrl?: string; | ||||||
|  | }; | ||||||
|  | /** | ||||||
|  |  * 登录提示 | ||||||
|  |  * @param props | ||||||
|  |  * @example | ||||||
|  |  *      toastLogin({ | ||||||
|  |  *        loginUrl: '/user/login/', | ||||||
|  |  *        redirectUrl: window.location.href, | ||||||
|  |  *      }); | ||||||
|  |  */ | ||||||
|  | export const toastLogin = (props: ToastLoginProps = {}) => { | ||||||
|  |   toast.info(<LoginMessage {...props} />); | ||||||
|  | }; | ||||||
		Reference in New Issue
	
	Block a user