diff --git a/packages/web/components/patterns/CardMenu.tsx b/packages/web/components/patterns/CardMenu.tsx index bfd60f68c..6a3c27dc0 100644 --- a/packages/web/components/patterns/CardMenu.tsx +++ b/packages/web/components/patterns/CardMenu.tsx @@ -58,7 +58,7 @@ export function CardMenu(props: CardMenuProps): JSX.Element { /> props.actionHandler('editTitle')} - title="Edit metadata" + title="Edit info" /> {props.item.readingProgressPercent < 98 ? ( { - // remove focus from modal - ;(document.activeElement as HTMLElement).blur() + onInteractOutside={(event) => { + event.preventDefault() }} > { - // remove focus from modal - ;(document.activeElement as HTMLElement).blur() + onInteractOutside={(event) => { + event.preventDefault() }} > diff --git a/packages/web/components/templates/homeFeed/AddLinkModal.tsx b/packages/web/components/templates/homeFeed/AddLinkModal.tsx index 319394646..8abf6fec4 100644 --- a/packages/web/components/templates/homeFeed/AddLinkModal.tsx +++ b/packages/web/components/templates/homeFeed/AddLinkModal.tsx @@ -57,9 +57,8 @@ export function AddLinkModal(props: AddLinkModalProps): JSX.Element { maxHeight: '300', fontFamily: '$inter', }} - onInteractOutside={() => { - // remove focus from modal - ;(document.activeElement as HTMLElement).blur() + onInteractOutside={(event) => { + event.preventDefault() }} > @@ -82,8 +81,9 @@ export function AddLinkModal(props: AddLinkModalProps): JSX.Element { } const AddLinkTab = (props: AddLinkModalProps): JSX.Element => { - const [errorMessage, setErrorMessage] = - useState(undefined) + const [errorMessage, setErrorMessage] = useState( + undefined + ) const addLink = useCallback( async (link: string) => { @@ -104,8 +104,9 @@ const AddLinkTab = (props: AddLinkModalProps): JSX.Element => { } const AddFeedTab = (props: AddLinkModalProps): JSX.Element => { - const [errorMessage, setErrorMessage] = - useState(undefined) + const [errorMessage, setErrorMessage] = useState( + undefined + ) const subscribe = useCallback( async (feedUrl: string) => { diff --git a/packages/web/components/templates/homeFeed/EditItemModals.tsx b/packages/web/components/templates/homeFeed/EditItemModals.tsx index 4d7881e47..21182d1d6 100644 --- a/packages/web/components/templates/homeFeed/EditItemModals.tsx +++ b/packages/web/components/templates/homeFeed/EditItemModals.tsx @@ -217,7 +217,6 @@ function EditItemModal(props: EditItemModalProps): JSX.Element { defaultOpen modal={true} onOpenChange={() => { - console.log('props.onOpenChange') props.onOpenChange(false) }} css={{}} @@ -225,9 +224,8 @@ function EditItemModal(props: EditItemModalProps): JSX.Element { { - // remove focus from modal - ;(document.activeElement as HTMLElement).blur() + onInteractOutside={(event) => { + event.preventDefault() }} onEscapeKeyDown={(event) => { props.onOpenChange(false) diff --git a/packages/web/components/templates/homeFeed/HomeFeedContainer.tsx b/packages/web/components/templates/homeFeed/HomeFeedContainer.tsx index ef186a759..d5ac0e349 100644 --- a/packages/web/components/templates/homeFeed/HomeFeedContainer.tsx +++ b/packages/web/components/templates/homeFeed/HomeFeedContainer.tsx @@ -1180,7 +1180,10 @@ export function LibraryItemsLayout( updateItem={(item: LibraryItem) => props.actionHandler('update-item', item) } - onOpenChange={() => props.setShowEditTitleModal(false)} + onOpenChange={() => { + props.setShowEditTitleModal(false) + props.setLinkToEdit(undefined) + }} item={props.linkToEdit as LibraryItem} /> )} diff --git a/packages/web/pages/settings/emails/recent.tsx b/packages/web/pages/settings/emails/recent.tsx index 4a4b119d6..326fa0087 100644 --- a/packages/web/pages/settings/emails/recent.tsx +++ b/packages/web/pages/settings/emails/recent.tsx @@ -108,9 +108,8 @@ const ViewRecentEmailModal = ( width: '100%', maxWidth: '650px', }} - onInteractOutside={() => { - // remove focus from modal - ;(document.activeElement as HTMLElement).blur() + onInteractOutside={(event) => { + event.preventDefault() }} > @@ -152,11 +151,13 @@ const ViewRecentEmailModal = ( export default function RecentEmails(): JSX.Element { const { recentEmails, revalidate, isValidating } = useGetRecentEmailsQuery() - const [viewingEmailText, setViewingEmailText] = - useState(undefined) + const [viewingEmailText, setViewingEmailText] = useState< + RecentEmail | undefined + >(undefined) - const [viewingEmailHtml, setViewingEmailHtml] = - useState(undefined) + const [viewingEmailHtml, setViewingEmailHtml] = useState< + RecentEmail | undefined + >(undefined) applyStoredTheme()