restored video function, app renders without crashing

src/features/posts/Feed.js

@@ -2,7 +2,6 @@ import React, { useState, useEffect } from "react";
 import { fetchBySub, /* selectPosts */ } from "./postsSlice";
 import { selectAllSubs } from "../reddit/redditSlice";
 import { useSelector, useDispatch } from "react-redux";
-// import { updatePosts } from "./postsSlice";
 import { v4 } from "uuid";
 import Post from "./Post";
 
@@ -15,7 +14,6 @@ export default function Feed() {
     const [currentPage, setCurrentPage] = useState(0);          // Determines current feed page; corresponds to index of feedPage array
     const dispatch = useDispatch();
 
-    // const posts = useSelector(selectPosts);
     const subs = useSelector(selectAllSubs);                    // Selects subreddits from redditSlice
     
     useEffect(() => {                                // this useEffect loop pulls the endpoints from the selected subreddits and stores them as an array in "endpoints"
@@ -82,7 +80,7 @@ export default function Feed() {
 
                 let sortedPosts = extractedPosts.sort(comparePosts);        // implements sorting function
 
-                console.log(sortedPosts);
+                // console.log(sortedPosts);
                 
                 let newFeed = sortedPosts.map((post) => {
                     return (
@@ -93,7 +91,6 @@ export default function Feed() {
                     )
                 })
                 
-                // dispatch(updatePosts(newFeed));    // stores current feed in state of postsSlice
                 setFeed(newFeed);
             }
 

src/features/video/VideoPlayer.js

@@ -1,7 +1,6 @@
 import { useState, useEffect, useRef } from 'react';
 
 export default function VideoPlayer({data, src}) {
-    const vidControls = useRef();
     const vid = useRef();
     const aud = useRef();        // identifies location of video/audio in DOM
     
@@ -13,24 +12,23 @@ export default function VideoPlayer({data, src}) {
     let url;        // contains video source, routed accordingly by logic below
 
     if (crossPostSrc) {
-        url = crossPostSrc;         // ... for crossposts
+        url = crossPostSrc;
-    } else if (data.url) {
+    } else if (data.media.reddit_video.fallback_url) {
-        url = data.url;             // ... for local posts, where the url
+        url = data.media.reddit_video.fallback_url;
-    } else {                        // can be accessed at data.url
+    } else {                        
-        url = null;                 // otherwise, is null
+        url = null;
     }
 
     useEffect(() => {                                       // checks the endpoint where audio may be found
         let checking = true;                                // if the fetch request throws an error, audio is set to null;
         const checkForAudio = async() => {                  // otherwise, audio is set to the endpoint, which is evaluated
             try {                                           // below as truthy, and rendered in the page
-                await fetch(`${url}/DASH_audio.mp4`)
+                await fetch(`${data.url}/DASH_audio.mp4`)
                 .then((response) => {
-                    let status = response.status;
+                    if (!response.ok) {
-                    if (status > 400) {
                         setAudio(null);
                     } else {
-                        setAudio(`${url}/DASH_audio.mp4`);
+                        setAudio(`${data.url}/DASH_audio.mp4`);
                     }
                 });
             } catch(e) {
@@ -53,7 +51,7 @@ export default function VideoPlayer({data, src}) {
             return;
         }
 
-        if (playing) {
+        if (audio && playing) {
             vid.current.play();                                         // synchronizes play/pause between two components
             vid.current.currentTime = aud.current.currentTime;          // according to section of state
         } else if (!playing) {
@@ -63,27 +61,25 @@ export default function VideoPlayer({data, src}) {
 
     return (
         <div className="video-player">
-
             {
                 !audio ? 
 
                 <>
-                <video id="post-video-no-audio" ref={vidControls} controls src={`${url}/DASH_1080.mp4` || `${url}/DASH_1080.mp4?source=fallback`}>
+                <video id="post-video-no-audio" controls src={url}>
                     This video is not supported by your browser.
                 </video>
                 </>
 
-                :
+                : 
 
                 <>
-                <video id="post-video" ref={vid} autoPlay={playing ? true : false} src={`${url}/DASH_1080.mp4`}>
+                <video id="post-video" ref={vid} autoPlay={playing ? true : false} src={url ? url : null}>
                     This video is not supported by your browser.
                 </video>
                 <video id="post-audio" ref={aud} controls onPlay={() => setPlaying(true)} onPause={() => setPlaying(false)} src={audio}>
                     This video is not supported by your browser.
                 </video>
                 </>
-
             }
         </div>
     );