Enhances dashboard with new metrics and charts

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.

docs/dashboard-components.md

@@ -0,0 +1,91 @@
+# Dashboard Component Documentation
+
+This document describes the enhanced components added to the Dashboard for an improved visualization experience.
+
+## New Components
+
+### 1. WordCloud
+
+The WordCloud component visualizes categories or topics based on their frequency. The size of each word corresponds to its frequency in the data.
+
+**File:** `components/WordCloud.tsx`
+
+**Features:**
+
+- Dynamic sizing based on frequency
+- Colorful display with a pleasing color palette
+- Responsive design
+- Interactive hover effects
+
+### 2. GeographicMap
+
+This component displays a world map with circles representing the number of sessions from each country.
+
+**File:** `components/GeographicMap.tsx`
+
+**Features:**
+
+- Interactive map using React Leaflet
+- Circle sizes scaled by session count
+- Tooltips showing country names and session counts
+- Responsive design
+
+### 3. MetricCard
+
+A modern, visually appealing card for displaying key metrics.
+
+**File:** `components/MetricCard.tsx`
+
+**Features:**
+
+- Multiple design variants (default, primary, success, warning, danger)
+- Support for trend indicators
+- Icons and descriptions
+- Clean, modern styling
+
+### 4. DonutChart
+
+An enhanced donut chart with better styling and a central text display capability.
+
+**File:** `components/DonutChart.tsx`
+
+**Features:**
+
+- Customizable colors
+- Center text area for displaying summaries
+- Interactive tooltips with percentages
+- Well-balanced legend display
+
+### 5. ResponseTimeDistribution
+
+Visualizes the distribution of response times as a histogram.
+
+**File:** `components/ResponseTimeDistribution.tsx`
+
+**Features:**
+
+- Color-coded bars (green for fast, yellow for medium, red for slow)
+- Target time indicator
+- Automatic binning of response times
+- Clear labeling and scales
+
+## Dashboard Enhancements
+
+The dashboard has been enhanced with:
+
+1. **Improved Layout**: Better use of space and responsive grid layouts
+2. **Visual Hierarchies**: Clear heading styles and consistent spacing
+3. **Color Coding**: Semantic use of colors to indicate statuses
+4. **Interactive Elements**: Better button styles with loading indicators
+5. **Data Context**: More complete view of metrics with additional visualizations
+6. **Geographic Insights**: Map view of session distribution by country
+7. **Language Analysis**: Improved language distribution visualization
+8. **Category Analysis**: Word cloud for category popularity
+9. **Performance Metrics**: Response time distribution for better insight into system performance
+
+## Usage Notes
+
+- The geographic map and response time distribution use simulated data where actual data is not available
+- All components are responsive and will adjust to different screen sizes
+- The dashboard automatically refreshes data when using the refresh button
+- Admin users have access to additional controls at the bottom of the dashboard