/**
 * Params
 * @param {string} url - The url of video
 */

/**
 * Returns
 * @param {number} width - The width of video
 * @param {number} height - The height of video
 * @param {number} duration - The duration of video
 */

import React from 'react';

import useVideoMeta from '@use-hooks/video-meta';

export default function App() {
  const url = 'https://cdn.int64ago.org/p26nad4i.mp4';
  const {
    width,
    height,
    duration,
  } = useVideoMeta(url);

  return (
    <div>
      <h2>DEMO of <span style={{ color: '#F44336' }}>@use-hooks/video-meta</span></h2>
      <div>
        {/* eslint-disable-next-line */}
        <video src={url} controls height={200} />
        <div>Width: {width}, Height: {height}, Duration: {duration}</div>
      </div>
    </div>
  );
}