diff --git a/src/app/admin/contract-management/components/contractTemplateList.tsx b/src/app/admin/contract-management/components/contractTemplateList.tsx
index 6aabfc0..4ab8b3e 100644
--- a/src/app/admin/contract-management/components/contractTemplateList.tsx
+++ b/src/app/admin/contract-management/components/contractTemplateList.tsx
@@ -13,11 +13,16 @@ type ContractTemplate = {
   name: string;
   type?: string;
   contract_type?: string | null;
+  user_type?: string | null;
   version: number;
   status: 'draft' | 'published' | 'archived' | string;
   updatedAt?: string;
 };
 
+function Pill({ children, className }: { children: React.ReactNode; className: string }) {
+  return <span className={`px-2 py-0.5 rounded text-xs font-semibold border ${className}`}>{children}</span>;
+}
+
 function StatusBadge({ status }: { status: string }) {
   const map: Record<string, string> = {
     draft: 'bg-gray-100 text-gray-800 border border-gray-300',
@@ -57,6 +62,7 @@ export default function ContractTemplateList({ refreshKey = 0, onEdit }: Props)
         name: x.name ?? 'Untitled',
         type: x.type,
         contract_type: x.contract_type ?? x.contractType ?? null,
+        user_type: x.user_type ?? x.userType ?? null,
         version: Number(x.version ?? 1),
         status: (x.state === 'active') ? 'published' : 'draft',
         updatedAt: x.updatedAt ?? x.modifiedAt ?? x.updated_at,
@@ -94,7 +100,9 @@ export default function ContractTemplateList({ refreshKey = 0, onEdit }: Props)
 
     try {
       const updated = await updateTemplateState(id, target as 'active' | 'inactive');
+      // Update clicked item immediately, then refresh list to reflect any auto-deactivations.
       setItems((prev) => prev.map((i) => i.id === id ? { ...i, status: updated.state === 'active' ? 'published' : 'draft' } : i));
+      await load();
     } catch {}
   };
 
@@ -138,10 +146,20 @@ export default function ContractTemplateList({ refreshKey = 0, onEdit }: Props)
             <div className="flex items-center gap-2">
               <p className="font-semibold text-lg text-gray-900 truncate">{c.name}</p>
               <StatusBadge status={c.status} />
-              {c.type === 'contract' && c.contract_type && (
-                <span className="px-2 py-0.5 rounded text-xs font-semibold bg-indigo-50 text-indigo-800 border border-indigo-200">
+              {c.type && (
+                <Pill className="bg-slate-50 text-slate-800 border-slate-200">
+                  {c.type === 'contract' ? 'Contract' : c.type === 'bill' ? 'Bill' : 'Other'}
+                </Pill>
+              )}
+              {c.type === 'contract' && (
+                <Pill className="bg-indigo-50 text-indigo-800 border-indigo-200">
                   {c.contract_type === 'gdpr' ? 'GDPR' : 'Contract'}
-                </span>
+                </Pill>
+              )}
+              {c.user_type && (
+                <Pill className="bg-emerald-50 text-emerald-800 border-emerald-200">
+                  {c.user_type === 'personal' ? 'Personal' : c.user_type === 'company' ? 'Company' : 'Both'}
+                </Pill>
               )}
             </div>
             <p className="text-xs text-gray-500">Version {c.version}{c.updatedAt ? ` • Updated ${new Date(c.updatedAt).toLocaleString()}` : ''}</p>