feat: update links for improved accessibility

apps/web/src/routes/_home/-sections/donate.tsx

@@ -202,7 +202,7 @@ export const DonationBanner = () => (
 					nativeButton={false}
 					className="h-11 gap-2 px-6"
 					render={
-						<a href="https://opencollective.com/reactive-resume/donate" target="_blank" rel="noopener">
+						<a href="https://opencollective.com/reactive-resume/donate" target="_blank" rel="noopener noreferrer">
 							<HeartIcon aria-hidden="true" weight="fill" className="text-rose-400 dark:text-rose-600" />
 							Open Collective
 							<span className="sr-only"> ({t`opens in new tab`})</span>
@@ -215,7 +215,7 @@ export const DonationBanner = () => (
 					nativeButton={false}
 					className="h-11 gap-2 px-6"
 					render={
-						<a href="https://github.com/sponsors/AmruthPillai" target="_blank" rel="noopener">
+						<a href="https://github.com/sponsors/AmruthPillai" target="_blank" rel="noopener noreferrer">
 							<GithubLogoIcon aria-hidden="true" weight="fill" className="text-zinc-400 dark:text-zinc-600" />
 							GitHub Sponsors
 							<span className="sr-only"> ({t`opens in new tab`})</span>

apps/web/src/routes/_home/-sections/faq.tsx

@@ -60,7 +60,7 @@ const getFaqItems = (): FAQItemData[] => [
 	},
 ];
 
-export function FAQ() {
+export function Faq() {
 	const faqItems = getFaqItems();
 
 	return (

apps/web/src/routes/_home/-sections/footer.tsx

@@ -129,7 +129,7 @@ function FooterLink({ url, label }: FooterLinkItem) {
 			<a
 				href={url}
 				target="_blank"
-				rel="noopener"
+				rel="noopener noreferrer"
 				className="relative inline-block text-sm transition-colors hover:text-foreground"
 				onMouseEnter={() => setIsHovered(true)}
 				onMouseLeave={() => setIsHovered(false)}

apps/web/src/routes/_home/index.tsx

@@ -1,7 +1,7 @@
 import { createFileRoute } from "@tanstack/react-router";
 import { createRootStructuredDataScript, getCanonicalRootUrl } from "@/libs/seo";
 import { DonationBanner } from "./-sections/donate";
-import { FAQ } from "./-sections/faq";
+import { Faq } from "./-sections/faq";
 import { Features } from "./-sections/features";
 import { Footer } from "./-sections/footer";
 import { Hero } from "./-sections/hero";
@@ -35,7 +35,7 @@ function RouteComponent() {
 					<Templates />
 					<Testimonials />
 					<DonationBanner />
-					<FAQ />
+					<Faq />
 					<Prefooter />
 					<Footer />
 				</div>

apps/web/src/routes/agent/$threadId.tsx

@@ -994,6 +994,7 @@ function AgentChatComposer({
 						ref={fileInputRef}
 						type="file"
 						multiple
+						aria-label={t`Upload attachments`}
 						className="hidden"
 						onChange={(event) => onUploadFiles(event.target.files)}
 					/>

apps/web/src/routes/builder/$resumeId/-sidebar/left/sections/picture.tsx

@@ -55,7 +55,14 @@ function PicturePreviewControls({
 }) {
 	return (
 		<div className="flex items-center gap-x-4">
-			<input ref={fileInputRef} type="file" accept="image/*" className="hidden" onChange={onUploadPicture} />
+			<input
+				ref={fileInputRef}
+				type="file"
+				accept="image/*"
+				aria-label={t`Upload picture`}
+				className="hidden"
+				onChange={onUploadPicture}
+			/>
 
 			<button
 				type="button"

apps/web/src/routes/builder/$resumeId/-sidebar/right/sections/information.test.tsx

@@ -47,6 +47,6 @@ describe("InformationSectionBuilder", () => {
 		renderInfo();
 		const docs = screen.getByText("Documentation").closest("a") as HTMLAnchorElement;
 		expect(docs.getAttribute("target")).toBe("_blank");
-		expect(docs.getAttribute("rel")).toBe("noopener");
+		expect(docs.getAttribute("rel")).toBe("noopener noreferrer");
 	});
 });

apps/web/src/routes/builder/$resumeId/-sidebar/right/sections/information.tsx

@@ -30,7 +30,7 @@ export function InformationSectionBuilder() {
 					nativeButton={false}
 					className="mt-2 whitespace-normal px-4! text-xs"
 					render={
-						<a href="http://opencollective.com/reactive-resume" target="_blank" rel="noopener">
+						<a href="http://opencollective.com/reactive-resume" target="_blank" rel="noopener noreferrer">
 							<HandHeartIcon />
 							<span className="truncate">
 								<Trans>Donate to Reactive Resume</Trans>
@@ -47,7 +47,7 @@ export function InformationSectionBuilder() {
 					className="text-xs"
 					nativeButton={false}
 					render={
-						<a href="https://docs.rxresu.me" target="_blank" rel="noopener">
+						<a href="https://docs.rxresu.me" target="_blank" rel="noopener noreferrer">
 							<Trans>Documentation</Trans>
 						</a>
 					}
@@ -59,7 +59,7 @@ export function InformationSectionBuilder() {
 					className="text-xs"
 					nativeButton={false}
 					render={
-						<a href="https://github.com/amruthpillai/reactive-resume" target="_blank" rel="noopener">
+						<a href="https://github.com/amruthpillai/reactive-resume" target="_blank" rel="noopener noreferrer">
 							<Trans>Source Code</Trans>
 						</a>
 					}
@@ -71,7 +71,7 @@ export function InformationSectionBuilder() {
 					className="text-xs"
 					nativeButton={false}
 					render={
-						<a href="https://github.com/amruthpillai/reactive-resume/issues" target="_blank" rel="noopener">
+						<a href="https://github.com/amruthpillai/reactive-resume/issues" target="_blank" rel="noopener noreferrer">
 							<Trans>Report a Bug</Trans>
 						</a>
 					}
@@ -83,7 +83,7 @@ export function InformationSectionBuilder() {
 					className="text-xs"
 					nativeButton={false}
 					render={
-						<a href="https://crowdin.com/project/reactive-resume" target="_blank" rel="noopener">
+						<a href="https://crowdin.com/project/reactive-resume" target="_blank" rel="noopener noreferrer">
 							<Trans>Translations</Trans>
 						</a>
 					}
@@ -95,7 +95,7 @@ export function InformationSectionBuilder() {
 					className="text-xs"
 					nativeButton={false}
 					render={
-						<a href="https://opencollective.com/reactive-resume/donate" target="_blank" rel="noopener">
+						<a href="https://opencollective.com/reactive-resume/donate" target="_blank" rel="noopener noreferrer">
 							<Trans>Sponsors</Trans>
 						</a>
 					}

apps/web/src/routes/builder/$resumeId/-sidebar/right/sections/resume-analysis.tsx

@@ -224,11 +224,11 @@ export function ResumeAnalysisSectionBuilder() {
 											<div key={suggestion.title} className="space-y-3 rounded-md border bg-card p-3">
 												<div className="flex items-center gap-2">
 													<span
-														role="img"
+														aria-hidden="true"
 														className={`size-2.5 shrink-0 rounded-full ring-1 ring-border ${impactCircleClass(suggestion.impact)}`}
 														title={impactLabel(suggestion.impact)}
-														aria-label={impactLabel(suggestion.impact)}
 													/>
+													<span className="sr-only">{impactLabel(suggestion.impact)}</span>
 													<div className="font-semibold text-sm tracking-tight">{suggestion.title}</div>
 												</div>