feat: Made entire row for selectable table clickable. #177

chadstewart · 2022-08-11T15:22:36Z

What type of PR is this? (check all applicable)

Description

This PR adds the feature of making the entire row clickable in the selectable table component.

Related Tickets & Documents

Fixes #84

Mobile & Desktop Screenshots/Recordings

Added tests?

👍 yes
🙅 no, because they aren't needed
🙋 no, because I need help

Added to documentation?

[optional] Are there any post-deployment tasks we need to perform?

[optional] What gif best describes this PR or how it makes you feel?

netlify · 2022-08-11T15:22:45Z

✅ Deploy Preview for oss-insights ready!

Name	Link
🔨 Latest commit	`ef56487`
🔍 Latest deploy log	https://app.netlify.com/sites/oss-insights/deploys/62f556302e43b00008aeb6e0
😎 Deploy Preview	https://deploy-preview-177--oss-insights.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 settings.

netlify · 2022-08-11T15:24:02Z

✅ Deploy Preview for design-insights ready!

Name	Link
🔨 Latest commit	`ef56487`
🔍 Latest deploy log	https://app.netlify.com/sites/design-insights/deploys/62f55630e7d2840008ba88cc
😎 Deploy Preview	https://deploy-preview-177--design-insights.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 settings.

bdougie · 2022-08-11T17:12:12Z

The click area doesn't extend to the whole row. Per the issue @pixelsbyeryc, I was thinking that what was expected. Also curious if the hover state should highlight the row as it is pictured. Might be helpful for the user.

components/molecules/SelectableTable/selectable-table.tsx

…change the checkbox value.

…ing over table row.

0-vortex

LGTM!

eryc-cc

☝️ One more thing.

Add a border radius to that blue area.

LGTM otherwise 🍕

chadstewart · 2022-08-11T22:41:41Z

point_up One more thing.

Add a border radius to that blue area.

LGTM otherwise pizza

Added the border but I don't like it. Causes all the content to shift and makes it look kinda janky.

eryc-cc · 2022-08-11T22:43:42Z

point_up One more thing.

Add a border radius to that blue area.

LGTM otherwise pizza

Added the border but I don't like it. Causes all the content to shift and makes it look kinda janky.

No need to add a border, just the border-radius, I think in tailwind is rounded

Maybe rounded-sm? Should be 4-6px max... more than that will look too rounded

chadstewart · 2022-08-11T22:50:06Z

No need to add a border, just the border-radius, I think in tailwind is rounded

Maybe rounded-sm? Should be 4-6px max... more than that will look too rounded

Added the border radius but it doesn't seem to affect the highlight. I'm using background color for the highlight so that might be the issue.

components/molecules/SelectableTable/selectable-table.tsx

bdougie

Looks good, let's ship it.

## [1.1.0-beta.2](v1.1.0-beta.1...v1.1.0-beta.2) (2022-08-12) ### 🍕 Features * add animation to the progress pie component ([#182](#182)) ([90f4bbb](90f4bbb)), closes [#126](#126) * make entire row for selectable table clickable ([#177](#177)) ([8fb914a](8fb914a)), closes [#84](#84)

github-actions · 2022-08-12T01:45:27Z

🎉 This PR is included in version 1.1.0-beta.2 🎉

The release is available on GitHub release

Your semantic-release bot 📦🚀

## [1.1.0](v1.0.5...v1.1.0) (2022-08-13) ### ✅ Tests * enable parallel netlify build for storybook ([#170](#170)) ([d6c5a75](d6c5a75)), closes [#49](#49) ### 🔁 Continuous Integration * add better release target deployment urls ([#172](#172)) ([f3a93f0](f3a93f0)) ### 🧑‍💻 Code Refactoring * update login text to say connect with github. ([#178](#178)) ([5b7e572](5b7e572)), closes [#139](#139) ### 🍕 Features * add animation to the progress pie component ([#182](#182)) ([90f4bbb](90f4bbb)), closes [#126](#126) * make entire row for selectable table clickable ([#177](#177)) ([8fb914a](8fb914a)), closes [#84](#84) * Simplify the Dashboard ([#155](#155)) ([80d445c](80d445c)) ### 🐛 Bug Fixes * correct domain dot com bubble error ([#173](#173)) ([3816edb](3816edb)) * Fixing 'Maximum Depth Reached' or Infinite Loop bug. ([#188](#188)) ([d7a4954](d7a4954))

