fix: use deterministic badge color for app names in Logs tab
Use attributeBadgeColor() (hash-based) instead of "auto" so the same application name gets the same badge color across all pages. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -2,6 +2,7 @@ import { useState, useCallback } from 'react';
|
|||||||
import { useNavigate } from 'react-router';
|
import { useNavigate } from 'react-router';
|
||||||
import { Badge } from '@cameleer/design-system';
|
import { Badge } from '@cameleer/design-system';
|
||||||
import type { LogEntryResponse } from '../../api/queries/logs';
|
import type { LogEntryResponse } from '../../api/queries/logs';
|
||||||
|
import { attributeBadgeColor } from '../../utils/attribute-color';
|
||||||
import styles from './LogEntry.module.css';
|
import styles from './LogEntry.module.css';
|
||||||
|
|
||||||
function levelColor(level: string): string {
|
function levelColor(level: string): string {
|
||||||
@@ -63,7 +64,7 @@ export function LogEntry({ entry }: LogEntryProps) {
|
|||||||
<div className={styles.row}>
|
<div className={styles.row}>
|
||||||
<span className={styles.timestamp}>{formatTime(entry.timestamp)}</span>
|
<span className={styles.timestamp}>{formatTime(entry.timestamp)}</span>
|
||||||
<span className={styles.level} style={{ color: levelColor(entry.level) }}>{entry.level}</span>
|
<span className={styles.level} style={{ color: levelColor(entry.level) }}>{entry.level}</span>
|
||||||
{entry.application && <Badge label={entry.application} color="auto" />}
|
{entry.application && <Badge label={entry.application} color={attributeBadgeColor(entry.application)} />}
|
||||||
<span className={styles.logger} title={entry.loggerName ?? ''}>
|
<span className={styles.logger} title={entry.loggerName ?? ''}>
|
||||||
{abbreviateLogger(entry.loggerName)}
|
{abbreviateLogger(entry.loggerName)}
|
||||||
</span>
|
</span>
|
||||||
|
|||||||
Reference in New Issue
Block a user