Added, beneficiaries, site visits and change management
This commit is contained in:
@@ -24,6 +24,7 @@ import { HelpTooltip } from '../ui/HelpTooltip';
|
||||
import { useToast } from '../ui/Toast';
|
||||
import { ExportButton } from '../ui/ExportButton';
|
||||
import { ExportColumn } from '../../utils/exportUtils';
|
||||
import { useTableSort, SortableTh } from '../../utils/tableSort';
|
||||
import {
|
||||
Rule,
|
||||
Programme,
|
||||
@@ -233,6 +234,20 @@ export const RulesSection: React.FC<RulesSectionProps> = ({
|
||||
});
|
||||
}, [rules, selectedProgrammeFilter, statusFilter, searchTerm, programmeMap]);
|
||||
|
||||
// Sorting hook
|
||||
const {
|
||||
sortedData: sortedRules,
|
||||
sortColumn: ruleSortCol,
|
||||
sortDirection: ruleSortDir,
|
||||
handleSort: handleRuleSort,
|
||||
} = useTableSort<Rule>(filteredRules, null, null, {
|
||||
name: (r: Rule) => r.name,
|
||||
programmeId: (r: Rule) => programmeMap.get(String(r.programmeId))?.name || `Programme #${r.programmeId}`,
|
||||
version: (r: Rule) => r.version || 1,
|
||||
status: (r: Rule) => getActivityStatusBadge(r.status).label,
|
||||
createdAt: (r: Rule) => r.createdAt,
|
||||
});
|
||||
|
||||
// Export columns definition
|
||||
const ruleExportColumns: ExportColumn<Rule>[] = useMemo(
|
||||
() => [
|
||||
@@ -396,16 +411,26 @@ export const RulesSection: React.FC<RulesSectionProps> = ({
|
||||
<table className="w-full text-left border-collapse">
|
||||
<thead>
|
||||
<tr className="border-b border-slate-800/80 bg-slate-900/50 text-[11px] font-semibold text-slate-400 uppercase tracking-wider">
|
||||
<th className="py-3 px-4">Rule Title & Directives</th>
|
||||
<th className="py-3 px-4">Associated Programme</th>
|
||||
<th className="py-3 px-4">Version</th>
|
||||
<th className="py-3 px-4">Status</th>
|
||||
<th className="py-3 px-4">Audit Info</th>
|
||||
<SortableTh column="name" currentColumn={ruleSortCol} direction={ruleSortDir} onSort={handleRuleSort} className="py-3 px-4">
|
||||
Rule Title & Directives
|
||||
</SortableTh>
|
||||
<SortableTh column="programmeId" currentColumn={ruleSortCol} direction={ruleSortDir} onSort={handleRuleSort} className="py-3 px-4">
|
||||
Associated Programme
|
||||
</SortableTh>
|
||||
<SortableTh column="version" currentColumn={ruleSortCol} direction={ruleSortDir} onSort={handleRuleSort} className="py-3 px-4">
|
||||
Version
|
||||
</SortableTh>
|
||||
<SortableTh column="status" currentColumn={ruleSortCol} direction={ruleSortDir} onSort={handleRuleSort} className="py-3 px-4">
|
||||
Status
|
||||
</SortableTh>
|
||||
<SortableTh column="createdAt" currentColumn={ruleSortCol} direction={ruleSortDir} onSort={handleRuleSort} className="py-3 px-4">
|
||||
Audit Info
|
||||
</SortableTh>
|
||||
<th className="py-3 px-4 text-right">Actions</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody className="divide-y divide-slate-800/60 text-xs text-slate-300">
|
||||
{filteredRules.map((r) => {
|
||||
{sortedRules.map((r) => {
|
||||
const statusBadge = getActivityStatusBadge(r.status);
|
||||
const parentProg = programmeMap.get(String(r.programmeId));
|
||||
|
||||
|
||||
Reference in New Issue
Block a user