update

src/App.js

@@ -77,7 +77,7 @@ function App() {
         {/* <CourseChapter /> */}
         {/* <SidebarMenu /> */}
         {/* <SidebarDesign2 /> */}
-        <SimpleBarChart />
+        {/* <SimpleBarChart /> */}
       </div>
     </Provider>
   );

src/components/testtttt/Testttt.js

@@ -1,78 +1,18 @@
-import React, { PureComponent } from 'react';
-import { BarChart, Bar, Cell, XAxis, YAxis, CartesianGrid, Tooltip, Legend, ResponsiveContainer } from 'recharts';
+import React from "react";
+// import "./Testttt.scss";
 
-const data = [
-  {
-    name: 'Page A',
-    uv: 4000,
-    pv: 2400,
-  },
-  {
-    name: 'Page B',
-    uv: 3000,
-    pv: 1398,
-    amt: 2210,
-  },
-  {
-    name: 'Page C',
-    uv: 2000,
-    pv: 9800,
-    amt: 2290,
-  },
-  {
-    name: 'Page D',
-    uv: 2780,
-    pv: 3908,
-    amt: 2000,
-  },
-  {
-    name: 'Page E',
-    uv: 1890,
-    pv: 4800,
-    amt: 2181,
-  },
-  {
-    name: 'Page F',
-    uv: 2390,
-    pv: 3800,
-    amt: 2500,
-  },
-  {
-    name: 'Page G',
-    uv: 3490,
-    pv: 4300,
-    amt: 2100,
-  },
-];
+import book from "../../assets/images/book.svg";
+import bookCover from "../../assets/images/book-white-cover.svg";
 
-export default function App() {
-    return (
-      <ResponsiveContainer width="100%" aspect={3}>
-        <BarChart
-          width={500}
-          height={300}
-          data={data}
-          margin={{
-            top: 5,
-            right: 30,
-            left: 20,
-            bottom: 5,
-          }}
-        >
-          <CartesianGrid strokeDasharray="3 3" />
-          <XAxis dataKey="name" tick={{stroke: "red"}} axisLine={false} tickLine={false}/>
-          <YAxis
-            tick={{stroke: "red"}}
-            axisLine={false}
-            tickLine={false}
-            tickCount={7}
-            // tickFormatter={(number) =>'$${number.toFixed(2)}'}
-            />
-          <Tooltip />
-          <Legend />
-          <Bar dataKey="pv" fill="#8884d8" />
-          <Bar dataKey="uv" fill="#82ca9d" />
-        </BarChart>
-      </ResponsiveContainer>
+export const Testttt = ({ bookBackCoverBg }) => {
+  return (
+    <section className="w-10/12 bg-white rounded-lg shadow-lg p-10 mx-auto my-10">
+      <div>mahdi</div>
+    </section>
     );
-}
+};
+
+export default Testttt;
+Testttt.defaultProps = {
+  bookBackCoverBg: "bg-greenBookBg",
+};