2023-01-20 04:52:55 +01:00
|
|
|
import {
|
|
|
|
Button,
|
|
|
|
Dialog,
|
|
|
|
DialogActions,
|
|
|
|
DialogContent,
|
|
|
|
DialogTitle,
|
2023-01-21 01:53:53 +01:00
|
|
|
FormControlLabel,
|
|
|
|
Switch,
|
2023-01-20 04:52:55 +01:00
|
|
|
} from '@material-ui/core'
|
|
|
|
import {
|
|
|
|
SelectInput,
|
|
|
|
SimpleForm,
|
|
|
|
useCreate,
|
|
|
|
useGetList,
|
|
|
|
useNotify,
|
|
|
|
} from 'react-admin'
|
|
|
|
import { useMemo, useState } from 'react'
|
|
|
|
import { shareUrl } from '../utils'
|
|
|
|
|
2023-01-21 01:53:53 +01:00
|
|
|
export const ShareDialog = ({ open, close, onClose, ids, resource, title }) => {
|
2023-01-20 04:52:55 +01:00
|
|
|
const notify = useNotify()
|
|
|
|
const [format, setFormat] = useState('')
|
|
|
|
const [maxBitRate, setMaxBitRate] = useState(0)
|
2023-01-21 01:53:53 +01:00
|
|
|
const [originalFormat, setUseOriginalFormat] = useState(true)
|
2023-01-20 04:52:55 +01:00
|
|
|
const { data: formats, loading } = useGetList(
|
|
|
|
'transcoding',
|
|
|
|
{
|
|
|
|
page: 1,
|
|
|
|
perPage: 1000,
|
|
|
|
},
|
|
|
|
{ field: 'name', order: 'ASC' }
|
|
|
|
)
|
|
|
|
|
|
|
|
const formatOptions = useMemo(
|
|
|
|
() =>
|
|
|
|
loading
|
|
|
|
? []
|
|
|
|
: Object.values(formats).map((f) => {
|
|
|
|
return { id: f.targetFormat, name: f.targetFormat }
|
|
|
|
}),
|
|
|
|
[formats, loading]
|
|
|
|
)
|
|
|
|
|
2023-01-21 01:53:53 +01:00
|
|
|
const handleOriginal = (e) => {
|
|
|
|
const original = e.target.checked
|
|
|
|
|
|
|
|
setUseOriginalFormat(original)
|
|
|
|
|
|
|
|
if (original) {
|
|
|
|
setFormat('')
|
|
|
|
setMaxBitRate(0)
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2023-01-20 04:52:55 +01:00
|
|
|
const [createShare] = useCreate(
|
|
|
|
'share',
|
|
|
|
{
|
|
|
|
resourceType: resource,
|
|
|
|
resourceIds: ids?.join(','),
|
|
|
|
format,
|
|
|
|
maxBitRate,
|
|
|
|
},
|
|
|
|
{
|
|
|
|
onSuccess: (res) => {
|
|
|
|
const url = shareUrl(res?.data?.id)
|
|
|
|
close()
|
|
|
|
navigator.clipboard
|
|
|
|
.writeText(url)
|
|
|
|
.then(() => {
|
|
|
|
notify(`URL copied to clipboard: ${url}`, {
|
|
|
|
type: 'info',
|
|
|
|
multiLine: true,
|
|
|
|
duration: 0,
|
|
|
|
})
|
|
|
|
})
|
|
|
|
.catch((err) => {
|
|
|
|
notify(`Error copying URL ${url} to clipboard: ${err.message}`, {
|
|
|
|
type: 'warning',
|
|
|
|
multiLine: true,
|
|
|
|
duration: 0,
|
|
|
|
})
|
|
|
|
})
|
|
|
|
},
|
|
|
|
onFailure: (error) =>
|
|
|
|
notify(`Error sharing media: ${error.message}`, { type: 'warning' }),
|
|
|
|
}
|
|
|
|
)
|
|
|
|
|
|
|
|
return (
|
|
|
|
<Dialog
|
|
|
|
open={open}
|
|
|
|
onClose={onClose}
|
|
|
|
onBackdropClick={onClose}
|
2023-01-21 01:53:53 +01:00
|
|
|
aria-labelledby="share-dialog"
|
2023-01-20 04:52:55 +01:00
|
|
|
fullWidth={true}
|
|
|
|
maxWidth={'sm'}
|
|
|
|
>
|
2023-01-21 01:53:53 +01:00
|
|
|
<DialogTitle id="share-dialog">{title}</DialogTitle>
|
2023-01-20 04:52:55 +01:00
|
|
|
<DialogContent>
|
|
|
|
<SimpleForm toolbar={null} variant={'outlined'}>
|
2023-01-21 01:53:53 +01:00
|
|
|
<FormControlLabel
|
|
|
|
control={<Switch checked={originalFormat} />}
|
|
|
|
label={'Share in original format'}
|
|
|
|
onChange={handleOriginal}
|
2023-01-20 04:52:55 +01:00
|
|
|
/>
|
2023-01-21 01:53:53 +01:00
|
|
|
{!originalFormat && (
|
|
|
|
<SelectInput
|
|
|
|
source="format"
|
|
|
|
choices={formatOptions}
|
|
|
|
resettable
|
|
|
|
onChange={(event) => {
|
|
|
|
setFormat(event.target.value)
|
|
|
|
}}
|
|
|
|
/>
|
|
|
|
)}
|
|
|
|
{!originalFormat && (
|
|
|
|
<SelectInput
|
|
|
|
source="bitrate"
|
|
|
|
choices={[
|
|
|
|
{ id: 32, name: '32' },
|
|
|
|
{ id: 48, name: '48' },
|
|
|
|
{ id: 64, name: '64' },
|
|
|
|
{ id: 80, name: '80' },
|
|
|
|
{ id: 96, name: '96' },
|
|
|
|
{ id: 112, name: '112' },
|
|
|
|
{ id: 128, name: '128' },
|
|
|
|
{ id: 160, name: '160' },
|
|
|
|
{ id: 192, name: '192' },
|
|
|
|
{ id: 256, name: '256' },
|
|
|
|
{ id: 320, name: '320' },
|
|
|
|
]}
|
|
|
|
resettable
|
|
|
|
onChange={(event) => {
|
|
|
|
setMaxBitRate(event.target.value)
|
|
|
|
}}
|
|
|
|
/>
|
|
|
|
)}
|
2023-01-20 04:52:55 +01:00
|
|
|
</SimpleForm>
|
|
|
|
</DialogContent>
|
|
|
|
<DialogActions>
|
|
|
|
<Button onClick={createShare} color="primary">
|
|
|
|
Share
|
|
|
|
</Button>
|
|
|
|
<Button onClick={onClose} color="primary">
|
|
|
|
Cancel
|
|
|
|
</Button>
|
|
|
|
</DialogActions>
|
|
|
|
</Dialog>
|
|
|
|
)
|
|
|
|
}
|