From 7a1596cad9d047fe5f6508b3034624de08886c5e Mon Sep 17 00:00:00 2001
From: Julia Johannesen <julia@insertdomain.name>
Date: Tue, 1 Oct 2024 10:06:40 -0400
Subject: [PATCH 1/3] Make post form attachments accessible

Adds a role="button", tabindex, and @keydown to MkPostFormAttaches in
order to make it accessible to keyboard users.
---
 .../src/components/MkPostFormAttaches.vue         | 15 +++++++++++++--
 1 file changed, 13 insertions(+), 2 deletions(-)

diff --git a/packages/frontend/src/components/MkPostFormAttaches.vue b/packages/frontend/src/components/MkPostFormAttaches.vue
index a3fb7c691f..ce804a916c 100644
--- a/packages/frontend/src/components/MkPostFormAttaches.vue
+++ b/packages/frontend/src/components/MkPostFormAttaches.vue
@@ -7,7 +7,14 @@ SPDX-License-Identifier: AGPL-3.0-only
 <div v-show="props.modelValue.length != 0" :class="$style.root">
 	<Sortable :modelValue="props.modelValue" :class="$style.files" itemKey="id" :animation="150" :delay="100" :delayOnTouchOnly="true" @update:modelValue="v => emit('update:modelValue', v)">
 		<template #item="{element}">
-			<div :class="$style.file" @click="showFileMenu(element, $event)" @contextmenu.prevent="showFileMenu(element, $event)">
+			<div
+				:class="$style.file"
+				@click="showFileMenu(element, $event)"
+				@keydown.space.enter="showFileMenu(element, $event)"
+				@contextmenu.prevent="showFileMenu(element, $event)"
+				role="button"
+				tabindex="0"
+			>
 				<MkDriveFileThumbnail :data-id="element.id" :class="$style.thumbnail" :file="element" fit="cover"/>
 				<div v-if="element.isSensitive" :class="$style.sensitive">
 					<i class="ti ti-eye-exclamation" style="margin: auto;"></i>
@@ -132,7 +139,7 @@ async function crop(file: Misskey.entities.DriveFile): Promise<void> {
 	emit('replaceFile', file, newFile);
 }
 
-function showFileMenu(file: Misskey.entities.DriveFile, ev: MouseEvent): void {
+function showFileMenu(file: Misskey.entities.DriveFile, ev: MouseEvent|KeyboardEvent): void {
 	if (menuShowing) return;
 
 	const isImage = file.type.startsWith('image/');
@@ -187,6 +194,10 @@ function showFileMenu(file: Misskey.entities.DriveFile, ev: MouseEvent): void {
 	border-radius: var(--radius-xs);
 	overflow: hidden;
 	cursor: move;
+
+	&:focus-visible {
+		outline-offset: 4px;
+	}
 }
 
 .thumbnail {

From 0aec0bb402021f4f6572c5fa481bc1273e3c9eed Mon Sep 17 00:00:00 2001
From: Julia Johannesen <julia@insertdomain.name>
Date: Tue, 1 Oct 2024 10:30:02 -0400
Subject: [PATCH 2/3] Fix to match upstream

Upstreams linter was mad about the attributes not being before the event
handlers, so this fixes that to match upstream when we end up merging
2024.9 (assuming it gets included in that release)
---
 packages/frontend/src/components/MkPostFormAttaches.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/frontend/src/components/MkPostFormAttaches.vue b/packages/frontend/src/components/MkPostFormAttaches.vue
index ce804a916c..7914f72369 100644
--- a/packages/frontend/src/components/MkPostFormAttaches.vue
+++ b/packages/frontend/src/components/MkPostFormAttaches.vue
@@ -9,11 +9,11 @@ SPDX-License-Identifier: AGPL-3.0-only
 		<template #item="{element}">
 			<div
 				:class="$style.file"
+				role="button"
+				tabindex="0"
 				@click="showFileMenu(element, $event)"
 				@keydown.space.enter="showFileMenu(element, $event)"
 				@contextmenu.prevent="showFileMenu(element, $event)"
-				role="button"
-				tabindex="0"
 			>
 				<MkDriveFileThumbnail :data-id="element.id" :class="$style.thumbnail" :file="element" fit="cover"/>
 				<div v-if="element.isSensitive" :class="$style.sensitive">

From 91889dfed3fe8efe7eb7bfe7ea24aa0ada379e46 Mon Sep 17 00:00:00 2001
From: Julia Johannesen <julia@insertdomain.name>
Date: Tue, 1 Oct 2024 13:07:32 -0400
Subject: [PATCH 3/3] Add spacing in type signature

Again, to match the upstream PR.
---
 packages/frontend/src/components/MkPostFormAttaches.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/frontend/src/components/MkPostFormAttaches.vue b/packages/frontend/src/components/MkPostFormAttaches.vue
index 7914f72369..7d24828e5b 100644
--- a/packages/frontend/src/components/MkPostFormAttaches.vue
+++ b/packages/frontend/src/components/MkPostFormAttaches.vue
@@ -139,7 +139,7 @@ async function crop(file: Misskey.entities.DriveFile): Promise<void> {
 	emit('replaceFile', file, newFile);
 }
 
-function showFileMenu(file: Misskey.entities.DriveFile, ev: MouseEvent|KeyboardEvent): void {
+function showFileMenu(file: Misskey.entities.DriveFile, ev: MouseEvent | KeyboardEvent): void {
 	if (menuShowing) return;
 
 	const isImage = file.type.startsWith('image/');