feat(desktop): traffic rate monitor support

[ysfscream]

PR Checklist

If you have any questions, you can refer to the Contributing Guide

What is the new behavior?

This pull request includes significant updates to the chart components, traffic monitoring, and utility functions. The changes introduce new features, improve functionality, and enhance code readability. Below are the most important changes:

Chart Components

• Renamed AreaLine.vue to LineChartExtent.vue and added a new type prop to switch between 'area' and 'line' chart types. Updated the chart rendering logic to handle the new type prop. [1] [2] [3]
• Added a new NumberCard.vue component to display numerical values with optional icons and labels.

Traffic Monitoring

• Enhanced TrafficMonitor.vue to include rate calculation and display for received and sent traffic. Added new methods to handle metrics updates and chart initialization. [1] [2] [3]
• Updated traffic statistics to display both accumulated traffic and rate of traffic in separate charts.

Utility Functions

• Refactored systemTopic.ts to merge received and sent metrics, calculate traffic rates, and transform traffic messages. Removed unused functions related to system topics.
• Improved formatter.ts to handle byte formatting more accurately and added handling for values less than one byte.

Miscellaneous

• Updated viewer.ts to include new translations for traffic rate labels.
• Adjusted imports in TopicTree.vue to reflect the new file paths for TreeView.vue and TreeNodeInfo.vue.