feat(features): add tooltips for speakers_catalog and fix bug with it…

…alic font in tooltips
sws2apps · Oct 31, 2024 · b1a5c40 · b1a5c40
1 parent 51ff27e
commit b1a5c40
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 7 deletions.
diff --git a/src/components/tooltip/index.tsx b/src/components/tooltip/index.tsx
@@ -35,6 +35,7 @@ const Tooltip = ({
             maxWidth: '360px',
             color: 'var(--white)',
             fontSize: '12px',
+            fontStyle: 'normal',
             border: 'none',
           },
         },

diff --git a/src/features/persons/speakers_catalog/my_congregation/header/index.tsx b/src/features/persons/speakers_catalog/my_congregation/header/index.tsx
@@ -10,6 +10,7 @@ import { OutgoingSpeakersHeaderType } from './index.types';
 import useHeader from './useHeader';
 import Typography from '@components/typography';
 import OutgoingSpeakersAccess from '../congregations_access';
+import Tooltip from '@components/tooltip';
 
 const OutgoingSpeakersHeader = ({
   expanded,
@@ -74,14 +75,18 @@ const OutgoingSpeakersHeader = ({
       <Box sx={{ display: 'flex', alignItems: 'center', gap: '8px' }}>
         {isPublicTalkCoordinator && (
           <>
-            <IconButton onClick={onEditModeChange}>
-              {!editMode && <IconEdit color="var(--accent-main)" />}
-              {editMode && <IconCheck color="var(--accent-main)" />}
-            </IconButton>
-            {congAccountConnected && (
-              <IconButton onClick={handleOpenAccess}>
-                <IconSharedWith color="var(--accent-main)" />
+            <Tooltip title={t('tr_edit')} delaySpeed="slow">
+              <IconButton onClick={onEditModeChange}>
+                {!editMode && <IconEdit color="var(--accent-main)" />}
+                {editMode && <IconCheck color="var(--accent-main)" />}
               </IconButton>
+            </Tooltip>
+            {congAccountConnected && (
+              <Tooltip title={t('tr_whoHasAccess')} delaySpeed="slow">
+                <IconButton onClick={handleOpenAccess}>
+                  <IconSharedWith color="var(--accent-main)" />
+                </IconButton>
+              </Tooltip>
             )}
           </>
         )}