fix(react): address Doctor findings (#1143)

Accessibility/semantics pass aligned with React Doctor: role-based spans/divs become real buttons, role=status becomes <output>, modals use native <dialog>, author/peer flags render as <img>, and embed/challenge iframes are sandboxed. Includes review follow-ups: correct button chrome/centering/themed dialog colors and focus rings, the missing aria-label i18n keys (all languages), the Yandex image-search URL, clearer .bso setup steps, a keyboard-accessible image-search dropdown, and removal of the post-edit ('comment edited') display (mod edits unchanged).
This commit is contained in:
Tommaso Casaburi
2026-05-29 17:09:07 +07:00
committed by GitHub
parent ac95e58433
commit e082c7b428
132 changed files with 1753 additions and 1224 deletions
+9 -3
View File
@@ -283,7 +283,13 @@ const PostPage = () => {
const resolvedCommunityAddress = useResolvedCommunityAddress();
const resolvedCommunityIdentifier = useCommunityIdentifier(resolvedCommunityAddress);
const isInAllView = isAllView(pathname);
const routeState = useMemo(() => getEffectiveRouteUserState(locationState), [locationKey, pathname, locationState]);
const routeState = useMemo(() => {
// locationKey/pathname are intentional deps: getEffectiveRouteUserState falls back to the
// non-reactive window.history.state, so the memo must re-run on every navigation to re-read it.
void locationKey;
void pathname;
return getEffectiveRouteUserState(locationState);
}, [locationKey, pathname, locationState]);
const resolvedComment = useCommentWithFeedCache({ commentCid, autoUpdate: autoUpdateEnabled, community: resolvedCommunityIdentifier });
const queuedComment = useMemo(() => getQueuedCommentFromRouteState(routeState, commentCid), [routeState, commentCid]);
@@ -370,16 +376,16 @@ const PostPage = () => {
const queuedReplyHasMore = queuedReplyRepliesResult.hasMore;
const queuedReplyLoadMore = queuedReplyRepliesResult.loadMore;
const queuedReplyReset = (queuedReplyRepliesResult as { reset?: () => Promise<void> }).reset;
const queuedReplyReplies = (queuedReplyRepliesResult.updatedReplies?.length ? queuedReplyRepliesResult.updatedReplies : queuedReplyRepliesResult.replies) || [];
const replyPaginationOverride = useMemo(() => {
if (!queuedReply || !post?.cid) return undefined;
const queuedReplyReplies = (queuedReplyRepliesResult.updatedReplies?.length ? queuedReplyRepliesResult.updatedReplies : queuedReplyRepliesResult.replies) || [];
return {
hasMore: queuedReplyHasMore,
loadMore: queuedReplyLoadMore,
replies: mergeRepliesWithQueuedReply(queuedReplyReplies, queuedReply),
reset: queuedReplyReset,
};
}, [post?.cid, queuedReply, queuedReplyHasMore, queuedReplyLoadMore, queuedReplyReplies, queuedReplyReset]);
}, [post?.cid, queuedReply, queuedReplyHasMore, queuedReplyLoadMore, queuedReplyRepliesResult.replies, queuedReplyRepliesResult.updatedReplies, queuedReplyReset]);
useEffect(() => {
return () => {