starred/yaak-mountain-loop
1
0
Fork 0
mirror of https://github.com/mountain-loop/yaak.git synced 2026-03-21 00:49:17 +01:00
Code Issues 8 Packages Projects Releases 10 Wiki Activity

Better gRPC status on error

Browse Source
This commit is contained in:
Gregory Schier
2024-02-24 12:41:43 -08:00
parent 5664d41073
commit bcf0ae159d
5 changed files with 155 additions and 89 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
src-web/components/EmptyStateText.tsx
View File

@@ -1,12 +1,19 @@
import classNames from 'classnames';
import type { ReactNode } from 'react';
interface Props {
children: ReactNode;
className?: string;
}
export function EmptyStateText({ children }: Props) {
export function EmptyStateText({ children, className }: Props) {
return (
<div className="rounded-lg border border-dashed border-highlight h-full py-2 text-gray-400 flex items-center justify-center">
<div
className={classNames(
className,
'rounded-lg border border-dashed border-highlight h-full py-2 text-gray-400 flex items-center justify-center',
)}
>
{children}
</div>
);

44
src-web/components/GrpcConnectionMessagesPane.tsx
View File

@@ -106,20 +106,29 @@ export function GrpcConnectionMessagesPane({ style, methodType, activeRequest }:
</>
) : (
<div className="h-full grid grid-rows-[auto_minmax(0,1fr)]">
<div className="mb-2 select-text cursor-text font-semibold">
{activeEvent.error ?? activeEvent.content}
<div>
<div className="select-text cursor-text font-semibold">
{activeEvent.content}
</div>
{activeEvent.error && (
<div className="text-xs font-mono py-1 text-orange-700">
{activeEvent.error}
</div>
)}
</div>
<div className="py-2 h-full">
{Object.keys(activeEvent.metadata).length === 0 ? (
<EmptyStateText>
No {activeEvent.eventType === 'connection_end' ? 'trailers' : 'metadata'}
</EmptyStateText>
) : (
<KeyValueRows>
{Object.entries(activeEvent.metadata).map(([key, value]) => (
<KeyValueRow key={key} label={key} value={value} />
))}
</KeyValueRows>
)}
</div>
{Object.keys(activeEvent.metadata).length === 0 ? (
<EmptyStateText>
No {activeEvent.eventType === 'connection_end' ? 'trailers' : 'metadata'}
</EmptyStateText>
) : (
<KeyValueRows>
{Object.entries(activeEvent.metadata).map(([key, value]) => (
<KeyValueRow key={key} label={key} value={value} />
))}
</KeyValueRows>
)}
</div>
)}
</div>
@@ -186,7 +195,14 @@ function EventRow({
: 'info'
}
/>
<div className={classNames('w-full truncate text-2xs')}>{error ?? content}</div>
<div className={classNames('w-full truncate text-2xs')}>
{content}
{error && (
<>
<span className="text-orange-600"> ({error})</span>
</>
)}
</div>
<div className={classNames('opacity-50 text-2xs')}>
{format(createdAt + 'Z', 'HH:mm:ss.SSS')}
</div>

6
src-web/components/core/KeyValueRow.tsx
View File

@@ -29,10 +29,12 @@ interface Props {
export function KeyValueRow({ label, value, labelClassName }: Props) {
return (
<>
<td className={classNames('py-1 pr-2 text-gray-700 select-text cursor-text', labelClassName)}>
<td
className={classNames('py-0.5 pr-2 text-gray-700 select-text cursor-text', labelClassName)}
>
{label}
</td>
<td className="py-1 cursor-text select-text break-all min-w-0">{value}</td>
<td className="py-0.5 cursor-text select-text break-all min-w-0">{value}</td>
</>
);
}