Redirecting user on upload ✅✅✅

Author: Gaurav242007

components/Studio/UploadVideo.jsx

@@ -78,7 +78,7 @@ const UploadVideo = () => {
             });
           const { path } = data;
 
-          await supabase.from("videos").insert({
+         const {data: videoDetails} =  await supabase.from("videos").insert({
             uid: videoPath,
             url: videoUrl,
             thumbnail: thumbnailUrl + path,
@@ -91,10 +91,12 @@ const UploadVideo = () => {
             dislikes: [],
             channelRef: currentChannel?.uid,
             views: [],
-          });
+          }).select();
+
+          console.log(videoDetails)
 
           e.target.value = "";
-          router.push("/");
+          router.push(`/studio/video/${videoDetails[0]?.uid}?edit=true`);
           window.location.reload();
         });
       });

components/Studio/Video/Edit.jsx

@@ -157,6 +157,7 @@ const EditVideo = ({ uid, videoDetails }) => {
   const thumbnailRef = useRef(null);
   const [editedDetails, setEditedDetails] = useState(videoDetails);
   const [key, setKey] = useState("key");
+  const router = useRouter();
 
   useEffect(() => {
     const newKey = GetUid();
@@ -181,6 +182,11 @@ const EditVideo = ({ uid, videoDetails }) => {
     setEditedDetails({ ...editedDetails, thumbnail: newThumbnail });
     event.target.value = "";
   };
+
+  const Delete = async () => {
+    await supabase.from("videos").delete().eq("uid", uid);
+    router.push("/studio?content=true");
+  };
   return (
     <Fragment>
       <Header
@@ -236,34 +242,6 @@ const EditVideo = ({ uid, videoDetails }) => {
             />
           </div>
 
-          {/* <div>
-            <label
-              htmlFor="playlist"
-              className="block my-4 text-xl font-medium text-gray-900 dark:text-white"
-            >
-              Choose a playlist
-            </label>
-            <select
-              onChange={(e) => {
-                setVideoPlaylist(e.target.value);
-              }}
-              id="playlist"
-              className="ring-1 bg-transparent text-lg rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full py-3 px-4 text-blue-400 dark:focus:ring-blue-500 outline-none"
-            >
-              {userPlaylists?.map((playlist) =>
-                playlist?.name === videoPlaylist ? (
-                  <option value={playlist?.name} selected key={GetUid()}>
-                    {playlist?.name}
-                  </option>
-                ) : (
-                  <option value={playlist?.name} key={GetUid()}>
-                    {playlist?.name}
-                  </option>
-                )
-              )}
-            </select>
-          </div> */}
-
           <div className="mb-6">
             <p className="my-4 flex flex-col text-bold text-lg text-gray-900 dark:text-white">
               Thumbnail
@@ -326,6 +304,7 @@ const EditVideo = ({ uid, videoDetails }) => {
 
           <button
             type="button"
+            onClick={() => Delete()}
             className="focus:outline-none text-white bg-red-500 hover:bg-red-600 focus:ring-4 focus:ring-red-300 font-medium rounded-lg w-20 transition px-5 py-2.5 mr-2 mb-2 dark:bg-red-500 dark:hover:bg-red-400 dark:focus:ring-red-900"
           >
             Delete

components/Video.jsx

@@ -36,7 +36,7 @@ export default function Video({
   const timeAgo = new TimeAgo("en-US");
 
   return (
-    <div className=" cursor-pointer w-full h-64 my-2 hover:scale-105 transition group">
+    <div className=" cursor-pointer w-full h-64 my-5 mt-14 hover:scale-105 transition group">
       <div className="relative">
         <img
           src={ thumbnail}