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

Logs: Show older logs button when infinite scroll is enabled and sort order is descending #91060

Merged
merged 13 commits into from
Aug 15, 2024

Conversation

matyax
Copy link
Contributor

@matyax matyax commented Jul 26, 2024

When inifinte scrolling was introduced, it had a built-in behavior to detect scrolls in the top section and request more logs. Additionally, when infinite scroll is used, the old Logs Navigation component is not displayed.

After feedback that behavior was removed, but we never added a way to request older logs when the order is "oldest first".

This PR adds the button back when infinite scrolling is enabled, and the sort order is "oldest first", to allow to see older logs.

Demo.mov

Special notes for your reviewer:

We could do the same for "Newer logs", but it will require a more complex implementation that I wouldn't want to backport.

@matyax matyax requested a review from a team as a code owner July 26, 2024 14:20
@matyax matyax self-assigned this Jul 26, 2024
@github-actions github-actions bot added this to the 11.2.x milestone Jul 26, 2024
@matyax matyax added add to changelog backport v11.1.x Mark PR for automatic backport to v11.1.x type/bug labels Jul 26, 2024
Copy link
Contributor

Hello @matyax!
Backport pull requests need to be either:

  • Pull requests which address bugs,
  • Urgent fixes which need product approval, in order to get merged,
  • Docs changes.

Please, if the current pull request addresses a bug fix, label it with the type/bug label.
If it already has the product approval, please add the product-approved label. For docs changes, please add the type/docs label.
If the pull request modifies CI behaviour, please add the type/ci label.
If none of the above applies, please consider removing the backport label and target the next major/minor release.
Thanks!

Copy link
Contributor

This PR must be merged before a backport PR will be created.

@@ -250,5 262,8 @@ const getStyles = (theme: GrafanaTheme2, oldestLogsFirst: boolean) => {
align-items: center;
margin-top: ${theme.spacing(1)};
Copy link
Contributor Author

Choose a reason for hiding this comment

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

We can migrate these to the object format, but not here because this will be backported.

@matyax
Copy link
Contributor Author

matyax commented Aug 15, 2024

Friendly reminder of this escalation.

Copy link
Contributor

@svennergr svennergr left a comment

Choose a reason for hiding this comment

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

Works great 👍

public/app/features/logs/components/InfiniteScroll.tsx Outdated Show resolved Hide resolved
@matyax matyax enabled auto-merge (squash) August 15, 2024 14:17
@matyax matyax requested a review from a team as a code owner August 15, 2024 15:01
@matyax matyax requested review from joshhunt and L-M-K-B and removed request for a team August 15, 2024 15:01
@matyax matyax merged commit 40c6f74 into main Aug 15, 2024
15 checks passed
@matyax matyax deleted the matyax/older-logs branch August 15, 2024 15:17
@github-actions github-actions bot modified the milestones: 11.2.x, 11.3.x Aug 15, 2024
Copy link
Contributor

The backport to v11.1.x failed:

The process '/usr/bin/git' failed with exit code 1

To backport manually, run these commands in your terminal:

# Fetch latest updates from GitHub
git fetch
# Create a new branch
git switch --create backport-91060-to-v11.1.x origin/v11.1.x
# Cherry-pick the merged commit of this pull request and resolve the conflicts
git cherry-pick -x 40c6f741c08868f1fb42b5b5760faf1e5ef93b52

When the conflicts are resolved, stage and commit the changes:

git add . && git cherry-pick --continue

If you have the GitHub CLI installed:

# Push the branch to GitHub:
git push --set-upstream origin backport-91060-to-v11.1.x
# Create the PR body template
PR_BODY=$(gh pr view 91060 --json body --template 'Backport 40c6f741c08868f1fb42b5b5760faf1e5ef93b52 from #91060{{ "\n\n---\n\n" }}{{ index . "body" }}')
# Create the PR on GitHub
echo "${PR_BODY}" | gh pr create --title '[v11.1.x] Logs: Show older logs button when infinite scroll is enabled and sort order is descending' --body-file - --label 'type/bug' --label 'area/explore' --label 'area/frontend' --label 'add to changelog' --label 'backport' --base v11.1.x --milestone 11.1.x --web

Or, if you don't have the GitHub CLI installed (we recommend you install it!):

# Push the branch to GitHub:
git push --set-upstream origin backport-91060-to-v11.1.x

# Create a pull request where the `base` branch is `v11.1.x` and the `compare`/`head` branch is `backport-91060-to-v11.1.x`.

# Remove the local backport branch
git switch main
git branch -D backport-91060-to-v11.1.x

@grafana-delivery-bot grafana-delivery-bot bot added the backport-failed Failed to generate backport PR. Please resolve conflicts and create one manually. label Aug 15, 2024
@matyax matyax removed the backport v11.1.x Mark PR for automatic backport to v11.1.x label Aug 15, 2024
giorgioatmerqury pushed a commit to cybermerqury/grafana that referenced this pull request Aug 21, 2024
… order is descending (grafana#91060)

* LogsNavigation: show older logs button when the order is descending

* LogsNavigation: adjust styles for showing only older logs button

* Logs Navigation: revert changes

* Infinite scroll: add older logs button

* Older logs button: show only in explore

* chore: add unit test

* Formatting

* Update public/app/features/logs/components/InfiniteScroll.test.tsx

Co-authored-by: Sven Grossmann <[email protected]>

* Chore: add missing translation

* Chore: move the button a tiny bit

---------

Co-authored-by: Sven Grossmann <[email protected]>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
add to changelog area/explore area/frontend backport-failed Failed to generate backport PR. Please resolve conflicts and create one manually. type/bug
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

2 participants