license import { AnchorButton , Classes , Dialog , Intent } from "@blueprintjs/core" ; import React from "react" ; /**
 * A modal that is rendered when this song is being edited in another tab.
 * There's no escaping this modal. You need to reload or close the tab to continue.
 */ export default class ModalLocked extends React . PureComponent { render ( ) { return ( < Dialog icon = "lock" title = "Locked" isOpen = { true } canOutsideClickClose = { false } canEscapeKeyClose = { false } isCloseButtonShown = { false } > < div className = { Classes . DIALOG_BODY } > This song was opened in another tab . You can only edit in one tab at once . If you have closed the other tab , you may { " " } < a href = { window . location . toString ( ) } > resume editing here < /a>. < /div> < div className = { Classes . DIALOG_FOOTER } > < div className = { Classes . DIALOG_FOOTER_ACTIONS } > < AnchorButton href = { window . location . toString ( ) } intent = { Intent . PRIMARY } icon = "refresh" > Reload < /AnchorButton> < /div> < /div> < /Dialog>); } } export function lock ( songID ) { localStorage . setItem ( "startedEditingNotification" , songID ) ; localStorage . removeItem ( "startedEditingNotification" ) ; } let editingNotificationHandler = null ; /**
 * Calls handler when another tab starts editing a song.
 */ export function setEditingNotificationHandler ( handler ) { if ( editingNotificationHandler ) { window . removeEventListener ( "storage" , editingNotificationHandler ) ; editingNotificationHandler = null ; } if ( handler ) { editingNotificationHandler = ( ev ) : void => { if ( ev . key === "startedEditingNotification" && ev . newValue ) { handler ( ev . newValue ) ; } } ; window . addEventListener ( "storage" , editingNotificationHandler ) ; } }