import { useSuspenseQuery } from '@tanstack/react-query';
import axios from 'axios';

export function Time() {
  const { data: time } = useSuspenseQuery({
    queryKey: ['time'],
    queryFn: async () => axios.get<{ datetime: string }>('https://worldtimeapi.org/api/timezone/Asia/Shanghai')
      .then(res => res.data.datetime)
      .then(isoString => new Date(isoString).toLocaleTimeString()),
  });
  return (
    <p>
      Current time:
      {time}
    </p>
  );
}