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

Add full screen view for logs #45183

Merged
merged 6 commits into from
Jan 8, 2025
Merged

Conversation

tirkarthi
Copy link
Contributor

@tirkarthi tirkarthi commented Dec 23, 2024

Related #44663 (comment)

It will be useful to have logs open in full screen view to read the logs. Currently the tab and task details are still present on scroll taking more space. Legacy logs page had more screen space which was useful for our users internally. The implementation is simple that uses dialog to display the same code block with wrap and other styles applied in full screen mode.

Notes for reviewer and self :

  • I would opt for removing Dialog.Header section too to get more space or replace log with some other useful information.
  • Using an IconButton but can change to button with text "Full Screen" for uniformity.

image

Full screen

image

@boring-cyborg boring-cyborg bot added the area:UI Related to UI/UX. For Frontend Developers. label Dec 23, 2024
@jscheffl
Copy link
Contributor

jscheffl commented Jan 1, 2025

Note: As PR #45312 has been merged, the code formatting rules have changed for new UI. Please rebase and re-run pre-commit checks to ensure that formatting in folder airflow/ui is adjusted.

Copy link
Member

@pierrejeambrun pierrejeambrun left a comment

Choose a reason for hiding this comment

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

Working as expected.

A few minor suggestions.

airflow/ui/src/components/TaskLogHeader.tsx Outdated Show resolved Hide resolved
airflow/ui/src/pages/TaskInstance/Logs.tsx Outdated Show resolved Hide resolved
airflow/ui/src/pages/TaskInstance/Logs.tsx Show resolved Hide resolved
Copy link
Member

@pierrejeambrun pierrejeambrun left a comment

Choose a reason for hiding this comment

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

Working as expected.

Code looks good too.

@pierrejeambrun pierrejeambrun merged commit 8ae1ef0 into apache:main Jan 8, 2025
35 checks passed
@tirkarthi
Copy link
Contributor Author

Thanks @pierrejeambrun and @bbovenzi

dstandish pushed a commit to astronomer/airflow that referenced this pull request Jan 8, 2025
* Add full screen view for log.

* Use text button instead of icon.

* Revert "Use text button instead of icon."

This reverts commit 956ff7c.

* Use icon and revert text button.

* Refactor to header component for reuse. Show task tries in fullscreen.

* Refactor log content to separate component for reuse.
agupta01 pushed a commit to agupta01/airflow that referenced this pull request Jan 13, 2025
* Add full screen view for log.

* Use text button instead of icon.

* Revert "Use text button instead of icon."

This reverts commit 956ff7c.

* Use icon and revert text button.

* Refactor to header component for reuse. Show task tries in fullscreen.

* Refactor log content to separate component for reuse.
HariGS-DB pushed a commit to HariGS-DB/airflow that referenced this pull request Jan 16, 2025
* Add full screen view for log.

* Use text button instead of icon.

* Revert "Use text button instead of icon."

This reverts commit 956ff7c.

* Use icon and revert text button.

* Refactor to header component for reuse. Show task tries in fullscreen.

* Refactor log content to separate component for reuse.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
area:UI Related to UI/UX. For Frontend Developers.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants