chore: switch to react-router v7

app/components/Code.tsx

@@ -1,45 +1,47 @@
-import { useState, HTMLProps } from 'react'
-import { CopyIcon, CheckIcon } from '@primer/octicons-react'
-
-import { cn } from '~/utils/cn'
-import { toast } from '~/components/Toaster'
+import { useState, HTMLProps } from 'react';
+import { CopyIcon, CheckIcon } from '@primer/octicons-react';
+import { cn } from '~/utils/cn';
+import { toast } from '~/components/Toaster';
 
 interface Props extends HTMLProps<HTMLSpanElement> {
-	isCopyable?: boolean
+	isCopyable?: boolean;
 }
 
 export default function Code(props: Props) {
-	const [isCopied, setIsCopied] = useState(false)
+	const [isCopied, setIsCopied] = useState(false);
 
 	return (
 		<>
-			<code className={cn(
-				'bg-ui-100 dark:bg-ui-800 p-0.5 rounded-md',
-				props.className
-			)}>
+			<code
+				className={cn(
+					'bg-ui-100 dark:bg-ui-800 p-0.5 rounded-md',
+					props.className,
+				)}
+			>
 				{props.children}
 			</code>
-			{props.isCopyable && (
+			{props.isCopyable && props.children ? (
 				<button
 					className={cn(
 						'ml-1 p-1 rounded-md',
 						'bg-ui-100 dark:bg-ui-800',
 						'text-ui-500 dark:text-ui-400',
-						'inline-flex items-center justify-center'
+						'inline-flex items-center justify-center',
 					)}
 					onClick={() => {
-						navigator.clipboard.writeText(props.children.join(''))
-						toast('Copied to clipboard')
-						setIsCopied(true)
-						setTimeout(() => setIsCopied(false), 1000)
+						navigator.clipboard.writeText(props.children.join(''));
+						toast('Copied to clipboard');
+						setIsCopied(true);
+						setTimeout(() => setIsCopied(false), 1000);
 					}}
 				>
-					{isCopied ?
-						<CheckIcon className="h-3 w-3" /> :
+					{isCopied ? (
+						<CheckIcon className="h-3 w-3" />
+					) : (
 						<CopyIcon className="h-3 w-3" />
-					}
+					)}
 				</button>
-			)}
+			) : undefined}
 		</>
-	)
+	);
 }