remove about page

app/components/ui/post-info-bar.tsx

@@ -1,7 +1,26 @@
+import { Link } from '@remix-run/react'
 import moment from 'moment'
+import invariant from 'tiny-invariant'
 import { effectSizeOnTarget } from '#app/repositories/ranking.ts'
 import { type PostState, type Post } from '#app/types/api-types.ts'
 
+const effectSizeThresholds: number[] = [0.1, 0.3, 0.5, 0.7, 0.9]
+
+function convincingnessScale(effectSize: number): string {
+	let numberOfFlames = 0
+
+	for (let i = 0; i < effectSizeThresholds.length; i++) {
+		const threshold = effectSizeThresholds[i]
+		invariant(threshold !== undefined)
+		if (effectSize < threshold) {
+			break
+		}
+		numberOfFlames++
+	}
+
+	return '🔥'.repeat(numberOfFlames)
+}
+
 export function PostInfoBar({
 	post,
 	postState,
@@ -12,36 +31,23 @@ export function PostInfoBar({
 	const ageString = moment(post.createdAt).fromNow()
 	const effectSize = effectSizeOnTarget(postState.effectOnTargetPost)
 
+	invariant(effectSizeThresholds[0] !== undefined)
+
 	return (
 		<>
-			<div className="mb-1 flex w-full items-center gap-2 text-xs sm:items-baseline">
-				{postState.effectOnTargetPost !== null && (
-					<span title="Convincingness Score. How much this post changed people's opinion on the target post.">
-						<span className="opacity-50">{(effectSize * 100).toFixed(0)}%</span>{' '}
-						{convincingnessScale(effectSize)}
+			<Link to={`/stats/${post.id}`}>
+				<div className="mb-1 flex w-full items-center gap-2 text-xs sm:items-baseline">
+					{effectSize > effectSizeThresholds[0] && (
+						<span title="Convincingness Score. How much this post changed people's opinion on the target post.">
+							{convincingnessScale(effectSize)}
+						</span>
+					)}
+					<span className="opacity-50">
+						{postState.voteCount} {postState.voteCount == 1 ? 'vote' : 'votes'}
 					</span>
-				)}
-				<span className="opacity-50">{ageString}</span>
-				<span className="opacity-50">
-					{postState.voteCount} {postState.voteCount == 1 ? 'vote' : 'votes'}
-				</span>
-			</div>
+					<span className="opacity-50">{ageString}</span>
+				</div>
+			</Link>
 		</>
 	)
 }
-
-function convincingnessScale(effectSize: number): string {
-	if (effectSize < 0.1) {
-		return ''
-	} else if (effectSize < 0.3) {
-		return '🔥'
-	} else if (effectSize < 0.5) {
-		return '🔥🔥'
-	} else if (effectSize < 0.7) {
-		return '🔥🔥🔥'
-	} else if (effectSize < 0.9) {
-		return '🔥🔥🔥🔥'
-	} else {
-		return '🔥🔥🔥🔥🔥'
-	}
-}