OBPIH-7251 Fixed position columns and horizontal scrolling for new react tables#5244
OBPIH-7251 Fixed position columns and horizontal scrolling for new react tables#5244awalkowiak merged 7 commits intoOBPIH-7241from
Conversation
| const [isScreenWiderThanTable, setIsScreenWiderThanTable] = useState(false); | ||
| const totalSize = table.getTotalSize(); | ||
| useEffect(() => { | ||
| const handleResize = () => { | ||
| setIsScreenWiderThanTable(window.innerWidth > totalSize); | ||
| }; | ||
| handleResize(); | ||
| window.addEventListener('resize', handleResize); | ||
| return () => window.removeEventListener('resize', handleResize); | ||
| }, [totalSize]); | ||
|
|
There was a problem hiding this comment.
Isn't it a candidate for a hook?
| let boxShadow; | ||
| let clipPath; | ||
| let marginRight; | ||
| if (isLastLeftPinnedColumn) { | ||
| boxShadow = '0 0 15px #00000040'; | ||
| clipPath = 'inset(0 -15px 0 0)'; | ||
| marginRight = '5px'; | ||
| } else { | ||
| boxShadow = undefined; | ||
| clipPath = undefined; | ||
| marginRight = undefined; | ||
| } |
There was a problem hiding this comment.
can't you use ternary?
There was a problem hiding this comment.
Good point, I could use a ternary. I did it this way for now because in the docs they also use isPinned === 'right', which I haven’t added yet, so the if made more sense at this stage. But I’ll clean it up for now
alannadolny
left a comment
alannadolny
left a comment
There was a problem hiding this comment.
@SebastianLib, have you checked the other cycle count tables, right?
|
@alannadolny yes of course, you can check my video in the ticket. Now I'm resolving conflicts |
github-actions
bot
added
the
domain: frontend
| RECORDED: 'date_counted', | ||
| // fix after getting appropriate property in response | ||
| TRANSACTION_ID: 'inventoryItem.id', | ||
| TRANSACTION_ID: 'inventory_item_id', |
There was a problem hiding this comment.
how is this change connected with the ticket? Is it something you fixed additionally or?
Btw. I am a bit scared of that change - could you provide the context and confirm this won't break anything?
There was a problem hiding this comment.
I changed it after agreeing with Alan. It was because the getCommonPinningStyles function built into the react table column.getIsLastColumn('left') did not detect a column that had an id with a dot. It's hard to say if it will break anything in the future because the data is mocked for now
4 participants
✨ Description of Change
Link to GitHub issue or Jira ticket:
Description:
1376 px:
📷 Screenshots & Recordings (optional)