From 4cf1b16a864e3dc747137ddc6da5c109f73235cb Mon Sep 17 00:00:00 2001
From: Misode <misoloo64@gmail.com>
Date: Thu, 31 Oct 2024 04:20:02 +0100
Subject: [PATCH] Show max 50 list items by default

---
 src/app/components/generator/McdocRenderer.tsx | 11 +++++++++++
 1 file changed, 11 insertions(+)

diff --git a/src/app/components/generator/McdocRenderer.tsx b/src/app/components/generator/McdocRenderer.tsx
index a777c2e4..32543c98 100644
--- a/src/app/components/generator/McdocRenderer.tsx
+++ b/src/app/components/generator/McdocRenderer.tsx
@@ -680,6 +680,7 @@ function ListBody({ type: outerType, node, makeEdit, ctx }: Props<ListType | Pri
 
 	const { locale } = useLocale()
 	const { expand, collapse, isToggled } = useToggles()
+	const [maxShown, setMaxShown] = useState(50)
 
 	const type = node.typeDef && isListOrArray(node.typeDef) ? node.typeDef : outerType
 	const canAdd = (type.lengthRange?.max ?? Infinity) > (node?.children?.length ?? 0)
@@ -743,6 +744,16 @@ function ListBody({ type: outerType, node, makeEdit, ctx }: Props<ListType | Pri
 
 	return <>
 		{node.children.map((item, index) => {
+			if (index === maxShown) {
+				return <div class="node-header">
+					<label>{locale('entries_hidden', `${node.children.length - maxShown}`)}</label>
+					<button onClick={() => setMaxShown(Math.min(maxShown + 50, node.children.length))}>{locale('entries_hidden.more', '50')}</button>
+					<button onClick={() => setMaxShown(node.children.length)}>{locale('entries_hidden.all')}</button>
+				</div>
+			}
+			if (index > maxShown) {
+				return <></>
+			}
 			const child = item.value
 			const itemType = getItemType(type)
 			const childType = simplifyType(itemType, ctx)