Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

relations header button to appear at all times for mobile devices #7044

Merged
merged 3 commits into from
Sep 17, 2024

Conversation

ehconitin
Copy link
Contributor

fixes #7036

Copy link
Contributor

@greptile-apps greptile-apps bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

PR Summary

This PR addresses the visibility of relation header buttons on mobile devices, improving user experience and discoverability of actions.

  • Modified RecordDetailRelationSection.tsx to use useIsMobile hook for detecting mobile devices
  • Adjusted visibility of add/edit button to always show on mobile, not just on hover
  • Removed displayOnHover class for mobile devices in LightIconButton component
  • Improved accessibility for new users on mobile by making dropdown actions more apparent

1 file(s) reviewed, no comment(s)
Edit PR Review Bot Settings

@@ -54,6 +55,7 @@ export const RecordDetailRelationSection = ({
} = fieldDefinition.metadata as FieldRelationMetadata;
const record = useRecoilValue(recordStoreFamilyState(recordId));

const isMobile = useIsMobile();
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Or should I pass in the prop in either Context or to the component from RecordShowContainer?

Copy link
Contributor

@bosiraphael bosiraphael left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hello @ehconitin ! Thank you for contributing :) LGTM, left a comment

Copy link
Contributor

@bosiraphael bosiraphael left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

@bosiraphael bosiraphael merged commit 3c306e9 into twentyhq:main Sep 17, 2024
10 of 11 checks passed
Copy link

Thanks @ehconitin for your contribution!
This marks your 1st PR on the repo. You're top 32% of all our contributors 🎉
See contributor page - Share on LinkedIn - Share on Twitter

Contributions

@ehconitin ehconitin deleted the minor-fix branch October 10, 2024 10:46
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Always display icons to add record, not just on hover
2 participants