admin/marco.pms.web
1
0
Fork 0
Code Issues Pull Requests 4 Actions Packages Projects Releases Wiki Activity

Sorting in Subscription page.

Browse Source
This commit is contained in:
Kartik Sharma 2025-12-13 11:20:16 +05:30
parent e695807e77
commit 3ff80ee032
1 changed files with 51 additions and 48 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

99
src/pages/Home/SubscriptionPlans.jsx
View File

@ -104,61 +104,64 @@ const SubscriptionPlans = () => {
<div className="accordion" id={`planFeatures-${plan.id}`}> <div className="accordion" id={`planFeatures-${plan.id}`}>
{plan.features?.modules && {plan.features?.modules &&
Object.entries(plan.features.modules).map(([key, mod]) => { Object.entries(plan.features.modules)
if (!mod || !mod.name) return null; .sort(([, a], [, b]) => Number(b.enabled) - Number(a.enabled))
.map(([key, mod]) => {
return ( if (!mod || !mod.name) return null;
<div className="accordion-item mb-2" key={`${plan.id}-${mod.id}`}>
<h2 id={`heading-${plan.id}-${mod.id}`} className="accordion-header"> return (
<button <div className="accordion-item mb-2" key={`${plan.id}-${mod.id}`}>
className="accordion-button py-2 d-flex justify-content-between align-items-center" <h2 id={`heading-${plan.id}-${mod.id}`} className="accordion-header">
type="button" <button
data-bs-toggle="collapse" className="accordion-button py-2 d-flex justify-content-between align-items-center"
data-bs-target={`#collapse-${plan.id}-${mod.id}`} type="button"
aria-expanded="true" data-bs-toggle="collapse"
aria-controls={`collapse-${plan.id}-${mod.id}`} data-bs-target={`#collapse-${plan.id}-${mod.id}`}
aria-expanded="true"
aria-controls={`collapse-${plan.id}-${mod.id}`}
>
<span className="fw-semibold d-flex align-items-center">
{mod.enabled ? (
<i className="fa-regular fa-circle-check text-success me-2"></i>
) : (
<i className="fa-regular fa-circle-xmark text-danger me-2"></i>
)}
{mod.name}
</span>
<i className="bx bx-chevron-down ms-2"></i>
</button>
</h2>
<div
id={`collapse-${plan.id}-${mod.id}`}
className="accordion-collapse collapse show"
aria-labelledby={`heading-${plan.id}-${mod.id}`}
> >
<span className="fw-semibold d-flex align-items-center"> <div className="accordion-body py-2">
{mod.enabled ? ( {mod.features?.length > 0 ? (
<i className="fa-regular fa-circle-check text-success me-2"></i> <ul className="list-unstyled ms-2">
{mod.features.map((feat) => (
<li key={feat.id} className="d-flex align-items-start mb-1">
<i
className={`bx bxs-circle ${mod.enabled ? "text-success" : "text-danger"
} me-2 mt-1`}
style={{ fontSize: "8px" }}
></i>
<span>{feat.name}</span>
</li>
))}
</ul>
) : ( ) : (
<i className="fa-regular fa-circle-xmark text-danger me-2"></i> <p className="text-muted small mb-0">No additional features</p>
)} )}
{mod.name} </div>
</span>
<i className="bx bx-chevron-down ms-2"></i>
</button>
</h2>
<div
id={`collapse-${plan.id}-${mod.id}`}
className="accordion-collapse collapse show"
aria-labelledby={`heading-${plan.id}-${mod.id}`}
>
<div className="accordion-body py-2">
{mod.features?.length > 0 ? (
<ul className="list-unstyled ms-2">
{mod.features.map((feat) => (
<li key={feat.id} className="d-flex align-items-start mb-1">
<i
className={`bx bxs-circle ${mod.enabled ? "text-success" : "text-danger"
} me-2 mt-1`}
style={{ fontSize: "8px" }}
></i>
<span>{feat.name}</span>
</li>
))}
</ul>
) : (
<p className="text-muted small mb-0">No additional features</p>
)}
</div> </div>
</div> </div>
</div>
); );
})} })}
</div> </div>