\n \n \n
\n );\n }\n}","import React from 'react';\nimport {classNames} from '../libs/css-utils.js';\nimport * as gists from '../libs/gists.js';\nimport ServiceContext from '../ServiceContext.js';\n\nexport default class SaveAsGist extends React.Component {\n constructor () {\n super();\n this.state = {\n saving: false,\n secret: false,\n };\n }\n componentDidMount() {\n const {userManager} = this.context;\n userManager.subscribe(this.onPatChange);\n }\n componentWillUnmount() {\n const {userManager} = this.context;\n userManager.unsubscribe(this.onPatChange);\n }\n onPatChange = () => {\n this.forceUpdate();\n }\n toggleSecret = () => {\n this.setState({secret: !this.state.secret});\n }\n saveNew = async() => {\n const {github, addError} = this.context;\n const {secret} = this.state;\n this.setState({saving: true});\n const {data, onSave, onClose} = this.props;\n let success = false;\n try {\n const {id, name, date, public: _public} = await github.createGist(data, secret);\n gists.addGist(id, name, date, _public);\n onSave(id);\n success = true;\n } catch (e) {\n addError(`could not create gist: ${e}`)\n }\n this.setState({saving: false});\n if (success) {\n onClose();\n }\n }\n saveOverExisting = async() => {\n const {github, addError} = this.context;\n this.setState({saving: true});\n const {data, gistId, onClose} = this.props;\n let success = false;\n try {\n const {id, name, date, public: _public} = await github.updateGist(gistId, data);\n gists.addGist(id, name, date, _public);\n success = true;\n } catch (e) {\n addError(`could not update gist: ${e}`)\n }\n this.setState({saving: false});\n if (success) {\n onClose();\n }\n }\n forkAndSave = async() => {\n const {github, addError} = this.context;\n const {data, gistId, onSave, onClose} = this.props;\n const {secret} = this.state;\n this.setState({saving: true});\n let success = false;\n try {\n const {id: newId} = await github.forkGist(gistId, secret);\n const {id, name, date, public: _public} = await github.updateGist(newId, data);\n gists.addGist(id, name, date, _public);\n onSave(id);\n success = true\n } catch (e) {\n addError(`could not fork and update gist: ${e}`);\n }\n this.setState({saving: false});\n if (success) {\n onClose();\n }\n }\n renderLogin() {\n const {userManager} = this.context;\n return (\n StackOverflow Snippet (copy the code below paste into S.O.)
\n\n
\n this.onChange(true)}/>
\n this.onChange(false)}/>
\n S.O. does not support es6 modules yet so picking \"As Module\" puts the code in a <script> in the HTML area.
\n\n
\n {makeSnippet(data, asModule)}\n \n \n
\n HTML (copy the code below paste into a file)
\n\n
\n this.onChange(true)}/>
\n this.onChange(false)}/>
\n \n
\n {makeHTML(data, asModule)}\n \n \n \n
\n \n Login with github\n
\n );\n }\n renderSave() {\n const {saving, secret} = this.state;\n const {userManager} = this.context;\n const userData = userManager.getUserData();\n const {gistId, gistOwnerId} = this.props;\n const canUpdate = userData && gistId && userData.id === gistOwnerId;\n const canFork = userData && gistId && userData.id !== gistOwnerId;\n return (\n \n
\n );\n }\n render() {\n const {userManager} = this.context;\n const userData = userManager.getUserData();\n return userData ? this.renderSave() : this.renderLogin();\n }\n}\n\nSaveAsGist.contextType = ServiceContext;","import React from 'react';\n\nexport default function SaveAsJSON(props) {\n const {data} = props;\n return (\n \n Save to New Gist\n Update Current Gist\n Fork and Save Gist\n
\n \n
\n
\n \n
Warning:\n\n\n
\n (see docs)\n- You can not change a gist from public to secret
\n- Secret gists are still publicly accessible they're just unlisted
\n
\n
\n );\n}","import React from 'react';\n\nimport {jsonToCompressedBase64} from '../libs/compression.js';\n\nexport default function SaveAsURL(props) {\n const {data} = props;\n const src = jsonToCompressedBase64(data);\n const url = `${window.location.origin}?src=${encodeURIComponent(src)}`;\n return url.length < 8000\n ? (\n \n Copy the text below, paste into the load ui or put somewhere on the net\n and make your own URL with
\n {window.location.origin}?src=url-to-json.\n {JSON.stringify(data)}\n \n \n
\n )\n : (\n Copy / bookmark the link below
\n {url}\n \n Too large to save as URL\n
\n )\n ;\n}\n","import React from 'react';\nimport Dialog from './Dialog.js';\nimport Embed from './Embed.js';\nimport Export from './Export.js';\nimport SaveAsGist from './SaveAsGist.js';\nimport SaveAsJSON from './SaveAsJSON.js';\nimport SaveAsURL from './SaveAsURL.js';\nimport Section from './Section.js';\n\nexport default function Save(props) {\n const {data, gistId, gistOwnerId, onSave, onClose} = props;\n return (\n \n )\n}\n","import React from 'react';\n\nimport Dialog from './Dialog.js';\nimport Section from './Section.js';\nimport ServiceContext from '../ServiceContext.js';\n\nimport verticalIcon from '../icons/vertical-layout.svg';\nimport horizontalIcon from '../icons/horizontal-layout.svg';\nimport twoByTwoIcon from '../icons/two-by-two-layout.svg';\nimport tabbedIcon from '../icons/tabbed-layout.svg';\n\nimport {classNames} from '../libs/css-utils.js';\nimport * as uiModel from '../libs/ui-model.js';\n\nfunction RadioOption(props) {\n const {children, onChange, selected} = props;\n return (\n \n {children}\n
\n );\n}\n\nfunction Radio(props) {\n const {selected, onChange, children} = props;\n\n const newChildren = React.Children.map(children, (child) => {\n if (!React.isValidElement(child)) {\n return null;\n }\n\n const {result} = child.props;\n const isSelected = result === selected;\n\n //const id = childNdx;\n //childNdx += 1;\n return React.cloneElement(child, {\n //...child.props,\n selected: isSelected,\n onChange: () => onChange(result),\n });\n });\n\n return (\n \n {newChildren}\n
\n );\n}\n\nfunction Checkbox(props) {\n const {id, label, checked, onChange} = props;\n const elemId = `checkbox-${id}`;\n return (\n \n onChange(e.target.checked)}\n />\n \n
\n );\n}\n\nclass Logout extends React.Component {\n componentDidMount() {\n const {userManager} = this.context;\n userManager.subscribe(this.handleChange);\n }\n componentWillUnmount() {\n const {userManager} = this.context;\n userManager.unsubscribe(this.handleChange);\n }\n handleChange = () => {\n this.forceUpdate();\n }\n handleLogout = () => {\n const {userManager} = this.context;\n userManager.logout();\n }\n render() {\n const {userManager} = this.context;\n const userData = userManager.getUserData();\n return (!!userData &&\n Logged in as: \n {!!userData.login && }\n {!!userData.avatar_url && 
}\n
\n \n \n \n \n \n \n \n \n \n \n
\n );\n}","import SubscriptionManager from './SubscriptionManager.ts';\n\nconst kUserManagerKey = 'foobar'; // not important\n\nexport default class UserManager {\n constructor({\n oauthManager,\n github,\n addError,\n }) {\n this.oauthManager = oauthManager;\n this.github = github;\n this.subscriptionManager = new SubscriptionManager();\n this.addError = addError;\n oauthManager.subscribe(this._handleNewAuth);\n this._handleNewAuth();\n this.userData = undefined;\n }\n /*\n {\n \"login\": \"greggman\",\n \"id\": 234804,\n \"node_id\": \"MDQ6VXNlcjIzNDgwNA==\",\n \"avatar_url\": \"https://avatars2.githubusercontent.com/u/234804?v=4\",\n \"gravatar_id\": \"\",\n \"url\": \"https://api.github.com/users/greggman\",\n \"html_url\": \"https://github.com/greggman\",\n \"followers_url\": \"https://api.github.com/users/greggman/followers\",\n \"following_url\": \"https://api.github.com/users/greggman/following{/other_user}\",\n \"gists_url\": \"https://api.github.com/users/greggman/gists{/gist_id}\",\n \"starred_url\": \"https://api.github.com/users/greggman/starred{/owner}{/repo}\",\n \"subscriptions_url\": \"https://api.github.com/users/greggman/subscriptions\",\n \"organizations_url\": \"https://api.github.com/users/greggman/orgs\",\n \"repos_url\": \"https://api.github.com/users/greggman/repos\",\n \"events_url\": \"https://api.github.com/users/greggman/events{/privacy}\",\n \"received_events_url\": \"https://api.github.com/users/greggman/received_events\",\n \"type\": \"User\",\n \"site_admin\": false,\n \"name\": \"Greggman\",\n \"company\": null,\n \"blog\": \"http://games.greggman.com\",\n \"location\": \"Earth\",\n \"email\": \"github@greggman.com\",\n \"hireable\": null,\n \"bio\": \"30 years of games\\r\\n5 years of Chrome\",\n \"twitter_username\": null,\n \"public_repos\": 283,\n \"public_gists\": 80,\n \"followers\": 1037,\n \"following\": 3,\n \"created_at\": \"2010-04-01T08:48:05Z\",\n \"updated_at\": \"2020-10-24T06:05:24Z\"\n }\n */\n getUserData() {\n return this.userData;\n }\n _handleNewAuth = async() => {\n this.userData = undefined;\n const pat = this.oauthManager.pat();\n this.github.setPat(pat);\n if (pat) {\n try {\n const data = await this.github.getAuthenticatedUser();\n this.userData = data;\n } catch (e) {\n this.addError(e);\n }\n }\n this.subscriptionManager.notify(kUserManagerKey);\n }\n login = () => {\n this.oauthManager.login();\n }\n logout = () => {\n this.oauthManager.logout();\n this.github.setPat()\n }\n subscribe(fn) {\n this.subscriptionManager.subscribe(kUserManagerKey, fn);\n }\n unsubscribe(fn) {\n this.subscriptionManager.unsubscribe(kUserManagerKey, fn);\n }\n cleanup() {\n this.oauthManager.unsubscribe(this._handleNewAuth);\n }\n}\n\n","import React from 'react';\n\nimport EditLine from './EditLine.js';\n// import Footer from './Footer.js';\nimport {storageManager} from '../globals.js';\nimport GitHub from '../libs/GitHub.js';\nimport Head from './Head.js';\nimport Help from './Help.js';\nimport IDE from './IDE.js';\nimport Load from './Load.js';\nimport {isGistId, loadGistFromSrc} from '../libs/loader.js';\nimport {LogManager} from './Log.js';\nimport * as model from '../libs/model.js';\nimport Save from './Save.js';\nimport ServiceContext from '../ServiceContext.js';\nimport Settings from './Settings.js';\nimport Toolbar from './Toolbar.js';\nimport * as uiModel from '../libs/ui-model.js';\nimport UserManager from '../libs/UserManager.js';\nimport * as winMsgMgr from '../libs/WindowMessageManager';\nimport query from '../libs/start-query.js';\n\nimport './App.css';\nimport { classNames } from '../libs/css-utils.js';\n\nconst noJSX = () => [];\nconst darkMatcher = window.matchMedia('(prefers-color-scheme: dark)');\n\nclass App extends React.Component {\n constructor(props) {\n super();\n this.state = {\n path: window.location.pathname,\n dark: darkMatcher.matches,\n fullscreen: !!query.fullscreen,\n loading: false,\n dialog: noJSX,\n gistId: '',\n messages: [],\n userData: {},\n updateVersion: 0,\n };\n this.github = new GitHub();\n this.oauthManager = props.oauthManager;\n this.backupManager = props.backupManager;\n this.logManager = new LogManager();\n this.userManager = new UserManager({\n oauthManager: this.oauthManager,\n github: this.github,\n addError: this.addError,\n });\n this.toolbarFns = {\n handleRun: this.handleRun,\n handleStop: this.handleStop,\n handleSave: this.handleSave,\n handleNew: this.handleNew,\n handleLoad: this.handleLoad,\n handleSettings: this.handleSettings,\n handleFullscreen: this.handleFullscreen,\n handleHelp: this.handleHelp,\n };\n }\n componentWillUnmount() {\n uiModel.unsubscribe(this.handleUIChange);\n this.userManager.cleanup();\n }\n componentDidMount() {\n uiModel.subscribe(this.handleUIChange);\n winMsgMgr.on('newGist', null, this.handleNewGist);\n this.github.addEventListener('userdata', (e) => {\n this.setState({\n userData: e.data,\n });\n });\n model.add('path', window.location.pathname);\n model.subscribe('path', (newValue) => {\n window.history.pushState({}, '', newValue);\n this.setState({\n path: newValue,\n });\n });\n // I still am not sure how I'm supposed to handle this.\n // Putting my model in the state itself seems wrong\n // and doesn't actually help since I'd have to \n // generate an entirely new state object to change any\n // nested property.\n //\n // Storing the data outside I see no way to tell\n // components to re-render except to call forceUpdate\n // which all the documentation says \"if you call this\n // you're doing it wrong\".\n //\n // Redux is a joke. 50 lines code needed to set\n // a single field. Repeat those 50 lines for every field.\n // Things like redux-tools make it less to type those\n // 50 lines but they still execute 50 to 500 lines of code\n // just to set a single value.\n model.subscribe(model.filesVersionKey, _ => {\n this.forceUpdate();\n });\n // this is a hack because I can't figure out how to\n // update the CodeMirror areas\n model.subscribe('updateVersion', _ => {\n this.setState({updateVersion: this.state.updateVersion + 1});\n });\n\n darkMatcher.addEventListener('change', () => {\n this.setState({dark: darkMatcher.matches});\n });\n\n if (query.newGist) {\n window.history.pushState({}, '', `${window.location.origin}`);\n window.opener.postMessage({type: 'gimmeDaCodez'}, '*');\n return;\n }\n\n const backup = this.backupManager.getBackup();\n let loaded = false;\n if (backup) {\n try {\n const data = JSON.parse(backup);\n if (data.href === window.location.href) {\n model.setData(data.data);\n const url = new URL(data.href);\n const {src} = Object.fromEntries(new URLSearchParams(url.search).entries());\n if (isGistId(src)) {\n this.setState({gistId: src, gistOwnerId: data.gistOwnerId});\n }\n loaded = true;\n this.addInfo('loaded backup from local storage')\n }\n } catch (e) {\n console.log('bad backup')\n }\n this.backupManager.clearBackup();\n }\n if (!loaded) {\n if (query.src) {\n this.loadData(query.src);\n }\n }\n this.updateTitle();\n }\n componentDidUpdate() {\n this.updateTitle();\n }\n updateTitle() {\n const data = model.getData();\n document.title = data.name || 'jsGist';\n }\n async loadData(src) {\n this.setState({loading: true});\n let success = true;\n let firstTry = true;\n for (;;) {\n try {\n const {data, id, rawData} = await loadGistFromSrc(src, this.github);\n model.setData(data);\n if (id) {\n this.setState({\n gistId: src,\n gistOwnerId: rawData?.owner?.id,\n });\n }\n break;\n } catch (e) {\n if (firstTry) {\n this.userManager.logout();\n firstTry = false;\n } else {\n success = false;\n console.warn(e);\n this.addError(`could not load jsGist: src=${src} ${e}`);\n break;\n }\n }\n }\n this.setState({loading: false});\n if (success) {\n this.handleRun();\n }\n }\n handleUIChange = () => {\n this.forceUpdate();\n }\n handleNewGist = (data) => {\n let success = true;\n try {\n model.setData(data);\n this.backupManager.clearBackup();\n } catch (e) {\n success = false;\n console.warn(e);\n this.addError(`could create new jsGist: ${e}`);\n }\n if (success) {\n this.handleRun();\n }\n };\n addMsg = (msg, className) => {\n switch (className) {\n case 'error':\n console.error(msg);\n break;\n default:\n console.log(msg);\n break;\n }\n this.setState({messages: [{msg: msg.toString(), className}, ...this.state.messages]});\n setTimeout(() => {\n this.setState({messages: this.state.messages.slice(0, this.state.messages.length - 1)});\n }, 5000);\n }\n addInfo = (msg) => this.addMsg(msg, 'info');\n addError = (msg) => this.addMsg(msg, 'error');\n closeDialog = () => {\n this.setState({dialog: noJSX});\n }\n registerRunnerAPI = (api) => {\n this.runnerAPI = api;\n this.handleStop();\n }\n handleNew = async() => {\n //this.backupManager.clearBackup();\n //window.location.href = window.location.origin; // causes a reload\n window.open('/?newGist=1', '_blank');\n }\n handleRun = async () => {\n this.backupManager.setBackup(JSON.stringify({\n href: window.location.href,\n data: model.getData(),\n gistOwnerId: this.state.gistOwnerId,\n }));\n this.logManager.clear();\n console.clear();\n this.runnerAPI.run(model.getData());\n }\n handleStop = async () => {\n this.runnerAPI.run(model.getBlankData(), true);\n }\n handleSave = async () => {\n this.setState({dialog: this.renderSave});\n }\n handleSettings = () => {\n this.setState({dialog: this.renderSettings});\n }\n handleFullscreen = () => {\n this.setState({fullscreen: !this.state.fullscreen});\n }\n handleHelp = () => {\n this.setState({dialog: this.renderHelp});\n }\n handleLoad = () => {\n this.setState({dialog: this.renderLoad});\n }\n handleOnLoad = async() => {\n this.setState({dialog: noJSX});\n this.handleRun();\n }\n handleOnSave = (gistId) => {\n window.history.pushState({}, '', `${window.location.origin}?src=${gistId}`);\n this.setState({\n gistId,\n gistOwnerId: this.userManager.getUserData().id,\n });\n }\n handleAbort = () => {\n this.abort();\n };\n renderHelp = () => {\n return (\n \n
\n {/*\n \n
\n {\n !loading &&\n \n
\n \n
\n \n model.setName(v)} />\n {!!userData.name && }\n {!!userData.avatarURL && 
}\n
\n \n
\n \n
\n }\n \n {\n this.state.messages.map(({msg, className}, i) => (
\n \n \n );\n }\n}\n\nexport default App;\n","const backupKey = 'backup';\r\n\r\nexport default class BackupManager {\r\n #storageManager;\r\n\r\n constructor(storageManager) {\r\n this.#storageManager = storageManager;\r\n }\r\n getBackup() {\r\n return this.#storageManager.get(backupKey);\r\n }\r\n setBackup(data) {\r\n this.#storageManager.set(backupKey, data);\r\n }\r\n clearBackup() {\r\n this.#storageManager.delete(backupKey);\r\n }\r\n}","\nimport {clientId} from '../globals.js';\nimport {createURL} from './url.js';\nimport {createPopup} from './utils';\nimport StorageManager from './StorageManager';\nimport * as winMsgMgr from './WindowMessageManager';\n\nconst patKey = 'pat';\n\nconst getTokenURL = process.env.REACT_APP_OAUTH_HELPER_URL;\nif (!getTokenURL) {\n throw Error ('must set environment variable: OAUTH_HELPER_URL');\n}\n\nexport default class OAuthManager {\n private _popup?: Window;\n private _state?: string;\n private _storageManager: StorageManager;\n\n constructor(storageManager: StorageManager) {\n this._popup = undefined;\n this._state = undefined; // last state sent to auth\n this._storageManager = storageManager;\n winMsgMgr.on('auth', null, (data: any) => {\n this._closePopup();\n if (data.state === this._state) {\n this.requestToken(data);\n }\n });\n }\n // TODO: rename this and decide if Github should be connected\n pat() {\n return this._storageManager.get(patKey);\n }\n subscribe(fn: () => void) {\n this._storageManager.subscribe(patKey, fn);\n }\n unsubscribe(fn: () => void) {\n this._storageManager.unsubscribe(patKey, fn);\n }\n _closePopup() {\n if (this._popup) {\n this._popup.close();\n this._popup = undefined;\n }\n }\n requestToken = async (auth: any) => {\n try {\n const params = {\n client: clientId,\n code: auth.code,\n };\n const url = createURL(getTokenURL, params);\n const req = await fetch(url);\n const data = await req.json();\n if (!data.access_token) {\n throw new Error(JSON.stringify(data));\n }\n this._storageManager.set(patKey, data.access_token);\n } catch (e) {\n console.error(e);\n }\n }\n logout = () => {\n this._storageManager.delete(patKey);\n }\n login = () => {\n this._closePopup();\n this._state = `${Date.now()}-${Math.random()}`; // does this need to special? Seems like no\n const url = createURL('https://github.com/login/oauth/authorize', {\n client_id: clientId,\n scope: 'gist',\n state: this._state,\n });\n this._popup = createPopup(url);\n }\n}","// This optional code is used to register a service worker.\n// register() is not called by default.\n\n// This lets the app load faster on subsequent visits in production, and gives\n// it offline capabilities. However, it also means that developers (and users)\n// will only see deployed updates on subsequent visits to a page, after all the\n// existing tabs open on the page have been closed, since previously cached\n// resources are updated in the background.\n\n// To learn more about the benefits of this model and instructions on how to\n// opt-in, read https://bit.ly/CRA-PWA\n\nconst isLocalhost = Boolean(\n window.location.hostname === 'localhost' ||\n // [::1] is the IPv6 localhost address.\n window.location.hostname === '[::1]' ||\n // 127.0.0.0/8 are considered localhost for IPv4.\n window.location.hostname.match(\n /^127(?:\\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/\n )\n);\n\nexport function register(config) {\n if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {\n // The URL constructor is available in all browsers that support SW.\n const publicUrl = new URL(process.env.PUBLIC_URL, window.location.href);\n if (publicUrl.origin !== window.location.origin) {\n // Our service worker won't work if PUBLIC_URL is on a different origin\n // from what our page is served on. This might happen if a CDN is used to\n // serve assets; see https://github.com/facebook/create-react-app/issues/2374\n return;\n }\n\n window.addEventListener('load', () => {\n const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;\n\n if (isLocalhost) {\n // This is running on localhost. Let's check if a service worker still exists or not.\n checkValidServiceWorker(swUrl, config);\n\n // Add some additional logging to localhost, pointing developers to the\n // service worker/PWA documentation.\n navigator.serviceWorker.ready.then(() => {\n console.log(\n 'This web app is being served cache-first by a service ' +\n 'worker. To learn more, visit https://bit.ly/CRA-PWA'\n );\n });\n } else {\n // Is not localhost. Just register service worker\n registerValidSW(swUrl, config);\n }\n });\n }\n}\n\nfunction registerValidSW(swUrl, config) {\n navigator.serviceWorker\n .register(swUrl)\n .then(registration => {\n registration.onupdatefound = () => {\n const installingWorker = registration.installing;\n if (installingWorker == null) {\n return;\n }\n installingWorker.onstatechange = () => {\n if (installingWorker.state === 'installed') {\n if (navigator.serviceWorker.controller) {\n // At this point, the updated precached content has been fetched,\n // but the previous service worker will still serve the older\n // content until all client tabs are closed.\n console.log(\n 'New content is available and will be used when all ' +\n 'tabs for this page are closed. See https://bit.ly/CRA-PWA.'\n );\n\n // Execute callback\n if (config && config.onUpdate) {\n config.onUpdate(registration);\n }\n } else {\n // At this point, everything has been precached.\n // It's the perfect time to display a\n // \"Content is cached for offline use.\" message.\n console.log('Content is cached for offline use.');\n\n // Execute callback\n if (config && config.onSuccess) {\n config.onSuccess(registration);\n }\n }\n }\n };\n };\n })\n .catch(error => {\n console.error('Error during service worker registration:', error);\n });\n}\n\nfunction checkValidServiceWorker(swUrl, config) {\n // Check if the service worker can be found. If it can't reload the page.\n fetch(swUrl, {\n headers: { 'Service-Worker': 'script' },\n })\n .then(response => {\n // Ensure service worker exists, and that we really are getting a JS file.\n const contentType = response.headers.get('content-type');\n if (\n response.status === 404 ||\n (contentType != null && contentType.indexOf('javascript') === -1)\n ) {\n // No service worker found. Probably a different app. Reload the page.\n navigator.serviceWorker.ready.then(registration => {\n registration.unregister().then(() => {\n window.location.reload();\n });\n });\n } else {\n // Service worker found. Proceed as normal.\n registerValidSW(swUrl, config);\n }\n })\n .catch(() => {\n console.log(\n 'No internet connection found. App is running in offline mode.'\n );\n });\n}\n\nexport function unregister() {\n if ('serviceWorker' in navigator) {\n navigator.serviceWorker.ready\n .then(registration => {\n registration.unregister();\n })\n .catch(error => {\n console.error(error.message);\n });\n }\n}\n","import React from 'react';\nimport ReactDOM from 'react-dom';\nimport {storageManager} from './globals.js';\nimport './index.css';\nimport './scrollbars.js';\nimport App from './components/App';\nimport BackupManager from './components/BackupManager.js';\nimport OAuthManager from './libs/OAuthManager';\nimport * as serviceWorker from './serviceWorker';\n\nconst oauthManager = new OAuthManager(storageManager);\nconst backupManager = new BackupManager(storageManager);\n\nReactDOM.render(\n {msg}
))\n }\n \n \n \n
\n );\n }\n}","import React from 'react';\nimport {classNames} from '../libs/css-utils.js';\nimport * as gists from '../libs/gists.js';\nimport ServiceContext from '../ServiceContext.js';\n\nexport default class SaveAsGist extends React.Component {\n constructor () {\n super();\n this.state = {\n saving: false,\n secret: false,\n };\n }\n componentDidMount() {\n const {userManager} = this.context;\n userManager.subscribe(this.onPatChange);\n }\n componentWillUnmount() {\n const {userManager} = this.context;\n userManager.unsubscribe(this.onPatChange);\n }\n onPatChange = () => {\n this.forceUpdate();\n }\n toggleSecret = () => {\n this.setState({secret: !this.state.secret});\n }\n saveNew = async() => {\n const {github, addError} = this.context;\n const {secret} = this.state;\n this.setState({saving: true});\n const {data, onSave, onClose} = this.props;\n let success = false;\n try {\n const {id, name, date, public: _public} = await github.createGist(data, secret);\n gists.addGist(id, name, date, _public);\n onSave(id);\n success = true;\n } catch (e) {\n addError(`could not create gist: ${e}`)\n }\n this.setState({saving: false});\n if (success) {\n onClose();\n }\n }\n saveOverExisting = async() => {\n const {github, addError} = this.context;\n this.setState({saving: true});\n const {data, gistId, onClose} = this.props;\n let success = false;\n try {\n const {id, name, date, public: _public} = await github.updateGist(gistId, data);\n gists.addGist(id, name, date, _public);\n success = true;\n } catch (e) {\n addError(`could not update gist: ${e}`)\n }\n this.setState({saving: false});\n if (success) {\n onClose();\n }\n }\n forkAndSave = async() => {\n const {github, addError} = this.context;\n const {data, gistId, onSave, onClose} = this.props;\n const {secret} = this.state;\n this.setState({saving: true});\n let success = false;\n try {\n const {id: newId} = await github.forkGist(gistId, secret);\n const {id, name, date, public: _public} = await github.updateGist(newId, data);\n gists.addGist(id, name, date, _public);\n onSave(id);\n success = true\n } catch (e) {\n addError(`could not fork and update gist: ${e}`);\n }\n this.setState({saving: false});\n if (success) {\n onClose();\n }\n }\n renderLogin() {\n const {userManager} = this.context;\n return (\n StackOverflow Snippet (copy the code below paste into S.O.)
\n\n
\n this.onChange(true)}/>
\n this.onChange(false)}/>
\n S.O. does not support es6 modules yet so picking \"As Module\" puts the code in a <script> in the HTML area.
\n\n
\n {makeSnippet(data, asModule)}\n \n \n
\n HTML (copy the code below paste into a file)
\n\n
\n this.onChange(true)}/>
\n this.onChange(false)}/>
\n \n
\n {makeHTML(data, asModule)}\n \n \n \n
\n \n Login with github\n
\n );\n }\n renderSave() {\n const {saving, secret} = this.state;\n const {userManager} = this.context;\n const userData = userManager.getUserData();\n const {gistId, gistOwnerId} = this.props;\n const canUpdate = userData && gistId && userData.id === gistOwnerId;\n const canFork = userData && gistId && userData.id !== gistOwnerId;\n return (\n \n
\n );\n }\n render() {\n const {userManager} = this.context;\n const userData = userManager.getUserData();\n return userData ? this.renderSave() : this.renderLogin();\n }\n}\n\nSaveAsGist.contextType = ServiceContext;","import React from 'react';\n\nexport default function SaveAsJSON(props) {\n const {data} = props;\n return (\n \n Save to New Gist\n Update Current Gist\n Fork and Save Gist\n
\n \n
\n
\n \n
Warning:\n\n\n
\n (see docs)\n- You can not change a gist from public to secret
\n- Secret gists are still publicly accessible they're just unlisted
\n
\n
\n );\n}","import React from 'react';\n\nimport {jsonToCompressedBase64} from '../libs/compression.js';\n\nexport default function SaveAsURL(props) {\n const {data} = props;\n const src = jsonToCompressedBase64(data);\n const url = `${window.location.origin}?src=${encodeURIComponent(src)}`;\n return url.length < 8000\n ? (\n \n Copy the text below, paste into the load ui or put somewhere on the net\n and make your own URL with
\n {window.location.origin}?src=url-to-json.\n {JSON.stringify(data)}\n \n \n
\n )\n : (\n Copy / bookmark the link below
\n {url}\n \n Too large to save as URL\n
\n )\n ;\n}\n","import React from 'react';\nimport Dialog from './Dialog.js';\nimport Embed from './Embed.js';\nimport Export from './Export.js';\nimport SaveAsGist from './SaveAsGist.js';\nimport SaveAsJSON from './SaveAsJSON.js';\nimport SaveAsURL from './SaveAsURL.js';\nimport Section from './Section.js';\n\nexport default function Save(props) {\n const {data, gistId, gistOwnerId, onSave, onClose} = props;\n return (\n \n )\n}\n","import React from 'react';\n\nimport Dialog from './Dialog.js';\nimport Section from './Section.js';\nimport ServiceContext from '../ServiceContext.js';\n\nimport verticalIcon from '../icons/vertical-layout.svg';\nimport horizontalIcon from '../icons/horizontal-layout.svg';\nimport twoByTwoIcon from '../icons/two-by-two-layout.svg';\nimport tabbedIcon from '../icons/tabbed-layout.svg';\n\nimport {classNames} from '../libs/css-utils.js';\nimport * as uiModel from '../libs/ui-model.js';\n\nfunction RadioOption(props) {\n const {children, onChange, selected} = props;\n return (\n \n {children}\n
\n );\n}\n\nfunction Radio(props) {\n const {selected, onChange, children} = props;\n\n const newChildren = React.Children.map(children, (child) => {\n if (!React.isValidElement(child)) {\n return null;\n }\n\n const {result} = child.props;\n const isSelected = result === selected;\n\n //const id = childNdx;\n //childNdx += 1;\n return React.cloneElement(child, {\n //...child.props,\n selected: isSelected,\n onChange: () => onChange(result),\n });\n });\n\n return (\n \n {newChildren}\n
\n );\n}\n\nfunction Checkbox(props) {\n const {id, label, checked, onChange} = props;\n const elemId = `checkbox-${id}`;\n return (\n \n onChange(e.target.checked)}\n />\n \n
\n );\n}\n\nclass Logout extends React.Component {\n componentDidMount() {\n const {userManager} = this.context;\n userManager.subscribe(this.handleChange);\n }\n componentWillUnmount() {\n const {userManager} = this.context;\n userManager.unsubscribe(this.handleChange);\n }\n handleChange = () => {\n this.forceUpdate();\n }\n handleLogout = () => {\n const {userManager} = this.context;\n userManager.logout();\n }\n render() {\n const {userManager} = this.context;\n const userData = userManager.getUserData();\n return (!!userData &&\n Logged in as: \n {!!userData.login && }\n {!!userData.avatar_url && }\n
\n \n \n \n \n \n \n \n \n \n \n
\n );\n}","import SubscriptionManager from './SubscriptionManager.ts';\n\nconst kUserManagerKey = 'foobar'; // not important\n\nexport default class UserManager {\n constructor({\n oauthManager,\n github,\n addError,\n }) {\n this.oauthManager = oauthManager;\n this.github = github;\n this.subscriptionManager = new SubscriptionManager();\n this.addError = addError;\n oauthManager.subscribe(this._handleNewAuth);\n this._handleNewAuth();\n this.userData = undefined;\n }\n /*\n {\n \"login\": \"greggman\",\n \"id\": 234804,\n \"node_id\": \"MDQ6VXNlcjIzNDgwNA==\",\n \"avatar_url\": \"https://avatars2.githubusercontent.com/u/234804?v=4\",\n \"gravatar_id\": \"\",\n \"url\": \"https://api.github.com/users/greggman\",\n \"html_url\": \"https://github.com/greggman\",\n \"followers_url\": \"https://api.github.com/users/greggman/followers\",\n \"following_url\": \"https://api.github.com/users/greggman/following{/other_user}\",\n \"gists_url\": \"https://api.github.com/users/greggman/gists{/gist_id}\",\n \"starred_url\": \"https://api.github.com/users/greggman/starred{/owner}{/repo}\",\n \"subscriptions_url\": \"https://api.github.com/users/greggman/subscriptions\",\n \"organizations_url\": \"https://api.github.com/users/greggman/orgs\",\n \"repos_url\": \"https://api.github.com/users/greggman/repos\",\n \"events_url\": \"https://api.github.com/users/greggman/events{/privacy}\",\n \"received_events_url\": \"https://api.github.com/users/greggman/received_events\",\n \"type\": \"User\",\n \"site_admin\": false,\n \"name\": \"Greggman\",\n \"company\": null,\n \"blog\": \"http://games.greggman.com\",\n \"location\": \"Earth\",\n \"email\": \"github@greggman.com\",\n \"hireable\": null,\n \"bio\": \"30 years of games\\r\\n5 years of Chrome\",\n \"twitter_username\": null,\n \"public_repos\": 283,\n \"public_gists\": 80,\n \"followers\": 1037,\n \"following\": 3,\n \"created_at\": \"2010-04-01T08:48:05Z\",\n \"updated_at\": \"2020-10-24T06:05:24Z\"\n }\n */\n getUserData() {\n return this.userData;\n }\n _handleNewAuth = async() => {\n this.userData = undefined;\n const pat = this.oauthManager.pat();\n this.github.setPat(pat);\n if (pat) {\n try {\n const data = await this.github.getAuthenticatedUser();\n this.userData = data;\n } catch (e) {\n this.addError(e);\n }\n }\n this.subscriptionManager.notify(kUserManagerKey);\n }\n login = () => {\n this.oauthManager.login();\n }\n logout = () => {\n this.oauthManager.logout();\n this.github.setPat()\n }\n subscribe(fn) {\n this.subscriptionManager.subscribe(kUserManagerKey, fn);\n }\n unsubscribe(fn) {\n this.subscriptionManager.unsubscribe(kUserManagerKey, fn);\n }\n cleanup() {\n this.oauthManager.unsubscribe(this._handleNewAuth);\n }\n}\n\n","import React from 'react';\n\nimport EditLine from './EditLine.js';\n// import Footer from './Footer.js';\nimport {storageManager} from '../globals.js';\nimport GitHub from '../libs/GitHub.js';\nimport Head from './Head.js';\nimport Help from './Help.js';\nimport IDE from './IDE.js';\nimport Load from './Load.js';\nimport {isGistId, loadGistFromSrc} from '../libs/loader.js';\nimport {LogManager} from './Log.js';\nimport * as model from '../libs/model.js';\nimport Save from './Save.js';\nimport ServiceContext from '../ServiceContext.js';\nimport Settings from './Settings.js';\nimport Toolbar from './Toolbar.js';\nimport * as uiModel from '../libs/ui-model.js';\nimport UserManager from '../libs/UserManager.js';\nimport * as winMsgMgr from '../libs/WindowMessageManager';\nimport query from '../libs/start-query.js';\n\nimport './App.css';\nimport { classNames } from '../libs/css-utils.js';\n\nconst noJSX = () => [];\nconst darkMatcher = window.matchMedia('(prefers-color-scheme: dark)');\n\nclass App extends React.Component {\n constructor(props) {\n super();\n this.state = {\n path: window.location.pathname,\n dark: darkMatcher.matches,\n fullscreen: !!query.fullscreen,\n loading: false,\n dialog: noJSX,\n gistId: '',\n messages: [],\n userData: {},\n updateVersion: 0,\n };\n this.github = new GitHub();\n this.oauthManager = props.oauthManager;\n this.backupManager = props.backupManager;\n this.logManager = new LogManager();\n this.userManager = new UserManager({\n oauthManager: this.oauthManager,\n github: this.github,\n addError: this.addError,\n });\n this.toolbarFns = {\n handleRun: this.handleRun,\n handleStop: this.handleStop,\n handleSave: this.handleSave,\n handleNew: this.handleNew,\n handleLoad: this.handleLoad,\n handleSettings: this.handleSettings,\n handleFullscreen: this.handleFullscreen,\n handleHelp: this.handleHelp,\n };\n }\n componentWillUnmount() {\n uiModel.unsubscribe(this.handleUIChange);\n this.userManager.cleanup();\n }\n componentDidMount() {\n uiModel.subscribe(this.handleUIChange);\n winMsgMgr.on('newGist', null, this.handleNewGist);\n this.github.addEventListener('userdata', (e) => {\n this.setState({\n userData: e.data,\n });\n });\n model.add('path', window.location.pathname);\n model.subscribe('path', (newValue) => {\n window.history.pushState({}, '', newValue);\n this.setState({\n path: newValue,\n });\n });\n // I still am not sure how I'm supposed to handle this.\n // Putting my model in the state itself seems wrong\n // and doesn't actually help since I'd have to \n // generate an entirely new state object to change any\n // nested property.\n //\n // Storing the data outside I see no way to tell\n // components to re-render except to call forceUpdate\n // which all the documentation says \"if you call this\n // you're doing it wrong\".\n //\n // Redux is a joke. 50 lines code needed to set\n // a single field. Repeat those 50 lines for every field.\n // Things like redux-tools make it less to type those\n // 50 lines but they still execute 50 to 500 lines of code\n // just to set a single value.\n model.subscribe(model.filesVersionKey, _ => {\n this.forceUpdate();\n });\n // this is a hack because I can't figure out how to\n // update the CodeMirror areas\n model.subscribe('updateVersion', _ => {\n this.setState({updateVersion: this.state.updateVersion + 1});\n });\n\n darkMatcher.addEventListener('change', () => {\n this.setState({dark: darkMatcher.matches});\n });\n\n if (query.newGist) {\n window.history.pushState({}, '', `${window.location.origin}`);\n window.opener.postMessage({type: 'gimmeDaCodez'}, '*');\n return;\n }\n\n const backup = this.backupManager.getBackup();\n let loaded = false;\n if (backup) {\n try {\n const data = JSON.parse(backup);\n if (data.href === window.location.href) {\n model.setData(data.data);\n const url = new URL(data.href);\n const {src} = Object.fromEntries(new URLSearchParams(url.search).entries());\n if (isGistId(src)) {\n this.setState({gistId: src, gistOwnerId: data.gistOwnerId});\n }\n loaded = true;\n this.addInfo('loaded backup from local storage')\n }\n } catch (e) {\n console.log('bad backup')\n }\n this.backupManager.clearBackup();\n }\n if (!loaded) {\n if (query.src) {\n this.loadData(query.src);\n }\n }\n this.updateTitle();\n }\n componentDidUpdate() {\n this.updateTitle();\n }\n updateTitle() {\n const data = model.getData();\n document.title = data.name || 'jsGist';\n }\n async loadData(src) {\n this.setState({loading: true});\n let success = true;\n let firstTry = true;\n for (;;) {\n try {\n const {data, id, rawData} = await loadGistFromSrc(src, this.github);\n model.setData(data);\n if (id) {\n this.setState({\n gistId: src,\n gistOwnerId: rawData?.owner?.id,\n });\n }\n break;\n } catch (e) {\n if (firstTry) {\n this.userManager.logout();\n firstTry = false;\n } else {\n success = false;\n console.warn(e);\n this.addError(`could not load jsGist: src=${src} ${e}`);\n break;\n }\n }\n }\n this.setState({loading: false});\n if (success) {\n this.handleRun();\n }\n }\n handleUIChange = () => {\n this.forceUpdate();\n }\n handleNewGist = (data) => {\n let success = true;\n try {\n model.setData(data);\n this.backupManager.clearBackup();\n } catch (e) {\n success = false;\n console.warn(e);\n this.addError(`could create new jsGist: ${e}`);\n }\n if (success) {\n this.handleRun();\n }\n };\n addMsg = (msg, className) => {\n switch (className) {\n case 'error':\n console.error(msg);\n break;\n default:\n console.log(msg);\n break;\n }\n this.setState({messages: [{msg: msg.toString(), className}, ...this.state.messages]});\n setTimeout(() => {\n this.setState({messages: this.state.messages.slice(0, this.state.messages.length - 1)});\n }, 5000);\n }\n addInfo = (msg) => this.addMsg(msg, 'info');\n addError = (msg) => this.addMsg(msg, 'error');\n closeDialog = () => {\n this.setState({dialog: noJSX});\n }\n registerRunnerAPI = (api) => {\n this.runnerAPI = api;\n this.handleStop();\n }\n handleNew = async() => {\n //this.backupManager.clearBackup();\n //window.location.href = window.location.origin; // causes a reload\n window.open('/?newGist=1', '_blank');\n }\n handleRun = async () => {\n this.backupManager.setBackup(JSON.stringify({\n href: window.location.href,\n data: model.getData(),\n gistOwnerId: this.state.gistOwnerId,\n }));\n this.logManager.clear();\n console.clear();\n this.runnerAPI.run(model.getData());\n }\n handleStop = async () => {\n this.runnerAPI.run(model.getBlankData(), true);\n }\n handleSave = async () => {\n this.setState({dialog: this.renderSave});\n }\n handleSettings = () => {\n this.setState({dialog: this.renderSettings});\n }\n handleFullscreen = () => {\n this.setState({fullscreen: !this.state.fullscreen});\n }\n handleHelp = () => {\n this.setState({dialog: this.renderHelp});\n }\n handleLoad = () => {\n this.setState({dialog: this.renderLoad});\n }\n handleOnLoad = async() => {\n this.setState({dialog: noJSX});\n this.handleRun();\n }\n handleOnSave = (gistId) => {\n window.history.pushState({}, '', `${window.location.origin}?src=${gistId}`);\n this.setState({\n gistId,\n gistOwnerId: this.userManager.getUserData().id,\n });\n }\n handleAbort = () => {\n this.abort();\n };\n renderHelp = () => {\n return (\n \n
\n {/*\n \n
\n {\n !loading &&\n \n
\n \n
\n \n model.setName(v)} />\n {!!userData.name && }\n {!!userData.avatarURL && }\n
\n \n
\n \n
\n }\n \n {\n this.state.messages.map(({msg, className}, i) => (
\n \n \n );\n }\n}\n\nexport default App;\n","const backupKey = 'backup';\r\n\r\nexport default class BackupManager {\r\n #storageManager;\r\n\r\n constructor(storageManager) {\r\n this.#storageManager = storageManager;\r\n }\r\n getBackup() {\r\n return this.#storageManager.get(backupKey);\r\n }\r\n setBackup(data) {\r\n this.#storageManager.set(backupKey, data);\r\n }\r\n clearBackup() {\r\n this.#storageManager.delete(backupKey);\r\n }\r\n}","\nimport {clientId} from '../globals.js';\nimport {createURL} from './url.js';\nimport {createPopup} from './utils';\nimport StorageManager from './StorageManager';\nimport * as winMsgMgr from './WindowMessageManager';\n\nconst patKey = 'pat';\n\nconst getTokenURL = process.env.REACT_APP_OAUTH_HELPER_URL;\nif (!getTokenURL) {\n throw Error ('must set environment variable: OAUTH_HELPER_URL');\n}\n\nexport default class OAuthManager {\n private _popup?: Window;\n private _state?: string;\n private _storageManager: StorageManager;\n\n constructor(storageManager: StorageManager) {\n this._popup = undefined;\n this._state = undefined; // last state sent to auth\n this._storageManager = storageManager;\n winMsgMgr.on('auth', null, (data: any) => {\n this._closePopup();\n if (data.state === this._state) {\n this.requestToken(data);\n }\n });\n }\n // TODO: rename this and decide if Github should be connected\n pat() {\n return this._storageManager.get(patKey);\n }\n subscribe(fn: () => void) {\n this._storageManager.subscribe(patKey, fn);\n }\n unsubscribe(fn: () => void) {\n this._storageManager.unsubscribe(patKey, fn);\n }\n _closePopup() {\n if (this._popup) {\n this._popup.close();\n this._popup = undefined;\n }\n }\n requestToken = async (auth: any) => {\n try {\n const params = {\n client: clientId,\n code: auth.code,\n };\n const url = createURL(getTokenURL, params);\n const req = await fetch(url);\n const data = await req.json();\n if (!data.access_token) {\n throw new Error(JSON.stringify(data));\n }\n this._storageManager.set(patKey, data.access_token);\n } catch (e) {\n console.error(e);\n }\n }\n logout = () => {\n this._storageManager.delete(patKey);\n }\n login = () => {\n this._closePopup();\n this._state = `${Date.now()}-${Math.random()}`; // does this need to special? Seems like no\n const url = createURL('https://github.com/login/oauth/authorize', {\n client_id: clientId,\n scope: 'gist',\n state: this._state,\n });\n this._popup = createPopup(url);\n }\n}","// This optional code is used to register a service worker.\n// register() is not called by default.\n\n// This lets the app load faster on subsequent visits in production, and gives\n// it offline capabilities. However, it also means that developers (and users)\n// will only see deployed updates on subsequent visits to a page, after all the\n// existing tabs open on the page have been closed, since previously cached\n// resources are updated in the background.\n\n// To learn more about the benefits of this model and instructions on how to\n// opt-in, read https://bit.ly/CRA-PWA\n\nconst isLocalhost = Boolean(\n window.location.hostname === 'localhost' ||\n // [::1] is the IPv6 localhost address.\n window.location.hostname === '[::1]' ||\n // 127.0.0.0/8 are considered localhost for IPv4.\n window.location.hostname.match(\n /^127(?:\\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/\n )\n);\n\nexport function register(config) {\n if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {\n // The URL constructor is available in all browsers that support SW.\n const publicUrl = new URL(process.env.PUBLIC_URL, window.location.href);\n if (publicUrl.origin !== window.location.origin) {\n // Our service worker won't work if PUBLIC_URL is on a different origin\n // from what our page is served on. This might happen if a CDN is used to\n // serve assets; see https://github.com/facebook/create-react-app/issues/2374\n return;\n }\n\n window.addEventListener('load', () => {\n const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;\n\n if (isLocalhost) {\n // This is running on localhost. Let's check if a service worker still exists or not.\n checkValidServiceWorker(swUrl, config);\n\n // Add some additional logging to localhost, pointing developers to the\n // service worker/PWA documentation.\n navigator.serviceWorker.ready.then(() => {\n console.log(\n 'This web app is being served cache-first by a service ' +\n 'worker. To learn more, visit https://bit.ly/CRA-PWA'\n );\n });\n } else {\n // Is not localhost. Just register service worker\n registerValidSW(swUrl, config);\n }\n });\n }\n}\n\nfunction registerValidSW(swUrl, config) {\n navigator.serviceWorker\n .register(swUrl)\n .then(registration => {\n registration.onupdatefound = () => {\n const installingWorker = registration.installing;\n if (installingWorker == null) {\n return;\n }\n installingWorker.onstatechange = () => {\n if (installingWorker.state === 'installed') {\n if (navigator.serviceWorker.controller) {\n // At this point, the updated precached content has been fetched,\n // but the previous service worker will still serve the older\n // content until all client tabs are closed.\n console.log(\n 'New content is available and will be used when all ' +\n 'tabs for this page are closed. See https://bit.ly/CRA-PWA.'\n );\n\n // Execute callback\n if (config && config.onUpdate) {\n config.onUpdate(registration);\n }\n } else {\n // At this point, everything has been precached.\n // It's the perfect time to display a\n // \"Content is cached for offline use.\" message.\n console.log('Content is cached for offline use.');\n\n // Execute callback\n if (config && config.onSuccess) {\n config.onSuccess(registration);\n }\n }\n }\n };\n };\n })\n .catch(error => {\n console.error('Error during service worker registration:', error);\n });\n}\n\nfunction checkValidServiceWorker(swUrl, config) {\n // Check if the service worker can be found. If it can't reload the page.\n fetch(swUrl, {\n headers: { 'Service-Worker': 'script' },\n })\n .then(response => {\n // Ensure service worker exists, and that we really are getting a JS file.\n const contentType = response.headers.get('content-type');\n if (\n response.status === 404 ||\n (contentType != null && contentType.indexOf('javascript') === -1)\n ) {\n // No service worker found. Probably a different app. Reload the page.\n navigator.serviceWorker.ready.then(registration => {\n registration.unregister().then(() => {\n window.location.reload();\n });\n });\n } else {\n // Service worker found. Proceed as normal.\n registerValidSW(swUrl, config);\n }\n })\n .catch(() => {\n console.log(\n 'No internet connection found. App is running in offline mode.'\n );\n });\n}\n\nexport function unregister() {\n if ('serviceWorker' in navigator) {\n navigator.serviceWorker.ready\n .then(registration => {\n registration.unregister();\n })\n .catch(error => {\n console.error(error.message);\n });\n }\n}\n","import React from 'react';\nimport ReactDOM from 'react-dom';\nimport {storageManager} from './globals.js';\nimport './index.css';\nimport './scrollbars.js';\nimport App from './components/App';\nimport BackupManager from './components/BackupManager.js';\nimport OAuthManager from './libs/OAuthManager';\nimport * as serviceWorker from './serviceWorker';\n\nconst oauthManager = new OAuthManager(storageManager);\nconst backupManager = new BackupManager(storageManager);\n\nReactDOM.render(\n {msg}
))\n }\n