feat: create AddPolicyEngine component with dynamic condition and action builders
This commit is contained in:
@@ -15,6 +15,7 @@ import {
|
||||
CustomSwitch,
|
||||
CustomCheckBox,
|
||||
CustomLoader,
|
||||
Skeleton,
|
||||
} from '../../../components/custom';
|
||||
import CustomSuccessModal from '../../../components/custom/CustomSuccessModal';
|
||||
import {
|
||||
@@ -544,7 +545,7 @@ export default function AddPolicyEngine() {
|
||||
jurisdictionId: Array.isArray(jurisdiction) && jurisdiction.length > 0 ? String(jurisdiction[0]) : undefined,
|
||||
jurisdictionIds: Array.isArray(jurisdiction) ? jurisdiction.map(String) : [],
|
||||
description: description || undefined,
|
||||
status: isDeploy ? 'active' : 'draft',
|
||||
status: isDeploy ? status.toLowerCase() : 'draft',
|
||||
audienceType: audienceType === 'Selected Cohorts' ? 'COHORT' : 'ALL',
|
||||
targetAudiences:
|
||||
audienceType === 'Selected Cohorts'
|
||||
@@ -759,8 +760,82 @@ export default function AddPolicyEngine() {
|
||||
|
||||
if (loadingPolicy) {
|
||||
return (
|
||||
<div className="flex flex-col items-center justify-center min-h-screen bg-white">
|
||||
<CustomLoader label="Loading Policy Details..." />
|
||||
<div className="flex flex-col h-full bg-white min-h-screen">
|
||||
{/* ─── Header Skeleton ────────────────────────────────────────────── */}
|
||||
<div className="flex items-center justify-between py-4 bg-white border-b border-gray-200">
|
||||
<div className="flex items-start gap-4">
|
||||
<div className="mt-1 p-1">
|
||||
<Skeleton variant="circular" className="w-5 h-5" />
|
||||
</div>
|
||||
<div className="flex flex-col gap-1">
|
||||
<Skeleton className="w-48 h-7" />
|
||||
<Skeleton className="w-32 h-4" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* ─── Body Content Skeleton ──────────────────────────────────────── */}
|
||||
<div className="flex-1 overflow-y-auto [scrollbar-width:none] [-ms-overflow-style:none] [&::-webkit-scrollbar]:hidden py-6 pb-32">
|
||||
<div className="w-full flex flex-col gap-6">
|
||||
|
||||
{/* Policy Information Card */}
|
||||
<div className="bg-[#FAFAFA] rounded-[16px] p-6 border border-gray-100">
|
||||
<div className="flex items-center gap-2 mb-5">
|
||||
<Skeleton className="w-8 h-8 rounded-lg" />
|
||||
<Skeleton className="w-40 h-5" />
|
||||
</div>
|
||||
|
||||
<div className="grid grid-cols-1 md:grid-cols-3 gap-6 mb-6">
|
||||
<div className="flex flex-col gap-2">
|
||||
<Skeleton className="w-24 h-4" />
|
||||
<Skeleton className="w-full h-11" />
|
||||
</div>
|
||||
<div className="flex flex-col gap-2">
|
||||
<Skeleton className="w-24 h-4" />
|
||||
<Skeleton className="w-full h-11" />
|
||||
</div>
|
||||
<div className="flex flex-col gap-2">
|
||||
<Skeleton className="w-24 h-4" />
|
||||
<Skeleton className="w-full h-11" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex flex-col gap-2">
|
||||
<Skeleton className="w-24 h-4" />
|
||||
<Skeleton className="w-full h-24" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Target Audience Card */}
|
||||
<div className="bg-[#FAFAFA] rounded-[16px] p-6 border border-gray-100">
|
||||
<div className="flex items-center gap-2 mb-5">
|
||||
<Skeleton className="w-8 h-8 rounded-lg" />
|
||||
<Skeleton className="w-40 h-5" />
|
||||
</div>
|
||||
<div className="flex flex-col gap-6">
|
||||
<div className="flex items-center gap-8">
|
||||
<Skeleton className="w-32 h-6" />
|
||||
<Skeleton className="w-32 h-6" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Rule Engine Card */}
|
||||
<div className="bg-[#FAFAFA] rounded-[16px] p-6 border border-gray-100">
|
||||
<div className="flex items-center justify-between mb-6">
|
||||
<div className="flex items-center gap-2">
|
||||
<Skeleton className="w-8 h-8 rounded-lg" />
|
||||
<Skeleton className="w-32 h-5" />
|
||||
</div>
|
||||
<Skeleton className="w-40 h-10 rounded-lg" />
|
||||
</div>
|
||||
<div className="border border-gray-100 rounded-[12px] p-6 bg-white">
|
||||
<Skeleton className="w-full h-32" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user