Fix dual highcharts import issue.

index.html

@@ -69,16 +69,17 @@
       const flipside = new Flipside("a7936778-4f87-4790-889f-3ab617271458");
 
       flipside.chart("chart", {
-        title: "Bitcoin Health",
+        title: "Flipside 25 - Overall Industry Health",
         series: [
           {
-            name: "BTC FCAS",
-            symbol: "BTC",
+            name: "FLIP25",
+            symbol: "FLIP25",
             metric: "fcas",
             type: "line",
             yAxis: 1
           }
         ],
+        colors: ["#81A0F1"],
         rangeSelector: {
           enabled: true
         }

src/chart/index.tsx

@@ -1,5 +1,4 @@
 import { h, Component } from "preact";
-import Highcharts from "highcharts/highstock";
 import merge from "lodash/merge";
 import API from "../api";
 import { createApiSeries, createSeries } from "./helpers";
@@ -8,7 +7,13 @@ import { DEFAULT_HIGHCHARTS, DEFAULT_YAXIS } from "./defaults";
 import CustomLinks from "../components/customLinks";
 import * as css from "./style.css";
 
-require("highcharts/modules/exporting")(Highcharts);
+let Highcharts: any;
+if (!window.Highcharts) {
+  Highcharts = require("highcharts/highstock");
+  require("highcharts/modules/exporting")(Highcharts);
+} else {
+  Highcharts = window.Highcharts;
+}
 
 type ChartType = "line" | "bar";
 type ChartAxis = "left" | "right";

src/custom.d.ts

@@ -2,3 +2,7 @@ declare module "*.css" {
   const css: any;
   export default css;
 }
+
+interface Window {
+  Highcharts: any;
+}