All files / kernel-ui/src/components RunLoopBanner.tsx

100% Statements 6/6
100% Branches 2/2
100% Functions 1/1
100% Lines 6/6

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64                          3x 8x 8x   8x 4x     4x                                                                                    
import {
  Box,
  Text as TextComponent,
  TextColor,
  TextVariant,
  FontWeight,
} from '@metamask/design-system-react';
 
import { usePanelContext } from '../context/PanelContext.tsx';
 
// Announces that the kernel's run loop has died. Worth saying loudly because
// every other panel keeps rendering its last known contents, so a dead kernel
// looks identical to a healthy idle one.
export const RunLoopBanner: React.FC = () => {
  const { status } = usePanelContext();
  const runLoop = status?.runLoop;
 
  if (runLoop?.state !== 'failed') {
    return null;
  }
 
  return (
    <Box
      className="mb-4 p-3 border border-error-default rounded"
      data-testid="run-loop-failure"
      role="alert"
    >
      <TextComponent
        variant={TextVariant.BodyMd}
        color={TextColor.ErrorDefault}
        fontWeight={FontWeight.Bold}
      >
        Kernel run loop has died. Nothing shown below is live and no message
        will be processed until the kernel is restarted.
      </TextComponent>
      <TextComponent
        variant={TextVariant.BodySm}
        color={TextColor.ErrorDefault}
        data-testid="run-loop-failure-error"
      >
        {runLoop.error}
      </TextComponent>
      {/* When a crank dies and its rollback then fails, the headline above names
          the rollback and only the chain below names what killed the kernel. */}
      <details>
        <summary>
          <TextComponent
            variant={TextVariant.BodyXs}
            color={TextColor.ErrorDefault}
          >
            Details
          </TextComponent>
        </summary>
        <pre
          className="text-xs whitespace-pre-wrap break-all max-h-64 overflow-auto"
          data-testid="run-loop-failure-detail"
        >
          {runLoop.detail}
        </pre>
      </details>
    </Box>
  );
};