Fix labels in anonymous mode (#5650)

* Fix labels in anonymous mode
fix https://github.com/FreshRSS/FreshRSS/issues/4305

* Show all tags

* Revert "Show all tags"

This reverts commit 24dfba501729cea32943548bc829d3581883de50.

* Add message when no labels

* fixed no label style

* i18n de translation

* Fix in non-anomymous mode

* No class in anonymous mode

---------

Co-authored-by: maTh <1645099+math-GH@users.noreply.github.com>
Co-authored-by: math-gh <>

1 files changed, 44 insertions, 28 deletions

diff --git a/p/scripts/main.js b/p/scripts/main.js
index 7c8eb90e2..e87636863 100644
--- a/p/scripts/main.js
+++ b/p/scripts/main.js
@@ -1300,47 +1300,63 @@ function loadDynamicTags(div) {
 			return req.onerror(e);
 		}
 
-		const li_item0 = document.createElement('li');
-		li_item0.setAttribute('class', 'item addItem');
+		if (!context.anonymous) {
+			const li_item0 = document.createElement('li');
+			li_item0.setAttribute('class', 'item addItem');
 
-		const label = document.createElement('label');
-		label.setAttribute('class', 'noHover');
+			const label = document.createElement('label');
+			label.setAttribute('class', 'noHover');
 
-		const input_checkboxTag = document.createElement('input');
-		input_checkboxTag.setAttribute('class', 'checkboxTag checkboxNewTag');
-		input_checkboxTag.setAttribute('name', 't_0');
-		input_checkboxTag.setAttribute('type', 'checkbox');
+			const input_checkboxTag = document.createElement('input');
+			input_checkboxTag.setAttribute('class', 'checkboxTag checkboxNewTag');
+			input_checkboxTag.setAttribute('name', 't_0');
+			input_checkboxTag.setAttribute('type', 'checkbox');
 
-		const input_newTag = document.createElement('input');
-		input_newTag.setAttribute('type', 'text');
-		input_newTag.setAttribute('name', 'newTag');
-		input_newTag.addEventListener('keydown', function (ev) { if (ev.key.toUpperCase() == 'ENTER') { this.parentNode.previousSibling.click(); } });
+			const input_newTag = document.createElement('input');
+			input_newTag.setAttribute('type', 'text');
+			input_newTag.setAttribute('name', 'newTag');
+			input_newTag.addEventListener('keydown', function (ev) { if (ev.key.toUpperCase() == 'ENTER') { this.parentNode.previousSibling.click(); } });
 
-		const button_btn = document.createElement('button');
-		button_btn.setAttribute('type', 'button');
-		button_btn.setAttribute('class', 'btn');
-		button_btn.addEventListener('click', function () { this.parentNode.parentNode.click(); });
+			const button_btn = document.createElement('button');
+			button_btn.setAttribute('type', 'button');
+			button_btn.setAttribute('class', 'btn');
+			button_btn.addEventListener('click', function () { this.parentNode.parentNode.click(); });
 
-		const text_plus = document.createTextNode('+');
+			const text_plus = document.createTextNode('+');
 
-		const div_stick = document.createElement('div');
-		div_stick.setAttribute('class', 'stick');
+			const div_stick = document.createElement('div');
+			div_stick.setAttribute('class', 'stick');
 
-		button_btn.appendChild(text_plus);
-		div_stick.appendChild(input_newTag);
-		div_stick.appendChild(button_btn);
-		label.appendChild(input_checkboxTag);
-		label.appendChild(div_stick);
-		li_item0.appendChild(label);
+			button_btn.appendChild(text_plus);
+			div_stick.appendChild(input_newTag);
+			div_stick.appendChild(button_btn);
+			label.appendChild(input_checkboxTag);
+			label.appendChild(div_stick);
+			li_item0.appendChild(label);
 
-		div.querySelector('.dropdown-menu').appendChild(li_item0);
+			div.querySelector('.dropdown-menu').appendChild(li_item0);
+		}
 
 		let html = '';
 		if (json && json.length) {
+			let nbLabelsChecked = 0;
 			for (let i = 0; i < json.length; i++) {
 				const tag = json[i];
-				html += '<li class="item"><label><input class="checkboxTag" name="t_' + tag.id + '" type="checkbox"' +
-						(tag.checked ? ' checked="checked"' : '') + '> ' + tag.name + '</label></li>';
+				if (context.anonymous && !tag.checked) {
+					// In anomymous mode, show only the used tags
+					continue;
+				}
+				if (tag.checked) {
+					nbLabelsChecked++;
+				}
+				html += '<li class="item"><label><input ' +
+					(context.anonymous ? '' : 'class="checkboxTag" ') +
+					'name="t_' + tag.id + '"type="checkbox" ' +
+					(context.anonymous ? 'disabled="disabled" ' : '') +
+					(tag.checked ? 'checked="checked" ' : '') + '/> ' + tag.name + '</label></li>';
+			}
+			if (context.anonymous && nbLabelsChecked === 0) {
+				html += '<li class="item"><span class="emptyLabels">' + context.i18n.labels_empty + '</span></li>';
 			}
 		}
 		div.querySelector('.dropdown-menu').insertAdjacentHTML('beforeend', html);