-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy path.eslintcache
1 lines (1 loc) · 65.3 KB
/
.eslintcache
1
[{"C:\\Users\\josh_\\reactapps\\yt-app\\src\\index.js":"1","C:\\Users\\josh_\\reactapps\\yt-app\\src\\App.js":"2","C:\\Users\\josh_\\reactapps\\yt-app\\src\\serviceWorker.js":"3","C:\\Users\\josh_\\reactapps\\yt-app\\src\\app\\store.js":"4","C:\\Users\\josh_\\reactapps\\yt-app\\src\\features\\counter\\Counter.js":"5","C:\\Users\\josh_\\reactapps\\yt-app\\src\\features\\counter\\counterSlice.js":"6","C:\\Users\\josh_\\reactapps\\yt-app\\src\\components\\VidoePlayer.js":"7","C:\\Users\\josh_\\reactapps\\yt-app\\src\\components\\VideoReferencer.js":"8","C:\\Users\\josh_\\reactapps\\yt-app\\src\\utility.js":"9","C:\\Users\\josh_\\reactapps\\yt-app\\src\\components\\VideoSearch.js":"10","C:\\Users\\josh_\\reactapps\\yt-app\\src\\components\\Sidebar.js":"11","C:\\Users\\josh_\\reactapps\\yt-app\\src\\components\\VideoReferences.js":"12","C:\\Users\\josh_\\reactapps\\yt-app\\src\\components\\EditReference.js":"13","C:\\Users\\josh_\\reactapps\\yt-app\\src\\components\\CreateReference.js":"14","C:\\Users\\josh_\\reactapps\\yt-app\\src\\components\\ComponentNavigator.js":"15","C:\\Users\\josh_\\reactapps\\yt-app\\src\\features\\video\\videoSlice.js":"16","C:\\Users\\josh_\\reactapps\\yt-app\\src\\components\\SidebarData.js":"17","C:\\Users\\josh_\\reactapps\\yt-app\\src\\components\\withNavigator.js":"18","C:\\Users\\josh_\\reactapps\\yt-app\\src\\components\\auth\\Login.js":"19","C:\\Users\\josh_\\reactapps\\yt-app\\src\\components\\auth\\Register.js":"20","C:\\Users\\josh_\\reactapps\\yt-app\\src\\components\\auth\\AuthOptions.js":"21","C:\\Users\\josh_\\reactapps\\yt-app\\src\\features\\user\\userSlice.js":"22","C:\\Users\\josh_\\reactapps\\yt-app\\src\\components\\misc\\ErrorNotice.js":"23","C:\\Users\\josh_\\reactapps\\yt-app\\src\\components\\auth\\ProtectedRoute.js":"24","C:\\Users\\josh_\\reactapps\\yt-app\\src\\axios.js":"25","C:\\Users\\josh_\\reactapps\\yt-app\\src\\components\\auth\\ProfileDetails.js":"26","C:\\Users\\josh_\\reactapps\\yt-app\\src\\features\\error\\errorSlice.js":"27","C:\\Users\\josh_\\reactapps\\yt-app\\src\\components\\PlayReference.js":"28","C:\\Users\\josh_\\reactapps\\yt-app\\src\\components\\misc\\VolumeIndicator.js":"29","C:\\Users\\josh_\\reactapps\\yt-app\\src\\components\\CollectionGrouping.js":"30","C:\\Users\\josh_\\reactapps\\yt-app\\src\\features\\collection\\collectionSlice.js":"31","C:\\Users\\josh_\\reactapps\\yt-app\\src\\components\\ManageCollections.js":"32","C:\\Users\\josh_\\reactapps\\yt-app\\src\\components\\misc\\ToggleableColorPicker.js":"33","C:\\Users\\josh_\\reactapps\\yt-app\\src\\components\\CollectionDetail.js":"34","C:\\Users\\josh_\\reactapps\\yt-app\\src\\components\\PlayCollection.js":"35"},{"size":692,"mtime":1607540352299,"results":"36","hashOfConfig":"37"},{"size":2274,"mtime":1610641371464,"results":"38","hashOfConfig":"37"},{"size":5141,"mtime":499162500000,"results":"39","hashOfConfig":"37"},{"size":559,"mtime":1610187464456,"results":"40","hashOfConfig":"37"},{"size":1626,"mtime":499162500000,"results":"41","hashOfConfig":"42"},{"size":1551,"mtime":499162500000,"results":"43","hashOfConfig":"37"},{"size":4253,"mtime":1610994138330,"results":"44","hashOfConfig":"37"},{"size":9766,"mtime":1609977834056,"results":"45","hashOfConfig":"37"},{"size":615,"mtime":1610209751419,"results":"46","hashOfConfig":"37"},{"size":1332,"mtime":1611295867191,"results":"47","hashOfConfig":"37"},{"size":1398,"mtime":1609869447732,"results":"48","hashOfConfig":"37"},{"size":2633,"mtime":1610406188215,"results":"49","hashOfConfig":"37"},{"size":2214,"mtime":1609409512100,"results":"50","hashOfConfig":"37"},{"size":2703,"mtime":1609467079011,"results":"51","hashOfConfig":"37"},{"size":750,"mtime":1609467032105,"results":"52","hashOfConfig":"37"},{"size":4721,"mtime":1610678691643,"results":"53","hashOfConfig":"37"},{"size":554,"mtime":1609093182239,"results":"54","hashOfConfig":"37"},{"size":866,"mtime":1608925364207,"results":"55","hashOfConfig":"37"},{"size":2652,"mtime":1610408308428,"results":"56","hashOfConfig":"37"},{"size":4212,"mtime":1609869325004,"results":"57","hashOfConfig":"37"},{"size":1236,"mtime":1609850520234,"results":"58","hashOfConfig":"37"},{"size":3734,"mtime":1609476966300,"results":"59","hashOfConfig":"37"},{"size":270,"mtime":1609134410128,"results":"60","hashOfConfig":"37"},{"size":548,"mtime":1609463460760,"results":"61","hashOfConfig":"37"},{"size":147,"mtime":1610389985726,"results":"62","hashOfConfig":"37"},{"size":751,"mtime":1609463962730,"results":"63","hashOfConfig":"37"},{"size":697,"mtime":1609458082549,"results":"64","hashOfConfig":"37"},{"size":1086,"mtime":1609779653654,"results":"65","hashOfConfig":"37"},{"size":580,"mtime":1609971674342,"results":"66","hashOfConfig":"37"},{"size":5474,"mtime":1610641772689,"results":"67","hashOfConfig":"37"},{"size":6128,"mtime":1610678576673,"results":"68","hashOfConfig":"37"},{"size":1971,"mtime":1610330003344,"results":"69","hashOfConfig":"37"},{"size":1738,"mtime":1610243880279,"results":"70","hashOfConfig":"37"},{"size":3374,"mtime":1610245429918,"results":"71","hashOfConfig":"37"},{"size":2740,"mtime":1611878670727,"results":"72","hashOfConfig":"37"},{"filePath":"73","messages":"74","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"75"},"1l2lz7a",{"filePath":"76","messages":"77","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":"78","usedDeprecatedRules":"75"},{"filePath":"79","messages":"80","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"75"},{"filePath":"81","messages":"82","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"75"},{"filePath":"83","messages":"84","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"7l24th",{"filePath":"85","messages":"86","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"75"},{"filePath":"87","messages":"88","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":"89","usedDeprecatedRules":"75"},{"filePath":"90","messages":"91","errorCount":0,"warningCount":2,"fixableErrorCount":0,"fixableWarningCount":0,"source":"92","usedDeprecatedRules":"75"},{"filePath":"93","messages":"94","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"75"},{"filePath":"95","messages":"96","errorCount":0,"warningCount":2,"fixableErrorCount":0,"fixableWarningCount":0,"source":"97","usedDeprecatedRules":"75"},{"filePath":"98","messages":"99","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"75"},{"filePath":"100","messages":"101","errorCount":0,"warningCount":2,"fixableErrorCount":0,"fixableWarningCount":0,"source":"102","usedDeprecatedRules":"75"},{"filePath":"103","messages":"104","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"75"},{"filePath":"105","messages":"106","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"75"},{"filePath":"107","messages":"108","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"75"},{"filePath":"109","messages":"110","errorCount":0,"warningCount":2,"fixableErrorCount":0,"fixableWarningCount":0,"source":"111","usedDeprecatedRules":"75"},{"filePath":"112","messages":"113","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"75"},{"filePath":"114","messages":"115","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"75"},{"filePath":"116","messages":"117","errorCount":0,"warningCount":3,"fixableErrorCount":0,"fixableWarningCount":0,"source":"118","usedDeprecatedRules":"75"},{"filePath":"119","messages":"120","errorCount":0,"warningCount":2,"fixableErrorCount":0,"fixableWarningCount":0,"source":"121","usedDeprecatedRules":"75"},{"filePath":"122","messages":"123","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"75"},{"filePath":"124","messages":"125","errorCount":0,"warningCount":2,"fixableErrorCount":0,"fixableWarningCount":0,"source":"126","usedDeprecatedRules":"75"},{"filePath":"127","messages":"128","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"75"},{"filePath":"129","messages":"130","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"75"},{"filePath":"131","messages":"132","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"75"},{"filePath":"133","messages":"134","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":"135","usedDeprecatedRules":"75"},{"filePath":"136","messages":"137","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"75"},{"filePath":"138","messages":"139","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"75"},{"filePath":"140","messages":"141","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"75"},{"filePath":"142","messages":"143","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"75"},{"filePath":"144","messages":"145","errorCount":0,"warningCount":2,"fixableErrorCount":0,"fixableWarningCount":0,"source":"146","usedDeprecatedRules":"75"},{"filePath":"147","messages":"148","errorCount":0,"warningCount":2,"fixableErrorCount":0,"fixableWarningCount":0,"source":"149","usedDeprecatedRules":"75"},{"filePath":"150","messages":"151","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"75"},{"filePath":"152","messages":"153","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"75"},{"filePath":"154","messages":"155","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"C:\\Users\\josh_\\reactapps\\yt-app\\src\\index.js",[],["156","157"],"C:\\Users\\josh_\\reactapps\\yt-app\\src\\App.js",["158"],"import React, { useEffect, useState } from 'react';\r\nimport { useDispatch } from 'react-redux';\r\nimport { HashRouter as Router, Route, Switch } from 'react-router-dom';\r\nimport ProtectedRoute from './components/auth/ProtectedRoute';\r\nimport './App.css';\r\nimport Sidebar from './components/Sidebar';\r\nimport VideoReferences from './components/VideoReferences';\r\nimport EditReference from './components/EditReference';\r\nimport CreateReference from './components/CreateReference';\r\nimport Login from './components/auth/Login';\r\nimport Register from './components/auth/Register';\r\nimport AuthOptions from './components/auth/AuthOptions';\r\nimport { loadUser } from './features/user/userSlice';\r\nimport PlayReference from './components/PlayReference';\r\nimport ManageCollections from './components/ManageCollections';\r\nimport PlayCollection from './components/PlayCollection';\r\nconst App = () => {\r\n\r\n const dispatch = useDispatch();\r\n useEffect(() => {\r\n dispatch(loadUser());\r\n }, [])\r\n\r\n const [sideBarOpen, setSideBarOpen] = useState(false);\r\n const getClasses = () => {\r\n if (sideBarOpen)\r\n return \"App open\";\r\n else \r\n return \"App\"; \r\n }\r\n return (\r\n <Router>\r\n <div className={getClasses()}>\r\n \r\n <Sidebar setSideBarOpen={setSideBarOpen} />\r\n <div className=\"routes\">\r\n <div className=\"inner\">\r\n <Switch>\r\n <ProtectedRoute exact path=\"/\" component={VideoReferences} />\r\n <ProtectedRoute path=\"/edit/:id\" component={EditReference} />\r\n <ProtectedRoute path=\"/create\" component={CreateReference} />\r\n <ProtectedRoute path=\"/play/collection/:id\" component={PlayCollection} />\r\n <ProtectedRoute path=\"/play/:id\" component={PlayReference} />\r\n <ProtectedRoute path=\"/collections\" component={ManageCollections} />\r\n <Route path=\"/login\" component={Login} />\r\n <Route path=\"/register\" component={Register} />\r\n <Route path=\"*\" component={() => \"Page Not Found\"} />\r\n </Switch>\r\n </div>\r\n </div>\r\n <AuthOptions setSideBarOpen={setSideBarOpen}/>\r\n </div>\r\n \r\n </Router>\r\n );\r\n}\r\n\r\nexport default App;\r\n","C:\\Users\\josh_\\reactapps\\yt-app\\src\\serviceWorker.js",[],"C:\\Users\\josh_\\reactapps\\yt-app\\src\\app\\store.js",[],"C:\\Users\\josh_\\reactapps\\yt-app\\src\\features\\counter\\Counter.js",[],"C:\\Users\\josh_\\reactapps\\yt-app\\src\\features\\counter\\counterSlice.js",[],"C:\\Users\\josh_\\reactapps\\yt-app\\src\\components\\VidoePlayer.js",["159"],"import React, { useState, useEffect, useRef } from 'react'\r\nimport Slide from 'rc-slider';\r\nimport 'rc-slider/assets/index.css';\r\nimport { CustomInput, Button } from 'reactstrap';\r\nimport ReactPlayer from 'react-player';\r\nimport { getTime } from '../utility';\r\nimport VolumeIndicator from './misc/VolumeIndicator';\r\nconst { createSliderWithTooltip } = Slide;\r\nconst Slider = createSliderWithTooltip(Slide);\r\n\r\nfunction VideoPlayer({\r\n video,\r\n handleVideoEnd,\r\n nextButtonText,\r\n nextButtonHandler\r\n}) {\r\n const [isPaused, setPaused ] = useState(false);\r\n const [volume, setVolume] = useState(0.5);\r\n const [repeat, setRepeat] = useState(false);\r\n const [value, setValue] = useState(video.startSeconds);\r\n const videoRef = useRef();\r\n\r\n const [videoDuration, setVideoDuration] = useState(60);\r\n\r\n useEffect(() => {\r\n if (videoRef.current){\r\n setVideoDuration(videoRef.current.getDuration());\r\n }\r\n })\r\n \r\n\r\n\r\n const handleVolumeChange = (newvolume) => {\r\n setVolume(newvolume);\r\n \r\n }\r\n const handlePlaying = (e) => { \r\n setPaused(false); \r\n \r\n }\r\n const handlePause = (e) => {\r\n setPaused(true);\r\n \r\n }\r\n const handleEnd = () => {\r\n if (repeat){\r\n if (videoRef.current){\r\n videoRef.current.seekTo(video.startSeconds);\r\n setValue(video.startSeconds);\r\n }\r\n }else{\r\n handleVideoEnd();\r\n }\r\n }\r\n\r\n const handleSliderChange = (newvalue) => {\r\n setValue(newvalue);\r\n if (videoRef.current){\r\n videoRef.current.seekTo(newvalue);\r\n }\r\n }\r\n\r\n const handleProgress = (state) => {\r\n setValue(state.playedSeconds);\r\n }\r\n\r\n return (\r\n <div className=\"player\">\r\n <ReactPlayer\r\n className=\"video\" \r\n url={video.url}\r\n width=\"100%\"\r\n height=\"100%\"\r\n controls={false}\r\n playing={!isPaused}\r\n config={{\r\n youtube: video.endSeconds\r\n ? { playerVars: { start: video.startSeconds, end: video.endSeconds } } \r\n : { playerVars: { start: video.startSeconds } },\r\n }}\r\n onProgress={handleProgress}\r\n volume={volume}\r\n onPlay={handlePlaying}\r\n onPause={handlePause}\r\n onEnded={handleEnd}\r\n ref={videoRef}\r\n />\r\n <div\r\n className=\"track\"\r\n >\r\n <span\r\n className=\"\"\r\n >{getTime(value)}</span>\r\n \r\n <Slider \r\n min={video.startSeconds}\r\n max={video.endSeconds?video.endSeconds:videoDuration}\r\n value={value}\r\n onChange={handleSliderChange}\r\n tipFormatter={val => getTime(val)}\r\n />\r\n </div>\r\n <div \r\n className=\"controls\"\r\n >\r\n <CustomInput \r\n type=\"switch\" \r\n id=\"pauseSwitch\" \r\n label=\"Pause\" \r\n checked={isPaused}\r\n onChange={() => setPaused(!isPaused)}\r\n />\r\n <CustomInput \r\n type=\"switch\" \r\n id=\"repeatSwitch\" \r\n label=\"Repeat after video ends\" \r\n checked={repeat}\r\n onChange={() => setRepeat(!repeat)}\r\n />\r\n <VolumeIndicator \r\n min={0}\r\n max={1}\r\n value={volume}\r\n />\r\n <Slider \r\n className=\"volumeSlider\"\r\n min={0}\r\n max={1}\r\n value={volume}\r\n step={0.1}\r\n onChange={handleVolumeChange}\r\n />\r\n <br />\r\n <Button onClick={nextButtonHandler} outline color=\"secondary\">{nextButtonText}</Button>\r\n </div>\r\n </div>\r\n )\r\n}\r\n\r\nexport default VideoPlayer\r\n","C:\\Users\\josh_\\reactapps\\yt-app\\src\\components\\VideoReferencer.js",["160","161"],"import React, { useState, useEffect, useRef } from 'react'\r\nimport Slider from 'rc-slider';\r\nimport 'rc-slider/assets/index.css';\r\nimport { CustomInput, Form, FormGroup, Label, Input, Col, Button } from 'reactstrap';\r\nimport ReactPlayer from 'react-player';\r\nimport { getTime, clamp } from '../utility'\r\nimport VolumeIndicator from './misc/VolumeIndicator';\r\nconst { createSliderWithTooltip } = Slider;\r\nconst Range = createSliderWithTooltip(Slider.Range);\r\n\r\n\r\n\r\n\r\nfunction VideoReferencer({\r\n video,\r\n setNewReference,\r\n handleVideoEnd,\r\n nextButtonText,\r\n nextButtonHandler\r\n}) {\r\n const [isPaused, setPaused ] = useState(false);\r\n const [volume, setVolume] = useState(0.5);\r\n const [repeat, setRepeat] = useState(false);\r\n const videoRef = useRef();\r\n const [referenceType, setReferenceType] = useState(video.endSeconds?'range':'point');\r\n const [referenceName, setReferenceName] = useState(video.name?video.name:'');\r\n\r\n const [startPoint, setStartPoint] = useState(video.startSeconds ? video.startSeconds : 0);\r\n \r\n const [value, setValue] = useState(startPoint);\r\n const [videoDuration, setVideoDuration] = useState(60);\r\n const [endPoint, setEndPoint] = useState(video.endSeconds ? video.endSeconds : 40);\r\n\r\n useEffect(() => {\r\n if (videoRef.current){\r\n setVideoDuration(videoRef.current.getDuration());\r\n setEndPoint(clamp(endPoint, value, videoRef.current.getDuration()));\r\n }\r\n })\r\n\r\n useEffect(() => {\r\n console.log(\"start seconds\", video.startSeconds);\r\n console.log(\"end seconds\", video.endSeconds);\r\n console.log(\"start point\", startPoint);\r\n console.log(\"end point\", endPoint);\r\n \r\n }, [endPoint])\r\n \r\n \r\n const handleSubmit = (e) => {\r\n e.preventDefault();\r\n if (referenceType === 'point'){\r\n setNewReference(referenceName, Math.floor(startPoint));\r\n }else if (referenceType === 'range'){\r\n setNewReference(referenceName, Math.floor(startPoint), Math.floor(endPoint));\r\n }else{\r\n return;\r\n }\r\n nextButtonHandler();\r\n }\r\n \r\n\r\n const handleVolumeChange = (newvolume) => {\r\n setVolume(newvolume);\r\n \r\n }\r\n const handlePlaying = (e) => { \r\n setPaused(false); \r\n \r\n }\r\n const handlePause = (e) => {\r\n setPaused(true);\r\n \r\n }\r\n\r\n const handleReady = () => {\r\n if (videoRef.current){\r\n videoRef.current.seekTo(startPoint);\r\n setValue(startPoint);\r\n }\r\n if (video.endSeconds){\r\n setEndPoint(video.endSeconds);\r\n }\r\n }\r\n \r\n const handleEnd = () => {\r\n if (repeat){\r\n if (videoRef.current){\r\n videoRef.current.seekTo(startPoint);\r\n setValue(startPoint);\r\n }\r\n }else{\r\n handleVideoEnd();\r\n }\r\n }\r\n\r\n const handleSliderChange = (newvalue) => {\r\n if (newvalue[0]){\r\n setStartPoint(newvalue[0]);\r\n }\r\n if (newvalue[1]){\r\n setValue(newvalue[1]);\r\n }\r\n if (newvalue[2]){\r\n setEndPoint(newvalue[2]);\r\n }\r\n console.log(newvalue)\r\n if (videoRef.current){\r\n videoRef.current.seekTo(newvalue[1]);\r\n }\r\n //setPaused(false);\r\n }\r\n\r\n const handleProgress = (state) => {\r\n setValue(state.playedSeconds);\r\n\r\n // the range input doesn't support overlapping of handles (so endpoint - 1)\r\n if (referenceType === 'range' && state.playedSeconds >= endPoint - 1){ \r\n if (videoRef.current){\r\n setPaused(true);\r\n }\r\n }\r\n }\r\n\r\n const handleTypeChange = (e) => {\r\n setReferenceType(e.target.value);\r\n if (e.target.value === 'range'){\r\n setEndPoint(value + videoDuration / 10); // endPoint is clamped above\r\n }\r\n }\r\n\r\n return (\r\n\r\n <div className=\"player\">\r\n <ReactPlayer\r\n className=\"video\" \r\n url={video.url}\r\n width=\"100%\"\r\n height=\"100%\"\r\n controls={false}\r\n playing={!isPaused}\r\n onProgress={handleProgress}\r\n volume={volume}\r\n onPlay={handlePlaying}\r\n onPause={handlePause}\r\n onEnded={handleEnd}\r\n onReady={handleReady}\r\n ref={videoRef}\r\n />\r\n <div\r\n className=\"track\"\r\n >\r\n <span\r\n className=\"\"\r\n >{getTime(value)}</span>\r\n {' '} | {' '}\r\n <span\r\n className=\"\"\r\n >{referenceName}</span>\r\n <Range\r\n min={0}\r\n max={videoDuration}\r\n value={(referenceType==='range')?[startPoint, value, endPoint]:[startPoint, value]}\r\n onChange={handleSliderChange}\r\n count={(referenceType==='range')?3:2}\r\n pushable={true}\r\n allowCross={true}\r\n tipFormatter={val => getTime(val)}\r\n handleStyle={[{}, {backgroundColor: 'paleturquoise'}]}\r\n \r\n />\r\n </div>\r\n <div \r\n className=\"controls\"\r\n >\r\n <Form\r\n onSubmit={handleSubmit}\r\n >\r\n <CustomInput \r\n type=\"switch\" \r\n id=\"pauseSwitchReferencer\"\r\n label=\"Pause\" \r\n checked={isPaused}\r\n onChange={() => setPaused(!isPaused)}\r\n />\r\n <CustomInput \r\n type=\"switch\" \r\n label=\"Repeat after video ends\"\r\n id=\"repeatSwitchReferencer\" \r\n checked={repeat}\r\n onChange={() => setRepeat(!repeat)}\r\n />\r\n <FormGroup check>\r\n <VolumeIndicator \r\n min={0}\r\n max={1}\r\n value={volume}\r\n />\r\n <Slider \r\n className=\"volumeSlider\"\r\n min={0}\r\n max={1}\r\n value={volume}\r\n step={0.1}\r\n onChange={handleVolumeChange}\r\n />\r\n </FormGroup>\r\n <br />\r\n <FormGroup check>\r\n <Label check>\r\n <Input onChange={handleTypeChange} value=\"point\" checked={referenceType === 'point'} type=\"radio\" name=\"referenceType\" />{' '}\r\n Reference Point\r\n </Label>\r\n </FormGroup>\r\n <br />\r\n <FormGroup check>\r\n <Label check>\r\n <Input onChange={handleTypeChange} value=\"range\" checked={referenceType === 'range'} type=\"radio\" name=\"referenceType\" />{' '}\r\n Reference Range\r\n </Label>\r\n </FormGroup>\r\n <br />\r\n <FormGroup row>\r\n <Label for=\"referenceName\" sm={2}>Name</Label>\r\n <Col sm={10}>\r\n <Input type=\"text\" name=\"referenceName\" value={referenceName} onChange={(e) => setReferenceName(e.target.value)} id=\"referenceName\" placeholder=\"Enter the reference name here\" required/>\r\n </Col>\r\n </FormGroup>\r\n <FormGroup row style={{ maxWidth: '450px'}}>\r\n <Col sm={2}>\r\n SP: {getTime(startPoint)}\r\n </Col>\r\n <Col style={{ maxWidth: '200px'}} sm={5}>\r\n <Button onClick={() => setStartPoint(value)} outline color=\"secondary\">Set start point to current played point</Button>\r\n </Col>\r\n <Col style={{ maxWidth: '200px'}} sm={5}>\r\n <Button onClick={() => setStartPoint(0)} outline color=\"secondary\">Set start point to beginning</Button>\r\n </Col>\r\n </FormGroup>\r\n {referenceType === 'range' &&\r\n <FormGroup row style={{ maxWidth: '450px'}}>\r\n <Col sm={2}>\r\n EP: {getTime(endPoint)}\r\n </Col>\r\n <Col style={{ maxWidth: '200px'}} sm={5}>\r\n <Button onClick={() => setEndPoint(value)} outline color=\"secondary\">Set end point to current played point</Button>\r\n </Col>\r\n <Col style={{ maxWidth: '200px'}} sm={5}>\r\n <Button onClick={() => setEndPoint(videoDuration)} outline color=\"secondary\">Set end point to end</Button>\r\n </Col>\r\n </FormGroup>\r\n }\r\n\r\n \r\n \r\n <FormGroup check row>\r\n <Col sm={{ size: 5, offset: 2 }}>\r\n <Input type=\"submit\" value={nextButtonText}/>\r\n </Col>\r\n </FormGroup>\r\n </Form>\r\n </div>\r\n </div>\r\n )\r\n}\r\n\r\nexport default VideoReferencer","C:\\Users\\josh_\\reactapps\\yt-app\\src\\utility.js",[],"C:\\Users\\josh_\\reactapps\\yt-app\\src\\components\\VideoSearch.js",["162","163"],"import React, { useState } from 'react';\r\nimport { Button, Input, Label } from 'reactstrap';\r\nimport ErrorNotice from './misc/ErrorNotice';\r\n\r\nfunction VideoSearch({\r\n setNewURL,\r\n goToNextComponent\r\n}) {\r\n\r\n const [url, setURL] = useState('');\r\n const [error, setError] = useState();\r\n\r\n const handleSubmit = e => {\r\n e.preventDefault();\r\n let pattern = /http(?:s?):\\/\\/(?:www\\.)?youtu(?:be\\.com\\/watch\\?v=|\\.be\\/)([\\w\\-\\_]*)(&(amp;)?[\\w\\?=]*)?/i;\r\n let result = pattern.test(url);\r\n if (!result){\r\n setError('The link provided wasn\\'t a valid youtube link');\r\n return;\r\n }\r\n\r\n setNewURL(url);\r\n goToNextComponent();\r\n\r\n }\r\n return (\r\n <div\r\n className=\"d-flex flex-column justify-content-center align-items-center px-2\"\r\n >\r\n <Label for=\"videoSearch\">Enter the url of the video to begin</Label>\r\n <Input className=\"col-sm-5 my-2\" type=\"text\" name=\"videoSearch\" id=\"videoSearch\" value={url} onChange={e => setURL(e.target.value)} />\r\n {error && (<ErrorNotice message={error} clearError={() => setError(undefined)} />)}\r\n <Button className=\"my-2\" onClick={handleSubmit}>Search</Button>\r\n </div>\r\n )\r\n}\r\n\r\nexport default VideoSearch\r\n","C:\\Users\\josh_\\reactapps\\yt-app\\src\\components\\Sidebar.js",[],"C:\\Users\\josh_\\reactapps\\yt-app\\src\\components\\VideoReferences.js",["164","165"],"import React, { useEffect } from 'react';\r\nimport { useSelector, useDispatch } from 'react-redux';\r\nimport { Spinner } from 'reactstrap';\r\nimport { DragDropContext } from 'react-beautiful-dnd';\r\n\r\n\r\nimport {\r\n\r\n selectVideoData,\r\n getAllUserVideosAsync,\r\n\r\n} from '../features/video/videoSlice'\r\nimport CollectionGrouping from './CollectionGrouping';\r\nimport { \r\n selectCollectionData, \r\n getAllUserCollectionsFullAsync,\r\n moveVideoAsync,\r\n \r\n} from '../features/collection/collectionSlice';\r\nfunction VideoReferences() {\r\n const { isLoading: isVideoLoading, videos } = useSelector(selectVideoData);\r\n const { isLoading: isCollectionLoading, collections } = useSelector(selectCollectionData);\r\n const dispatch = useDispatch();\r\n\r\n\r\n useEffect(() => {\r\n dispatch(getAllUserVideosAsync());\r\n dispatch(getAllUserCollectionsFullAsync());\r\n }, [])\r\n\r\n const handleDragEnd = (param) => {\r\n //console.log(param);\r\n const { source, destination, draggableId } = param;\r\n if (!destination){\r\n return;\r\n }\r\n let { droppableId: fromCollection, index: fromIndex } = source;\r\n let { droppableId: toCollection, index: toIndex } = destination;\r\n\r\n if (fromCollection === 'null'){\r\n fromCollection = null;\r\n } \r\n if (toCollection === 'null'){\r\n toCollection = null;\r\n }\r\n let payload = {\r\n fromCollection,\r\n fromIndex,\r\n toCollection,\r\n toIndex\r\n }\r\n\r\n //console.log(fromCollection, toCollection, draggableId);\r\n\r\n dispatch(moveVideoAsync(draggableId, payload));\r\n\r\n // payload = {\r\n // ...payload,\r\n // videoId: draggableId\r\n // }\r\n // dispatch(moveVideo(payload));\r\n // dispatch(moveVideoInCollection(payload));\r\n }\r\n\r\n return (\r\n <div className=\"text-center\">\r\n <h2>Video References</h2>\r\n <DragDropContext\r\n onDragEnd={handleDragEnd}\r\n >\r\n {collections.map(collection => (\r\n (collection.videos &&\r\n <CollectionGrouping \r\n key={collection.id}\r\n collection={collection}\r\n videos={collection.videos}\r\n //videosConfirm={videos.filter(vid => vid.collectionId === collection.id)}\r\n />)\r\n ))}\r\n </DragDropContext>\r\n {(isCollectionLoading || isVideoLoading) && <Spinner color=\"secondary\" />}\r\n </div>\r\n )\r\n}\r\n\r\nexport default VideoReferences\r\n","C:\\Users\\josh_\\reactapps\\yt-app\\src\\components\\EditReference.js",[],"C:\\Users\\josh_\\reactapps\\yt-app\\src\\components\\CreateReference.js",[],"C:\\Users\\josh_\\reactapps\\yt-app\\src\\components\\ComponentNavigator.js",[],"C:\\Users\\josh_\\reactapps\\yt-app\\src\\features\\video\\videoSlice.js",["166","167"],"import { createSlice } from '@reduxjs/toolkit';\r\nimport axios from '../../axios';\r\nimport { getTokenFromUserReducer } from '../user/userSlice';\r\nimport { getErrors } from '../error/errorSlice';\r\nimport { deleteVideoInCollection } from '../collection/collectionSlice';\r\nexport const videoSlice = createSlice({\r\n name: 'video',\r\n initialState: {\r\n videos: [],\r\n isLoading: false,\r\n },\r\n reducers: {\r\n add: (state, action) => {\r\n state.videos.push(action.payload);\r\n },\r\n replaceAllVideos: (state, action) => {\r\n state.videos = action.payload;\r\n state.isLoading = false;\r\n },\r\n removeVideo: (state, action) => {\r\n state.videos = state.videos.filter(vid => vid.id !== action.payload.id);\r\n },\r\n editVideo: (state, action) => {\r\n state.videos = state.videos.map(vid => {\r\n if (vid.id === action.payload.id)\r\n return action.payload;\r\n else\r\n return vid;\r\n });\r\n },\r\n startLoading: state => {\r\n state.isLoading = true;\r\n },\r\n stopLoading: state => {\r\n state.isLoading = false;\r\n },\r\n moveVideo: (state, { payload }) => {\r\n const { fromCollection, fromIndex, toCollection, toIndex, videoId } = payload;\r\n const indexInUnalteredState = state.videos.findIndex(video => video.id === videoId);\r\n if (indexInUnalteredState > -1){\r\n state.videos[indexInUnalteredState].collectionId = toCollection;\r\n \r\n const videosInToCollection = state.videos.filter(video => video.collectionId === toCollection);\r\n const videosNotInToCollection = state.videos.filter(video => video.collectionId !== toCollection);\r\n //newCourses[params.termI].splice(params.courseI, 0, newCourses[currentItem.termI].splice(currentItem.courseI, 1)[0]);\r\n const index = videosInToCollection.findIndex(video => video.id === videoId);\r\n\r\n videosInToCollection.splice(toIndex, 0, videosInToCollection.splice(index, 1)[0]);\r\n state.videos = [...videosInToCollection, ...videosNotInToCollection];\r\n }\r\n }\r\n },\r\n });\r\n\r\n\r\n export const { add, replaceAllVideos, removeVideo, editVideo, startLoading, stopLoading, moveVideo } = videoSlice.actions;\r\n\r\n const headers = (token) => ({\r\n headers: {\"x-auth-token\": token }\r\n })\r\n\r\n export const addVideoAsync = video => async (dispatch, getState) => {\r\n try{\r\n const savedVideo = await axios.post(\r\n '/videos/add',\r\n video,\r\n headers(getTokenFromUserReducer(getState))\r\n ); \r\n dispatch(add(savedVideo.data));\r\n }catch (err) {\r\n console.log(err);\r\n if(err.response){\r\n dispatch(getErrors({\r\n msg: err.response.data,\r\n status: err.response.status,\r\n id: null\r\n }));\r\n }\r\n }\r\n }\r\n\r\n export const getAllUserVideosAsync = () => async (dispatch, getState) => {\r\n try{\r\n dispatch(startLoading());\r\n const userVideos = await axios.get(\r\n '/videos/uservideos',\r\n headers(getTokenFromUserReducer(getState))\r\n ); \r\n dispatch(replaceAllVideos(userVideos.data));\r\n }catch (err) {\r\n console.log(err);\r\n dispatch(stopLoading());\r\n if(err.response){\r\n dispatch(getErrors({\r\n msg: err.response.data,\r\n status: err.response.status,\r\n id: null\r\n }));\r\n }\r\n }\r\n }\r\n\r\n export const editVideoAsync = (videoId, editedVideo) => async (dispatch, getState) => {\r\n try{\r\n const updatedVideo = await axios.put(\r\n '/videos/edit/' + videoId,\r\n editedVideo,\r\n headers(getTokenFromUserReducer(getState))\r\n ); \r\n dispatch(editVideo(updatedVideo.data));\r\n }catch (err) {\r\n console.log(err);\r\n if(err.response){\r\n dispatch(getErrors({\r\n msg: err.response.data,\r\n status: err.response.status,\r\n id: null\r\n }));\r\n }\r\n }\r\n }\r\n\r\nexport const deleteVideoAsync = (videoId) => async (dispatch, getState) => {\r\n try{\r\n const updatedVideo = await axios.delete(\r\n '/videos/delete/' + videoId,\r\n headers(getTokenFromUserReducer(getState))\r\n ); \r\n dispatch(removeVideo(updatedVideo.data));\r\n dispatch(deleteVideoInCollection(updatedVideo.data));\r\n }catch (err) {\r\n console.log(err);\r\n if(err.response){\r\n dispatch(getErrors({\r\n msg: err.response.data,\r\n status: err.response.status,\r\n id: null\r\n }));\r\n }\r\n }\r\n}\r\n\r\n export const selectVideos = state => state.video.videos;\r\n export const selectVideoData = state => state.video;\r\n export default videoSlice.reducer;","C:\\Users\\josh_\\reactapps\\yt-app\\src\\components\\SidebarData.js",[],"C:\\Users\\josh_\\reactapps\\yt-app\\src\\components\\withNavigator.js",[],"C:\\Users\\josh_\\reactapps\\yt-app\\src\\components\\auth\\Login.js",["168","169","170"],"import React, { useState, useEffect } from 'react';\r\nimport { useDispatch, useSelector } from 'react-redux';\r\nimport { useHistory } from 'react-router-dom';\r\nimport { Spinner } from 'reactstrap';\r\nimport { login, selectAllUserData } from '../../features/user/userSlice';\r\nimport { selectAllErrorData, clearErrors } from '../../features/error/errorSlice';\r\n\r\nimport ErrorNotice from '../misc/ErrorNotice';\r\nimport AuthOptions from './AuthOptions';\r\nfunction Login() {\r\n const dispatch = useDispatch();\r\n const history = useHistory();\r\n const { isAuthenticated, isLoading } = useSelector(selectAllUserData);\r\n const { msg, status, id} = useSelector(selectAllErrorData);\r\n\r\n // demo account\r\n const [email, setEmail] = useState('test@email.com');\r\n const [password, setPassword] = useState('123456');\r\n const [message, setMessage] = useState('');\r\n\r\n const [error, setError] = useState({\r\n email: '',\r\n password: ''\r\n });\r\n\r\n useEffect(() => {\r\n if(id === 'LOGIN_FAIL'){\r\n setError(msg.errors); \r\n }else{\r\n setError({\r\n email: '',\r\n password: ''\r\n });\r\n }\r\n if(isAuthenticated){\r\n history.push('/');\r\n }\r\n \r\n },[msg, status, id, isAuthenticated]);\r\n\r\n useEffect(() => {\r\n return dispatch(clearErrors());\r\n },[])\r\n const submit = (e) => {\r\n e.preventDefault();\r\n setMessage('');\r\n \r\n \r\n const loginUser = { email, password };\r\n dispatch(login(loginUser));\r\n }\r\n return (\r\n <div className=\"page\">\r\n <h2>Log In</h2>\r\n {isLoading && <Spinner color=\"secondary\" />}\r\n <form className=\"form\" onSubmit={submit}>\r\n <span className=\"error\">{message}</span>\r\n <label htmlFor=\"login-email\">Email</label>\r\n <input id=\"login-email\" type=\"email\" onChange={(e) => setEmail(e.target.value)} value={email} />\r\n {error.email && (<ErrorNotice message={error.email} clearError={() => setError({...error, email: undefined})} />)}\r\n\r\n\r\n <label htmlFor=\"login-password\">Password</label>\r\n <input id=\"login-password\" type=\"password\" onChange={(e) => setPassword(e.target.value)} value={password} />\r\n {error.password && (<ErrorNotice message={error.password} clearError={() => setError({...error, password: undefined})} />)}\r\n\r\n <input type=\"submit\" value=\"Log in\" />\r\n\r\n \r\n </form>\r\n </div>\r\n )\r\n}\r\n\r\nexport default Login\r\n","C:\\Users\\josh_\\reactapps\\yt-app\\src\\components\\auth\\Register.js",["171","172"],"import React, { useState, useEffect } from 'react';\r\nimport { useDispatch, useSelector } from 'react-redux';\r\nimport { useHistory } from 'react-router-dom';\r\nimport { selectAllUserData, register } from '../../features/user/userSlice';\r\nimport { selectAllErrorData, clearErrors } from '../../features/error/errorSlice';\r\nimport ErrorNotice from '../misc/ErrorNotice';\r\nfunction Register() {\r\n const { isAuthenticated } = useSelector(selectAllUserData);\r\n const { msg, status, id} = useSelector(selectAllErrorData);\r\n\r\n const dispatch = useDispatch();\r\n const history = useHistory();\r\n const [email, setEmail] = useState('');\r\n const [password, setPassword] = useState('');\r\n const [passwordConfirm, setPasswordConfirm] = useState('');\r\n const [firstname, setFirstName] = useState('');\r\n const [lastname, setLastName] = useState('');\r\n const [username, setUserName] = useState('');\r\n const [message, setMessage] = useState('');\r\n const [error, setError] = useState({\r\n email: '',\r\n password: '',\r\n firstname: '',\r\n lastname: '',\r\n username: ''\r\n });\r\n\r\n useEffect(() => {\r\n if(id === 'REGISTER_FAIL'){\r\n setError(msg.errors); \r\n }else{\r\n setError({\r\n email: '',\r\n password: '',\r\n firstname: '',\r\n lastname: '',\r\n username: ''\r\n });\r\n }\r\n if(isAuthenticated){\r\n history.push('/');\r\n }\r\n },[msg, status, id, isAuthenticated]);\r\n\r\n useEffect(() => {\r\n return dispatch(clearErrors());\r\n },[])\r\n \r\n const submit = async (e) => {\r\n e.preventDefault();\r\n setMessage('');\r\n \r\n if (password !== passwordConfirm){\r\n setMessage('Passwords do not match');\r\n return;\r\n }\r\n\r\n const newUser = { email, password, firstname, lastname, username};\r\n dispatch(register(newUser))\r\n }\r\n \r\n return (\r\n <div className=\"page\">\r\n <h2>Register</h2>\r\n <form className=\"form\" onSubmit={submit}>\r\n {message && (<ErrorNotice message={message} clearError={() => setMessage(undefined)} />)}\r\n <label htmlFor=\"register-email\">Email</label>\r\n <input id=\"register-email\" type=\"email\" onChange={(e) => setEmail(e.target.value)} value={email} />\r\n {error.email && (<ErrorNotice message={error.email} clearError={() => setError({...error, email: undefined})} />)}\r\n\r\n <label htmlFor=\"register-password\">Password</label>\r\n <input id=\"register-password\" type=\"password\" onChange={(e) => setPassword(e.target.value)} value={password} />\r\n <input type=\"password\" placeholder=\"Reenter password\" onChange={(e) => setPasswordConfirm(e.target.value)} value={passwordConfirm} />\r\n {error.password && (<ErrorNotice message={error.password} clearError={() => setError({...error, password: undefined})} />)}\r\n\r\n <label htmlFor=\"register-firstname\">First Name</label>\r\n <input id=\"register-firstname\" type=\"text\" onChange={(e) => setFirstName(e.target.value)} value={firstname} />\r\n {error.firstname && (<ErrorNotice message={error.firstname} clearError={() => setError({...error, firstname: undefined})} />)}\r\n\r\n <label htmlFor=\"register-lastname\">Last Name</label>\r\n <input id=\"register-lastname\" type=\"text\" onChange={(e) => setLastName(e.target.value)} value={lastname} />\r\n {error.lastname && (<ErrorNotice message={error.lastname} clearError={() => setError({...error, lastname: undefined})} />)}\r\n\r\n <label htmlFor=\"register-username\">Username</label>\r\n <input id=\"register-username\" type=\"text\" onChange={(e) => setUserName(e.target.value)} value={username} />\r\n {error.username && (<ErrorNotice message={error.username} clearError={() => setError({...error, username: undefined})} />)}\r\n\r\n <input type=\"submit\" value=\"Register\" />\r\n\r\n \r\n </form>\r\n </div>\r\n )\r\n}\r\n\r\nexport default Register\r\n","C:\\Users\\josh_\\reactapps\\yt-app\\src\\components\\auth\\AuthOptions.js",[],"C:\\Users\\josh_\\reactapps\\yt-app\\src\\features\\user\\userSlice.js",["173","174"],"import { createSlice } from '@reduxjs/toolkit';\r\nimport axios from '../../axios';\r\nimport { getErrors, clearErrors } from '../error/errorSlice';\r\nfunction loggedIn (state, { payload }){\r\n localStorage.setItem('auth-token', payload.token)\r\n //state = {...state, ...payload};\r\n state.token = payload.token;\r\n state.isAuthenticated = true;\r\n state.isLoading = false;\r\n state.user = payload.user;\r\n}\r\n\r\nfunction loggedOut (state){\r\n localStorage.removeItem('auth-token');\r\n state.token = null;\r\n state.user = null;\r\n state.isAuthenticated = false;\r\n state.isLoading = false;\r\n}\r\n\r\n\r\nexport const userSlice = createSlice({\r\n name: 'user',\r\n initialState: {\r\n userData: {\r\n token: undefined,\r\n user: undefined \r\n },\r\n isAuthenticated: null,\r\n isLoading: false,\r\n user: null,\r\n token: localStorage.getItem('auth-token')\r\n },\r\n reducers: {\r\n changeUser: (state, { payload }) => {\r\n state.userData.token = payload.token;\r\n state.userData.user = payload.user;\r\n },\r\n userLoading: state => {\r\n state.isLoading = true;\r\n },\r\n userLoaded: (state, { payload }) => {\r\n state.isAuthenticated = true;\r\n state.isLoading = false;\r\n state.user = payload;\r\n },\r\n loginSuccess: loggedIn,\r\n registerSuccess: loggedIn,\r\n authError: loggedOut,\r\n loginFail: loggedOut,\r\n logoutSuccess: loggedOut,\r\n registerFail: loggedOut\r\n },\r\n });\r\n\r\n\r\n export const { userLoading, userLoaded, loginSuccess, registerSuccess, authError, loginFail, logoutSuccess, registerFail } = userSlice.actions;\r\n\r\n export const getTokenFromUserReducer = getState => getState().user.token; \r\n\r\n const headers = (token) => ({\r\n headers: {\"x-auth-token\": token }\r\n })\r\n\r\n export const loadUser = () => async (dispatch, getState) => {\r\n try{\r\n dispatch(userLoading());\r\n\r\n const token = getTokenFromUserReducer(getState);\r\n\r\n const userRes = await axios.get(\r\n '/users/', \r\n headers(token)\r\n );\r\n dispatch(userLoaded(userRes.data));\r\n\r\n\r\n }catch(err){\r\n console.log(err);\r\n if(err.response){\r\n dispatch(getErrors({\r\n msg: err.response.data,\r\n status: err.response.status,\r\n id: null\r\n }));\r\n }\r\n dispatch(authError());\r\n }\r\n }\r\n\r\n export const register = (newUser) => async dispatch => {\r\n try{\r\n \r\n const registerRes = await axios.post(\r\n '/users/register',\r\n newUser\r\n );\r\n\r\n const loginRes = await axios.post(\r\n '/users/login',\r\n {\r\n email: newUser.email,\r\n password: newUser.password,\r\n }\r\n );\r\n\r\n dispatch(registerSuccess(loginRes.data));\r\n }catch(err){\r\n console.log(err);\r\n if(err.response){\r\n dispatch(getErrors({\r\n msg: err.response.data,\r\n status: err.response.status,\r\n id: 'REGISTER_FAIL'\r\n }));\r\n }\r\n dispatch(registerFail());\r\n }\r\n }\r\n\r\n export const login = returningUser => async dispatch => {\r\n try{\r\n \r\n const loginRes = await axios.post(\r\n '/users/login',\r\n {\r\n email: returningUser.email,\r\n password: returningUser.password,\r\n }\r\n );\r\n\r\n dispatch(loginSuccess(loginRes.data));\r\n }catch(err){\r\n console.log(err);\r\n if(err.response){\r\n dispatch(getErrors({\r\n msg: err.response.data,\r\n status: err.response.status,\r\n id: 'LOGIN_FAIL'\r\n }));\r\n }\r\n dispatch(loginFail());\r\n }\r\n }\r\n\r\n export const selectAllUserData = state => state.user;\r\n\r\n export default userSlice.reducer;","C:\\Users\\josh_\\reactapps\\yt-app\\src\\components\\misc\\ErrorNotice.js",[],"C:\\Users\\josh_\\reactapps\\yt-app\\src\\components\\auth\\ProtectedRoute.js",[],"C:\\Users\\josh_\\reactapps\\yt-app\\src\\axios.js",[],"C:\\Users\\josh_\\reactapps\\yt-app\\src\\components\\auth\\ProfileDetails.js",["175"],"import React from 'react'\r\nimport DefaultProfilePhoto from '../../assets/profile-photo.jpg'\r\nimport { useSelector } from 'react-redux';\r\nimport { selectAllUserData } from '../../features/user/userSlice';\r\nfunction ProfileDetails() {\r\n const { user } = useSelector(selectAllUserData);\r\n return (\r\n <div className=\"profile-info\">\r\n <img src={DefaultProfilePhoto} className=\"profile-photo\" alt=\"profile photo\" />\r\n <div className=\"profile-details\">\r\n <span className=\"user-name\">{user ? user.firstname + ' ' + user.lastname : 'Guest' }</span>\r\n <br />\r\n <span className=\"user-type\">User</span>\r\n </div>\r\n </div>\r\n )\r\n}\r\n\r\nexport default ProfileDetails\r\n","C:\\Users\\josh_\\reactapps\\yt-app\\src\\features\\error\\errorSlice.js",[],"C:\\Users\\josh_\\reactapps\\yt-app\\src\\components\\PlayReference.js",[],"C:\\Users\\josh_\\reactapps\\yt-app\\src\\components\\misc\\VolumeIndicator.js",[],"C:\\Users\\josh_\\reactapps\\yt-app\\src\\components\\CollectionGrouping.js",[],"C:\\Users\\josh_\\reactapps\\yt-app\\src\\features\\collection\\collectionSlice.js",["176","177"],"import { createSlice } from '@reduxjs/toolkit';\r\nimport axios from '../../axios';\r\nimport { getTokenFromUserReducer } from '../user/userSlice';\r\nimport { getErrors } from '../error/errorSlice';\r\nimport { moveVideo } from '../video/videoSlice';\r\nexport const collectionSlice = createSlice({\r\n name: 'collection',\r\n initialState: {\r\n collections: [],\r\n isLoading: false\r\n },\r\n reducers: {\r\n add: (state, action) => {\r\n state.collections.push(action.payload);\r\n },\r\n replaceAllCollections: (state, action) => {\r\n state.collections = action.payload;\r\n state.isLoading = false;\r\n },\r\n removeCollection: (state, action) => {\r\n state.collections = state.collections.filter(col => col.id !== action.payload.id);\r\n },\r\n editCollection: (state, action) => {\r\n state.collections = state.collections.map(col => {\r\n if (col.id === action.payload.id)\r\n return action.payload;\r\n else\r\n return col;\r\n });\r\n },\r\n startLoading: state => {\r\n state.isLoading = true;\r\n },\r\n stopLoading: state => {\r\n state.isLoading = false;\r\n },\r\n moveVideoInCollection: (state, { payload }) => {\r\n const { fromCollection, fromIndex, toCollection, toIndex, videoId } = payload;\r\n const fromColIndex = state.collections.findIndex(col => col.id === fromCollection);\r\n const vidIndex = state.collections[fromColIndex].videos.findIndex(vid => vid.id === videoId);\r\n state.collections[fromColIndex].videos[vidIndex].collectionId = toCollection;\r\n const toColIndex = state.collections.findIndex(col => col.id === toCollection);\r\n state.collections[toColIndex].videos.splice(\r\n toIndex, \r\n 0,\r\n state.collections[fromColIndex].videos.splice(vidIndex, 1)[0]\r\n );\r\n state.isLoading = false;\r\n },\r\n deleteVideoInCollection: (state, { payload }) => {\r\n state.collections = state.collections.map(col => ({\r\n ...col,\r\n videos: col.videos.filter(vid => vid.id !== payload.id)\r\n }));\r\n }\r\n },\r\n });\r\n\r\n\r\n export const { add, replaceAllCollections, removeCollection, editCollection, startLoading, stopLoading, moveVideoInCollection, deleteVideoInCollection } = collectionSlice.actions;\r\n\r\n const headers = (token) => ({\r\n headers: {\"x-auth-token\": token }\r\n })\r\n\r\n export const addCollectionAsync = collection => async (dispatch, getState) => {\r\n try{\r\n const savedCollection = await axios.post(\r\n '/collections/add',\r\n collection,\r\n headers(getTokenFromUserReducer(getState))\r\n ); \r\n dispatch(add(savedCollection.data));\r\n }catch (err) {\r\n console.log(err);\r\n if(err.response){\r\n dispatch(getErrors({\r\n msg: err.response.data,\r\n status: err.response.status,\r\n id: null\r\n }));\r\n }\r\n }\r\n }\r\n\r\n export const getAllUserCollectionsAsync = () => async (dispatch, getState) => {\r\n try{\r\n dispatch(startLoading());\r\n const userCollections = await axios.get(\r\n '/collections/usercollections',\r\n headers(getTokenFromUserReducer(getState))\r\n ); \r\n dispatch(replaceAllCollections(userCollections.data));\r\n }catch (err) {\r\n console.log(err);\r\n dispatch(stopLoading());\r\n if(err.response){\r\n dispatch(getErrors({\r\n msg: err.response.data,\r\n status: err.response.status,\r\n id: null\r\n }));\r\n }\r\n }\r\n }\r\n\r\n export const getAllUserCollectionsFullAsync = () => async (dispatch, getState) => {\r\n try{\r\n dispatch(startLoading());\r\n const userCollections = await axios.get(\r\n '/collections/usercollectionsfull',\r\n headers(getTokenFromUserReducer(getState))\r\n ); \r\n dispatch(replaceAllCollections(userCollections.data));\r\n }catch (err) {\r\n console.log(err);\r\n dispatch(stopLoading());\r\n if(err.response){\r\n dispatch(getErrors({\r\n msg: err.response.data,\r\n status: err.response.status,\r\n id: null\r\n }));\r\n }\r\n }\r\n }\r\n\r\n export const editCollectionAsync = (collectionId, editedCollection) => async (dispatch, getState) => {\r\n try{\r\n const updatedCollection = await axios.put(\r\n '/collections/edit/' + collectionId,\r\n editedCollection,\r\n headers(getTokenFromUserReducer(getState))\r\n ); \r\n dispatch(editCollection(updatedCollection.data));\r\n }catch (err) {\r\n console.log(err);\r\n if(err.response){\r\n dispatch(getErrors({\r\n msg: err.response.data,\r\n status: err.response.status,\r\n id: null\r\n }));\r\n }\r\n }\r\n }\r\n\r\nexport const deleteCollectionAsync = (collectionId) => async (dispatch, getState) => {\r\n try{\r\n const updatedCollection = await axios.delete(\r\n '/collections/delete/' + collectionId,\r\n headers(getTokenFromUserReducer(getState))\r\n ); \r\n dispatch(removeCollection(updatedCollection.data));\r\n }catch (err) {\r\n console.log(err);\r\n if(err.response){\r\n dispatch(getErrors({\r\n msg: err.response.data,\r\n status: err.response.status,\r\n id: null\r\n }));\r\n }\r\n }\r\n}\r\n\r\nexport const moveVideoAsync = (videoId, payload) => async (dispatch, getState) => {\r\n try{\r\n dispatch(startLoading());\r\n const updateResult = await axios.put(\r\n '/collections/move/' + videoId,\r\n payload,\r\n headers(getTokenFromUserReducer(getState))\r\n ); \r\n payload = {...payload, videoId};\r\n dispatch(moveVideo(payload));\r\n dispatch(moveVideoInCollection(payload));\r\n }catch (err) {\r\n console.log(err);\r\n dispatch(stopLoading());\r\n if(err.response){\r\n dispatch(getErrors({\r\n msg: err.response.data,\r\n status: err.response.status,\r\n id: null\r\n }));\r\n }\r\n }\r\n }\r\n\r\n export const selectCollectionData = state => state.collection;\r\n export default collectionSlice.reducer;","C:\\Users\\josh_\\reactapps\\yt-app\\src\\components\\ManageCollections.js",["178","179"],"import React, { useState ,useEffect } from 'react'\r\nimport { useSelector, useDispatch } from 'react-redux';\r\nimport { Spinner } from 'reactstrap';\r\n\r\nimport { \r\n selectCollectionData, \r\n getAllUserCollectionsAsync,\r\n addCollectionAsync,\r\n editCollectionAsync\r\n} from '../features/collection/collectionSlice';\r\nimport CollectionDetail from './CollectionDetail';\r\n\r\nfunction ManageCollections() {\r\n const { isLoading, collections } = useSelector(selectCollectionData);\r\n const dispatch = useDispatch();\r\n const [newCollection, setNewCollection] = useState({\r\n name: '',\r\n color: JSON.stringify({r: '200', g: '200', b: '200', a: '1'})\r\n });\r\n const handleSubmitNewCollection = (newCollectionDetails) => {\r\n dispatch(addCollectionAsync(newCollectionDetails));\r\n }\r\n const handleSubmitEditCollection = (collectionId, newCollectionDetails) => {\r\n dispatch(editCollectionAsync(collectionId, newCollectionDetails));\r\n }\r\n \r\n useEffect(() => {\r\n dispatch(getAllUserCollectionsAsync());\r\n }, [])\r\n\r\n return (\r\n <div>\r\n <h2 className=\"text-center\">Manage Collections</h2>\r\n <h3>Add a new Collection</h3>\r\n <CollectionDetail \r\n collection={newCollection}\r\n collections={collections}\r\n isNewCollection={true}\r\n handleSubmitCollectionDetail={handleSubmitNewCollection}\r\n />\r\n <h3>Existing Collections</h3>\r\n {collections.map(col => \r\n <CollectionDetail \r\n key={col.id}\r\n collection={col}\r\n collections={collections}\r\n isNewCollection={false}\r\n handleSubmitCollectionDetail={handleSubmitEditCollection}\r\n />\r\n )}\r\n {isLoading && <Spinner color=\"secondary\" />}\r\n </div>\r\n )\r\n}\r\n\r\nexport default ManageCollections\r\n","C:\\Users\\josh_\\reactapps\\yt-app\\src\\components\\misc\\ToggleableColorPicker.js",[],"C:\\Users\\josh_\\reactapps\\yt-app\\src\\components\\CollectionDetail.js",[],"C:\\Users\\josh_\\reactapps\\yt-app\\src\\components\\PlayCollection.js",[],{"ruleId":"180","replacedBy":"181"},{"ruleId":"182","replacedBy":"183"},{"ruleId":"184","severity":1,"message":"185","line":22,"column":6,"nodeType":"186","endLine":22,"endColumn":8,"suggestions":"187"},{"ruleId":"184","severity":1,"message":"188","line":25,"column":5,"nodeType":"189","endLine":25,"endColumn":14,"suggestions":"190"},{"ruleId":"184","severity":1,"message":"191","line":34,"column":5,"nodeType":"189","endLine":34,"endColumn":14,"suggestions":"192"},{"ruleId":"184","severity":1,"message":"193","line":47,"column":8,"nodeType":"186","endLine":47,"endColumn":18,"suggestions":"194"},{"ruleId":"195","severity":1,"message":"196","line":15,"column":89,"nodeType":"197","messageId":"198","endLine":15,"endColumn":90,"suggestions":"199"},{"ruleId":"195","severity":1,"message":"200","line":15,"column":108,"nodeType":"197","messageId":"198","endLine":15,"endColumn":109,"suggestions":"201"},{"ruleId":"202","severity":1,"message":"203","line":21,"column":40,"nodeType":"189","messageId":"204","endLine":21,"endColumn":46},{"ruleId":"184","severity":1,"message":"185","line":29,"column":8,"nodeType":"186","endLine":29,"endColumn":10,"suggestions":"205"},{"ruleId":"202","severity":1,"message":"206","line":38,"column":17,"nodeType":"189","messageId":"204","endLine":38,"endColumn":31},{"ruleId":"202","severity":1,"message":"207","line":38,"column":33,"nodeType":"189","messageId":"204","endLine":38,"endColumn":42},{"ruleId":"202","severity":1,"message":"208","line":9,"column":8,"nodeType":"189","messageId":"204","endLine":9,"endColumn":19},{"ruleId":"184","severity":1,"message":"209","line":39,"column":7,"nodeType":"186","endLine":39,"endColumn":41,"suggestions":"210"},{"ruleId":"184","severity":1,"message":"185","line":43,"column":7,"nodeType":"186","endLine":43,"endColumn":9,"suggestions":"211"},{"ruleId":"184","severity":1,"message":"209","line":43,"column":7,"nodeType":"186","endLine":43,"endColumn":41,"suggestions":"212"},{"ruleId":"184","severity":1,"message":"185","line":47,"column":7,"nodeType":"186","endLine":47,"endColumn":9,"suggestions":"213"},{"ruleId":"202","severity":1,"message":"214","line":3,"column":21,"nodeType":"189","messageId":"204","endLine":3,"endColumn":32},{"ruleId":"202","severity":1,"message":"215","line":94,"column":13,"nodeType":"189","messageId":"204","endLine":94,"endColumn":24},{"ruleId":"216","severity":1,"message":"217","line":9,"column":13,"nodeType":"218","endLine":9,"endColumn":92},{"ruleId":"202","severity":1,"message":"207","line":38,"column":33,"nodeType":"189","messageId":"204","endLine":38,"endColumn":42},{"ruleId":"202","severity":1,"message":"219","line":170,"column":13,"nodeType":"189","messageId":"204","endLine":170,"endColumn":25},{"ruleId":"202","severity":1,"message":"220","line":16,"column":27,"nodeType":"189","messageId":"204","endLine":16,"endColumn":43},{"ruleId":"184","severity":1,"message":"185","line":29,"column":8,"nodeType":"186","endLine":29,"endColumn":10,"suggestions":"221"},"no-native-reassign",["222"],"no-negated-in-lhs",["223"],"react-hooks/exhaustive-deps","React Hook useEffect has a missing dependency: 'dispatch'. Either include it or remove the dependency array.","ArrayExpression",["224"],"React Hook useEffect contains a call to 'setVideoDuration'. Without a list of dependencies, this can lead to an infinite chain of updates. To fix this, pass [] as a second argument to the useEffect Hook.","Identifier",["225"],"React Hook useEffect contains a call to 'setVideoDuration'. Without a list of dependencies, this can lead to an infinite chain of updates. To fix this, pass [endPoint, value] as a second argument to the useEffect Hook.",["226"],"React Hook useEffect has missing dependencies: 'startPoint', 'video.endSeconds', and 'video.startSeconds'. Either include them or remove the dependency array.",["227"],"no-useless-escape","Unnecessary escape character: \\_.","Literal","unnecessaryEscape",["228","229"],"Unnecessary escape character: \\?.",["230","231"],"no-unused-vars","'videos' is assigned a value but never used.","unusedVar",["232"],"'fromCollection' is assigned a value but never used.","'fromIndex' is assigned a value but never used.","'AuthOptions' is defined but never used.","React Hook useEffect has a missing dependency: 'history'. Either include it or remove the dependency array.",["233"],["234"],["235"],["236"],"'clearErrors' is defined but never used.","'registerRes' is assigned a value but never used.","jsx-a11y/img-redundant-alt","Redundant alt attribute. Screen-readers already announce `img` tags as an image. You don’t need to use the words `image`, `photo,` or `picture` (or any specified custom words) in the alt prop.","JSXOpeningElement","'updateResult' is assigned a value but never used.","'setNewCollection' is assigned a value but never used.",["237"],"no-global-assign","no-unsafe-negation",{"desc":"238","fix":"239"},{"desc":"240","fix":"241"},{"desc":"242","fix":"243"},{"desc":"244","fix":"245"},{"messageId":"246","fix":"247","desc":"248"},{"messageId":"249","fix":"250","desc":"251"},{"messageId":"246","fix":"252","desc":"248"},{"messageId":"249","fix":"253","desc":"251"},{"desc":"238","fix":"254"},{"desc":"255","fix":"256"},{"desc":"238","fix":"257"},{"desc":"255","fix":"258"},{"desc":"238","fix":"259"},{"desc":"238","fix":"260"},"Update the dependencies array to be: [dispatch]",{"range":"261","text":"262"},"Add dependencies array: []",{"range":"263","text":"264"},"Add dependencies array: [endPoint, value]",{"range":"265","text":"266"},"Update the dependencies array to be: [endPoint, startPoint, video.endSeconds, video.startSeconds]",{"range":"267","text":"268"},"removeEscape",{"range":"269","text":"270"},"Remove the `\\`. This maintains the current functionality.","escapeBackslash",{"range":"271","text":"272"},"Replace the `\\` with `\\\\` to include the actual backslash character.",{"range":"273","text":"270"},{"range":"274","text":"272"},{"range":"275","text":"262"},"Update the dependencies array to be: [msg, status, id, isAuthenticated, history]",{"range":"276","text":"277"},{"range":"278","text":"262"},{"range":"279","text":"277"},{"range":"280","text":"262"},{"range":"281","text":"262"},[985,987],"[dispatch]",[960,960],", []",[1481,1481],", [endPoint, value]",[1734,1744],"[endPoint, startPoint, video.endSeconds, video.startSeconds]",[450,451],"",[450,450],"\\",[469,470],[469,469],[886,888],[1273,1307],"[msg, status, id, isAuthenticated, history]",[1383,1385],[1519,1553],[1629,1631],[1062,1064]]