UI Fixes in console logs

This commit is contained in:
Sudheer Salavadi 2024-07-09 13:26:25 +05:30
parent 20c3c8e2ed
commit 2ba8d08acc
4 changed files with 11 additions and 8 deletions

View file

@ -36,7 +36,7 @@ const EventRow = React.memo((props: Props) => {
>
<div
className={cn(
'uppercase color-gray-medium text-sm flex items-center py-1',
'uppercase text-sm flex items-center py-1',
props.noMargin ? '' : 'ml-2'
)}
>
@ -67,7 +67,7 @@ const EventRow = React.memo((props: Props) => {
);
})
) : (
<div className={cn('color-gray-medium text-sm pt-2', props.noMargin ? '' : 'ml-4')}>
<div className={cn('color-gray-medium text-sm', props.noMargin ? '' : 'ml-4')}>
None captured.
</div>
)}

View file

@ -40,7 +40,7 @@ function renderWithNL(s: string | null = '') {
));
}
const getIconProps = (level: any) => {
const getIconProps = (level: LogLevel) => {
switch (level) {
case LogLevel.INFO:
case LogLevel.LOG:
@ -58,8 +58,11 @@ const getIconProps = (level: any) => {
name: 'console/error',
color: 'red',
};
default:
return {
name: 'console/info',
};
}
return null;
};
const INDEX_KEY = 'console';

View file

@ -34,7 +34,7 @@ function ConsoleRow(props: Props) {
<div
style={style}
className={cn(
'border-b flex items-start py-1 px-4 overflow-hidden group relative select-none',
'border-b flex items-start py-1 px-4 pe-8 overflow-hidden group relative select-none',
{
info: !log.isYellow && !log.isRed,
warn: log.isYellow,
@ -48,12 +48,12 @@ function ConsoleRow(props: Props) {
<Icon size="14" {...iconProps} />
</div>
<div key={log.key} data-scroll-item={log.isRed}>
<div className="flex items-start text-sm">
<div className="flex items-start text-sm ">
<div className={cn('flex items-start', { 'cursor-pointer underline decoration-dotted decoration-gray-400': !!log.errorId })}>
{canExpand && (
<Icon name={expanded ? 'caret-down-fill' : 'caret-right-fill'} className="mr-2" />
)}
<span className='font-mono text-nowrap max-w-xs'>
<span className='font-mono '>
{renderWithNL(lines.pop())}
</span>
</div>

View file

@ -10,7 +10,7 @@ interface Props {
}
function Console_info(props: Props) {
const { size = 14, width = size, height = size, fill = '' } = props;
const { size = 14, width = size, height = size, fill = '' } = props;
return (
<svg viewBox="0 0 16 16" width={ `${ width }px` } height={ `${ height }px` } ><path d="M14 1a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1h12zM2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2z"/><path d="m8.93 6.588-2.29.287-.082.38.45.083c.294.07.352.176.288.469l-.738 3.468c-.194.897.105 1.319.808 1.319.545 0 1.178-.252 1.465-.598l.088-.416c-.2.176-.492.246-.686.246-.275 0-.375-.193-.304-.533L8.93 6.588zM9 4.5a1 1 0 1 1-2 0 1 1 0 0 1 2 0z"/></svg>
);