admin: live and query log pages show client names

admin/src/features/clients/ClientsPage.tsx

@@ -56,23 +56,6 @@ const styles = stylex.create({
 	dash: {
 		color: colors.textMuted,
 	},
-	/**
-	 * A learned name is runtime state, not something the operator typed, so it
-	 * reads muted and carries an outlined "learned" tag. The tag is real text —
-	 * a screen reader announces it — because colour alone is not an affordance.
-	 */
-	learnedTag: {
-		marginLeft: "0.5rem",
-		borderWidth: 1,
-		borderStyle: "solid",
-		borderColor: colors.border,
-		borderRadius: "0.25rem",
-		paddingInline: "0.375rem",
-		paddingBlock: "0.125rem",
-		fontSize: "0.75rem",
-		lineHeight: "1rem",
-		color: colors.textMuted,
-	},
 	badge: {
 		marginLeft: "0.5rem",
 		borderRadius: "0.25rem",
@@ -153,9 +136,9 @@ export default function ClientsPage() {
 										{client.name !== "" ? (
 											client.name
 										) : client.learned_name !== "" ? (
-											<span {...stylex.props(styles.dash)}>
+											<span {...stylex.props(shared.learnedName)}>
 												{client.learned_name}
-												<span {...stylex.props(styles.learnedTag)}>learned</span>
+												<span {...stylex.props(shared.learnedTag)}>learned</span>
 											</span>
 										) : (
 											<span {...stylex.props(styles.dash)}>—</span>