Fix typescript errors

web/pages/components/statistic.tsx

@@ -6,7 +6,7 @@ interface ItemProps {
   value: string,
   prefix: JSX.Element,
   color: string,
-  progress: boolean,
+  progress?: boolean,
 };
 
 export default function StatisticItem(props: ItemProps) {
@@ -41,8 +41,8 @@ function ProgressView({title, value, prefix, color}) {
   )
 }
 
-function StatisticView({title, value, prefix}) {
-  const valueStyle = { color: "#334", fontSize: "1.8rem" };
+function StatisticView({title, value, prefix, color}) {
+  const valueStyle = { fontSize: "1.8rem" };
 
   return (
     <Statistic

web/pages/index.tsx

@@ -122,11 +122,13 @@ export default function Stats() {
           title="Outbound Video Stream"
           value={`${setting.videoBitrate} kbps ${setting.framerate} fps`}
           prefix={null}
+          color="#334"
         />
         <StatisticItem
           title="Outbound Audio Stream"
           value={audioSetting}
           prefix={null}
+          color="#334"
         />
       </Row>
     );
@@ -147,16 +149,19 @@ export default function Stats() {
           )}`}
           value={formatDistanceToNow(new Date(broadcaster.time))}
           prefix={<ClockCircleOutlined />}
+          color="#334"
         />
         <StatisticItem
           title="Viewers"
           value={viewerCount}
           prefix={<UserOutlined />}
+          color="#334"
         />
         <StatisticItem
           title="Peak viewer count"
           value={sessionMaxViewerCount}
           prefix={<UserOutlined />}
+          color="#334"
         />
       </Row>
 
@@ -165,16 +170,19 @@ export default function Stats() {
           title="Input"
           value={formatIPAddress(remoteAddr)}
           prefix={null}
+          color="#334"
         />
         <StatisticItem
           title="Inbound Video Stream"
           value={streamVideoDetailString}
           prefix={null}
+          color="#334"
         />
         <StatisticItem
           title="Inbound Audio Stream"
           value={streamAudioDetailString}
           prefix={null}
+          color="#334"
         />
       </Row>
 
@@ -185,11 +193,13 @@ export default function Stats() {
           title="Stream key"
           value={config.streamKey}
           prefix={null}
+          color="#334"
         />
         <StatisticItem
           title="Directory registration enabled"
           value={config.yp.enabled.toString()}
           prefix={null}
+          color="#334"
         />
       </Row>
 

web/pages/viewer-info.tsx

@@ -109,16 +109,19 @@ export default function ViewersOverTime() {
           title="Current viewers"
           value={viewerCount.toString()}
           prefix={<UserOutlined />}
+          color="#334"
         />
         <StatisticItem
           title="Peak viewers this session"
           value={sessionPeakViewerCount.toString()}
           prefix={<UserOutlined />}
+          color="#334"
         />
         <StatisticItem
           title="Peak viewers overall"
           value={overallPeakViewerCount.toString()}
           prefix={<UserOutlined />}
+          color="#334"
         />
       </Row>
       <div className="chart-container">