Merge pull request #10481 from DestinyItemManager/icon-titles

Add some titles to icons
DestinyItemManager · Jun 16, 2024 · b129cd8 · b129cd8
2 parents ea921cf + fb885d2
commit b129cd8
Show file tree

Hide file tree

Showing 17 changed files with 67 additions and 22 deletions.
diff --git a/config/i18n.json b/config/i18n.json
@@ -399,6 +399,7 @@
     "ReportBug": "Report a Bug",
     "SaveSearch": "Save Search",
     "SearchResults": "Show Items",
+    "SearchActions": "Open Search Actions",
     "Shop": "Shop",
     "UpgradeDIM": "Update DIM",
     "WhatsNew": "What's New"
@@ -462,6 +463,10 @@
   "Inventory": {
     "ClickToExpand": "(Click to expand)"
   },
+  "Item": {
+    "ThumbsUp": "Thumbs Up",
+    "ThumbsDown": "Thumbs Down"
+  },
   "ItemFeed": {
     "Description": "Item Feed",
     "HideTagged": "Hide Tagged",
@@ -671,6 +676,7 @@
   },
   "Loadouts": {
     "Abilities": "Abilities",
+    "Actions": "Actions for {{title}}",
     "AddEquippedItems": "Add Equipped",
     "AddNotes": "Add Notes",
     "AddUnequippedItems": "Add Unequipped",
@@ -724,6 +730,7 @@
     "IncludeRuntimeStatBenefits": "Include Font mod stats",
     "IncludeRuntimeStatBenefitsDesc": "\"Font of ...\" armor mods provide a flat boost to character stats while you have Armor Charges.\n\nWith this setting, DIM considers these mods active and adds their benefits to this Loadout's stats in calculations and optimizations.",
     "InGameLoadouts": "In-Game Loadouts",
+    "InGameActions": "In-Game Loadout Actions",
     "ItemLeveling": "Item Leveling",
     "LoadoutName": "Loadout name",
     "Loadouts": "Loadouts",

diff --git a/src/app/character-tile/CharacterTile.tsx b/src/app/character-tile/CharacterTile.tsx
@@ -60,7 +60,7 @@ function VaultTile({ store }: { store: DimStore }) {
 
   return (
     <div className={styles.vaultTile}>
-      <img className={styles.vaultEmblem} src={store.icon} height={40} width={40} />
+      <img className={styles.vaultEmblem} src={store.icon} height={40} width={40} alt="" />
       <div className={styles.vaultName}>{store.className}</div>
       {!isPhonePortrait && (
         <div className={clsx(styles.powerLevel, styles.bigPowerLevel)}>

diff --git a/src/app/dim-ui/Dropdown.tsx b/src/app/dim-ui/Dropdown.tsx
@@ -31,6 +31,7 @@ interface Props {
   offset?: number;
   fixed?: boolean;
   placement?: Placement;
+  label: string;
 }
 
 function isDropdownOption(option: Option): option is DropdownOption {
@@ -54,6 +55,7 @@ export default function Dropdown({
   offset,
   fixed,
   placement = kebab ? 'bottom-end' : 'bottom-start',
+  label,
 }: Props) {
   const { isOpen, getToggleButtonProps, getMenuProps, highlightedIndex, getItemProps, reset } =
     useSelect({
@@ -84,7 +86,7 @@ export default function Dropdown({
     <div className={className}>
       <button
         type="button"
-        {...getToggleButtonProps({ ref: buttonRef, disabled })}
+        {...getToggleButtonProps({ ref: buttonRef, disabled, title: label })}
         className={kebab ? styles.kebabButton : styles.button}
       >
         {kebab ? (

diff --git a/src/app/inventory/RatingIcon.tsx b/src/app/inventory/RatingIcon.tsx
@@ -1,11 +1,14 @@
+import { t } from 'app/i18next-t';
 import { UiWishListRoll } from 'app/wishlists/wishlists';
 import { AppIcon, thumbsDownIcon, thumbsUpIcon } from '../shell/icons';
 import styles from './RatingIcon.m.scss';
 
 export default function RatingIcon({ uiWishListRoll }: { uiWishListRoll: UiWishListRoll }) {
   if (uiWishListRoll === UiWishListRoll.Bad) {
-    return <AppIcon className={styles.trashlist} icon={thumbsDownIcon} />;
+    return (
+      <AppIcon className={styles.trashlist} icon={thumbsDownIcon} title={t('Item.ThumbsDown')} />
+    );
   }
 
-  return <AppIcon className={styles.godroll} icon={thumbsUpIcon} />;
+  return <AppIcon className={styles.godroll} icon={thumbsUpIcon} title={t('Item.ThumbsUp')} />;
 }
diff --git a/src/app/inventory/TagIcon.tsx b/src/app/inventory/TagIcon.tsx
@@ -1,6 +1,7 @@
 import { IconDefinition } from '@fortawesome/fontawesome-svg-core';
+import { t } from 'app/i18next-t';
 import { AppIcon } from 'app/shell/icons';
-import { itemTagList, TagValue } from './dim-item-info';
+import { itemTagList, tagConfig, TagValue } from './dim-item-info';
 
 const tagIcons: { [tag: string]: string | IconDefinition | undefined } = {};
 for (const tag of itemTagList) {
@@ -10,5 +11,7 @@ for (const tag of itemTagList) {
 }
 
 export default function TagIcon({ className, tag }: { className?: string; tag: TagValue }) {
-  return tagIcons[tag] ? <AppIcon className={className} icon={tagIcons[tag]!} /> : null;
+  return tagIcons[tag] ? (
+    <AppIcon className={className} icon={tagIcons[tag]!} title={t(tagConfig[tag].label)} />
+  ) : null;
 }
diff --git a/src/app/inventory/d2-stores.ts b/src/app/inventory/d2-stores.ts
@@ -226,16 +226,14 @@ function loadProfile(
           } else {
             warnLog(
               TAG,
-              `Profile from Bungie.net is ${remoteProfileAgeSec}s old, while the cached profile is ${cachedProfileAgeSec}s old`,
+              `Profile from Bungie.net is ${remoteProfileAgeSec}s old, while the cached profile is ${cachedProfileAgeSec}s old.`,
               action,
             );
           }
           // Clear the error since we did load correctly
           dispatch(profileError(undefined));
           // undefined means skip processing, in case we already have computed stores
-          return storesLoadedSelector(getState())
-            ? undefined
-            : { profile: cachedProfileResponse, live: false };
+          return storesLoaded ? undefined : { profile: cachedProfileResponse, live: false };
         } else {
           infoLog(
             TAG,

diff --git a/src/app/item-actions/ItemActionsDropdown.tsx b/src/app/item-actions/ItemActionsDropdown.tsx
@@ -226,6 +226,7 @@ export default memo(function ItemActionsDropdown({
       className={styles.dropdownButton}
       offset={isPhonePortrait ? 6 : 2}
       fixed={fixed}
+      label={t('Header.SearchActions')}
     />
   );
 });
diff --git a/src/app/loadout/ingame/InGameLoadoutStrip.tsx b/src/app/loadout/ingame/InGameLoadoutStrip.tsx
@@ -211,7 +211,13 @@ function InGameLoadoutTile({
           {loadoutIcon}
         </PressTip>
       )}
-      <Dropdown kebab options={options} placement="bottom-end" className={styles.kebab} />
+      <Dropdown
+        label={t('Loadouts.InGameActions')}
+        kebab
+        options={options}
+        placement="bottom-end"
+        className={styles.kebab}
+      />
     </div>
   );
 }
diff --git a/src/app/loadout/loadout-edit/LoadoutEditSection.tsx b/src/app/loadout/loadout-edit/LoadoutEditSection.tsx
@@ -134,7 +134,7 @@ export default function LoadoutEditSection({
             <AppIcon icon={disabledIcon} />
           </button>
         )}
-        <Dropdown kebab options={options} />
+        <Dropdown label={t('Loadouts.Actions', { title })} kebab options={options} />
       </div>
       {children}
     </div>

diff --git a/src/app/organizer/ItemActions.tsx b/src/app/organizer/ItemActions.tsx
@@ -133,11 +133,21 @@ function ItemActions({
         <AppIcon icon={unlockedIcon} />
         <span className={styles.label}>{t('Organizer.Unlock')}</span>
       </button>
-      <Dropdown disabled={!itemsAreSelected} options={tagItems} className={styles.actionButton}>
+      <Dropdown
+        label={t('Organizer.BulkTag')}
+        disabled={!itemsAreSelected}
+        options={tagItems}
+        className={styles.actionButton}
+      >
         <AppIcon icon={tagIcon} />
         <span className={styles.label}>{t('Organizer.BulkTag')}</span>
       </Dropdown>
-      <Dropdown disabled={!itemsAreSelected} options={moveItems} className={styles.actionButton}>
+      <Dropdown
+        label={t('Organizer.BulkMove')}
+        disabled={!itemsAreSelected}
+        options={moveItems}
+        className={styles.actionButton}
+      >
         <AppIcon icon={moveIcon} />
         <span className={styles.label}>{t('Organizer.BulkMove')}</span>
       </Dropdown>

diff --git a/src/app/search/SearchBar.tsx b/src/app/search/SearchBar.tsx
@@ -515,6 +515,7 @@ function SearchBar(
             placeholder,
             type: 'text',
             name: 'filter',
+            'aria-label': placeholder,
           })}
           enterKeyHint="search"
         />

diff --git a/src/app/stream-deck/StreamDeckSettings/StreamDeckSettings.tsx b/src/app/stream-deck/StreamDeckSettings/StreamDeckSettings.tsx
@@ -54,7 +54,7 @@ export default function StreamDeckSettings() {
               href="https://marketplace.elgato.com/product/dim-stream-deck-11883ba5-c8db-4e3a-915f-612c5ba1b2e4"
             >
               <button type="button" className={clsx('dim-button', styles.button)}>
-                <AppIcon icon={faArrowCircleDown} /> {t('StreamDeck.Install')}
+                <AppIcon icon={faArrowCircleDown} ariaHidden /> {t('StreamDeck.Install')}
               </button>
             </ExternalLink>
           ) : (

diff --git a/src/app/strip-sockets/StripSockets.tsx b/src/app/strip-sockets/StripSockets.tsx
@@ -169,7 +169,7 @@ export default function StripSockets() {
         ) : state.tag === 'processing' ? (
           <>
             <span>
-              <AppIcon icon={refreshIcon} spinning={true} />
+              <AppIcon icon={refreshIcon} spinning={true} ariaHidden />
             </span>{' '}
             {t('StripSockets.Running')}
           </>
@@ -192,7 +192,7 @@ export default function StripSockets() {
         disabled={selectedSockets.length === 0}
       >
         <span>
-          <AppIcon icon={faCheckCircle} />{' '}
+          <AppIcon icon={faCheckCircle} ariaHidden />{' '}
           {t('StripSockets.Button', { numSockets: selectedSockets.length })}
         </span>
       </button>

diff --git a/src/app/vendors/VendorItemComponent.tsx b/src/app/vendors/VendorItemComponent.tsx
@@ -1,3 +1,4 @@
+import { t } from 'app/i18next-t';
 import { DimItem } from 'app/inventory/item-types';
 import { ItemPopupExtraInfo } from 'app/item-popup/item-popup';
 import { DestinyCollectibleState } from 'bungie-api-ts/destiny2';
@@ -116,11 +117,17 @@ export function VendorItemDisplay({
       </ItemPopupTrigger>
       {children}
       {owned ? (
-        <AppIcon className={styles.ownedIcon} icon={faCheck} />
+        <AppIcon className={styles.ownedIcon} icon={faCheck} title={t('MovePopup.Owned')} />
       ) : acquired ? (
-        <AppIcon className={styles.acquiredIcon} icon={faCheck} />
+        <AppIcon className={styles.acquiredIcon} icon={faCheck} title={t('MovePopup.Acquired')} />
       ) : (
-        locked && <AppIcon className={styles.lockedIcon} icon={lockIcon} />
+        locked && (
+          <AppIcon
+            className={styles.lockedIcon}
+            icon={lockIcon}
+            title={t('MovePopup.LockUnlock.Locked')}
+          />
+        )
       )}
     </div>
   );

diff --git a/src/app/whats-new/WhatsNewLink.tsx b/src/app/whats-new/WhatsNewLink.tsx
@@ -28,7 +28,7 @@ export default function WhatsNewLink({
   if (dimNeedsUpdate) {
     return (
       <a className={className({ isActive: false })} onClick={reloadDIM}>
-        <AppIcon className={styles.upgrade} icon={updateIcon} />
+        <AppIcon className={styles.upgrade} icon={updateIcon} ariaHidden />
         {t('Header.UpgradeDIM')}
       </a>
     );

diff --git a/src/app/wishlists/wishlist-file.ts b/src/app/wishlists/wishlist-file.ts
@@ -81,7 +81,7 @@ export function toWishList(
       }
 
       if (dupes > 0) {
-        warnLog(TAG, 'Discarded', dupes, 'duplicate rolls from wish list', wishList.source);
+        warnLog(TAG, 'Discarded', dupes, 'duplicate rolls from wish list', url);
       }
       wishList.infos.push(info);
     }

diff --git a/src/locale/en.json b/src/locale/en.json
@@ -385,6 +385,7 @@
     "ReloadApp": "Reload App",
     "ReportBug": "Report a Bug",
     "SaveSearch": "Save Search",
+    "SearchActions": "Open Search Actions",
     "SearchResults": "Show Items",
     "Shop": "Shop",
     "TagAs": "Tag as '{{tag}}'",
@@ -448,6 +449,10 @@
   "Inventory": {
     "ClickToExpand": "(Click to expand)"
   },
+  "Item": {
+    "ThumbsDown": "Thumbs Down",
+    "ThumbsUp": "Thumbs Up"
+  },
   "ItemFeed": {
     "ClearFeed": "Clear Feed",
     "Description": "Item Feed",
@@ -717,6 +722,7 @@
   },
   "Loadouts": {
     "Abilities": "Abilities",
+    "Actions": "Actions for {{title}}",
     "AddEquippedItems": "Add Equipped",
     "AddNotes": "Add Notes",
     "AddUnequippedItems": "Add Unequipped",
@@ -774,6 +780,7 @@
       "PasteHere": "Paste a loadout link to open the loadout."
     },
     "ImportLoadout": "Import Loadout",
+    "InGameActions": "In-Game Loadout Actions",
     "InGameLoadouts": "In-Game Loadouts",
     "IncludeRuntimeStatBenefits": "Include Font mod stats",
     "IncludeRuntimeStatBenefitsDesc": "\"Font of ...\" armor mods provide a flat boost to character stats while you have Armor Charges.\n\nWith this setting, DIM considers these mods active and adds their benefits to this Loadout's stats in calculations and optimizations.",