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

Migrate comment fragments to Jetpack Compose #11060

Merged
merged 65 commits into from
Nov 11, 2024

Conversation

Isira-Seneviratne
Copy link
Member

@Isira-Seneviratne Isira-Seneviratne commented May 12, 2024

What is it?

  • Bugfix (user facing)
  • Feature (user facing)
  • Codebase improvement (dev facing)
  • Meta improvement to the project (dev facing)

Description of the changes in your PR

  • Update the Compose dependencies to their latest versions.
  • Add the Compose library for Coil to handle image loading.
  • Add the LazyColumnScrollbar library to display scrollbars in Compose.
  • Migrate the comments to use Jetpack Compose and replace the comment replies fragment with a bottom sheet dialog.
  • Handle loading the comments and comment replies using the Paging library and a view model.

Before/After Screenshots/Screen Record

Before
Comments Comment replies
Before Before
After (initial design)
Comments Comment replies Expanded comment replies
After After After
After (improved design)
Comments Comment replies Expanded comment replies
After After After
Screen_recording_20240708_162549.mp4

Relies on the following changes

APK testing

The APK can be found by going to the "Checks" tab below the title. On the left pane, click on "CI", scroll down to "artifacts" and click "app" to download the zip file which contains the debug APK of this PR. You can find more info and a video demonstration on this wiki page.

Due diligence

@github-actions github-actions bot added size/medium PRs with less than 250 changed lines size/large PRs with less than 750 changed lines and removed size/medium PRs with less than 250 changed lines labels May 12, 2024
@Isira-Seneviratne Isira-Seneviratne changed the base branch from dev to refactor May 17, 2024 03:55
@Isira-Seneviratne Isira-Seneviratne force-pushed the Comments-Compose branch 2 times, most recently from c77ea74 to c106fb0 Compare May 17, 2024 04:02
@Isira-Seneviratne Isira-Seneviratne marked this pull request as ready for review May 17, 2024 04:48
@github-actions github-actions bot added size/giant PRs with more than 750 changed lines and removed size/large PRs with less than 750 changed lines labels Jun 18, 2024
@Isira-Seneviratne Isira-Seneviratne force-pushed the Comments-Compose branch 5 times, most recently from c834fd0 to 8ee1817 Compare June 19, 2024 12:30
@Isira-Seneviratne Isira-Seneviratne changed the title Convert comment replies views to Jetpack Compose Migrate comment fragments to Jetpack Compose Jun 21, 2024
@Isira-Seneviratne Isira-Seneviratne force-pushed the Comments-Compose branch 3 times, most recently from 31f1fcf to e973ce1 Compare July 3, 2024 13:28
@Isira-Seneviratne Isira-Seneviratne force-pushed the Comments-Compose branch 5 times, most recently from bace455 to 10dd571 Compare July 28, 2024 02:49
@Stypox
Copy link
Member

Stypox commented Nov 10, 2024

I pushed a few commits:

  • redesigned the layouts, see comparison in PR body
  • merge with refactor to include build fixes by litetex
  • fix paging skipping first page of comments
  • handle unknown values without showing -1 in various places
  • you can test nested replies and unknown comment and like counts in this peertube video: https://share.tube/w/vxu4uTstUBAUromWwXGHrq
  • you can test hearted and pinned comment in this youtube video: https://www.youtube.com/watch?v=Wf1th3vi53U
  • TODO: what should happen when the user clicks on a channel while inside of the comment replies dialog? Currently the channel does open, but only behind the bottom sheet, which is quite strange and difficult to notice. I would propose just lowering the bottom sheet, but not closing it to avoid accidental clicks on channel icons to close the view and forcing the user to scroll back to the original location to continue reading replies.
  • TODO: use Icons.Default.* instead of vector icons
  • TODO: create utility function to copy to clipboard from inside of a composable function

Copy link

Copy link
Member

@Stypox Stypox left a comment

Choose a reason for hiding this comment

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

Thank you! I implemented the TODOs in my previous comment.

The review comments I left here are things to do in future PRs.

Comment on lines +34 to +45
@Composable
fun rememberParsedDescription(description: Description): AnnotatedString {
// TODO: Handle links and hashtags, Markdown.
return remember(description) {
if (description.type == Description.HTML) {
val styles = TextLinkStyles(SpanStyle(textDecoration = TextDecoration.Underline))
AnnotatedString.fromHtml(description.content, styles)
} else {
AnnotatedString(description.content)
}
}
}
Copy link
Member

