reza achanged video tube

src/redux/reducers/public.tsx

@@ -1,5 +1,7 @@
 import { PublicAction } from "../actions-type";
 import proxy from "../proxy";
+import location from '../../util/location';
+
 const initialState = {
   homeData: [],
   newProducts: [],
@@ -69,13 +71,13 @@ export default function publicApi(state = initialState, action: PublicAction) {
         error: null,
       };
     case "public/vod/bookSection":
-      const videoId: any = localStorage.getItem("category")?.split(",")[2];
+      const videoId: any = location.getId();
       return {
         ...state,
         loading: false,
         bookSection: data,
         error: null,
-        selectedVideo: data?.vods?.filter((item: any) => item.name === videoId)[0]
+        selectedVideo: data.vods?.filter((item: any) => item.id !== videoId)[0]
       };
 
     case "public/vod/bookCourse":
@@ -98,7 +100,7 @@ export default function publicApi(state = initialState, action: PublicAction) {
         categories: allCats.map((item: any) =>
           data.vods.filter((item1: any) => item1.categoryId === item)
         ),
-        selectedVideo: data?.vods[0],
+        selectedVideo: data.vods.filter((item : any) => item.id !== location.getId())[0],
       };
     case "public/homePage":
       let itemsLevel;

src/router.js

@@ -47,7 +47,7 @@ function router({ status }) {
         <Route exact path={"/courses/:id"}>
           <Course />
         </Route>
-        <Route exact path={"/video-tube"}>
+        <Route exact path={"/video/:id"}>
           <VideoTube />
         </Route>
         <Route exact path={"/subscribe"}>

src/util/location.js

@@ -8,4 +8,4 @@ class location {
 
 const _location = new location();
 
-export default _location;
+export default _location;

src/views/Course/Lesson/index.tsx

@@ -111,7 +111,7 @@ function Lesson({
               </div>
               <ul className="d-flex">
                 <li>{data.type !== "pdf" && duration(data.duration)}</li>
-                <Link to="/video-tube" onClick={() => setCategory(lesson[0].categoryId, data.name)}>
+                <Link to={"/video/"+ data.id} onClick={() => setCategory(lesson[0].categoryId, data.name)}>
                   <li>{"مشاهده"}</li>
                 </Link>
                 {/* <li>{data.download ? "دانلود" : <img src={lock} alt="" />}</li> */}

src/views/Course/index.tsx

@@ -94,7 +94,7 @@ function Course({ getInfo, info, categories, loading }: any) {
               <img src={bookmark} alt="" />
             </button>
             <Link
-              to="/video-tube"
+              to={"/video/" + info?.vods[0]?.id}
               className="course__options--button d-flex align-items-center justify-content-between"
               onClick={() => checkFreeCat()}
             >
@@ -133,7 +133,7 @@ function Course({ getInfo, info, categories, loading }: any) {
               <img src={bookmark} alt="" />
             </button>
             <Link
-              to="/video-tube"
+              to={"/video/" + info?.vods[0]?.id}
               className="course__options--button d-flex align-items-center justify-content-around"
               onClick={() => checkFreeCat()}
             >
@@ -173,7 +173,6 @@ function Course({ getInfo, info, categories, loading }: any) {
 
 export default connect(
   (state: any) => ({
-    lessons: state.book.mockLessons,
     info: state.publicApi.bookInfo,
     categories: state.publicApi.categories,
     loading: state.publicApi.loading,

src/views/VideoTube/LessonPlayList/index.tsx

@@ -2,6 +2,7 @@ import React, { useEffect } from "react";
 import "./index.scss";
 import { connect } from "react-redux";
 import { publicApi } from "../../../redux/actions";
+import { Link } from "react-router-dom";
 
 function LessonPlayList({
   category,
@@ -16,12 +17,12 @@ function LessonPlayList({
     if (localStorage.getItem("scroll-list") && vods) {
       const list: HTMLElement = document.getElementById("list") as HTMLElement;
       const listItem: HTMLElement = document.getElementById(
-        "listItem" + selectedVideo.id
+        "listItem" + selectedVideo?.id
       ) as HTMLElement;
       const elementHeight: any = (listItem as any)?.offsetHeight;
       const listHeight: any = (list as any).offsetHeight;
-      const index = vods.findIndex((
+      const index = vods?.findIndex((
-        (item: any) => item.name === selectedVideo.name
+        (item: any) => item?.name === selectedVideo?.name
       ));
       console.log(index);
       console.log(listHeight,elementHeight * (Number(index) + 1));
@@ -52,7 +53,8 @@ function LessonPlayList({
 
           {bookId ? (
             category.map((video: any, i: any) => (
-              <div
+              <Link
+                to={"/video/" + video.id}
                 className={
                   "lesson-playlist__item d-flex align-items-center" +
                   " " +
@@ -82,10 +84,11 @@ function LessonPlayList({
                   <h4>{video.name}</h4>
                   {/* <p>{file.text}</p> */}
                 </div>
-              </div>
+              </Link>
             ))
           ) : (
-            <div
+            <Link
+              to={"/video/" + category.id}
               className={
                 "lesson-playlist__item d-flex align-items-center" +
                 " " +
@@ -112,7 +115,7 @@ function LessonPlayList({
                 <h4>{category.name}</h4>
                 {/* <p>{file.text}</p> */}
               </div>
-            </div>
+            </Link>
           )}
         </div>
       }

src/views/VideoTube/index.tsx

@@ -12,6 +12,7 @@ import "./index.scss";
 import listIcon from "../../assets/icons/list.png";
 import { connect } from "react-redux";
 import scroll from "../../util/scroll.js";
+import location from "../../util/location.js";
 import { book, publicApi } from "../../redux/actions";
 import Loader from "../../components/Loader";