1#@!#!123s

ALWAYS HENGHENG888 1#@!#!123s
: / var / www / chinawholesale-frontend-next / src / components / pages / faq /
Filename : FaqComponent.js
back
'use client'
import React, {useEffect} from "react";
import parser from "html-react-parser";
import { useFaqData} from "@/api/generale";
import {Collapse} from "antd";
import PageCardComponent from "@/components/mixed/PageCardComponent";
import ProductDetailsSkeleton from "@/components/skeleton/ProductDetailsSkeleton";
import {useQueryClient} from "@tanstack/react-query";
import PageNotFound from '@/components/pages/not-found/PageNotFound'

const FaqComponent = () => {

	const queryCache = useQueryClient();
	const {data: faqs, isLoading} = useFaqData();

	useEffect(() => {
		return () => {
			queryCache.removeQueries(['faqsPageData'])
		}
	}, []) // eslint-disable-line react-hooks/exhaustive-deps

	if (isLoading) {
		return (
			<div className="my-3 my-lg-5">
				<ProductDetailsSkeleton/>
			</div>
		)
	}

	if (isLoading) {
		return (
			<div className="my-3 my-lg-5">
				<ProductDetailsSkeleton/>
			</div>
		)
	}

	if (!faqs?.length) {
		return <PageNotFound/>
	}


	return (
		<>
			<PageCardComponent title={'Frequently Asked Questions'}>
				<Collapse
					accordion={false}
					expandIconPosition="end"
					defaultActiveKey={['1']}>
					{
						faqs?.map((faq, index) =>
							<Collapse.Panel key={index + 1} header={parser(faq.post_title)}>
								{parser(faq.post_content)}
							</Collapse.Panel>
						)
					}
				</Collapse>
			</PageCardComponent>
		</>
	);
};

export default FaqComponent;