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

consider scrolling for hover function #4731

Merged
merged 10 commits into from
Jan 19, 2024
Merged

consider scrolling for hover function #4731

merged 10 commits into from
Jan 19, 2024

Conversation

mirnawong1
Copy link
Contributor

this pr sets a flag to help indicate whether the page is being scrolled so that the toggles don’t expand while scrolling. this pr also modifies the handleMouseEnter function to check this flag and prevents the toggle from expanding if the page is being scrolled.

  • adds a new state variable to track if the page is scrolling.
  • add event listeners for scroll events to set this variable.
  • modifies the handleMouseEnter function to check the scrolling state.
    So:
  • isScrolling tracks if user is scrolling
  • handleScroll function to call on scrolling events and disables toggle if isScrolling is true
  • handleMouseEnter checks for isScrolling

@mirnawong1 mirnawong1 requested a review from a team as a code owner January 10, 2024 18:58
Copy link

vercel bot commented Jan 10, 2024

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
docs-getdbt-com ✅ Ready (Inspect) Visit Preview 💬 Add feedback Jan 19, 2024 3:41pm

@github-actions github-actions bot added Docs team Authored by the Docs team @dbt Labs size: medium This change will take up to a week to address labels Jan 10, 2024
@mirnawong1
Copy link
Contributor Author

preview of what this looks like: Recording Jan 11

Copy link
Contributor

@matthewshaver matthewshaver left a comment

Choose a reason for hiding this comment

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

I'm still not sure that, for pages with a long list of items, the "hover to expand" is the best user experience, but this is a big improvement over how it behaved prior in regards to the scrolling. Thanks Mirna for your work on this!

Copy link
Collaborator

@JKarlavige JKarlavige left a comment

Choose a reason for hiding this comment

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

The scroll feature looks like it works well! Just have one requested change regarding the table edit, then this should be ready to 🚢

Comment on lines 14 to 21
| [Performance](#performance) | Identify inefficiencies in pipeline execution to reduce infrastructure<br /> costs and improve timeliness. | <ul><li>What's the latest status of each model?</li> <li>Do I need to run this model?</li><li>How long did my DAG take to run?</li> </ul>|
| [Quality](#quality) | Monitor data source freshness and test results to resolve issues<br /> and drive trust in data. | <ul><li>How fresh are my data sources?</li><li>Which tests and models failed?</li><li>What's my project's test coverage?</li></ul> |
| [Discovery](#discovery) | Find and understand relevant datasets and semantic nodes with<br /> rich context and metadata. | <ul><li>What do these tables and columns mean?</li><li>What's the full data lineage?</li><li>Which metrics can I query?</li> </ul> |
| [Governance](#governance) | Audit data development and facilitate collaboration within and between teams. | <ul><li>Who is responsible for this model?</li><li>How do I contact the model's owner?</li><li>Who can use this model?</li></ul>|
| [Development](#development) | Understand dataset changes and usage and gauge impacts<br /> to inform project definition. | <ul><li>How is this metric used in BI tools?</li><li>Which nodes depend on this data source?</li><li>How has a model changed? What impact?</li> </ul>|

</table>
</div>
Copy link
Collaborator

Choose a reason for hiding this comment

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

Not sure if this edit is intended here but it looks like this table is broken within the preview: https://docs-getdbt-com-git-mwong-scroll-dbt-labs.vercel.app/docs/dbt-cloud-apis/discovery-use-cases-and-examples

Copy link
Contributor Author

Choose a reason for hiding this comment

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

oh wow thank you @JKarlavige ! that was definitely a mistaken and probably when i was playing with table widths. removed it and it should hopefully not affect the table anymore 🙏

@mirnawong1
Copy link
Contributor Author

enabling auto merge

Copy link
Collaborator

@JKarlavige JKarlavige left a comment

Choose a reason for hiding this comment

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

:shipit: :shipit: :shipit:

@mirnawong1 mirnawong1 merged commit dc9ac9a into current Jan 19, 2024
7 checks passed
@mirnawong1 mirnawong1 deleted the mwong-scroll branch January 19, 2024 15:47
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Docs team Authored by the Docs team @dbt Labs January-2024 size: medium This change will take up to a week to address
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants