src/hooks/useTraffic.ts


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25

import { useEffect, useState } from 'react';

import { fetchData } from '~/api/traffic';
import { ClashAPIConfig } from '~/types';

export default function useTraffic(apiConfig: ClashAPIConfig) {
  const traffic = fetchData(apiConfig);
  const [data, setData] = useState({
    up: [...traffic.up],
    down: [...traffic.down],
    labels: [...traffic.labels],
  });

  useEffect(() => {
    return traffic.subscribe(() => {
      setData({
        up: [...traffic.up],
        down: [...traffic.down],
        labels: [...traffic.labels],
      });
    });
  }, [traffic]);

  return data;
}