Typescript refactor.

src/lib/charts.tsx

@@ -2,12 +2,12 @@ import { StatusLight } from 'react-basics';
 import { formatDate } from 'lib/date';
 import { formatLongNumber } from 'lib/format';
 
-export function renderNumberLabels(label) {
-  return +label > 1000 ? formatLongNumber(label) : label;
+export function renderNumberLabels(label: string) {
+  return +label > 1000 ? formatLongNumber(+label) : label;
 }
 
-export function renderDateLabels(unit, locale) {
-  return (label, index, values) => {
+export function renderDateLabels(unit: string, locale: string) {
+  return (label: string, index: number, values: any[]) => {
     const d = new Date(values[index].value);
 
     switch (unit) {
@@ -27,8 +27,8 @@ export function renderDateLabels(unit, locale) {
   };
 }
 
-export function renderStatusTooltipPopup(unit, locale) {
-  return (setTooltipPopup, model) => {
+export function renderStatusTooltipPopup(unit: string, locale: string) {
+  return (setTooltipPopup: (data: any) => void, model: any) => {
     const { opacity, labelColors, dataPoints } = model.tooltip;
 
     if (!dataPoints?.length || !opacity) {

src/lib/crypto.ts

@@ -12,12 +12,12 @@ export function salt() {
   return hash(secret(), ROTATING_SALT);
 }
 
-export function uuid(...args) {
+export function uuid(...args: [any]) {
   if (!args.length) return v4();
 
   return v5(hash(...args, salt()), v5.DNS);
 }
 
-export function isUuid(value) {
+export function isUuid(value: string) {
   return validate(value);
 }

src/lib/db.ts

@@ -6,7 +6,7 @@ export const KAFKA = 'kafka';
 export const KAFKA_PRODUCER = 'kafka-producer';
 
 // Fixes issue with converting bigint values
-BigInt.prototype.toJSON = function () {
+BigInt.prototype['toJSON'] = function () {
   return Number(this);
 };
 
@@ -24,7 +24,7 @@ export function getDatabaseType(url = process.env.DATABASE_URL) {
   return type;
 }
 
-export async function runQuery(queries) {
+export async function runQuery(queries: any) {
   const db = getDatabaseType(process.env.CLICKHOUSE_URL || process.env.DATABASE_URL);
 
   if (db === POSTGRESQL || db === MYSQL) {

src/lib/filters.ts

@@ -1,4 +1,4 @@
-export const urlFilter = data => {
+export const urlFilter = (data: any[]) => {
   const map = data.reduce((obj, { x, y }) => {
     if (x) {
       if (!obj[x]) {
@@ -14,7 +14,7 @@ export const urlFilter = data => {
   return Object.keys(map).map(key => ({ x: key, y: map[key] }));
 };
 
-export const refFilter = data => {
+export const refFilter = (data: any[]) => {
   const links = {};
 
   const map = data.reduce((obj, { x, y }) => {
@@ -42,16 +42,16 @@ export const refFilter = data => {
   return Object.keys(map).map(key => ({ x: key, y: map[key], w: links[key] }));
 };
 
-export const emptyFilter = data => {
+export const emptyFilter = (data: any[]) => {
   return data.map(item => (item.x ? item : null)).filter(n => n);
 };
 
-export const percentFilter = data => {
+export const percentFilter = (data: any[]) => {
   const total = data.reduce((n, { y }) => n + y, 0);
   return data.map(({ x, y, ...props }) => ({ x, y, z: total ? (y / total) * 100 : 0, ...props }));
 };
 
-export const paramFilter = data => {
+export const paramFilter = (data: any[]) => {
   const map = data.reduce((obj, { x, y }) => {
     try {
       const searchParams = new URLSearchParams(x);

src/lib/format.ts

@@ -1,4 +1,4 @@
-export function parseTime(val) {
+export function parseTime(val: number) {
   const days = ~~(val / 86400);
   const hours = ~~(val / 3600) - days * 24;
   const minutes = ~~(val / 60) - days * 1440 - hours * 60;
@@ -14,16 +14,16 @@ export function parseTime(val) {
   };
 }
 
-export function formatTime(val) {
-  const { hour, minutes, seconds } = parseTime(val);
-  const h = hour > 0 ? `${hour}:` : '';
-  const m = hour > 0 ? minutes.toString().padStart(2, '0') : minutes;
+export function formatTime(val: number) {
+  const { hours, minutes, seconds } = parseTime(val);
+  const h = hours > 0 ? `${hours}:` : '';
+  const m = hours > 0 ? minutes.toString().padStart(2, '0') : minutes;
   const s = seconds.toString().padStart(2, '0');
 
   return `${h}${m}:${s}`;
 }
 
-export function formatShortTime(val, formats = ['m', 's'], space = '') {
+export function formatShortTime(val: number, formats = ['m', 's'], space = '') {
   const { days, hours, minutes, seconds, ms } = parseTime(val);
   let t = '';
 
@@ -40,11 +40,11 @@ export function formatShortTime(val, formats = ['m', 's'], space = '') {
   return t;
 }
 
-export function formatNumber(n) {
+export function formatNumber(n: string | number) {
   return Number(n).toFixed(0);
 }
 
-export function formatLongNumber(value) {
+export function formatLongNumber(value: number) {
   const n = Number(value);
 
   if (n >= 1000000) {
@@ -63,7 +63,7 @@ export function formatLongNumber(value) {
   return formatNumber(n);
 }
 
-export function stringToColor(str) {
+export function stringToColor(str: string) {
   if (!str) {
     return '#ffffff';
   }
@@ -73,7 +73,7 @@ export function stringToColor(str) {
   }
   let color = '#';
   for (let i = 0; i < 3; i++) {
-    let value = (hash >> (i * 8)) & 0xff;
+    const value = (hash >> (i * 8)) & 0xff;
     color += ('00' + value.toString(16)).slice(-2);
   }
   return color;

src/lib/lang.ts

@@ -96,10 +96,10 @@ export const languages = {
   'zh-TW': { label: '中文(繁體)', dateLocale: zhTW },
 };
 
-export function getDateLocale(locale) {
+export function getDateLocale(locale: string) {
   return languages[locale]?.dateLocale || enUS;
 }
 
-export function getTextDirection(locale) {
+export function getTextDirection(locale: string) {
   return languages[locale]?.dir || 'ltr';
 }

src/lib/types.ts

@@ -53,7 +53,7 @@ export interface SearchFilter {
 }
 
 export interface FilterResult<T> {
-  data: T;
+  data: T[];
   count: number;
   page: number;
   pageSize: number;