fix: no initial focus set for focustrap

pull/3065/head
Audric Ackermann 3 months ago
parent ae96936a1a
commit b5d7a0e5e5

@ -63,15 +63,12 @@ export const SessionWrapperModal = (props: SessionWrapperModalType) => {
} }
}; };
const fallbackFocusId = 'session-wrapper-modal';
return ( return (
<FocusTrap focusTrapOptions={{ fallbackFocus: `#${fallbackFocusId}`, allowOutsideClick: true }}> <FocusTrap focusTrapOptions={{ initialFocus: false, allowOutsideClick: true }}>
<div <div
className={classNames('loki-dialog modal', additionalClassName || null)} className={classNames('loki-dialog modal', additionalClassName || null)}
onClick={handleClick} onClick={handleClick}
role="dialog" role="dialog"
id={fallbackFocusId}
> >
<div className="session-confirm-wrapper"> <div className="session-confirm-wrapper">
<div ref={modalRef} className="session-modal"> <div ref={modalRef} className="session-modal">

@ -69,7 +69,7 @@ export const SelectionOverlay = () => {
const classNameAndId = 'message-selection-overlay'; const classNameAndId = 'message-selection-overlay';
return ( return (
<FocusTrap focusTrapOptions={{ fallbackFocus: `#${classNameAndId}`, allowOutsideClick: true }}> <FocusTrap focusTrapOptions={{ initialFocus: false, allowOutsideClick: true }}>
<div className={classNameAndId} id={classNameAndId}> <div className={classNameAndId} id={classNameAndId}>
<div className="close-button"> <div className="close-button">
<SessionIconButton iconType="exit" iconSize="medium" onClick={onCloseOverlay} /> <SessionIconButton iconType="exit" iconSize="medium" onClick={onCloseOverlay} />

@ -1,6 +1,6 @@
/* eslint-disable no-restricted-syntax */ /* eslint-disable no-restricted-syntax */
import { createSelector } from '@reduxjs/toolkit'; import { createSelector } from '@reduxjs/toolkit';
import { filter, first, isEmpty, isFinite, isNumber, pick, sortBy, toNumber } from 'lodash'; import { filter, isEmpty, isFinite, isNumber, pick, sortBy, toNumber } from 'lodash';
import { import {
ConversationLookupType, ConversationLookupType,
@ -596,8 +596,7 @@ export const getMostRecentMessageId = (state: StateType): string | null => {
export const getMostRecentOutgoingMessageId = createSelector( export const getMostRecentOutgoingMessageId = createSelector(
getSortedMessagesOfSelectedConversation, getSortedMessagesOfSelectedConversation,
(messages: Array<MessageModelPropsWithoutConvoProps>): string | undefined => { (messages: Array<MessageModelPropsWithoutConvoProps>): string | undefined => {
return first(messages.filter(m => m.propsForMessage.direction === 'outgoing'))?.propsForMessage return messages.find(m => m.propsForMessage.direction === 'outgoing')?.propsForMessage.id;
.id;
} }
); );

Loading…
Cancel
Save