Dashboard panels

[dudebehinddude]

Adds the functionality to be able to listen to a ros topic for dashboard data (topic: /hmi_dashboard_data), and dynamically render dashboard cards on specific pages based on that. The current card types are:

• Card
  • Renders a card with a title and content.
• Bar
  • A card with an additional bar component (to display a numeric value visually)
• Color
  • A card with an additional bar to display a color

The schema for making a custom component is as follows:

{
  screen: string; // The name of the screen the component should be on, e.g. "My Screen"
  id: string; // ID of the component, e.g. "my-component"
  type: string; // the type of the component, currently "card" or "bar"
  data: object;
}

Where data varies by type:

// Card
{
  title: string; // Name of the component
  content?: string | undefined; // Content/body text of the component
};

// Bar
{
  title: string;
  content?: string | undefined;
  value: number; // The current value of the bar
  min?: number; // Lower bound of the bar; default = 0
  max?: number; // Upper bound of the bar; default = 1
};

// Color
{
  title: string;
  content?: string | undefined;
  color: string; // the color to render; accepts any format valid in css
};

Example

All this data is being sent from ROS:

Closes #22, #24, #25, #26, #27