reza adde some thing

src/Redux/reducers/book.js

@@ -5,14 +5,47 @@ const initialState = {
   info: null,
   searchResult: [],
   filterResult: [],
+  subjects: [],
+  levels: [],
+  sortFilters: ["مرتب سازی", "محبوب ترین", "جدیدترین"],
 };
+
+const grades = [
+  "اول",
+  "دوم",
+  "سوم",
+  "چهارم",
+  "پنجم",
+  "ششم",
+  "هفتم",
+  "هشتم",
+  "نهم",
+  "دهم",
+  "یازدهم",
+  "دوازدهم",
+];
 export default function book(state = initialState, action) {
   let { type, data } = action;
   switch (type) {
     case "book/list":
-      return { ...state, loading: false, list: data, error: null };
+      let itemsSubject = data.map((item, index) => item.name);
+      if (window.innerWidth < 1000) {
+        itemsSubject.unshift("نام کتاب");
+      }
+      let itemsLevel = data.map((item) => grades[item.gradeId]);
+      if (window.innerWidth < 1000) {
+        itemsLevel.unshift("پایه تحصیلی");
+      }
+      return {
+        ...state,
+        loading: false,
+        list: data,
+        subjects: [...new Set(itemsSubject)],
+        levels: [...new Set(itemsLevel)],
+        error: null,
+      };
     case "book/info":
-      return { ...state, loading: false, list: null, info: data, error: null };
+      return { ...state, loading: false, info: data, error: null };
     case "book/update":
       return { ...state, loading: false, error: null };
     case "book/add":
@@ -22,8 +55,7 @@ export default function book(state = initialState, action) {
     case "book/search":
       return { ...state };
     case "book/filter":
-      const realList =
+      const realList = state.list;
-        state.searchResult.length > 0 ? state.searchResult : state.list;
       const level = data.level;
       const subject = data.subject;
       const sort = data.sort;
@@ -32,21 +64,38 @@ export default function book(state = initialState, action) {
         localStorage.setItem("filter", "ON");
       }
       let finalSort;
-      const byLevelFilter =
+      let byLevelFilter = [];
-        level.length > 0
+      if (level.length > 0) {
-          ? realList.filter(
+        level.map((item1) => {
-              (item) => item.name.indexOf(level.map((item) => item)) !== -1
+          for (let i = 0; i < realList.length; i++) {
-            )
+            if (grades[realList[i].gradeId] === item1) {
-          : realList;
+              byLevelFilter.push(realList[i]);
-      const bySubjectFilter =
+            }
-        subject.length > 0
+          }
-          ? byLevelFilter.filter(
+        });
-              (item) => item.name.indexOf(subject.map((item) => item)) !== -1
+      } else {
-            )
+        byLevelFilter = realList;
-          : byLevelFilter;
+      }
+
+      let bySubjectFilter = [];
+      if (subject.length > 0) {
+        subject.map((item1) => {
+          for (let i = 0; i < byLevelFilter.length; i++) {
+            if (byLevelFilter[i].name === item1) {
+              bySubjectFilter.push(byLevelFilter[i]);
+            }
+          }
+        });
+      } else {
+        bySubjectFilter = byLevelFilter;
+      }
+
       const bySearchFilter = search
-        ? bySubjectFilter.filter((item) => item.name.indexOf(search) !== -1)
+        ? bySubjectFilter.filter((item1) => item1.name.indexOf(search) !== -1)
         : bySubjectFilter;
+
+      console.log(bySearchFilter);
+
       if (sort === "گران ترین") {
         finalSort = bySearchFilter.sort((item1, item2) => {
           return item1.product[0].price - item2.product[0].price;

src/views/Home/SingleBlog/index.js

@@ -1,5 +1,7 @@
 import React, { Component } from "react";
 import { Link } from "react-router-dom";
+import VideoBox from "../../QR/VideoBox/index.js";
+import VoiceBox from "../../QR/VoiceBox/index.js";
 
 import "./index.scss";
 
@@ -10,6 +12,11 @@ const fontSize = {
     h1: window.innerWidth > maxDesktopSize ? 28 : window.innerWidth / 45,
     p: window.innerWidth > maxDesktopSize ? 14 : window.innerWidth / 85,
     a: window.innerWidth > maxDesktopSize ? 16 : window.innerWidth / 70,
+    content: {
+      h1: window.innerWidth > maxDesktopSize ? 18 : window.innerWidth / 75,
+      p: window.innerWidth > maxDesktopSize ? 14 : window.innerWidth / 90,
+      h2: window.innerWidth > maxDesktopSize ? 14 : window.innerWidth / 90,
+    },
   },
 };
 
@@ -23,21 +30,37 @@ export default class SingleBlog extends Component {
           <p style={{ fontSize: fontSize.desktop.p }}>{data.text}</p>
           <Link
             style={{ fontSize: fontSize.desktop.a }}
-            to={"/blogs" + data.id}
+            to={"/blogs/" + data.id}
           >
             بیشتر
           </Link>
         </div>
-        <div className="single-blog__left d-flex">
+        <div className="single-blog__left d-flex justify-content-center align-items-center">
-          {data.id ? (
+          {data.id ? <Identifier data={data} fontSize={fontSize} /> : null}
-            <img
-              src={`https://dnvn.ir/api/v1/file/${data.id}`}
-              alt={data.title}
-            />
-          ) : null}
           {data.video ? <video sourcce={data.video} /> : null}
         </div>
       </div>
     );
   }
 }
+
+const Identifier = (props) => {
+  const { data } = props;
+  console.log(data);
+  return (
+    <>
+      {data.type === "audio" ? (
+        <VoiceBox fontSize={props.fontSize} data={data} />
+      ) : null}
+      {data.type === "video" ? (
+        <VideoBox fontSize={props.fontSize} data={data} />
+      ) : null}
+      {data.type === "image" ? (
+        <img
+          src={"https://dnvn.ir/api/v1/file/" + data.fileIds}
+          alt={data.fileIds}
+        />
+      ) : null}
+    </>
+  );
+};

src/views/Products/Product/index.js

@@ -40,22 +40,22 @@ export default class Product extends Component {
               <Link
                 to={`/products/physical/${product.id}`}
                 style={{ fontSize: fontSize.mobile.a }}
-                className="mobile-products-product__links--physical"
+                className="mobile-products-product__links--physical d-flex justify-content-between align-items-center"
               >
-                کتاب
+                <h2 style={{ fontSize: fontSize.mobile.h2 }}>کتاب</h2>
-                {/* {!product.status.digital ? (
+                <span style={{ fontSize: fontSize.mobile.h2 }}>
-                  <img src={basket} alt="افزودن به سبد خرید" />
+                  {product.product[1].price} تومان
-                ) : null} */}
+                </span>
               </Link>
               <Link
                 to={`/products/digital/${product.id}`}
                 style={{ fontSize: fontSize.mobile.a }}
-                className="mobile-products-product__links--ar"
+                className="mobile-products-product__links--ar d-flex justify-content-between align-items-center"
               >
-                نسخه دیجیتال
+                <h2 style={{ fontSize: fontSize.mobile.h2 }}>دیجیتال</h2>
-                {/* {!product.status.digital ? (
+                <span style={{ fontSize: fontSize.mobile.h2 }}>
-                  <img src={basket} alt="افزودن به سبد خرید" />
+                  {product.product[0].price} تومان
-                ) : null} */}
+                </span>
               </Link>
             </div>
           </div>

src/views/Products/Product/index.scss

@@ -57,6 +57,9 @@
 }
 @media screen and (max-width: 350px) {
   .mobile-products-product {
+    h2 {
+      margin: 0px;
+    }
     width: 100%;
     background-color: #fafafa;
     margin: 20px;
@@ -116,6 +119,9 @@
 
 @media screen and (min-width: 350px) {
   .mobile-products-product {
+    h2 {
+      margin: 0px;
+    }
     width: calc(50% - 20px);
     background-color: #fafafa;
     margin: 10px;
@@ -177,6 +183,9 @@
 
 @media screen and (min-width: 550px) {
   .mobile-products-product {
+    h2 {
+      margin: 0px;
+    }
     width: calc(33% - 20px);
     background-color: #fafafa;
     margin: 10px;

src/views/Products/Select/index.js

@@ -69,9 +69,9 @@ export default function CustomizedSelects(props) {
           }
           input={<BootstrapInput />}
         >
-          {props.options.map((item) => (
+          {props.options.map((item, i) => (
-            <option key={item.id} value={item.value}>
+            <option key={i} value={item}>
-              {item.value}
+              {item}
             </option>
           ))}
         </NativeSelect>

src/views/Products/index.js

@@ -32,27 +32,6 @@ class Products extends Component {
       subject: [],
       sort: null,
     },
-    sortFilters: [
-      { id: 0, value: "مرتب سازی" },
-      { id: 1, value: "محبوب ترین" },
-      { id: 2, value: "جدیدترین" },
-      { id: 3, value: "ارزان ترین" },
-    ],
-    subjectFilters: [
-      { id: 0, value: "نام کتاب" },
-      { id: 1, value: "ریاضی" },
-      { id: 2, value: "شیمی" },
-      { id: 3, value: "علوم" },
-    ],
-    levelFilters: [
-      { id: 0, value: "پایه تحصیلی" },
-      { id: 1, value: "اول" },
-      { id: 2, value: "دوم" },
-      { id: 3, value: "سوم" },
-      { id: 4, value: "چهارم" },
-      { id: 5, value: "دهم" },
-      { id: 6, value: "هفتم" },
-    ],
   };
 
   handleProductSearch = (val) => {
@@ -79,7 +58,7 @@ class Products extends Component {
   }
 
   render() {
-    const { levelFilters, subjectFilters, sortFilters } = this.state;
+    const { sortFilters, levels, subjects } = this.props;
     return (
       <>
         {window.innerWidth > 1000 ? (
@@ -88,7 +67,9 @@ class Products extends Component {
               <Navbar page={"products"} />
               <Breadcrumbs />
               <div className="products__body d-flex">
+                {this.props.subjects.length > 0 ? (
                   <Filters parent={this} />
+                ) : null}
                 <div className="products__body--left d-flex flex-column">
                   <Sort
                     parent={this}
@@ -117,8 +98,8 @@ class Products extends Component {
               <div className="mobile-products__filters d-flex">
                 <div className="d-flex">
                   <Select name="sort" options={sortFilters} parent={this} />
-                  <Select name="level" options={subjectFilters} parent={this} />
+                  <Select name="subject" options={subjects} parent={this} />
-                  <Select name="subject" options={levelFilters} parent={this} />
+                  <Select name="level" options={levels} parent={this} />
                 </div>
                 <FilterListIcon style={{ fontSize: 40, color: "#a5a5a5" }} />
               </div>
@@ -131,13 +112,18 @@ class Products extends Component {
   }
 }
 
-export default connect((state) => ({}), {
+export default connect(
+  (state) => ({
+    subjects: state.book.subjects,
+    levels: state.book.levels,
+    sortFilters: state.book.sortFilters,
+  }),
+  {
     searchBook: book.searchBook,
     filterBook: book.filterBook,
-})(Products);
+  }
+)(Products);
 
 Products.defaultProps = {
   sortItems: ["پرفروش ترین", "جدیدترین"],
-  subjects: ["فیزیک", "زیست", "شیمی", "روانشناسی", "علوم", "دین و زندگی"],
-  levels: ["اول", "دوم", "سوم", "دهم"],
 };