MainDashboardComponent temp

MainDashboardComponent.ts

import { Component } from '@angular/core';
import { map } from 'rxjs/operators';
import { Breakpoints, BreakpointObserver } from '@angular/cdk/layout';
import { Color, ScaleType } from '@swimlane/ngx-charts';

@Component({
  selector: 'app-main-dashboard',
  templateUrl: './main-dashboard.component.html',
  styleUrls: ['./main-dashboard.component.scss']
})
export class MainDashboardComponent {
  /** Based on the screen size, switch from standard to one column per row */
  isHandset$ = this.breakpointObserver.observe(Breakpoints.Handset).pipe(
    map(({ matches }) => matches)
  );

  colorScheme: Color = {
    name: 'customScheme',
    group: ScaleType.Ordinal,
    selectable: true,
    domain: ['#5F249F', '#00A3E1', '#F9F048', '#6CC24A']
  };

  data = [
    {
      "name": ".NET",
      "value": 22
    },
    {
      "name": "Java",
      "value": 32
    },
    {
      "name": "Angular",
      "value": 9
    },
      {
      "name": "React",
      "value": 11
    }
  ];

  constructor(private breakpointObserver: BreakpointObserver) {}
}