gitea_admin/tech_mahindra
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Render charts in separate row below tiles

Browse Source
This commit is contained in:
Bhanu Prakash Sai Potteri 2026-05-23 11:21:56 +05:30
parent 8a32282c09
commit a35c7824c9
1 changed files with 20 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
src/components/RecordViewTable.tsx
View File

@ -268,18 +268,28 @@ export default function RecordViewTable({ viewId, onRowClick, toolbarAction }: P
onRowClick ? onRowClick(id) : navigate(`/detail/${id}`); onRowClick ? onRowClick(id) : navigate(`/detail/${id}`);
}; };
const tileSpecs = analyticsSpecs.filter(a => a.kind === "tile");
const chartSpecs = analyticsSpecs.filter(a => a.kind === "chart");
const analyticsRow = analyticsSpecs.length > 0 ? ( const analyticsRow = analyticsSpecs.length > 0 ? (
<div className="flex flex-wrap items-stretch gap-3 mb-4"> <div className="space-y-3 mb-4">
{analyticsSpecs.map((a, i) => { {tileSpecs.length > 0 && (
if (a.kind === "tile") { <div className="flex flex-wrap items-stretch gap-3">
{tileSpecs.map((a, i) => {
const tv = tileValues.find(t => t.tile_uid === a.uid); const tv = tileValues.find(t => t.tile_uid === a.uid);
return <Tile key={i} title={a.title} value={tv?.value as number | undefined} loading={loading || dataLoading} />; return <Tile key={`tile-${i}`} title={a.title} value={tv?.value as number | undefined} loading={loading || dataLoading} />;
}
const cd = chartData.find(c => c.chart_uid === a.uid);
const Chart = a.chartType === "pie" ? PieChart : BarChart;
return <Chart key={i} title={a.title} rows={cd?.rows ?? []} loading={loading || dataLoading} />;
})} })}
</div> </div>
)}
{chartSpecs.length > 0 && (
<div className="flex flex-wrap items-stretch gap-3">
{chartSpecs.map((a, i) => {
const cd = chartData.find(c => c.chart_uid === a.uid);
const Chart = (a as { chartType?: string }).chartType === "pie" ? PieChart : BarChart;
return <Chart key={`chart-${i}`} title={a.title} rows={cd?.rows ?? []} loading={loading || dataLoading} />;
})}
</div>
)}
</div>
) : null; ) : null;
if (loading) return <>{analyticsRow}<TableSkeleton rows={6} cols={fields.length || 6} /></>; if (loading) return <>{analyticsRow}<TableSkeleton rows={6} cols={fields.length || 6} /></>;