From f1365be6124264532b350aacfb70749f5c5edc46 Mon Sep 17 00:00:00 2001
From: Nikkel Mollenhauer <57323886+NikkelM@users.noreply.github.com>
Date: Sat, 25 Nov 2023 19:26:53 +0100
Subject: [PATCH] Gave the 'Untitled List' after a shuffle a proper name (#238)

---
 CHANGELOG.md                                      | 1 +
 src/content.js                                    | 8 +++++++-
 src/{buildShuffleButton.js => domManipulation.js} | 9 +++++++++
 webpack.common.cjs                                | 2 +-
 4 files changed, 18 insertions(+), 2 deletions(-)
 rename src/{buildShuffleButton.js => domManipulation.js} (92%)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 7200c828..1ed6b3e4 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -5,6 +5,7 @@
 <!--Releasenotes start-->
 - Added a new option to shuffle only from shorts.
 - Reduced the time it takes to shuffle, as the extension now uses a more sophisticated way to decide whether or not to check if a video has been deleted or not.
+- The playlist that is opened when shuffling (if the option is enabled) now has a better title and tooltip.
 - The popup now feels smoother in some places, and will make it clearer when some inputs are invalid.
 - Fixed bugs that would prevent some initialization logic to run after the extension is updated.
 <!--Releasenotes end-->
diff --git a/src/content.js b/src/content.js
index efd9ead4..dc06d5e2 100644
--- a/src/content.js
+++ b/src/content.js
@@ -1,7 +1,7 @@
 // Content script that is injected into YouTube pages
 import { setDOMTextWithDelay, isVideoUrl, RandomYoutubeVideoError } from "./utils.js";
 import { configSync, setSyncStorageValue } from "./chromeStorage.js";
-import { buildShuffleButton, shuffleButton, shuffleButtonTextElement } from "./buildShuffleButton.js";
+import { buildShuffleButton, shuffleButton, shuffleButtonTextElement, tryRenameUntitledList } from "./domManipulation.js";
 import { chooseRandomVideo } from "./shuffleVideo.js";
 
 // ---------- Initialization ----------
@@ -83,6 +83,12 @@ async function startDOMObserver(event) {
 }
 
 async function channelDetectedAction(pageType, channelId, channelName) {
+	// It might be that we got here after shuffling, in which case we want to check if there is a 'Untitled List' that we can rename
+	// We do this before anything else to prevent the previous text from showing shortly
+	if (pageType === "video") {
+		tryRenameUntitledList();
+	}
+
 	// We can get an error here if the extension context was invalidated and the user navigates without reloading the page
 	try {
 		// If we are still connected to the background worker, we can send a message to test the connection
diff --git a/src/buildShuffleButton.js b/src/domManipulation.js
similarity index 92%
rename from src/buildShuffleButton.js
rename to src/domManipulation.js
index f838f177..67843944 100644
--- a/src/buildShuffleButton.js
+++ b/src/domManipulation.js
@@ -92,6 +92,15 @@ export function buildShuffleButton(pageType, channelId, clickHandler) {
 	});
 }
 
+export function tryRenameUntitledList() {
+	let untitledListElement = document.querySelector('ytd-playlist-panel-renderer#playlist.style-scope.ytd-watch-flexy').querySelector('yt-formatted-string');
+
+	if (untitledListElement) {
+		untitledListElement.innerText = "Random YouTube Video - Playlist";
+		untitledListElement.title = "This playlist is unlisted, temporary and cannot be saved. Until it is removed by YouTube (which will happen automatically), you can revisit it using the link in the URL bar.";
+	}
+}
+
 // ----- Private -----
 function finalizeButton(pageType, channelId, clickHandler) {
 	let buttonDivID = "youtube-random-video-shuffle-button";
diff --git a/webpack.common.cjs b/webpack.common.cjs
index c2f7d594..e1247d35 100644
--- a/webpack.common.cjs
+++ b/webpack.common.cjs
@@ -9,7 +9,7 @@ module.exports = env => {
 		entry: {
 			// JS
 			background: './src/background.js',
-			buildShuffleButton: './src/buildShuffleButton.js',
+			domManipulation: './src/domManipulation.js',
 			content: './src/content.js',
 			shuffleVideo: './src/shuffleVideo.js',
 			utils: './src/utils.js',