From d87c153fe359f08f514bd1d6437e187af2954dfe Mon Sep 17 00:00:00 2001 From: Ryan Date: Fri, 7 Jun 2024 17:58:18 +1000 Subject: [PATCH 1/3] Show subclass super --- .../loadout-edit/LoadoutEditSubclass.tsx | 20 +++++++++---------- .../loadout-ui/LoadoutSubclassSection.tsx | 19 ++++++++---------- 2 files changed, 17 insertions(+), 22 deletions(-) diff --git a/src/app/loadout/loadout-edit/LoadoutEditSubclass.tsx b/src/app/loadout/loadout-edit/LoadoutEditSubclass.tsx index b85f6600c1..045ae4e120 100644 --- a/src/app/loadout/loadout-edit/LoadoutEditSubclass.tsx +++ b/src/app/loadout/loadout-edit/LoadoutEditSubclass.tsx @@ -9,7 +9,7 @@ import { AppIcon, powerActionIcon } from 'app/shell/icons'; import { itemCanBeInLoadout } from 'app/utils/item-utils'; import { DestinyClass } from 'bungie-api-ts/destiny2'; import clsx from 'clsx'; -import { BucketHashes, SocketCategoryHashes } from 'data/d2/generated-enums'; +import { BucketHashes } from 'data/d2/generated-enums'; import _ from 'lodash'; import { useMemo } from 'react'; import { useSelector } from 'react-redux'; @@ -101,6 +101,7 @@ export default function LoadoutEditSubclass({ // plugs in the loadout and they may be different to the popup onClick={plugs.length ? undefined : onClick} item={subclass.item} + hideSelectedSuper /> )} @@ -116,16 +117,13 @@ export default function LoadoutEditSubclass({ {subclass && (plugs.length ? (
- {plugs?.map( - (plug) => - plug.socketCategoryHash !== SocketCategoryHashes.Super && ( - - ), - )} + {plugs?.map((plug) => ( + + ))}
) : (
{t('Loadouts.Abilities')}
diff --git a/src/app/loadout/loadout-ui/LoadoutSubclassSection.tsx b/src/app/loadout/loadout-ui/LoadoutSubclassSection.tsx index 431e67a03b..e321df0296 100644 --- a/src/app/loadout/loadout-ui/LoadoutSubclassSection.tsx +++ b/src/app/loadout/loadout-ui/LoadoutSubclassSection.tsx @@ -6,7 +6,6 @@ import { ResolvedLoadoutItem } from 'app/loadout/loadout-types'; import { useD2Definitions } from 'app/manifest/selectors'; import { AppIcon, powerActionIcon } from 'app/shell/icons'; import clsx from 'clsx'; -import { SocketCategoryHashes } from 'data/d2/generated-enums'; import { useMemo } from 'react'; import { getSubclassPlugs } from '../item-utils'; import { createGetModRenderKey } from '../mod-utils'; @@ -43,6 +42,7 @@ export default function LoadoutSubclassSection({ // plugs in the loadout and they may be different to the popup onClick={plugs.length ? undefined : onClick} item={subclass.item} + hideSelectedSuper /> )} @@ -59,16 +59,13 @@ export default function LoadoutSubclassSection({ {plugs.length ? (
- {plugs?.map( - (plug) => - plug.socketCategoryHash !== SocketCategoryHashes.Super && ( - - ), - )} + {plugs?.map((plug) => ( + + ))}
) : (
{t('Loadouts.Abilities')}
From 838f8533a2de3f3daf551f688d5e720508ef9c8b Mon Sep 17 00:00:00 2001 From: Ryan Date: Fri, 7 Jun 2024 22:01:11 +1000 Subject: [PATCH 2/3] Fix for incorrect border --- src/app/inventory/InventoryItem.tsx | 10 ++++---- src/app/inventory/subclass.ts | 6 +++++ .../loadout-ui/LoadoutSubclassSection.m.scss | 24 +++++++++++++++++++ .../LoadoutSubclassSection.m.scss.d.ts | 3 +++ 4 files changed, 39 insertions(+), 4 deletions(-) diff --git a/src/app/inventory/InventoryItem.tsx b/src/app/inventory/InventoryItem.tsx index a17b13d462..27d4619a42 100644 --- a/src/app/inventory/InventoryItem.tsx +++ b/src/app/inventory/InventoryItem.tsx @@ -14,7 +14,7 @@ import { canSyncLockState } from './SyncTagLock'; import TagIcon from './TagIcon'; import { TagValue } from './dim-item-info'; import { DimItem } from './item-types'; -import { getSubclassIconInfo } from './subclass'; +import { getSubclassIconInfo, prismaticSubclassHashes } from './subclass'; interface Props { item: DimItem; @@ -64,12 +64,14 @@ export default function InventoryItem({ }; } - const isSubclass = item?.destinyVersion === 2 && item.bucket.hash === BucketHashes.Subclass; - const subclassIconInfo = isSubclass && !hideSelectedSuper ? getSubclassIconInfo(item) : null; + const isSubclass = item.destinyVersion === 2 && item.bucket.hash === BucketHashes.Subclass; + const isPrismatic = prismaticSubclassHashes.includes(item.hash); + const subclassIconInfo = + isSubclass && !isPrismatic && !hideSelectedSuper ? getSubclassIconInfo(item) : null; const hasBadge = shouldShowBadge(item); const itemStyles = clsx('item', { [styles.searchHidden]: searchHidden, - [styles.subclass]: isSubclass, + [styles.subclass]: isSubclass && !isPrismatic, [styles.hasBadge]: hasBadge, }); // Subtitle for engram powerlevel vs regular item type diff --git a/src/app/inventory/subclass.ts b/src/app/inventory/subclass.ts index afd84f01dd..62faeb401f 100644 --- a/src/app/inventory/subclass.ts +++ b/src/app/inventory/subclass.ts @@ -20,6 +20,12 @@ const baseImagesByDamageType: LookupTable = { [DamageType.Strand]: subclassStrand, }; +export const prismaticSubclassHashes = [ + 1616346845, // titan + 3893112950, // warlock + 4282591831, // hunter +]; + interface SubclassIconInfo { base: string; super: string; diff --git a/src/app/loadout/loadout-ui/LoadoutSubclassSection.m.scss b/src/app/loadout/loadout-ui/LoadoutSubclassSection.m.scss index 42c957d792..8212b6c8a2 100644 --- a/src/app/loadout/loadout-ui/LoadoutSubclassSection.m.scss +++ b/src/app/loadout/loadout-ui/LoadoutSubclassSection.m.scss @@ -61,3 +61,27 @@ .missingItem { opacity: 0.3; } + +// Subclass items +.superBase { + border-color: transparent !important; +} +.superPlug { + &::before { + background-image: url('../../images/subclass-border.svg'); + content: ''; + position: absolute; + width: 100%; + height: 100%; + z-index: 1; + left: 0; + top: 0; + } +} +.superIcon { + position: absolute; + width: calc(var(--item-size) - 4px); + height: calc(var(--item-size) - 4px); + left: 2px; + top: 2px; +} diff --git a/src/app/loadout/loadout-ui/LoadoutSubclassSection.m.scss.d.ts b/src/app/loadout/loadout-ui/LoadoutSubclassSection.m.scss.d.ts index 4ce4e5648c..526dc79813 100644 --- a/src/app/loadout/loadout-ui/LoadoutSubclassSection.m.scss.d.ts +++ b/src/app/loadout/loadout-ui/LoadoutSubclassSection.m.scss.d.ts @@ -7,6 +7,9 @@ interface CssExports { 'subclass': string; 'subclassContainer': string; 'subclassMods': string; + 'superBase': string; + 'superIcon': string; + 'superPlug': string; } export const cssExports: CssExports; export default cssExports; From 6f604ea9e57f772d6cafbe94a66effcb46cbd58b Mon Sep 17 00:00:00 2001 From: Ryan Date: Fri, 7 Jun 2024 22:07:25 +1000 Subject: [PATCH 3/3] revert css additions for triangle border for now --- .../loadout-ui/LoadoutSubclassSection.m.scss | 24 ------------------- .../LoadoutSubclassSection.m.scss.d.ts | 3 --- 2 files changed, 27 deletions(-) diff --git a/src/app/loadout/loadout-ui/LoadoutSubclassSection.m.scss b/src/app/loadout/loadout-ui/LoadoutSubclassSection.m.scss index 8212b6c8a2..42c957d792 100644 --- a/src/app/loadout/loadout-ui/LoadoutSubclassSection.m.scss +++ b/src/app/loadout/loadout-ui/LoadoutSubclassSection.m.scss @@ -61,27 +61,3 @@ .missingItem { opacity: 0.3; } - -// Subclass items -.superBase { - border-color: transparent !important; -} -.superPlug { - &::before { - background-image: url('../../images/subclass-border.svg'); - content: ''; - position: absolute; - width: 100%; - height: 100%; - z-index: 1; - left: 0; - top: 0; - } -} -.superIcon { - position: absolute; - width: calc(var(--item-size) - 4px); - height: calc(var(--item-size) - 4px); - left: 2px; - top: 2px; -} diff --git a/src/app/loadout/loadout-ui/LoadoutSubclassSection.m.scss.d.ts b/src/app/loadout/loadout-ui/LoadoutSubclassSection.m.scss.d.ts index 526dc79813..4ce4e5648c 100644 --- a/src/app/loadout/loadout-ui/LoadoutSubclassSection.m.scss.d.ts +++ b/src/app/loadout/loadout-ui/LoadoutSubclassSection.m.scss.d.ts @@ -7,9 +7,6 @@ interface CssExports { 'subclass': string; 'subclassContainer': string; 'subclassMods': string; - 'superBase': string; - 'superIcon': string; - 'superPlug': string; } export const cssExports: CssExports; export default cssExports;