leaflet.pub / leaflet
a tool for shared writing and social publishing
fork atom

enable publishing ordered lists

awarm.space c48ba9ba ea912e79

+145 -12
unified split
+104 -10
actions/publishToPublication.ts
··· 10 10 PubLeafletBlocksImage, 11 11 PubLeafletBlocksText, 12 12 PubLeafletBlocksUnorderedList, 13 + PubLeafletBlocksOrderedList, 13 14 PubLeafletDocument, 14 15 SiteStandardDocument, 15 16 PubLeafletContent, ··· 454 455 if (alignment) block.alignment = alignment; 455 456 return [block]; 456 457 } else { 457 - let block: PubLeafletPagesLinearDocument.Block = { 458 - $type: "pub.leaflet.pages.linearDocument#block", 459 - block: { 460 - $type: "pub.leaflet.blocks.unorderedList", 461 - children: await childrenToRecord(blockOrList.children, did), 462 - }, 463 - }; 464 - return [block]; 458 + let runs = splitListByStyle(blockOrList.children); 459 + let blocks = await Promise.all( 460 + runs.map(async (run) => { 461 + if (run.style === "ordered") { 462 + let block: PubLeafletPagesLinearDocument.Block = { 463 + $type: "pub.leaflet.pages.linearDocument#block", 464 + block: { 465 + $type: "pub.leaflet.blocks.orderedList", 466 + startIndex: 467 + run.children[0].block.listData?.listStart || 1, 468 + children: await orderedChildrenToRecord( 469 + run.children, 470 + did, 471 + ), 472 + }, 473 + }; 474 + return block; 475 + } else { 476 + let block: PubLeafletPagesLinearDocument.Block = { 477 + $type: "pub.leaflet.pages.linearDocument#block", 478 + block: { 479 + $type: "pub.leaflet.blocks.unorderedList", 480 + children: await unorderedChildrenToRecord( 481 + run.children, 482 + did, 483 + ), 484 + }, 485 + }; 486 + return block; 487 + } 488 + }), 489 + ); 490 + return blocks; 465 491 } 466 492 }), 467 493 ) 468 494 ).flat(); 469 495 } 470 496 471 - async function childrenToRecord(children: List[], did: string) { 497 + function splitListByStyle(children: List[]) { 498 + let runs: { style: "ordered" | "unordered"; children: List[] }[] = []; 499 + for (let child of children) { 500 + let style: "ordered" | "unordered" = 501 + child.block.listData?.listStyle === "ordered" 502 + ? "ordered" 503 + : "unordered"; 504 + let last = runs[runs.length - 1]; 505 + if (last && last.style === style) { 506 + last.children.push(child); 507 + } else { 508 + runs.push({ style, children: [child] }); 509 + } 510 + } 511 + return runs; 512 + } 513 + 514 + async function unorderedChildrenToRecord( 515 + children: List[], 516 + did: string, 517 + ): Promise<PubLeafletBlocksUnorderedList.ListItem[]> { 472 518 return ( 473 519 await Promise.all( 474 520 children.map(async (child) => { ··· 477 523 let record: PubLeafletBlocksUnorderedList.ListItem = { 478 524 $type: "pub.leaflet.blocks.unorderedList#listItem", 479 525 content, 480 - children: await childrenToRecord(child.children, did), 481 526 }; 527 + let sameStyle = child.children.filter( 528 + (c) => c.block.listData?.listStyle !== "ordered", 529 + ); 530 + let diffStyle = child.children.filter( 531 + (c) => c.block.listData?.listStyle === "ordered", 532 + ); 533 + if (sameStyle.length > 0) { 534 + record.children = await unorderedChildrenToRecord(sameStyle, did); 535 + } 536 + if (diffStyle.length > 0) { 537 + record.orderedListChildren = { 538 + $type: "pub.leaflet.blocks.orderedList", 539 + children: await orderedChildrenToRecord(diffStyle, did), 540 + }; 541 + } 542 + return record; 543 + }), 544 + ) 545 + ).flat(); 546 + } 547 + 548 + async function orderedChildrenToRecord( 549 + children: List[], 550 + did: string, 551 + ): Promise<PubLeafletBlocksOrderedList.ListItem[]> { 552 + return ( 553 + await Promise.all( 554 + children.map(async (child) => { 555 + let content = await blockToRecord(child.block, did); 556 + if (!content) return []; 557 + let record: PubLeafletBlocksOrderedList.ListItem = { 558 + $type: "pub.leaflet.blocks.orderedList#listItem", 559 + content, 560 + }; 561 + let sameStyle = child.children.filter( 562 + (c) => c.block.listData?.listStyle === "ordered", 563 + ); 564 + let diffStyle = child.children.filter( 565 + (c) => c.block.listData?.listStyle !== "ordered", 566 + ); 567 + if (sameStyle.length > 0) { 568 + record.children = await orderedChildrenToRecord(sameStyle, did); 569 + } 570 + if (diffStyle.length > 0) { 571 + record.unorderedListChildren = { 572 + $type: "pub.leaflet.blocks.unorderedList", 573 + children: await unorderedChildrenToRecord(diffStyle, did), 574 + }; 575 + } 482 576 return record; 483 577 }), 484 578 )
+41 -2
app/lish/[did]/[publication]/[rkey]/PostContent.tsx
··· 472 472 ))} 473 473 </ul> 474 474 ) : null; 475 + let orderedChildren = 476 + props.item.orderedListChildren?.children?.length ? ( 477 + <ol className="-ml-[7px] sm:ml-[7px]"> 478 + {props.item.orderedListChildren.children.map((child, index) => ( 479 + <OrderedListItem 480 + pages={props.pages} 481 + pollData={props.pollData} 482 + bskyPostData={props.bskyPostData} 483 + index={[...props.index, index]} 484 + item={child} 485 + did={props.did} 486 + key={index} 487 + className={props.className} 488 + pageId={props.pageId} 489 + startIndex={props.item.orderedListChildren?.startIndex} 490 + /> 491 + ))} 492 + </ol> 493 + ) : null; 475 494 return ( 476 495 <li className={`pb-0! flex flex-row gap-2`}> 477 496 <div ··· 488 507 index={props.index} 489 508 pageId={props.pageId} 490 509 /> 491 - {children}{" "} 510 + {children} 511 + {orderedChildren} 492 512 </div> 493 513 </li> 494 514 ); ··· 524 544 ))} 525 545 </ol> 526 546 ) : null; 547 + let unorderedChildren = 548 + props.item.unorderedListChildren?.children?.length ? ( 549 + <ul className="-ml-[7px] sm:ml-[7px]"> 550 + {props.item.unorderedListChildren.children.map((child, index) => ( 551 + <ListItem 552 + pages={props.pages} 553 + pollData={props.pollData} 554 + bskyPostData={props.bskyPostData} 555 + index={[...props.index, index]} 556 + item={child} 557 + did={props.did} 558 + key={index} 559 + className={props.className} 560 + pageId={props.pageId} 561 + /> 562 + ))} 563 + </ul> 564 + ) : null; 527 565 return ( 528 566 <li className={`pb-0! flex flex-row gap-2`}> 529 567 <div className="listMarker shrink-0 mx-2 z-1 mt-[14px]"> ··· 540 578 index={props.index} 541 579 pageId={props.pageId} 542 580 /> 543 - {children}{" "} 581 + {children} 582 + {unorderedChildren} 544 583 </div> 545 584 </li> 546 585 );