fix: prevent keypress event to trigger hotkeys in emoji selection mod…

…al (#300)
BDX-town · Apr 21, 2024 · ef96030 · ef96030
1 parent 063aee1
commit ef96030
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 12 deletions.
diff --git a/app/soapbox/components/emoji_picker.tsx b/app/soapbox/components/emoji_picker.tsx
@@ -9,7 +9,7 @@ import { createSelector } from 'reselect';
 
 import { IconButton } from 'soapbox/components/ui';
 import { useTheme } from 'soapbox/hooks';
-import { isMobile } from 'soapbox/is_mobile';
+import { isMobile, isUserTouching } from 'soapbox/is_mobile';
 
 const messages = defineMessages({
   emoji: { id: 'emoji_button.label', defaultMessage: 'Insert emoji' },
@@ -53,7 +53,7 @@ interface IWrapper {
 const Wrapper: React.FC<IWrapper> = ({ show, onClose, children }) => {
   if (!show) return null;
   return ReactDOM.createPortal(
-    <div className='emoji-picker fixed top-0 left-0 w-screen h-screen bg-gray-800 z-[100]'>
+    <div className='emoji-picker fixed top-0 left-0 w-screen h-screen bg-gray-800 z-[100]' onKeyPress={(e) => e.stopPropagation()}>
       <div className='bg-white dark:bg-slate-800  flex flex-col overflow-hidden sm:rounded-lg absolute top-1/2 left-1/2 -translate-x-[50%] -translate-y-[50%] '>
         <div className='p-1'>
           <IconButton
@@ -110,6 +110,7 @@ export const EmojiPickerModal: React.FC<IEmojiPickerModal> = ({ custom_emojis =
   return (
     <Wrapper show={active} onClose={handleClose}>
       <Picker
+        autoFocus={!isUserTouching()}
         theme={theme}
         dynamicWidth={isMobile(window.innerWidth)}
         categories={['frequent', 'custom', 'people', 'nature', 'foods', 'activity', 'places', 'objects', 'symbols', 'flags']}

diff --git a/app/soapbox/locales/fr.json b/app/soapbox/locales/fr.json
@@ -753,16 +753,15 @@
   "notification.others": " + {count} {count, plural, one {other} other {others}}",
   "notification.pleroma:chat_mention": "{name} vous a envoyé un message",
   "notification.pleroma:emoji_reaction": "{name} a réagi à votre publication",
-  "notification.poll": "Un sondage auquel vous avez participé vient de se terminer",
-  "notification.reblog": "{name} a partagé votre statut :",
-  "notification.status": "{name} just posted",
-  "notification.update": "{name} edited a post you interacted with",
-  "notification.user_approved": "Welcome to {instance}!",
-  "notifications.clear": "Effacer les notifications",
-  "notifications.clear_confirmation": "Êtes-vous sûr de vouloir effacer vos notifications ?",
-  "notifications.clear_heading": "Effacer les notifications",
-  "notifications.filter.all": "Tout",
-  "notifications.filter.boosts": "Repartages",
+  "notification.poll": "Ce sondage vient de se terminer.",
+  "notification.reblog": "{name} a partagé votre publication :",
+  "notification.status": "{name} vient de publier.",
+  "notification.update": "{name} a modifié sa publication.",
+  "notification.user_approved": "Bienvenue sur {instance} !",
+  "notifications.clear": "Effacer les notifications.",
+  "notifications.clear_confirmation": "Voulez-vous vraiment effacer toutes vos notifications ?",
+  "notifications.clear_heading": "Effacer les notifications.",
+  "notifications.filter.all": "Tout.",
   "notifications.filter.emoji_reacts": "Emoji reacts",
   "notifications.filter.favourites": "Favoris",
   "notifications.filter.follows": "Abonné·e·s",