Choose a reason for hiding this comment

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

Note: reimplementing Description -> AnnotatedString is going to be a tough task, considering how complicated TextLinkifier is: https://github.com/TeamNewPipe/NewPipe/blob/9d6ac67c46a6cc55e03dec0599d8070f7430098d/app/src/main/java/org/schabi/newpipe/util/text/TextLinkifier.java


is Resource.Error -> {
item {
NoItemsMessage(R.string.error_unable_to_load_comments)
Copy link
Member

Choose a reason for hiding this comment

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

An error panel should be created to handle all of these cases and allow retrying, reporting and opening in browser.

@Stypox Stypox merged commit 62ab9bd into TeamNewPipe:refactor Nov 11, 2024
6 checks passed
Copy link
Member

@AudricV AudricV left a comment

Choose a reason for hiding this comment

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

Here is some general feedback to be added to my review comments:

  • the difference between the two loading spinners is a bit disturbing, the new one for comments doesn't seem to match Material Design style;
  • it would be great if the replies only prevent interacting with comments and not all content (i.e. comment drawers cannot be shown outside of the comments view).

// params.key is null the first time load() is called, and we need to return the first page
val repliesPage = params.key ?: commentInfo.replies
val info = withContext(Dispatchers.IO) {
CommentsInfo.getMoreItems(service, commentInfo.url, repliesPage)
Copy link
Member

Choose a reason for hiding this comment

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

The app crashes when trying to load comment replies when being offline after comments have been loaded with a network connection at this exact line (it should also happen on comment continuations). This must be fixed.

Copy link
Member

Choose a reason for hiding this comment

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

There is no cache in the comment replies fetching, causing the app to reload them each time the device is rotated or a switch between the description content view tab and the comments one is done. This regression must be fixed.

@Profpatsch
Copy link
Contributor

I created issues for the remaining post-review comments

@Stypox
Copy link
Member

Stypox commented Nov 21, 2024

Now errors in the comments make the app crash completely (https://soundcloud.com/user-722618400/a-real-playa):

Exception

  • User Action: ui error
  • Request: ACRA report
  • Content Country: GB
  • Content Language: en-GB
  • App Language: en_GB
  • Service: none
  • Version: 0.27.2
  • OS: Linux Android 13 - 33
Crash log

java.lang.IllegalArgumentException: Page doesn't contain an URL
	at org.schabi.newpipe.extractor.services.soundcloud.extractors.SoundcloudCommentsExtractor.getPage(SoundcloudCommentsExtractor.java:44)
	at org.schabi.newpipe.extractor.comments.CommentsInfo.getMoreItems(CommentsInfo.java:79)
	at org.schabi.newpipe.paging.CommentsSource$load$info$1.invokeSuspend(CommentsSource.kt:23)
	at kotlin.coroutines.jvm.internal.BaseContinuationImpl.resumeWith(ContinuationImpl.kt:33)
	at kotlinx.coroutines.DispatchedTask.run(DispatchedTask.kt:101)
	at kotlinx.coroutines.internal.LimitedDispatcher$Worker.run(LimitedDispatcher.kt:113)
	at kotlinx.coroutines.scheduling.TaskImpl.run(Tasks.kt:89)
	at kotlinx.coroutines.scheduling.CoroutineScheduler.runSafely(CoroutineScheduler.kt:589)
	at kotlinx.coroutines.scheduling.CoroutineScheduler$Worker.executeTask(CoroutineScheduler.kt:823)
	at kotlinx.coroutines.scheduling.CoroutineScheduler$Worker.runWorker(CoroutineScheduler.kt:720)
	at kotlinx.coroutines.scheduling.CoroutineScheduler$Worker.run(CoroutineScheduler.kt:707)
	Suppressed: kotlinx.coroutines.internal.DiagnosticCoroutineContextException: [LazyStandaloneCoroutine{Cancelling}@16d25a5, Dispatchers.Main.immediate]


@Profpatsch
Copy link
Contributor

I’ll add an issue and mark it high priority

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
comments Anything to do with comments and comment replies under videos/audios GUI Issue is related to the graphical user interface rewrite Issues and PRs related to rewrite size/giant PRs with more than 750 changed lines
Projects
Status: Done
Development

Successfully merging this pull request may close these issues.

Introduce Jetpack Compose for NewPipe UI
7 participants