feat(platform): fdp table - make responsive pop-in areas navigable #12673

khotcholava · 2024-10-30T11:26:02Z

feat(platform): fdp table - make responsive pop-in areas navigable

Description

Ensure row navigation works correctly when interacting with pop-in columns using fdpTableColumnResponsive.
Malfunction code: showItemsCount input was duplicated.

closes [#11004](#11004) ## Description Ensure row navigation works correctly when interacting with pop-in columns using `fdpTableColumnResponsive`.

closes [#11004](#11004) ## Description Malfunction code: `showItemsCount` input was duplicated.

netlify · 2024-10-30T11:27:44Z

✅ Deploy Preview for fundamental-ngx ready!

Name	Link
🔨 Latest commit	`6bd8c76`
🔍 Latest deploy log	https://app.netlify.com/sites/fundamental-ngx/deploys/676568dd250909000838b1b6
😎 Deploy Preview	https://deploy-preview-12673--fundamental-ngx.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

khotcholava · 2024-10-30T11:28:22Z

libs/platform/table/table.component.html

@@ -18,7 +18,7 @@
        }
    </div>
    @if (showGrowingButton) {
-        <fdp-table-growing-button [showItemsCount]="showItemsCount" [showItemsCount]="true"></fdp-table-growing-button>


Removed a duplicate showItemsCount input. One instance was hardcoded to true, while the other took its value from the component input. Now, showItemsCount consistently derives its value from the component input.
@mikerodonnell89 @InnaAtanasova

khotcholava · 2024-10-30T11:30:13Z

libs/platform/table/table.component.scss

@@ -492,6 +492,7 @@ fdk-dynamic-portal {
    &__body-table {
        &.fd-table--pop-in {
            .fd-table__row--secondary {
+                cursor: pointer;


Made the secondary row clickable and added a pointer cursor to indicate interactivity.
@mikerodonnell89 @InnaAtanasova

I think it also needs the active/hover state as well and should be applied to the entire cell

github-actions · 2024-10-30T11:30:47Z

Visit the preview URL for this PR (updated for commit 6bd8c76):

https://fundamental-ngx-gh--pr12673-11004-make-responsiv-yqit1mxn.web.app

_{(expires Mon, 23 Dec 2024 14:42:37 GMT)}

_{🔥 via Firebase Hosting GitHub Action 🌎}

_{Sign: 41b993ee8e451bd7c6770b342ce142dc886eacff}

mikerodonnell89 · 2024-11-04T22:00:35Z

libs/platform/table/table.component.scss

@@ -492,6 +492,7 @@ fdk-dynamic-portal {
    &__body-table {
        &.fd-table--pop-in {
            .fd-table__row--secondary {
+                cursor: pointer;


I think it also needs the active/hover state as well and should be applied to the entire cell

droshev · 2024-11-20T14:43:45Z

@khotcholava to follow up

[#11004](#11004) - Fixed hover state for pop in area

dpavlenishvili · 2024-12-02T16:13:18Z

libs/platform/table/table.component.scss

@@ -648,3 +653,7 @@ fdk-dynamic-portal {
 th.fd-table__cell .fd-table__inner {
    font-weight: 700;
 }
+
+.tr-hovered {


inappropriate naming, it should be something like fd-classNameExample, or it should be styled directly in template or if it is necessary, class should be created on fundametnal styles side and then used on ngx side.

- Changed class name with more appropriate name

mikerodonnell89 · 2024-12-05T16:17:12Z

Couple things:

Border here is now missing
When an item is selected and then i hover the description area, hover state is only applied to the title area. You can see the title area has a grey background and the description area has a blue background in the screenshot above
Description header text ("Description (popping < 900px)") is still receiving text selection cursor, implying clicking the area is not actionable

closes [#11004](#11004) Adjust hover logic to prevent highlighting on checked rows, ensuring consistent UI behavior.

droshev · 2024-12-18T15:15:21Z

@dpavlenishvili can you review it? thanks

droshev · 2024-12-20T14:37:56Z

@mikerodonnell89 Can you take it from here. According to Akaki the work is done.

khotcholava added 2 commits October 30, 2024 15:21

feat(platform): fdp table - make responsive pop-in areas navigable

22ef39b

closes [#11004](#11004) ## Description Ensure row navigation works correctly when interacting with pop-in columns using `fdpTableColumnResponsive`.

feat(platform): fdp table - make responsive pop-in areas navigable

a8a8f2e

closes [#11004](#11004) ## Description Malfunction code: `showItemsCount` input was duplicated.

khotcholava self-assigned this Oct 30, 2024

khotcholava commented Oct 30, 2024

View reviewed changes

droshev added this to the Sprint 139 - October 2024 milestone Oct 30, 2024

droshev added the table label Oct 30, 2024

droshev requested a review from a team October 30, 2024 11:36

droshev modified the milestones: Sprint 139 - October 2024, Sprint 140 - November 2024 Oct 30, 2024

mikerodonnell89 requested changes Nov 4, 2024

View reviewed changes

khotcholavaSuzy added 2 commits November 26, 2024 10:51

Merge branch 'main' into 11004-make-responsive-pop-in-are-clickable

e0c835b

fix(core): wizard section role

83ae1b4

[#11004](#11004) - Fixed hover state for pop in area

droshev requested review from mikerodonnell89 and a team November 26, 2024 14:46

droshev modified the milestones: Sprint 140 - November 2024, Sprint 141 - December 2024 Dec 2, 2024

dpavlenishvili reviewed Dec 2, 2024

View reviewed changes

feat(platform): table responsive pop-in hover

d54d734

- Changed class name with more appropriate name

khotcholava requested a review from dpavlenishvili December 4, 2024 18:53

fix(platform): resolve row hover visual glitch

3084e1f

closes [#11004](#11004) Adjust hover logic to prevent highlighting on checked rows, ensuring consistent UI behavior.

khotcholava force-pushed the 11004-make-responsive-pop-in-are-clickable branch from 3bad9c0 to 3084e1f Compare December 11, 2024 13:10

Merge branch 'main' into 11004-make-responsive-pop-in-are-clickable

6bd8c76

dpavlenishvili approved these changes Dec 20, 2024

View reviewed changes

droshev assigned mikerodonnell89 Dec 20, 2024

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat(platform): fdp table - make responsive pop-in areas navigable #12673

feat(platform): fdp table - make responsive pop-in areas navigable #12673

khotcholava commented Oct 30, 2024

netlify bot commented Oct 30, 2024 •

edited

Loading

khotcholava Oct 30, 2024

khotcholava Oct 30, 2024

mikerodonnell89 Nov 4, 2024

github-actions bot commented Oct 30, 2024 •

edited

Loading

mikerodonnell89 Nov 4, 2024

droshev commented Nov 20, 2024

dpavlenishvili Dec 2, 2024 •

edited

Loading

khotcholava Dec 4, 2024

mikerodonnell89 commented Dec 5, 2024

droshev commented Dec 18, 2024

droshev commented Dec 20, 2024

feat(platform): fdp table - make responsive pop-in areas navigable #12673

Are you sure you want to change the base?

feat(platform): fdp table - make responsive pop-in areas navigable #12673

Conversation

khotcholava commented Oct 30, 2024

Description

netlify bot commented Oct 30, 2024 • edited Loading

✅ Deploy Preview for fundamental-ngx ready!

khotcholava Oct 30, 2024

Choose a reason for hiding this comment

khotcholava Oct 30, 2024

Choose a reason for hiding this comment

mikerodonnell89 Nov 4, 2024

Choose a reason for hiding this comment

github-actions bot commented Oct 30, 2024 • edited Loading

mikerodonnell89 Nov 4, 2024

Choose a reason for hiding this comment

droshev commented Nov 20, 2024

dpavlenishvili Dec 2, 2024 • edited Loading

Choose a reason for hiding this comment

khotcholava Dec 4, 2024

Choose a reason for hiding this comment

mikerodonnell89 commented Dec 5, 2024

droshev commented Dec 18, 2024

droshev commented Dec 20, 2024

netlify bot commented Oct 30, 2024 •

edited

Loading

github-actions bot commented Oct 30, 2024 •

edited

Loading

dpavlenishvili Dec 2, 2024 •

edited

Loading