"use strict";

import React, { useEffect, useRef, useState } from 'react';
import { View, TouchableOpacity, Text, StyleSheet, ActivityIndicator } from 'react-native';
import { Audio } from 'expo-av';
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
const formatTime = millis => {
  const totalSec = Math.floor(millis / 1000);
  const min = Math.floor(totalSec / 60);
  const sec = totalSec % 60;
  return `${min}:${sec.toString().padStart(2, '0')}`;
};
const AudioMessage = ({
  src
}) => {
  const soundRef = useRef(null);
  const [isPlaying, setIsPlaying] = useState(false);
  const [isLoading, setIsLoading] = useState(false);
  const [position, setPosition] = useState(0);
  const [duration, setDuration] = useState(0);
  const onPlaybackStatusUpdate = status => {
    if (!status.isLoaded) return;
    setPosition(status.positionMillis);
    setDuration(status.durationMillis ?? 0);
    setIsPlaying(status.isPlaying);
    if (status.didJustFinish) {
      setIsPlaying(false);
      soundRef.current?.setPositionAsync(0);
    }
  };
  const togglePlayback = async () => {
    try {
      if (!soundRef.current) {
        setIsLoading(true);
        const {
          sound
        } = await Audio.Sound.createAsync({
          uri: src
        }, {
          shouldPlay: true
        }, onPlaybackStatusUpdate);
        soundRef.current = sound;
        setIsLoading(false);
        setIsPlaying(true);
        return;
      }
      if (isPlaying) {
        await soundRef.current.pauseAsync();
      } else {
        await soundRef.current.playAsync();
      }
    } catch (error) {
      console.error('Audio playback error:', error);
      setIsLoading(false);
    }
  };
  useEffect(() => {
    return () => {
      soundRef.current?.unloadAsync();
    };
  }, []);
  const progress = duration > 0 ? position / duration : 0;
  return /*#__PURE__*/_jsxs(View, {
    style: styles.container,
    children: [/*#__PURE__*/_jsx(TouchableOpacity, {
      style: styles.playButton,
      onPress: togglePlayback,
      disabled: isLoading,
      children: isLoading ? /*#__PURE__*/_jsx(ActivityIndicator, {
        size: "small",
        color: "#fff"
      }) : /*#__PURE__*/_jsx(Text, {
        style: styles.playIcon,
        children: isPlaying ? '⏸' : '▶'
      })
    }), /*#__PURE__*/_jsxs(View, {
      style: styles.progressContainer,
      children: [/*#__PURE__*/_jsx(View, {
        style: styles.progressTrack,
        children: /*#__PURE__*/_jsx(View, {
          style: [styles.progressFill, {
            width: `${progress * 100}%`
          }]
        })
      }), /*#__PURE__*/_jsxs(Text, {
        style: styles.time,
        children: [formatTime(position), " / ", formatTime(duration)]
      })]
    })]
  });
};
export default AudioMessage;
const styles = StyleSheet.create({
  container: {
    flexDirection: 'row',
    alignItems: 'center',
    paddingHorizontal: 8,
    paddingVertical: 6,
    minWidth: 200
  },
  playButton: {
    width: 36,
    height: 36,
    borderRadius: 18,
    backgroundColor: '#007AFF',
    alignItems: 'center',
    justifyContent: 'center',
    marginRight: 10
  },
  playIcon: {
    color: '#fff',
    fontSize: 14
  },
  progressContainer: {
    flex: 1
  },
  progressTrack: {
    height: 4,
    backgroundColor: '#E0E0E0',
    borderRadius: 2,
    overflow: 'hidden'
  },
  progressFill: {
    height: '100%',
    backgroundColor: '#007AFF',
    borderRadius: 2
  },
  time: {
    fontSize: 11,
    color: '#888',
    marginTop: 4
  }
});
//# sourceMappingURL=AudioMessage.js.map