{"version":3,"file":"PlaylistPage.5727e4f76f59ce023d3e.js","mappings":"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","sources":["webpack://grafana/./public/app/core/components/PageActionBar/PageActionBar.tsx","webpack://grafana/./public/app/features/playlist/EmptyQueryListBanner.tsx","webpack://grafana/./public/app/features/playlist/ShareModal.tsx","webpack://grafana/./public/app/features/playlist/PlaylistPageList.tsx","webpack://grafana/./public/app/features/playlist/StartModal.tsx","webpack://grafana/./public/app/features/playlist/PlaylistPage.tsx","webpack://grafana/./public/app/features/playlist/api.ts"],"sourcesContent":["import React, { PureComponent } from 'react';\n\nimport { LinkButton, FilterInput } from '@grafana/ui';\n\nexport interface Props {\n  searchQuery: string;\n  setSearchQuery: (value: string) => void;\n  linkButton?: { href: string; title: string; disabled?: boolean };\n  target?: string;\n  placeholder?: string;\n}\n\nexport default class PageActionBar extends PureComponent<Props> {\n  render() {\n    const { searchQuery, linkButton, setSearchQuery, target, placeholder = 'Search by name or type' } = this.props;\n    const linkProps: typeof LinkButton.defaultProps = { href: linkButton?.href, disabled: linkButton?.disabled };\n\n    if (target) {\n      linkProps.target = target;\n    }\n\n    return (\n      <div className=\"page-action-bar\">\n        <div className=\"gf-form gf-form--grow\">\n          <FilterInput value={searchQuery} onChange={setSearchQuery} placeholder={placeholder} />\n        </div>\n        {linkButton && <LinkButton {...linkProps}>{linkButton.title}</LinkButton>}\n      </div>\n    );\n  }\n}\n","import { css } from '@emotion/css';\nimport React from 'react';\n\nimport { GrafanaTheme2 } from '@grafana/data';\nimport { useStyles2 } from '@grafana/ui';\n\nexport const EmptyQueryListBanner = () => {\n  const styles = useStyles2(getStyles);\n  return <div className={styles.noResult}>No playlist found!</div>;\n};\n\nconst getStyles = (theme: GrafanaTheme2) => {\n  return {\n    noResult: css`\n      padding: ${theme.spacing(2)};\n      background: ${theme.colors.secondary.main};\n      font-style: italic;\n      margin-top: ${theme.spacing(2)};\n    `,\n  };\n};\n","import React, { useState } from 'react';\n\nimport { AppEvents, SelectableValue, UrlQueryMap, urlUtil } from '@grafana/data';\nimport { Checkbox, ClipboardButton, Field, FieldSet, Icon, Input, Modal, RadioButtonGroup } from '@grafana/ui';\nimport appEvents from 'app/core/app_events';\n\nimport { buildBaseUrl } from '../dashboard/components/ShareModal/utils';\n\nimport { PlaylistMode } from './types';\n\ninterface ShareModalProps {\n  playlistUid: string;\n  onDismiss: () => void;\n}\n\nexport const ShareModal = ({ playlistUid, onDismiss }: ShareModalProps) => {\n  const [mode, setMode] = useState<PlaylistMode>(false);\n  const [autoFit, setAutofit] = useState(false);\n\n  const modes: Array<SelectableValue<PlaylistMode>> = [\n    { label: 'Normal', value: false },\n    { label: 'TV', value: 'tv' },\n    { label: 'Kiosk', value: true },\n  ];\n\n  const onShareUrlCopy = () => {\n    appEvents.emit(AppEvents.alertSuccess, ['Content copied to clipboard']);\n  };\n\n  const params: UrlQueryMap = {};\n  if (mode) {\n    params.kiosk = mode;\n  }\n  if (autoFit) {\n    params.autofitpanels = true;\n  }\n\n  const shareUrl = urlUtil.renderUrl(`${buildBaseUrl()}/play/${playlistUid}`, params);\n\n  return (\n    <Modal isOpen={true} title=\"Share playlist\" onDismiss={onDismiss}>\n      <FieldSet>\n        <Field label=\"Mode\">\n          <RadioButtonGroup value={mode} options={modes} onChange={setMode} />\n        </Field>\n        <Field>\n          <Checkbox\n            label=\"Autofit\"\n            description=\"Panel heights will be adjusted to fit screen size\"\n            name=\"autofix\"\n            value={autoFit}\n            onChange={(e) => setAutofit(e.currentTarget.checked)}\n          />\n        </Field>\n\n        <Field label=\"Link URL\">\n          <Input\n            id=\"link-url-input\"\n            value={shareUrl}\n            readOnly\n            addonAfter={\n              <ClipboardButton variant=\"primary\" getText={() => shareUrl} onClipboardCopy={onShareUrlCopy}>\n                <Icon name=\"copy\" /> Copy\n              </ClipboardButton>\n            }\n          />\n        </Field>\n      </FieldSet>\n    </Modal>\n  );\n};\n","import { css } from '@emotion/css';\nimport React from 'react';\n\nimport { GrafanaTheme2 } from '@grafana/data';\nimport { Button, Card, LinkButton, ModalsController, useStyles2 } from '@grafana/ui';\nimport { contextSrv } from 'app/core/services/context_srv';\n\nimport { DashNavButton } from '../dashboard/components/DashNav/DashNavButton';\n\nimport { ShareModal } from './ShareModal';\nimport { PlaylistDTO } from './types';\n\ninterface Props {\n  setStartPlaylist: (playlistItem: PlaylistDTO) => void;\n  setPlaylistToDelete: (playlistItem: PlaylistDTO) => void;\n  playlists: PlaylistDTO[] | undefined;\n}\n\nexport const PlaylistPageList = ({ playlists, setStartPlaylist, setPlaylistToDelete }: Props) => {\n  const styles = useStyles2(getStyles);\n  return (\n    <ul className={styles.list}>\n      {playlists!.map((playlist: PlaylistDTO) => (\n        <li className={styles.listItem} key={playlist.uid}>\n          <Card>\n            <Card.Heading>\n              {playlist.name}\n              <ModalsController key=\"button-share\">\n                {({ showModal, hideModal }) => (\n                  <DashNavButton\n                    tooltip=\"Share playlist\"\n                    icon=\"share-alt\"\n                    iconSize=\"lg\"\n                    onClick={() => {\n                      showModal(ShareModal, {\n                        playlistUid: playlist.uid,\n                        onDismiss: hideModal,\n                      });\n                    }}\n                  />\n                )}\n              </ModalsController>\n            </Card.Heading>\n            <Card.Actions>\n              <Button variant=\"secondary\" icon=\"play\" onClick={() => setStartPlaylist(playlist)}>\n                Start playlist\n              </Button>\n              {contextSrv.isEditor && (\n                <>\n                  <LinkButton key=\"edit\" variant=\"secondary\" href={`/playlists/edit/${playlist.uid}`} icon=\"cog\">\n                    Edit playlist\n                  </LinkButton>\n                  <Button\n                    disabled={false}\n                    onClick={() => setPlaylistToDelete({ id: playlist.id, uid: playlist.uid, name: playlist.name })}\n                    icon=\"trash-alt\"\n                    variant=\"destructive\"\n                  >\n                    Delete playlist\n                  </Button>\n                </>\n              )}\n            </Card.Actions>\n          </Card>\n        </li>\n      ))}\n    </ul>\n  );\n};\n\nfunction getStyles(theme: GrafanaTheme2) {\n  return {\n    list: css({\n      display: 'grid',\n    }),\n    listItem: css({\n      listStyle: 'none',\n    }),\n  };\n}\n","import React, { FC, useState } from 'react';\n\nimport { SelectableValue, urlUtil } from '@grafana/data';\nimport { locationService } from '@grafana/runtime';\nimport { Button, Checkbox, Field, FieldSet, Modal, RadioButtonGroup } from '@grafana/ui';\n\nimport { PlaylistDTO, PlaylistMode } from './types';\n\nexport interface StartModalProps {\n  playlist: PlaylistDTO;\n  onDismiss: () => void;\n}\n\nexport const StartModal: FC<StartModalProps> = ({ playlist, onDismiss }) => {\n  const [mode, setMode] = useState<PlaylistMode>(false);\n  const [autoFit, setAutofit] = useState(false);\n\n  const modes: Array<SelectableValue<PlaylistMode>> = [\n    { label: 'Normal', value: false },\n    { label: 'TV', value: 'tv' },\n    { label: 'Kiosk', value: true },\n  ];\n\n  const onStart = () => {\n    const params: any = {};\n    if (mode) {\n      params.kiosk = mode;\n    }\n    if (autoFit) {\n      params.autofitpanels = true;\n    }\n    locationService.push(urlUtil.renderUrl(`/playlists/play/${playlist.uid}`, params));\n  };\n\n  return (\n    <Modal isOpen={true} icon=\"play\" title=\"Start playlist\" onDismiss={onDismiss}>\n      <FieldSet>\n        <Field label=\"Mode\">\n          <RadioButtonGroup value={mode} options={modes} onChange={setMode} />\n        </Field>\n        <Checkbox\n          label=\"Autofit\"\n          description=\"Panel heights will be adjusted to fit screen size\"\n          name=\"autofix\"\n          value={autoFit}\n          onChange={(e) => setAutofit(e.currentTarget.checked)}\n        />\n      </FieldSet>\n      <Modal.ButtonRow>\n        <Button variant=\"primary\" onClick={onStart}>\n          Start {playlist.name}\n        </Button>\n      </Modal.ButtonRow>\n    </Modal>\n  );\n};\n","import React, { FC, useState } from 'react';\nimport { connect, MapStateToProps } from 'react-redux';\nimport { useDebounce } from 'react-use';\n\nimport { NavModel } from '@grafana/data';\nimport { ConfirmModal } from '@grafana/ui';\nimport Page from 'app/core/components/Page/Page';\nimport PageActionBar from 'app/core/components/PageActionBar/PageActionBar';\nimport { getNavModel } from 'app/core/selectors/navModel';\nimport { contextSrv } from 'app/core/services/context_srv';\nimport { StoreState } from 'app/types';\n\nimport EmptyListCTA from '../../core/components/EmptyListCTA/EmptyListCTA';\nimport { GrafanaRouteComponentProps } from '../../core/navigation/types';\n\nimport { EmptyQueryListBanner } from './EmptyQueryListBanner';\nimport { PlaylistPageList } from './PlaylistPageList';\nimport { StartModal } from './StartModal';\nimport { deletePlaylist, getAllPlaylist } from './api';\nimport { PlaylistDTO } from './types';\n\ninterface ConnectedProps {\n  navModel: NavModel;\n}\nexport interface PlaylistPageProps extends ConnectedProps, GrafanaRouteComponentProps {}\n\nexport const PlaylistPage: FC<PlaylistPageProps> = ({ navModel }) => {\n  const [searchQuery, setSearchQuery] = useState('');\n  const [debouncedSearchQuery, setDebouncedSearchQuery] = useState(searchQuery);\n  const [hasFetched, setHasFetched] = useState(false);\n  const [startPlaylist, setStartPlaylist] = useState<PlaylistDTO | undefined>();\n  const [playlistToDelete, setPlaylistToDelete] = useState<PlaylistDTO | undefined>();\n  const [forcePlaylistsFetch, setForcePlaylistsFetch] = useState(0);\n\n  const [playlists, setPlaylists] = useState<PlaylistDTO[]>([]);\n\n  useDebounce(\n    async () => {\n      const playlists = await getAllPlaylist(searchQuery);\n      if (!hasFetched) {\n        setHasFetched(true);\n      }\n      setPlaylists(playlists);\n      setDebouncedSearchQuery(searchQuery);\n    },\n    350,\n    [forcePlaylistsFetch, searchQuery]\n  );\n\n  const hasPlaylists = playlists && playlists.length > 0;\n  const onDismissDelete = () => setPlaylistToDelete(undefined);\n  const onDeletePlaylist = () => {\n    if (!playlistToDelete) {\n      return;\n    }\n    deletePlaylist(playlistToDelete.uid).finally(() => {\n      setForcePlaylistsFetch(forcePlaylistsFetch + 1);\n      setPlaylistToDelete(undefined);\n    });\n  };\n\n  const emptyListBanner = (\n    <EmptyListCTA\n      title=\"There are no playlists created yet\"\n      buttonIcon=\"plus\"\n      buttonLink=\"playlists/new\"\n      buttonTitle=\"Create Playlist\"\n      buttonDisabled={!contextSrv.isEditor}\n      proTip=\"You can use playlists to cycle dashboards on TVs without user control\"\n      proTipLink=\"http://docs.grafana.org/reference/playlist/\"\n      proTipLinkTitle=\"Learn more\"\n      proTipTarget=\"_blank\"\n    />\n  );\n\n  const showSearch = playlists.length > 0 || searchQuery.length > 0 || debouncedSearchQuery.length > 0;\n\n  return (\n    <Page navModel={navModel}>\n      <Page.Contents isLoading={!hasFetched}>\n        {showSearch && (\n          <PageActionBar\n            searchQuery={searchQuery}\n            linkButton={contextSrv.isEditor && { title: 'New playlist', href: '/playlists/new' }}\n            setSearchQuery={setSearchQuery}\n          />\n        )}\n\n        {!hasPlaylists && searchQuery ? (\n          <EmptyQueryListBanner />\n        ) : (\n          <PlaylistPageList\n            playlists={playlists}\n            setStartPlaylist={setStartPlaylist}\n            setPlaylistToDelete={setPlaylistToDelete}\n          />\n        )}\n        {!showSearch && emptyListBanner}\n        {playlistToDelete && (\n          <ConfirmModal\n            title={playlistToDelete.name}\n            confirmText=\"Delete\"\n            body={`Are you sure you want to delete '${playlistToDelete.name}' playlist?`}\n            onConfirm={onDeletePlaylist}\n            isOpen={Boolean(playlistToDelete)}\n            onDismiss={onDismissDelete}\n          />\n        )}\n        {startPlaylist && <StartModal playlist={startPlaylist} onDismiss={() => setStartPlaylist(undefined)} />}\n      </Page.Contents>\n    </Page>\n  );\n};\n\nconst mapStateToProps: MapStateToProps<ConnectedProps, {}, StoreState> = (state: StoreState) => ({\n  navModel: getNavModel(state.navIndex, 'playlists'),\n});\n\nexport default connect(mapStateToProps)(PlaylistPage);\n","import { getBackendSrv } from '@grafana/runtime';\n\nimport { notifyApp } from '../../core/actions';\nimport { createErrorNotification, createSuccessNotification } from '../../core/copy/appNotification';\nimport { dispatch } from '../../store/store';\n\nimport { Playlist, PlaylistDTO } from './types';\n\nexport async function createPlaylist(playlist: Playlist) {\n  await withErrorHandling(() => getBackendSrv().post('/api/playlists', playlist));\n}\n\nexport async function updatePlaylist(uid: string, playlist: Playlist) {\n  await withErrorHandling(() => getBackendSrv().put(`/api/playlists/${uid}`, playlist));\n}\n\nexport async function deletePlaylist(uid: string) {\n  await withErrorHandling(() => getBackendSrv().delete(`/api/playlists/${uid}`), 'Playlist deleted');\n}\n\nexport async function getPlaylist(uid: string): Promise<Playlist> {\n  const result: Playlist = await getBackendSrv().get(`/api/playlists/${uid}`);\n  return result;\n}\n\nexport async function getAllPlaylist(query: string): Promise<PlaylistDTO[]> {\n  const result: PlaylistDTO[] = await getBackendSrv().get('/api/playlists/', { query });\n  return result;\n}\n\nasync function withErrorHandling(apiCall: () => Promise<void>, message = 'Playlist saved') {\n  try {\n    await apiCall();\n    dispatch(notifyApp(createSuccessNotification(message)));\n  } catch (e) {\n    dispatch(notifyApp(createErrorNotification('Unable to save playlist', e)));\n  }\n}\n"],"names":["PageActionBar","PureComponent","render","searchQuery","linkButton","setSearchQuery","target","placeholder","this","props","linkProps","href","disabled","className","FilterInput","value","onChange","LinkButton","title","EmptyQueryListBanner","styles","useStyles2","getStyles","noResult","theme","css","spacing","colors","secondary","main","ShareModal","playlistUid","onDismiss","mode","setMode","useState","autoFit","setAutofit","params","kiosk","autofitpanels","shareUrl","urlUtil","buildBaseUrl","Modal","isOpen","FieldSet","Field","label","RadioButtonGroup","options","Checkbox","description","name","e","currentTarget","checked","Input","id","readOnly","addonAfter","ClipboardButton","variant","getText","onClipboardCopy","appEvents","AppEvents","Icon","PlaylistPageList","playlists","setStartPlaylist","setPlaylistToDelete","list","map","playlist","listItem","Card","ModalsController","showModal","hideModal","DashNavButton","tooltip","icon","iconSize","onClick","uid","Button","contextSrv","display","listStyle","StartModal","locationService","PlaylistPage","navModel","debouncedSearchQuery","setDebouncedSearchQuery","hasFetched","setHasFetched","startPlaylist","playlistToDelete","forcePlaylistsFetch","setForcePlaylistsFetch","setPlaylists","useDebounce","async","getAllPlaylist","hasPlaylists","length","emptyListBanner","EmptyListCTA","buttonIcon","buttonLink","buttonTitle","buttonDisabled","proTip","proTipLink","proTipLinkTitle","proTipTarget","showSearch","Page","isLoading","ConfirmModal","confirmText","body","onConfirm","deletePlaylist","finally","undefined","Boolean","connect","state","getNavModel","navIndex","createPlaylist","withErrorHandling","getBackendSrv","post","updatePlaylist","put","delete","getPlaylist","get","query","apiCall","message","dispatch","notifyApp","createSuccessNotification","createErrorNotification"],"sourceRoot":""}