From e615244ea51e1a31c645a32d9dabfea4216680f3 Mon Sep 17 00:00:00 2001 From: "Omar H." Date: Wed, 5 Nov 2025 15:16:56 -0500 Subject: [PATCH 1/4] Fix: Change favorite icon display from block to flex on hover for iTwinTile and IModelTile --- .../src/containers/ITwinGrid/ITwinTile.module.scss | 2 +- .../src/containers/iModelTiles/IModelTile.module.scss | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/modules/imodel-browser/src/containers/ITwinGrid/ITwinTile.module.scss b/packages/modules/imodel-browser/src/containers/ITwinGrid/ITwinTile.module.scss index cbde2e3a..0b877d0a 100644 --- a/packages/modules/imodel-browser/src/containers/ITwinGrid/ITwinTile.module.scss +++ b/packages/modules/imodel-browser/src/containers/ITwinGrid/ITwinTile.module.scss @@ -12,6 +12,6 @@ .iTwinTile:hover { .iTwinTileFavoriteIcon { - display: block; + display: flex; } } \ No newline at end of file diff --git a/packages/modules/imodel-browser/src/containers/iModelTiles/IModelTile.module.scss b/packages/modules/imodel-browser/src/containers/iModelTiles/IModelTile.module.scss index 2503bc28..70d55b06 100644 --- a/packages/modules/imodel-browser/src/containers/iModelTiles/IModelTile.module.scss +++ b/packages/modules/imodel-browser/src/containers/iModelTiles/IModelTile.module.scss @@ -12,6 +12,6 @@ .iModelTile:hover { .iModelTileFavoriteIcon { - display: block; + display: flex; } } \ No newline at end of file From 0ce06ccb9bbf073a0e584db8e28499278e8bd37b Mon Sep 17 00:00:00 2001 From: "Omar H." Date: Wed, 5 Nov 2025 15:20:06 -0500 Subject: [PATCH 2/4] Fix: Address favorite icon shift on hover in iModel browser --- .../omar-fix-favorite-hover_2025-11-05-20-19.json | 10 ++++++++++ 1 file changed, 10 insertions(+) create mode 100644 common/changes/@itwin/imodel-browser-react/omar-fix-favorite-hover_2025-11-05-20-19.json diff --git a/common/changes/@itwin/imodel-browser-react/omar-fix-favorite-hover_2025-11-05-20-19.json b/common/changes/@itwin/imodel-browser-react/omar-fix-favorite-hover_2025-11-05-20-19.json new file mode 100644 index 00000000..9a61ef1d --- /dev/null +++ b/common/changes/@itwin/imodel-browser-react/omar-fix-favorite-hover_2025-11-05-20-19.json @@ -0,0 +1,10 @@ +{ + "changes": [ + { + "packageName": "@itwin/imodel-browser-react", + "comment": "Fix: favorite icon shift on hover", + "type": "patch" + } + ], + "packageName": "@itwin/imodel-browser-react" +} \ No newline at end of file From 948efbdd55c3e8ce9e86ce11df0dc0b95f986a37 Mon Sep 17 00:00:00 2001 From: "Omar H." Date: Wed, 5 Nov 2025 16:04:12 -0500 Subject: [PATCH 3/4] Add: Allow user to add custom icons for remove from recents menu option --- .../src/imodel-browser/IModelGrid.stories.tsx | 22 ++++++++++++++++++- 1 file changed, 21 insertions(+), 1 deletion(-) diff --git a/packages/apps/storybook/src/imodel-browser/IModelGrid.stories.tsx b/packages/apps/storybook/src/imodel-browser/IModelGrid.stories.tsx index 74fd8029..ac0157d9 100644 --- a/packages/apps/storybook/src/imodel-browser/IModelGrid.stories.tsx +++ b/packages/apps/storybook/src/imodel-browser/IModelGrid.stories.tsx @@ -9,7 +9,7 @@ import { IModelGridProps, IModelTileProps, } from "@itwin/imodel-browser-react"; -import { SvgApple } from "@itwin/itwinui-icons-react"; +import { SvgApple, SvgClose, SvgDelete } from "@itwin/itwinui-icons-react"; import { Button, Code, @@ -349,3 +349,23 @@ DisableAddToRecents.argTypes = { cellOverrides: { table: { disable: true } }, className: { table: { disable: true } }, }; + +export const Recents = Template.bind({}); +Recents.args = { + apiOverrides: { serverEnvironmentPrefix: "qa" }, + requestType: "recents", +}; + +export const RecentsWithCustomIcon = Template.bind({}); +RecentsWithCustomIcon.args = { + apiOverrides: { serverEnvironmentPrefix: "qa" }, + requestType: "recents", + removeFromRecentsIcon: , +}; + +export const RecentsWithCloseIcon = Template.bind({}); +RecentsWithCloseIcon.args = { + apiOverrides: { serverEnvironmentPrefix: "qa" }, + requestType: "recents", + removeFromRecentsIcon: , +}; From e8dea170db55e7c644d6e975f28974520e6f0003 Mon Sep 17 00:00:00 2001 From: "Omar H." Date: Wed, 5 Nov 2025 16:04:26 -0500 Subject: [PATCH 4/4] Add: Support custom icon for "Remove from recents" action in IModelGrid --- .../src/containers/iModelGrid/IModelGrid.tsx | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/packages/modules/imodel-browser/src/containers/iModelGrid/IModelGrid.tsx b/packages/modules/imodel-browser/src/containers/iModelGrid/IModelGrid.tsx index 0315b3a6..86e20e78 100644 --- a/packages/modules/imodel-browser/src/containers/iModelGrid/IModelGrid.tsx +++ b/packages/modules/imodel-browser/src/containers/iModelGrid/IModelGrid.tsx @@ -46,6 +46,8 @@ export interface IModelGridProps { sortOptions?: IModelSortOptions; /** List of actions to build for each imodel context menu. */ iModelActions?: ContextMenuBuilderItem[]; + /** Custom icon for the "Remove from recents" context menu action. Only applies when requestType is "recents". */ + removeFromRecentsIcon?: JSX.Element; /** Function (can be a react hook) that returns state for an iModel, returned values will be applied as props to the IModelTile, overrides IModelGrid provided values */ useIndividualState?: ( iModel: IModelFull, @@ -126,6 +128,7 @@ const ITwinGridInternal = ({ accessToken, apiOverrides, iModelActions, + removeFromRecentsIcon, onThumbnailClick, iTwinId, sortOptions = { sortType: "name", descending: false }, @@ -195,6 +198,7 @@ const ITwinGridInternal = ({ const removeFromRecentsAction: ContextMenuBuilderItem = { key: "remove-from-recents", children: strings.removeFromRecents, + ...(removeFromRecentsIcon && { icon: removeFromRecentsIcon }), onClick: async (iModel, refetchData) => { if (!iModel || !accessToken) { return; @@ -208,7 +212,7 @@ const ITwinGridInternal = ({ }, }; return iModelActions - ? [...iModelActions, removeFromRecentsAction] + ? [removeFromRecentsAction, ...iModelActions] : [removeFromRecentsAction]; } return iModelActions; @@ -216,6 +220,7 @@ const ITwinGridInternal = ({ requestType, iModelActions, strings.removeFromRecents, + removeFromRecentsIcon, accessToken, apiOverrides?.serverEnvironmentPrefix, ]);