Add Tag Breakdown pie chart to dashboard

[Copilot]

The dashboard had a Project Breakdown pie chart but no equivalent visualization grouped by tags. This adds a Tag Breakdown chart with the same four metric views (Time Tracked, Tasks Completed, Tasks Overdue, Completed Late).

Changes

UI

• New Tag Breakdown chart card added to the dashboard grid alongside Project Breakdown
• Reuses existing renderNativePieChart — extended with optional pieElId/legendElId params (defaults preserved for backward compatibility)

Data processing

• processData gains an optional tagsArr = [] third parameter
• Builds tagMap from tags array and a getTagNames(task) helper (tasks with no tagIds fall into "Untagged")
• Accumulates four new metrics: tagData, tagCompletedData, tagOverdueData, tagLateData — mirroring existing project metric fields

Integration

• pullDataFromSP fetches tags via PluginAPI.getTags() when available (typeof guard for robustness)
• Mock data updated with sample tags (Frontend, Backend, Design) and tagIds on tasks

Example tag metrics accumulation

const getTagNames = (task) => (task.tagIds && task.tagIds.length > 0)
    ? task.tagIds.map(id => tagMap[id] || 'Unknown Tag')
    : ['Untagged'];

// In task processing loop:
tagNames.forEach(t => { metrics.tagData[t] = (metrics.tagData[t] || 0) + taskTimeInRange; });

Note: a task with multiple tags contributes to each tag's metric independently, consistent with how tags work as labels.

Original prompt

---

This section details on the original issue you should resolve

<issue_title>add plots with tags</issue_title>
<issue_description>add a plot similar to the circle plot by project but consider tags instead.</issue_description>

Comments on the Issue (you are @copilot in this section)

• Fixes add plots with tags #2

---

💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.