Merge pull request #10824 from DestinyItemManager/item-notes-hover

added notes to item tile hover if they exist.
DestinyItemManager · Dec 10, 2024 · 1bf19e8 · 1bf19e8
2 parents 8fc11cd + b3665d1
commit 1bf19e8
Show file tree

Hide file tree

Showing 3 changed files with 27 additions and 30 deletions.
diff --git a/src/app/inventory/ConnectedInventoryItem.tsx b/src/app/inventory/ConnectedInventoryItem.tsx
@@ -6,7 +6,7 @@ import { useSelector } from 'react-redux';
 import { wishListSelector } from '../wishlists/selectors';
 import InventoryItem from './InventoryItem';
 import { DimItem } from './item-types';
-import { hasNotesSelector, isNewSelector, tagSelector } from './selectors';
+import { isNewSelector, notesSelector, tagSelector } from './selectors';
 
 const autoLockTaggedSelector = settingSelector('autoLockTagged');
 
@@ -41,7 +41,7 @@ export default function ConnectedInventoryItem({
   const defaultFilterActive = currentFilter === stubTrue;
 
   const isNew = useSelector(isNewSelector(item));
-  const hasNotes = useSelector(hasNotesSelector(item));
+  const notes = useSelector(notesSelector(item));
   const wishlistRoll = useSelector(wishListSelector(item));
   const searchHidden =
     // dim this item if there's no search filter and it's archived
@@ -55,7 +55,7 @@ export default function ConnectedInventoryItem({
         item={item}
         isNew={isNew}
         tag={tag}
-        hasNotes={hasNotes}
+        notes={notes}
         wishlistRoll={wishlistRoll}
         onClick={onClick}
         onShiftClick={onShiftClick}
@@ -70,7 +70,7 @@ export default function ConnectedInventoryItem({
       innerRef,
       isNew,
       item,
-      hasNotes,
+      notes,
       onClick,
       onDoubleClick,
       onShiftClick,

diff --git a/src/app/inventory/InventoryItem.tsx b/src/app/inventory/InventoryItem.tsx
@@ -6,24 +6,37 @@ import BungieImage from '../dim-ui/BungieImage';
 import { AppIcon, lockIcon, stickyNoteIcon } from '../shell/icons';
 import { InventoryWishListRoll } from '../wishlists/wishlists';
 import BadgeInfo, { shouldShowBadge } from './BadgeInfo';
+import { TagValue } from './dim-item-info';
 import styles from './InventoryItem.m.scss';
+import { DimItem } from './item-types';
 import ItemIcon from './ItemIcon';
 import ItemIconPlaceholder from './ItemIconPlaceholder';
 import NewItemIndicator from './NewItemIndicator';
+import { getSubclassIconInfo } from './subclass';
 import { canSyncLockState } from './SyncTagLock';
 import TagIcon from './TagIcon';
-import { TagValue } from './dim-item-info';
-import { DimItem } from './item-types';
-import { getSubclassIconInfo } from './subclass';
 
-interface Props {
+export default function InventoryItem({
+  item,
+  isNew,
+  tag,
+  notes,
+  searchHidden,
+  autoLockTagged,
+  wishlistRoll,
+  hideSelectedSuper,
+  onClick,
+  onShiftClick,
+  onDoubleClick,
+  innerRef,
+}: {
   item: DimItem;
   /** Show this item as new? */
   isNew?: boolean;
   /** User defined tag */
   tag?: TagValue;
-  /** Does this item have notes? Used to show the icon. */
-  hasNotes?: boolean;
+  /** Notes for the item. Used to show the icon and put notes in tooltips. */
+  notes?: string;
   /** Has this been hidden by a search? */
   searchHidden?: boolean;
   /** Is the setting to automatically lock tagged items on? */
@@ -36,22 +49,7 @@ interface Props {
   onClick?: (e: React.MouseEvent) => void;
   onShiftClick?: (e: React.MouseEvent) => void;
   onDoubleClick?: (e: React.MouseEvent) => void;
-}
-
-export default function InventoryItem({
-  item,
-  isNew,
-  tag,
-  hasNotes,
-  searchHidden,
-  autoLockTagged,
-  wishlistRoll,
-  hideSelectedSuper,
-  onClick,
-  onShiftClick,
-  onDoubleClick,
-  innerRef,
-}: Props) {
+}) {
   let enhancedOnClick = onClick;
 
   if (onShiftClick) {
@@ -64,6 +62,8 @@ export default function InventoryItem({
     };
   }
 
+  const hasNotes = Boolean(notes);
+  const savedNotes = hasNotes ? `\nNotes: ${notes}` : '';
   const isSubclass = item?.destinyVersion === 2 && item.bucket.hash === BucketHashes.Subclass;
   const subclassIconInfo = isSubclass && !hideSelectedSuper ? getSubclassIconInfo(item) : null;
   const hasBadge = shouldShowBadge(item);
@@ -126,7 +126,7 @@ export default function InventoryItem({
       id={item.index}
       onClick={enhancedOnClick}
       onDoubleClick={onDoubleClick}
-      title={`${item.name}\n${subtitle}`}
+      title={`${item.name}\n${subtitle}${savedNotes}`}
       className={itemStyles}
       ref={innerRef}
     >

diff --git a/src/app/inventory/selectors.ts b/src/app/inventory/selectors.ts
@@ -407,9 +407,6 @@ export const tagSelector = (item: DimItem) => (state: RootState) => getTagSelect
 /** Get a specific item's notes */
 export const notesSelector = (item: DimItem) => (state: RootState) => getNotesSelector(state)(item);
 
-export const hasNotesSelector = (item: DimItem) => (state: RootState) =>
-  Boolean(getNotesSelector(state)(item));
-
 /**
  * all hashtags used in existing item notes, with (case-insensitive) dupes removed
  */