Login Error and Message

This commit is contained in:
Sedat ÖZTÜRK 2025-05-14 16:10:12 +03:00
parent 9de0296169
commit 336986272a
4 changed files with 73 additions and 35 deletions

View file

@ -25,7 +25,7 @@ const Side = ({ children, content, ...rest }: SideProps) => {
<Avatar className="border-2 border-white" shape="circle" src="/img/others/cto.png" /> <Avatar className="border-2 border-white" shape="circle" src="/img/others/cto.png" />
<div className="text-white"> <div className="text-white">
<div className="font-semibold text-base">Sedat ÖZTÜRK</div> <div className="font-semibold text-base">Sedat ÖZTÜRK</div>
<span className="opacity-80">CTO</span> <span className="opacity-80">Founder</span>
</div> </div>
</div> </div>
<p className="text-lg text-white opacity-80"> <p className="text-lg text-white opacity-80">

View file

@ -14,9 +14,12 @@ let didInit = false
const Theme = (props: CommonProps) => { const Theme = (props: CommonProps) => {
// ABP App Config'i uygulama acilirken al // ABP App Config'i uygulama acilirken al
const { getConfig } = useStoreActions((a) => a.abpConfig) const { getConfig } = useStoreActions((a) => a.abpConfig)
const { setTenantId } = useStoreActions((a) => a.auth)
useEffect(() => { useEffect(() => {
if (!didInit) { if (!didInit) {
didInit = true didInit = true
setTenantId('')
getConfig(false) getConfig(false)
} }
}, []) }, [])

View file

@ -7,16 +7,39 @@ const authApiService = axios.create({
baseURL: appConfig.baseUrl, baseURL: appConfig.baseUrl,
}) })
function extractTitle(html: string): string {
const match = html.match(/<title[^>]*>([\s\S]*?)<\/title>/i)
return match ? match[1].replace(/<[^>]+>/g, '').trim() : html
}
function extractBody(html: string): string {
const match = html.match(/<body[^>]*>([\s\S]*?)<\/body>/i)
return match ? match[1].replace(/<[^>]+>/g, '').trim() : html
}
authApiService.interceptors.response.use( authApiService.interceptors.response.use(
(response) => response, (response) => response,
async (error) => { async (error) => {
console.log('Error interceptor') //console.log('Error interceptor')
console.error(error) //console.error(error)
const { messages } = store.getActions().base const { messages } = store.getActions().base
let rawTitle = 'Hata!'
let rawMessage =
error.response?.data?.error_description ||
error.response?.data?.error?.message ||
error.response?.data?.message ||
error.message ||
'Bir hata oluştu'
if (error.response?.status === 404 && typeof error.response?.data === 'string') {
rawMessage = extractBody(error.response.data)
rawTitle = extractTitle(error.response.data)
}
messages.addError({ messages.addError({
id: crypto.randomUUID(), id: crypto.randomUUID(),
message: error.response?.data?.error?.message ?? error.message ?? 'Bir hata oluştu', message: rawMessage, //error.response?.data?.error?.message ?? error.message ?? 'Bir hata oluştu',
title: 'Hata!', title: rawTitle,
cid: error.response?.headers['x-correlation-id'], cid: error.response?.headers['x-correlation-id'],
statusCode: error.response?.status?.toString() ?? error.code, statusCode: error.response?.status?.toString() ?? error.code,
}) })

View file

@ -60,8 +60,6 @@ const Login = () => {
}, 100) }, 100)
} }
const [tenantList, setTenantList] = useState<{ value?: string; label?: string }[]>([])
const { signIn } = useAuth() const { signIn } = useAuth()
const { translate } = useLocalization() const { translate } = useLocalization()
@ -171,20 +169,27 @@ const Login = () => {
setSubmitting(false) setSubmitting(false)
} }
const fetchData = async () => { const subDomainName = getSubdomain()
const response = await getTenants(0, 1000) //const subDomainName = 'DEMO2'
if (response.data?.items) { const tenantId = useStoreState((a) => a.auth.tenantId) ?? subDomainName
setTenantList(response.data.items.map((a) => ({ value: a.id, label: a.name }))) const tenantStyle: React.CSSProperties | undefined =
subDomainName && subDomainName !== 'DEMO'
? {
opacity: 0,
position: 'absolute',
pointerEvents: 'none',
height: 0,
margin: 0,
padding: 0,
border: 'none',
} }
} : undefined
const tenantId = useStoreState((a) => a.auth.tenantId) ?? getSubdomain()
useEffect(() => { useEffect(() => {
if (!isMultiTenant) { if (!isMultiTenant) {
return return
} }
fetchData() setTenantId(subDomainName || '')
}, [isMultiTenant]) }, [isMultiTenant])
return ( return (
@ -198,27 +203,22 @@ const Login = () => {
<p>Please enter your credentials to sign in!</p> <p>Please enter your credentials to sign in!</p>
</div> </div>
{isMultiTenant && ( {isMultiTenant && (
<>
<label className="form-label mb-2" style={tenantStyle}>
Company
</label>
<div className="mb-4"> <div className="mb-4">
<Select <Input
placeholder={translate('::Sirket')} placeholder={translate('::Sirket')}
isClearable={true} value={tenantId || ''}
options={tenantList} onChange={(e) => setTenantId(e.target.value)}
value={tenantList.find((a) => a.value == tenantId)} style={tenantStyle}
onChange={(option) => setTenantId(option?.value)} aria-hidden={subDomainName && subDomainName !== 'DEMO' ? 'true' : 'false'}
/> />
</div> </div>
</>
)} )}
<div> <div>
{message && (
<Alert showIcon className="mb-4" type="success">
{message}
</Alert>
)}
{error && (
<Alert showIcon className="mb-4" type="danger">
{error}
</Alert>
)}
<Formik <Formik
initialValues={{ initialValues={{
userName: '', userName: '',
@ -291,6 +291,18 @@ const Login = () => {
onSuccess={(token: string) => setFieldValue('captchaResponse', token)} onSuccess={(token: string) => setFieldValue('captchaResponse', token)}
/> />
)} )}
{message && (
<Alert showIcon className="mb-4" type="success">
{message}
</Alert>
)}
{error && (
<Alert showIcon className="mb-4" type="danger">
{error}
</Alert>
)}
<Button block loading={isSubmitting} variant="solid" type="submit"> <Button block loading={isSubmitting} variant="solid" type="submit">
{isSubmitting ? 'Signing in...' : 'Sign In'} {isSubmitting ? 'Signing in...' : 'Sign In'}
</Button> </Button>