Merge pull request #378 from cloudflare/rule-nums

show rule number/index instead of id in UI

frontend/src/routes/(admin)/settings/(admin)/server-settings/rules/index.tsx

@@ -94,11 +94,11 @@ export default component$(() => {
 			</Form>
 			<div>
 				{rules.value.map(({ id, text }, idx) => {
-					const ruleId = idx + 1
-					const ruleBtnText = `${ruleId}. ${text.slice(0, 27)}${text.length > 27 ? '...' : ''}`
+					const ruleNumber = idx + 1
+					const ruleBtnText = `${ruleNumber}. ${text.slice(0, 27)}${text.length > 27 ? '...' : ''}`
 					return (
 						<div key={id} class="p-4 my-4 bg-wildebeest-600 rounded">
-							<Link href={`./edit/${ruleId}`} class="max-w-max inline-block mb-4 no-underline text-lg font-semibold">
+							<Link href={`./edit/${id}`} class="max-w-max inline-block mb-4 no-underline text-lg font-semibold">
 								{ruleBtnText}
 							</Link>
 							<div class="flex justify-between text-wildebeest-400">

frontend/src/routes/(frontend)/about/index.tsx

@@ -122,10 +122,10 @@ export default component$(() => {
 						<div class="my-1">
 							<Accordion title="Server rules">
 								<ol class="list-none flex flex-col gap-1 my-5 px-6">
-									{aboutInfo.rules.map(({ id, text }) => (
+									{aboutInfo.rules.map(({ id, text }, idx) => (
 										<li key={id} class="flex items-center border-wildebeest-700 border-b last-of-type:border-b-0 py-2">
 											<span class="bg-wildebeest-vibrant-400 text-wildebeest-900 mr-4 my-1 p-4 rounded-full w-5 h-5 grid place-content-center">
-												{id}
+												{idx + 1}
 											</span>
 											<span>{text}</span>
 										</li>