diff --git a/src/Redux/slice/bannerSlice.js b/src/Redux/slice/bannerSlice.js
index bf21ea3..0923fa8 100644
--- a/src/Redux/slice/bannerSlice.js
+++ b/src/Redux/slice/bannerSlice.js
@@ -1,14 +1,4 @@
-import { createApi, fetchBaseQuery } from '@reduxjs/toolkit/query/react';
-
-export const learnPage = createApi({
- reducerPath: 'LearnPage',
- baseQuery: fetchBaseQuery({ baseUrl: 'https://rubix.betadelivery.com/api/' }),
- endpoints: (builder) => ({
- getLearnPage: builder.query({
- query: () => 'learn/active',
- }),
- }),
-});
+import { createApi, fetchBaseQuery } from '@reduxjs/toolkit/query/react'
export const buildPage = createApi({
reducerPath: 'BuildPage',
@@ -20,5 +10,4 @@ export const buildPage = createApi({
}),
});
-export const { useGetLearnPageQuery } = learnPage;
export const { useGetBuildPageQuery } = buildPage;
diff --git a/src/Redux/slice/learPageSlice.js b/src/Redux/slice/learPageSlice.js
new file mode 100644
index 0000000..ff2579a
--- /dev/null
+++ b/src/Redux/slice/learPageSlice.js
@@ -0,0 +1,16 @@
+import { createApi, fetchBaseQuery } from '@reduxjs/toolkit/query/react';
+
+export const learnPageApi = createApi({
+ reducerPath: 'LearnPage',
+ baseQuery: fetchBaseQuery({ baseUrl: 'https://rubix.betadelivery.com/api/' }),
+ endpoints: (builder) => ({
+ getLearnPage: builder.query({
+ query: () => 'learn/active',
+ }),
+ getLearnFaq: builder.query({
+ query: () => 'faq/active',
+ }),
+ }),
+});
+
+export const { useGetLearnPageQuery, useGetLearnFaqQuery } = learnPageApi;
diff --git a/src/Redux/store/store.js b/src/Redux/store/store.js
index 88b0b1b..b8876b6 100644
--- a/src/Redux/store/store.js
+++ b/src/Redux/store/store.js
@@ -6,8 +6,8 @@ import { newsApi } from '../slice/newsSlice';
import { resourcesApi } from '../slice/resources';
import { videoTableApi } from '../slice/videoTable';
import { whitePaper } from '../slice/whitePaperSlice';
-import { buildPage, learnPage } from '../slice/bannerSlice';
-import { faqApi } from '../slice/faqSlice';
+import { buildPage } from '../slice/bannerSlice';
+import { learnPageApi } from '../slice/learPageSlice';
const store = configureStore({
reducer: {
@@ -18,9 +18,8 @@ const store = configureStore({
[resourcesApi.reducerPath]: resourcesApi.reducer,
[videoTableApi.reducerPath]: videoTableApi.reducer,
[whitePaper.reducerPath]: whitePaper.reducer,
- [learnPage.reducerPath]: learnPage.reducer,
[buildPage.reducerPath]: buildPage.reducer,
- [faqApi.reducerPath]: faqApi.reducer,
+ [learnPageApi.reducerPath]: learnPageApi.reducer,
},
middleware: (getDefaultMiddleware) =>
getDefaultMiddleware().concat(
@@ -31,9 +30,8 @@ const store = configureStore({
resourcesApi.middleware,
videoTableApi.middleware,
whitePaper.middleware,
- learnPage.middleware,
buildPage.middleware,
- faqApi.middleware,
+ learnPageApi.middleware
), // Add blogApi.middleware here
});
diff --git a/src/assets/images/Telecom-bg.png b/src/assets/images/Telecom-bg.png
new file mode 100644
index 0000000..6bcfea3
Binary files /dev/null and b/src/assets/images/Telecom-bg.png differ
diff --git a/src/assets/images/i&security-bg.png b/src/assets/images/i&security-bg.png
new file mode 100644
index 0000000..92482f6
Binary files /dev/null and b/src/assets/images/i&security-bg.png differ
diff --git a/src/components/LearnPage/Faq.jsx b/src/components/LearnPage/Faq.jsx
index f4dfec5..c409924 100644
--- a/src/components/LearnPage/Faq.jsx
+++ b/src/components/LearnPage/Faq.jsx
@@ -14,6 +14,8 @@ import {
} from "@chakra-ui/react";
import { AddIcon, MinusIcon } from "@chakra-ui/icons";
import { useGetFaqQuery } from "../../Redux/slice/faqSlice";
+import Loader from "../Loader/Loader";
+import { useGetLearnFaqQuery } from "../../Redux/slice/learPageSlice";
const accordion = [
{
@@ -183,10 +185,17 @@ const accordion = [
];
export const Faq = () => {
- const { data, isLoading, error } = useGetFaqQuery();
- console.log(data?.data?.data?.rows);
+ const { data, isLoading, error } = useGetLearnFaqQuery();
const faq = data?.data?.data?.rows;
+ if (isLoading) {
+ return (
+ <>
+
+
+ );
+ }
+
return (
<>
{faq?.map((item) => (
diff --git a/src/components/LearnPage/LearnBanner.jsx b/src/components/LearnPage/LearnBanner.jsx
index 3fa8e73..931a69f 100644
--- a/src/components/LearnPage/LearnBanner.jsx
+++ b/src/components/LearnPage/LearnBanner.jsx
@@ -3,6 +3,8 @@
import { Box, Button, Container, Text } from "@chakra-ui/react";
import banner from "../../assets/images/learnBanner.webp";
import { Link } from "react-router-dom";
+import Loader from "../Loader/Loader";
+import { useGetLearnPageQuery } from "../../Redux/slice/learPageSlice";
const BannerContent = [
{
@@ -20,10 +22,24 @@ const BannerContent = [
},
];
-const LearnBanner = ({ data }) => {
+const LearnBanner = () => {
+ const { data, isLoading, error } = useGetLearnPageQuery();
+ const learnData = data?.data?.data;
+
+ if (isLoading) {
+ return (
+
+
+
+ );
+ }
+
+ if (error) {
+ console.log(error.message);
+ }
return (
<>
- {data?.map((item) => (
+ {learnData?.map((item) => (
{
backgroundRepeat={"no-repeat"}
backgroundSize={"cover"}
position="relative"
+ backgroundPosition={"center"}
sx={{
"@media (max-width: 600px)": {
height: "400px",
diff --git a/src/pages/LearnPage.jsx b/src/pages/LearnPage.jsx
index 72e4f7a..5f6cca5 100644
--- a/src/pages/LearnPage.jsx
+++ b/src/pages/LearnPage.jsx
@@ -6,30 +6,17 @@ import GetStarted from "../components/LearnPage/GetStarted";
import LearnBanner from "../components/LearnPage/LearnBanner";
import LearnDev from "../components/LearnPage/LearnDev";
import WhyRubix from "../components/LearnPage/WhyRubix";
-import { useGetLearnPageQuery } from "../Redux/slice/bannerSlice";
import Loader from "../components/Loader/Loader";
const LearnPage = () => {
- const { data, isLoading, error } = useGetLearnPageQuery();
- const learnData = data?.data?.data;
- console.log(learnData);
-
useEffect(() => {
// Scroll to the top of the page when the component mounts
window.scrollTo(0, 0);
}, []);
- if (isLoading) {
- return (
-
-
-
- );
- }
-
return (
<>
-
+
diff --git a/src/routes/_routes.jsx b/src/routes/_routes.jsx
index 4f5a93c..164ab28 100644
--- a/src/routes/_routes.jsx
+++ b/src/routes/_routes.jsx
@@ -21,6 +21,8 @@ import UseCases from "../pages/UseCases";
import fintech from "../assets/images/usecase-bg.png";
import adTech from "../assets/images/addtech.jpg";
import martech from "../assets/images/martech.png";
+import security from "../assets/images/i&security-bg.png";
+import tele from "../assets/images/Telecom-bg.png";
import healthTech from "../assets/images/health-tech.png";
import Form from "../components/Contact/Form";
import UseCase from "../components/UseCase/UseCase";
@@ -176,7 +178,7 @@ export const route = [
bannerSubHeading={
"Stay up to date on what’s happening with Rubix, learn about upcoming events and access important resources."
}
- bannerImage={healthTech}
+ bannerImage={security}
useCase={IdentitySecurityContent}
/>
),
@@ -189,7 +191,7 @@ export const route = [
bannerSubHeading={
"Stay up to date on what’s happening with Rubix, learn about upcoming events and access important resources."
}
- bannerImage={healthTech}
+ bannerImage={tele}
useCase={telecom}
/>
),