reza fixed compo colors before ShoppingCart

src/screens/QRContent/Tab/index.js

@@ -1,25 +1,29 @@
 import React, { useState } from "react";
 import { View, Text, TouchableOpacity, Dimensions } from "react-native";
-import tw from "tailwind-rn";
+import { connect } from "react-redux";
-import Colors from "../../../constants/Colors";
+
+//components
 import Voice from "../Content/Voice";
 import Video from "../Content/Video";
 import PPT from "../Content/PPT";
 import PDF from "../Content/PDF";
 import Links from "../Content/Links";
 
+//assets
+import tw from "tailwind-rn";
+import Colors from "../../../constants/Colors";
+
 const { width } = Dimensions.get("window");
 
-//assets
 
-export default function Tab({ data }) {
+function Tab({ data, theme }) {
   const [dataType, setDataType] = useState("all");
 
   return (
     <View
       style={[
         tw("w-full flex  rounded-md overflow-hidden mt-4"),
-        { borderWidth: 1, borderColor: Colors.theme1.light.blue5 },
+        { borderWidth: 1, borderColor: Colors.theme1[theme].blue5 },
       ]}
     >
       <View style={tw("w-full flex flex-row-reverse justify-between px-0.5")}>
@@ -31,24 +35,19 @@ export default function Tab({ data }) {
               borderBottomWidth: 1,
               borderColor:
                 dataType === "all"
-                  ? Colors.theme1.light.blue3
+                  ? Colors.theme1[theme].blue3
-                  : Colors.theme1.light.blue5,
+                  : Colors.theme1[theme].blue5,
               backgroundColor:
-                dataType === "all" ? Colors.theme1.light.blue3 : "white",
+                dataType === "all" ? Colors.theme1[theme].blue3 : "white",
             },
           ]}
         >
           <Text
-            style={{
-              fontSize: width / 31,
-              color: "#707070",
-              fontFamily: "light",
-            }}
             style={{
               fontSize: width / 38,
               fontFamily: dataType === "all" ? "bold" : "light",
               textAlign: "center",
-              color: Colors.theme1.light.blue5,
+              color: Colors.theme1[theme].blue5,
             }}
           >
             تمامی محتوا
@@ -62,10 +61,10 @@ export default function Tab({ data }) {
               borderBottomWidth: 1,
               borderColor:
                 dataType === "voice"
-                  ? Colors.theme1.light.blue3
+                  ? Colors.theme1[theme].blue3
-                  : Colors.theme1.light.blue5,
+                  : Colors.theme1[theme].blue5,
               backgroundColor:
-                dataType === "voice" ? Colors.theme1.light.blue3 : "white",
+                dataType === "voice" ? Colors.theme1[theme].blue3 : "white",
             },
           ]}
         >
@@ -74,7 +73,7 @@ export default function Tab({ data }) {
               fontSize: width / 38,
               fontFamily: dataType === "voice" ? "bold" : "light",
               textAlign: "center",
-              color: Colors.theme1.light.blue5,
+              color: Colors.theme1[theme].blue5,
             }}
           >
             صوت
@@ -88,10 +87,10 @@ export default function Tab({ data }) {
               borderBottomWidth: 1,
               borderColor:
                 dataType === "video"
-                  ? Colors.theme1.light.blue3
+                  ? Colors.theme1[theme].blue3
-                  : Colors.theme1.light.blue5,
+                  : Colors.theme1[theme].blue5,
               backgroundColor:
-                dataType === "video" ? Colors.theme1.light.blue3 : "white",
+                dataType === "video" ? Colors.theme1[theme].blue3 : "white",
             },
           ]}
         >
@@ -100,7 +99,7 @@ export default function Tab({ data }) {
               fontSize: width / 38,
               fontFamily: dataType === "video" ? "bold" : "light",
               textAlign: "center",
-              color: Colors.theme1.light.blue5,
+              color: Colors.theme1[theme].blue5,
             }}
           >
             ویدئو
@@ -114,10 +113,10 @@ export default function Tab({ data }) {
               borderBottomWidth: 1,
               borderColor:
                 dataType === "pdf"
-                  ? Colors.theme1.light.blue3
+                  ? Colors.theme1[theme].blue3
-                  : Colors.theme1.light.blue5,
+                  : Colors.theme1[theme].blue5,
               backgroundColor:
-                dataType === "pdf" ? Colors.theme1.light.blue3 : "white",
+                dataType === "pdf" ? Colors.theme1[theme].blue3 : "white",
             },
           ]}
         >
@@ -126,7 +125,7 @@ export default function Tab({ data }) {
               fontSize: width / 38,
               fontFamily: dataType === "pdf" ? "bold" : "light",
               textAlign: "center",
-              color: Colors.theme1.light.blue5,
+              color: Colors.theme1[theme].blue5,
             }}
           >
             پی دی اف
@@ -140,10 +139,10 @@ export default function Tab({ data }) {
               borderBottomWidth: 1,
               borderColor:
                 dataType === "ppt"
-                  ? Colors.theme1.light.blue3
+                  ? Colors.theme1[theme].blue3
-                  : Colors.theme1.light.blue5,
+                  : Colors.theme1[theme].blue5,
               backgroundColor:
-                dataType === "ppt" ? Colors.theme1.light.blue3 : "white",
+                dataType === "ppt" ? Colors.theme1[theme].blue3 : "white",
             },
           ]}
         >
@@ -152,7 +151,7 @@ export default function Tab({ data }) {
               fontSize: width / 38,
               fontFamily: dataType === "ppt" ? "bold" : "light",
               textAlign: "center",
-              color: Colors.theme1.light.blue5,
+              color: Colors.theme1[theme].blue5,
             }}
           >
             پاور پوینت
@@ -166,10 +165,10 @@ export default function Tab({ data }) {
               borderBottomWidth: 1,
               borderColor:
                 dataType === "links"
-                  ? Colors.theme1.light.blue3
+                  ? Colors.theme1[theme].blue3
-                  : Colors.theme1.light.blue5,
+                  : Colors.theme1[theme].blue5,
               backgroundColor:
-                dataType === "links" ? Colors.theme1.light.blue3 : "white",
+                dataType === "links" ? Colors.theme1[theme].blue3 : "white",
             },
           ]}
         >
@@ -178,7 +177,7 @@ export default function Tab({ data }) {
               fontSize: width / 38,
               fontFamily: dataType === "links" ? "bold" : "light",
               textAlign: "center",
-              color: Colors.theme1.light.blue5,
+              color: Colors.theme1[theme].blue5,
             }}
           >
             لینک ها
@@ -188,12 +187,8 @@ export default function Tab({ data }) {
       <View style={tw("flex  w-full p-4")}>
         {dataType === "all" && (
           <>
-            {data.voice && (
+            {data.voice && <Voice data={data.voice} />}
-              <Voice data={data.voice} />
+            {data.video && <Video data={data.video} />}
-            )}
-            {data.video && (
-              <Video data={data.video} />
-            )}
             {data.ppt && <PPT data={data.ppt} />}
             {data.pdf && <PDF data={data.pdf} />}
             {data.links && <Links data={data.links} />}
@@ -288,3 +283,9 @@ export default function Tab({ data }) {
     </View>
   );
 }
+
+const mapStateToProps = (state) => ({
+  theme: state.publicApi.theme,
+});
+
+export default connect(mapStateToProps)(Tab);