mirror of
https://github.com/kjanat/livedash-node.git
synced 2026-01-16 20:12:08 +01:00
Kaj Kowalski
5317b2aa39
Improves the dashboard with additional metrics and visualizations to provide a more comprehensive overview of application usage and performance. Adds new charts, including: - Word cloud for category analysis - Geographic map for user distribution (simulated data) - Response time distribution chart Refactors existing components for improved clarity and reusability, including the introduction of a generic `MetricCard` component. Improves error handling and user feedback during data refresh and session loading. Adds recommended VSCode extensions for ESLint and Prettier.
32 lines
851 B
TypeScript
32 lines
851 B
TypeScript
"use client";
|
|
|
|
import { useEffect, useState } from "react";
|
|
import { getLocalizedLanguageName } from "../lib/localization";
|
|
|
|
interface LanguageDisplayProps {
|
|
languageCode: string | null | undefined;
|
|
className?: string;
|
|
}
|
|
|
|
/**
|
|
* Component to display a language name from its ISO 639-1 code
|
|
* Uses Intl.DisplayNames API when available, falls back to the code
|
|
*/
|
|
export default function LanguageDisplay({
|
|
languageCode,
|
|
className,
|
|
}: LanguageDisplayProps) {
|
|
const [languageName, setLanguageName] = useState<string>(
|
|
languageCode || "Unknown"
|
|
);
|
|
|
|
useEffect(() => {
|
|
// Only run in the browser and if we have a valid code
|
|
if (typeof window !== "undefined" && languageCode) {
|
|
setLanguageName(getLocalizedLanguageName(languageCode));
|
|
}
|
|
}, [languageCode]);
|
|
|
|
return <span className={className}>{languageName}</span>;
|
|
}
|