Untitled

import { useState, useEffect } from 'react';

interface ApiResponse {
  id: string;
  view_seconds: number[][];
}

interface UseUniqViewSecondsResult {
  data: number[];
  loading: boolean;
  error: Error | null;
}

const processViewSeconds = (viewSeconds: number[][]): number[] => {
  // Flatten the array -> remove duplicates -> sort in ascending order
  return [...new Set(viewSeconds.flat())].sort((a, b) => a - b);
};

const useUniqViewSeconds = (url: string): UseUniqViewSecondsResult => {
  const [data, setData] = useState<number[]>([]);
  const [loading, setLoading] = useState<boolean>(true);
  const [error, setError] = useState<Error | null>(null);

  useEffect(() => {
    const fetchData = async () => {
      setLoading(true);
      try {
        const response = await fetch(url);
        if (!response.ok) {
          throw new Error('Network response was not ok');
        }
        const result: ApiResponse = await response.json();
        const uniqViewSeconds = processViewSeconds(result.view_seconds);
        setData(uniqViewSeconds);
      } catch (err) {
        setError(err as Error);
      } finally {
        setLoading(false);
      }
    };

    fetchData();
  }, [url]);

  return { data, loading, error };
};

export default useUniqViewSeconds;