import { location, PlayerAudio } from "@heydovetail/ui-components";
import React from "react";
import { AttachmentCard, Props as AttachmentCardProps } from "../AttachmentCard";
import { AttachmentDownloadUrlSubscribe } from "../Shared/AttachmentDownloadUrlSubscribe";

type Props = AttachmentCardProps;

export class AttachmentAudio extends React.PureComponent<Props> {
  public render() {
    return (
      <AttachmentDownloadUrlSubscribe {...this.props}>
        {downloadUrl => (
          <AttachmentCard {...this.props}>
            <PlayerAudio
              disabled={downloadUrl.type !== "available"}
              src={downloadUrl.type === "available" ? location.external(downloadUrl.url).url : undefined}
            />
          </AttachmentCard>
        )}
      </AttachmentDownloadUrlSubscribe>
    );
  }
}