Refactor: Update ProductConfigList component
- Import IoAlertCircleSharp from react-icons/io5 - Import Link from react-router-dom - Add conditional rendering for the title based on data length - Add Link and button for redirecting to the store when no configs exist
This commit is contained in:
@@ -6,7 +6,8 @@ import ConfigItem from "./components/ConfigItem";
|
|||||||
import ConfigItemLoading from "./components/ConfigItemLoading";
|
import ConfigItemLoading from "./components/ConfigItemLoading";
|
||||||
import ProfileImage from "./components/ProfileImage";
|
import ProfileImage from "./components/ProfileImage";
|
||||||
import { Fragment } from "react/jsx-runtime";
|
import { Fragment } from "react/jsx-runtime";
|
||||||
import { MdErrorOutline } from "react-icons/md";
|
import { IoAlertCircleSharp } from "react-icons/io5";
|
||||||
|
import { Link } from "react-router-dom";
|
||||||
|
|
||||||
const ProductConfigList = ({
|
const ProductConfigList = ({
|
||||||
data,
|
data,
|
||||||
@@ -30,9 +31,11 @@ const ProductConfigList = ({
|
|||||||
</Button>
|
</Button>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<p className="max-md:text-lg text-xl font-bold text-center">
|
{data?.result?.configs?.length !== 0 && (
|
||||||
لیست کانفیگ ها
|
<p className="max-md:text-lg text-xl font-bold text-center">
|
||||||
</p>
|
لیست کانفیگ ها
|
||||||
|
</p>
|
||||||
|
)}
|
||||||
<div
|
<div
|
||||||
className="w-full h-full p-3 max-sm:px-0 flex flex-col gap-3
|
className="w-full h-full p-3 max-sm:px-0 flex flex-col gap-3
|
||||||
justify-center items-center"
|
justify-center items-center"
|
||||||
@@ -50,10 +53,18 @@ const ProductConfigList = ({
|
|||||||
{error.message}
|
{error.message}
|
||||||
</Alert>
|
</Alert>
|
||||||
) : data?.result?.configs?.length === 0 ? (
|
) : data?.result?.configs?.length === 0 ? (
|
||||||
<div className="w-full h-full flex flex-col gap-3 justify-center items-center">
|
<Link to={'/configs/3'} className="w-full h-full flex flex-col gap-3 justify-center items-center">
|
||||||
<MdErrorOutline className="w-[5rem] h-[5rem]" />
|
<IoAlertCircleSharp className="max-md:w-[3.5rem] max-md:h-[3.5rem] w-[5rem] h-[5rem]" />
|
||||||
<p className="text-sm md:text-base"> کانفیگی وجود ندارد </p>
|
<div
|
||||||
</div>
|
className="w-full h-auto flex flex-col gap-5 justify-center items-center"
|
||||||
|
>
|
||||||
|
<p className="text-sm md:text-base">
|
||||||
|
{" "}
|
||||||
|
شما در حال حاضر سرویسی ندارید برای خرید کلیک کنید{" "}
|
||||||
|
</p>
|
||||||
|
<Button>برو به فروشگاه</Button>
|
||||||
|
</div>
|
||||||
|
</Link>
|
||||||
) : (
|
) : (
|
||||||
data?.result?.configs?.map((item) => {
|
data?.result?.configs?.map((item) => {
|
||||||
return (
|
return (
|
||||||
|
|||||||
Reference in New Issue
Block a user