diff --git a/web/components/contract/contracts-grid.tsx b/web/components/contract/contracts-grid.tsx index 915facd9..cd7746ce 100644 --- a/web/components/contract/contracts-grid.tsx +++ b/web/components/contract/contracts-grid.tsx @@ -61,16 +61,30 @@ export function ContractsGrid(props: {

) } + // Reorganize the contracts so that the masonry layout shows them in the original order + // E.g. from [0, 1, 2, 3] => [0, 2, 1, 3] + // E.g. from [0, 1, 2, 3, 4, 5, 6] => [0, 2, 4, 1, 3, 5, 6] + const halfway = Math.floor(contracts.length / 2) + function reorder(i: number) { + return i < halfway + ? i * 2 + : Math.min((i - halfway) * 2 + 1, (contracts?.length ?? 1) - 1) + } + const twoColContracts = Array.from( + { length: contracts.length }, + (_, i) => contracts[reorder(i)] + ) return ( - +