github-actions · 2022-08-13T17:28:03Z

🎉 This PR is included in version 1.1.0 🎉

The release is available on GitHub release

Your semantic-release bot 📦🚀

* origin/main: chore(patch): release 1.1.2 [skip ci] fix(auth): enable auth with SSR and API routes (#196) chore(patch): release 1.1.1 [skip ci] fix(ui): broken tools nav (#194) chore(minor): release 1.1.0 [skip ci] chore(patch): release 1.1.0-beta.3 on beta channel [skip ci] fix: Fixing 'Maximum Depth Reached' or Infinite Loop bug. (#188) chore(patch): release 1.0.5 [skip ci] fix: Delete codeql-analysis.yml (#186) chore(minor): release 1.1.0-beta.2 on beta channel [skip ci] feat: make entire row for selectable table clickable (#177) feat: add animation to the progress pie component (#182) chore(minor): release 1.1.0-beta.1 on beta channel [skip ci] feat: Simplify the Dashboard (#155) chore(patch): release 1.0.4 [skip ci] fix: Make the description relevant (#180) chore(patch): release 1.0.4-beta.3 on beta channel [skip ci] refactor: update login text to say connect with github. (#178) chore(patch): release 1.0.4-beta.2 on beta channel [skip ci]

## [1.1.0-beta.2](open-sauced/app@v1.1.0-beta.1...v1.1.0-beta.2) (2022-08-12) ### 🍕 Features * add animation to the progress pie component ([#182](open-sauced/app#182)) ([90f4bbb](open-sauced/app@90f4bbb)), closes [#126](open-sauced/app#126) * make entire row for selectable table clickable ([#177](open-sauced/app#177)) ([8fb914a](open-sauced/app@8fb914a)), closes [#84](open-sauced/app#84)

## [1.1.0](open-sauced/app@v1.0.5...v1.1.0) (2022-08-13) ### ✅ Tests * enable parallel netlify build for storybook ([#170](open-sauced/app#170)) ([d6c5a75](open-sauced/app@d6c5a75)), closes [#49](open-sauced/app#49) ### 🔁 Continuous Integration * add better release target deployment urls ([#172](open-sauced/app#172)) ([f3a93f0](open-sauced/app@f3a93f0)) ### 🧑‍💻 Code Refactoring * update login text to say connect with github. ([#178](open-sauced/app#178)) ([5b7e572](open-sauced/app@5b7e572)), closes [#139](open-sauced/app#139) ### 🍕 Features * add animation to the progress pie component ([#182](open-sauced/app#182)) ([90f4bbb](open-sauced/app@90f4bbb)), closes [#126](open-sauced/app#126) * make entire row for selectable table clickable ([#177](open-sauced/app#177)) ([8fb914a](open-sauced/app@8fb914a)), closes [#84](open-sauced/app#84) * Simplify the Dashboard ([#155](open-sauced/app#155)) ([80d445c](open-sauced/app@80d445c)) ### 🐛 Bug Fixes * correct domain dot com bubble error ([#173](open-sauced/app#173)) ([3816edb](open-sauced/app@3816edb)) * Fixing 'Maximum Depth Reached' or Infinite Loop bug. ([#188](open-sauced/app#188)) ([d7a4954](open-sauced/app@d7a4954))

Made entire row for selectable table clickable.

ac9782e

chadstewart requested review from 0-vortex, bdougie and eryc-cc August 11, 2022 15:22

chadstewart marked this pull request as ready for review August 11, 2022 15:22

chadstewart changed the title ~~Made entire row for selectable table clickable.~~ feat: Made entire row for selectable table clickable. Aug 11, 2022

eryc-cc suggested changes Aug 11, 2022

View reviewed changes

components/molecules/SelectableTable/selectable-table.tsx Outdated Show resolved Hide resolved

chadstewart added 2 commits August 11, 2022 13:32

Resolved bug where only element with the actual checkbox would cause …

8a068d3

…change the checkbox value.

Updated Selectable table to add background color when cursor is hover…

72271b9

…ing over table row.

chadstewart requested a review from eryc-cc August 11, 2022 18:39

chadstewart added 2 commits August 11, 2022 14:09

Fixed issue where checkbox would change state twice on click.

a97bf33

Added checkbox story to storybook.

ef56487

0-vortex approved these changes Aug 11, 2022

View reviewed changes

eryc-cc approved these changes Aug 11, 2022

View reviewed changes

eryc-cc reviewed Aug 12, 2022

View reviewed changes

components/molecules/SelectableTable/selectable-table.tsx Show resolved Hide resolved

eryc-cc mentioned this pull request Aug 12, 2022

[Bug] Add background to selectable <tr> table elements #183

Closed

bdougie approved these changes Aug 12, 2022

View reviewed changes

0-vortex merged commit 8fb914a into beta Aug 12, 2022

0-vortex deleted the 84-make-entire-row-selectable branch August 12, 2022 01:42

github-actions bot added the released on @beta label Aug 12, 2022

github-actions bot added the released label Aug 13, 2022

eryc-cc mentioned this pull request Aug 22, 2022

fix: Add background to selectable tr table #252

Merged

19 tasks

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat: Made entire row for selectable table clickable. #177

feat: Made entire row for selectable table clickable. #177

chadstewart commented Aug 11, 2022 •

edited

Loading

netlify bot commented Aug 11, 2022 •

edited

Loading

netlify bot commented Aug 11, 2022 •

edited

Loading

bdougie commented Aug 11, 2022

0-vortex left a comment

eryc-cc left a comment

chadstewart commented Aug 11, 2022

eryc-cc commented Aug 11, 2022 •

edited

Loading

chadstewart commented Aug 11, 2022

bdougie left a comment

github-actions bot commented Aug 12, 2022

github-actions bot commented Aug 13, 2022

feat: Made entire row for selectable table clickable. #177

feat: Made entire row for selectable table clickable. #177

Conversation

chadstewart commented Aug 11, 2022 • edited Loading

What type of PR is this? (check all applicable)

Description

Related Tickets & Documents

Mobile & Desktop Screenshots/Recordings

Added tests?

Added to documentation?

[optional] Are there any post-deployment tasks we need to perform?

[optional] What gif best describes this PR or how it makes you feel?

netlify bot commented Aug 11, 2022 • edited Loading

✅ Deploy Preview for oss-insights ready!

netlify bot commented Aug 11, 2022 • edited Loading

✅ Deploy Preview for design-insights ready!

bdougie commented Aug 11, 2022

0-vortex left a comment

Choose a reason for hiding this comment

eryc-cc left a comment

Choose a reason for hiding this comment

chadstewart commented Aug 11, 2022

eryc-cc commented Aug 11, 2022 • edited Loading

chadstewart commented Aug 11, 2022

bdougie left a comment

Choose a reason for hiding this comment

github-actions bot commented Aug 12, 2022

github-actions bot commented Aug 13, 2022

chadstewart commented Aug 11, 2022 •

edited

Loading

netlify bot commented Aug 11, 2022 •

edited

Loading

netlify bot commented Aug 11, 2022 •

edited

Loading

eryc-cc commented Aug 11, 2022 •

edited

Loading