import * as React from 'react';
import Dialog from 'material-ui/Dialog';

import PreviewPlayer from '../../Video/Player';

const PreviewMediaDialog = ({
  open,
  media,
  volume,
  onCloseDialog
}) => (
  <Dialog
    contentClassName="Dialog PreviewMediaDialog"
    bodyClassName="Dialog-body"
    titleClassName="Dialog-title"
    title={open ? `${media.artist} – ${media.title}` : 'Preview Media'}
    open={open}
    onRequestClose={onCloseDialog}
    autoScrollBodyContent
  >
    {open && (
      <div className="PreviewMediaDialog-content">
        <PreviewPlayer
          mode="preview"
          media={media}
          volume={volume}
        />
      </div>
    )}
  </Dialog>
);

PreviewMediaDialog.propTypes = {
  open: React.PropTypes.bool,
  media: React.PropTypes.object,
  volume: React.PropTypes.volume,

  onCloseDialog: React.PropTypes.func.isRequired
};

export default PreviewMediaDialog;

@@ -126,92 +126,307 @@
 nst 
-PreviewMediaDialog = (%7B%0A  open,%0A  media,%0A  volume,%0A  onCloseDialog%0A%7D) =%3E (%0A  %3CDialog
+useClassNameWidthStyle = %7B%0A  width: null%0A%7D;%0Aconst inheritWidthStyle = %7B%0A  width: 'inherit'%0A%7D;%0A%0Aconst PreviewMediaDialog = (%7B%0A  open,%0A  media,%0A  volume,%0A  onCloseDialog%0A%7D) =%3E (%0A  %3CDialog%0A    className=%22AppColumn AppColumn--left%22%0A    style=%7BuseClassNameWidthStyle%7D%0A    overlayStyle=%7BinheritWidthStyle%7D
 %0A   

make dialog not overlay chat