Skip to content

Remove jQuery class from the notification count #30172

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.

Sign up for GitHub

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

Merged
merged 7 commits into from
Mar 29, 2024
Merged

Remove jQuery class from the notification count #30172

Changes from 1 commit
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
ef8ffcf
Remove jQuery class from the notification count
yardenshoham Mar 29, 2024
9f83631
Use toggleElem
yardenshoham Mar 29, 2024
99d4ea3
Use elementsCall
yardenshoham Mar 29, 2024
06129a3
Merge branch 'main' into notifications-jquery-class
yardenshoham Mar 29, 2024
892cdc7
Revert "Use elementsCall"
yardenshoham Mar 29, 2024
6d75d26
Merge branch 'main' into notifications-jquery-class
yardenshoham Mar 29, 2024
283ea3b
Merge branch 'main' into notifications-jquery-class
GiteaBot Mar 29, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
10 changes: 6 additions & 4 deletions web_src/js/features/notification.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
import $ from 'jquery';
import {GET} from '../modules/fetch.js';
import {hideElem, showElem} from '../utils/dom.js';

const {appSubUrl, notificationSettings, assetVersionEncoded} = window.config;
let notificationSequenceNumber = 0;
Expand Down Expand Up @@ -177,14 +178,15 @@ async function updateNotificationCount() {

const data = await response.json();

const $notificationCount = $('.notification_count');
if (data.new === 0) {
$notificationCount.addClass('tw-hidden');
hideElem('.notification_count');
} else {
$notificationCount.removeClass('tw-hidden');
showElem('.notification_count');
}

$notificationCount.text(`${data.new}`);
for (const el of document.getElementsByClassName('notification_count')) {
el.textContent = `${data.new}`;
}
Copy link
Contributor

Choose a reason for hiding this comment

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

I guess it's better to introduce a util function:

queryElem('.notification_count', (el) => el.textContent = `${data.new}`);

I have seen too many loops for the refactoring.

Copy link
Member Author

Choose a reason for hiding this comment

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

Maybe export

gitea/web_src/js/utils/dom.js

Line 3 in 849eee8

function elementsCall(el, func, ...args) {
?

Copy link
Contributor

Choose a reason for hiding this comment

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

Yup, it is a good candidate, meanwhile I guess it needs some rewriting and renaming.

Copy link
Member Author

Choose a reason for hiding this comment

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

99d4ea3 (#30172)

Feel free to push here for nits

Copy link
Member

@silverwind silverwind Mar 29, 2024 •
edited
Loading

Choose a reason for hiding this comment

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

I would name it forElems, e.g. do something for each matched element.

Copy link
Member

@silverwind silverwind Mar 29, 2024 •
edited
Loading

Choose a reason for hiding this comment

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

Could also just use built-in methods, a bit more verbose but does the same:

Array.from(document.querySelectorAll('.foo')).forEach((el) => el.checked = true);

Copy link
Member

@silverwind silverwind Mar 29, 2024 •
edited
Loading

Choose a reason for hiding this comment

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

Looks there is NodeList.forEach, so it can be shortened:

document.querySelectorAll('.foo').forEach((el) => el.checked = true);

@wxiaoguang @yardenshoham is that acceptable to you?

Copy link
Member Author

Choose a reason for hiding this comment

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

Could also just use built-in methods

Lint converts it into a for-of loop.
image

Looks there is NodeList.forEach, so it can be shortened

Same here.
image

Honestly I think using a loop is OK, I don't see a big need to avoid it.

Copy link
Member

@silverwind silverwind Mar 29, 2024 •
edited
Loading

Choose a reason for hiding this comment

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

Hmm yes the rule thinks it's Array.forEach because it has no type information and this is unfixable in the rule unless it gains type information from things like typescript's parser which we don't use yet.

So yes, I prefer revert to for-of now, even if it's more verbose.

Copy link
Member Author

Choose a reason for hiding this comment

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

892cdc7


return `${data.new}`;
} catch (error) {
Expand Down