diff --git a/packages/desktop-client/src/components/sidebar/Account.tsx b/packages/desktop-client/src/components/sidebar/Account.tsx index 0a1536727c1db369d93b0d4b5fefec40a43c50ce..c0b89c9fa41cba0d196d16f1ad59a869035813e6 100644 --- a/packages/desktop-client/src/components/sidebar/Account.tsx +++ b/packages/desktop-client/src/components/sidebar/Account.tsx @@ -5,10 +5,14 @@ import { css } from 'glamor'; import { type AccountEntity } from 'loot-core/src/types/models'; +import { useNotes } from '../../hooks/useNotes'; import { styles, theme, type CSSProperties } from '../../style'; import { AlignedText } from '../common/AlignedText'; import { Link } from '../common/Link'; +import { Text } from '../common/Text'; +import { Tooltip } from '../common/Tooltip'; import { View } from '../common/View'; +import { Notes } from '../Notes'; import { useDraggable, useDroppable, @@ -82,7 +86,10 @@ export function Account({ onDrop, }); - return ( + const accountNote = useNotes(`account-${account?.id}`); + const needsTooltip = !!account?.id; + + const accountRow = ( <View innerRef={dropRef} style={{ flexShrink: 0, ...outerStyle }}> <View> <DropHighlight pos={dropPos} /> @@ -148,4 +155,45 @@ export function Account({ </View> </View> ); + + if (!needsTooltip) { + return accountRow; + } + + return ( + <Tooltip + content={ + <View + style={{ + padding: 10, + }} + > + <Text + style={{ + fontWeight: 'bold', + borderBottom: accountNote ? `1px solid ${theme.tableBorder}` : 0, + marginBottom: accountNote ? '0.5rem' : 0, + }} + > + {name} + </Text> + {accountNote && ( + <Notes + getStyle={() => ({ + padding: 0, + })} + notes={accountNote} + /> + )} + </View> + } + style={{ ...styles.tooltip, borderRadius: '0px 5px 5px 0px' }} + placement="right top" + triggerProps={{ + delay: 1000, + }} + > + {accountRow} + </Tooltip> + ); } diff --git a/upcoming-release-notes/2796.md b/upcoming-release-notes/2796.md new file mode 100644 index 0000000000000000000000000000000000000000..701a78a25cfc16a1541e17d90851d775eb89415f --- /dev/null +++ b/upcoming-release-notes/2796.md @@ -0,0 +1,6 @@ +--- +category: Enhancements +authors: [psybers] +--- + +Show account notes in tooltip on sidebar.