mirror of
https://github.com/logto-io/logto.git
synced 2024-12-16 20:26:19 -05:00
fix(console): hide some log headers for webhook event (#3971)
* fix(console): hide some log headers for webhook event hide some log headers for webhook event * fix(console): address typo address typo
This commit is contained in:
parent
12ae2622b1
commit
5599667576
2 changed files with 45 additions and 29 deletions
|
@ -16,6 +16,7 @@ import PageMeta from '@/components/PageMeta';
|
||||||
import TabNav, { TabNavItem } from '@/components/TabNav';
|
import TabNav, { TabNavItem } from '@/components/TabNav';
|
||||||
import UserName from '@/components/UserName';
|
import UserName from '@/components/UserName';
|
||||||
import { logEventTitle } from '@/consts/logs';
|
import { logEventTitle } from '@/consts/logs';
|
||||||
|
import { hookEventLogKey } from '@/consts/webhooks';
|
||||||
import type { RequestError } from '@/hooks/use-api';
|
import type { RequestError } from '@/hooks/use-api';
|
||||||
import { getUserTitle } from '@/utils/user';
|
import { getUserTitle } from '@/utils/user';
|
||||||
|
|
||||||
|
@ -28,6 +29,9 @@ const getAuditLogDetailsRelatedResourceLink = (pathname: string) =>
|
||||||
const getDetailsTabNavLink = (logId: string, userId?: string) =>
|
const getDetailsTabNavLink = (logId: string, userId?: string) =>
|
||||||
userId ? `/users/${userId}/logs/${logId}` : `/audit-logs/${logId}`;
|
userId ? `/users/${userId}/logs/${logId}` : `/audit-logs/${logId}`;
|
||||||
|
|
||||||
|
const isWebhookEventLog = (key?: string) =>
|
||||||
|
key && Object.values<string>(hookEventLogKey).includes(key);
|
||||||
|
|
||||||
function AuditLogDetails() {
|
function AuditLogDetails() {
|
||||||
const { userId, hookId, logId } = useParams();
|
const { userId, hookId, logId } = useParams();
|
||||||
const { pathname } = useLocation();
|
const { pathname } = useLocation();
|
||||||
|
@ -59,6 +63,8 @@ function AuditLogDetails() {
|
||||||
return null;
|
return null;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const isWebHookEvent = isWebhookEventLog(data?.key);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<DetailsPage
|
<DetailsPage
|
||||||
backLink={backLink}
|
backLink={backLink}
|
||||||
|
@ -79,29 +85,37 @@ function AuditLogDetails() {
|
||||||
<div className={styles.label}>{t('log_details.event_key')}</div>
|
<div className={styles.label}>{t('log_details.event_key')}</div>
|
||||||
<div>{data.key}</div>
|
<div>{data.key}</div>
|
||||||
</div>
|
</div>
|
||||||
<div className={styles.infoItem}>
|
{!isWebHookEvent && (
|
||||||
<div className={styles.label}>{t('log_details.application')}</div>
|
<>
|
||||||
<div>
|
<div className={styles.infoItem}>
|
||||||
{data.payload.applicationId ? (
|
<div className={styles.label}>{t('log_details.application')}</div>
|
||||||
<ApplicationName
|
<div>
|
||||||
isLink={data.payload.applicationId !== demoAppApplicationId}
|
{data.payload.applicationId ? (
|
||||||
applicationId={data.payload.applicationId}
|
<ApplicationName
|
||||||
/>
|
isLink={data.payload.applicationId !== demoAppApplicationId}
|
||||||
) : (
|
applicationId={data.payload.applicationId}
|
||||||
'-'
|
/>
|
||||||
)}
|
) : (
|
||||||
</div>
|
'-'
|
||||||
</div>
|
)}
|
||||||
<div className={styles.infoItem}>
|
</div>
|
||||||
<div className={styles.label}>{t('log_details.ip_address')}</div>
|
</div>
|
||||||
<div>{data.payload.ip ?? '-'}</div>
|
<div className={styles.infoItem}>
|
||||||
</div>
|
<div className={styles.label}>{t('log_details.ip_address')}</div>
|
||||||
<div className={styles.infoItem}>
|
<div>{data.payload.ip ?? '-'}</div>
|
||||||
<div className={styles.label}>{t('log_details.user')}</div>
|
</div>
|
||||||
<div>
|
<div className={styles.infoItem}>
|
||||||
{data.payload.userId ? <UserName isLink userId={data.payload.userId} /> : '-'}
|
<div className={styles.label}>{t('log_details.user')}</div>
|
||||||
</div>
|
<div>
|
||||||
</div>
|
{data.payload.userId ? (
|
||||||
|
<UserName isLink userId={data.payload.userId} />
|
||||||
|
) : (
|
||||||
|
'-'
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</>
|
||||||
|
)}
|
||||||
<div className={styles.infoItem}>
|
<div className={styles.infoItem}>
|
||||||
<div className={styles.label}>{t('log_details.log_id')}</div>
|
<div className={styles.label}>{t('log_details.log_id')}</div>
|
||||||
<div>{data.id}</div>
|
<div>{data.id}</div>
|
||||||
|
@ -111,12 +125,14 @@ function AuditLogDetails() {
|
||||||
<div>{new Date(data.createdAt).toLocaleString()}</div>
|
<div>{new Date(data.createdAt).toLocaleString()}</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
{!isWebHookEvent && (
|
||||||
<div className={styles.infoItem}>
|
<div>
|
||||||
<div className={styles.label}>{t('log_details.user_agent')}</div>
|
<div className={styles.infoItem}>
|
||||||
<div>{data.payload.userAgent}</div>
|
<div className={styles.label}>{t('log_details.user_agent')}</div>
|
||||||
|
<div>{data.payload.userAgent}</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
)}
|
||||||
</div>
|
</div>
|
||||||
</Card>
|
</Card>
|
||||||
<TabNav>
|
<TabNav>
|
||||||
|
|
|
@ -2,7 +2,7 @@ import type { HookEvent } from '../../foundations/index.js';
|
||||||
|
|
||||||
/** The type of a hook event. */
|
/** The type of a hook event. */
|
||||||
export enum Type {
|
export enum Type {
|
||||||
ExchangeTokenBy = 'TriggerHook',
|
TriggerHook = 'TriggerHook',
|
||||||
}
|
}
|
||||||
|
|
||||||
export type LogKey = `${Type}.${HookEvent}`;
|
export type LogKey = `${Type}.${HookEvent}`;
|
||||||
|
|
Loading…
Reference in a new issue