Skip to content

Use selector-observe on more features #3094

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

Closed
fregante wants to merge 1 commit into from
Closed

Use selector-observe on more features #3094

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
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
21 changes: 14 additions & 7 deletions source/features/hide-own-stars.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,17 +1,25 @@
import select from 'select-dom';
import * as pageDetect from 'github-url-detection';

import oneTime from 'onetime';

import features from '../libs/features';
import {getUsername} from '../libs/utils';
import {lazilyObserveSelector, ElementCallback} from '../libs/once-visible-observer';

async function init(): Promise<void> {
for (const item of select.all('#dashboard .news .watch_started, #dashboard .news .fork')) {
if (select.exists(`a[href^="/${getUsername()}"]`, item)) {
item.style.display = 'none';
}
function hide(element: HTMLElement): void {
if (select.exists(`a[href^="/${getUsername()}"]`, element)) {
element.style.display = 'none';
}
}

function init(): void {
lazilyObserveSelector(`
#dashboard .news .watch_started,
#dashboard .news .fork
`, hide as ElementCallback);
}

features.add({
id: __filebasename,
description: 'Hides "starred" events for your own repos on the newsfeed.',
Expand All @@ -20,7 +28,6 @@ features.add({
include: [
pageDetect.isDashboard
],
onlyAdditionalListeners: true,
repeatOnAjax: false,
init
init: oneTime(init)
});
49 changes: 7 additions & 42 deletions source/features/infinite-scroll.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,47 +3,13 @@ import debounce from 'debounce-fn';
import * as pageDetect from 'github-url-detection';

import features from '../libs/features';
import {lazilyObserveSelector, ElementCallback} from '../libs/once-visible-observer';

let button: HTMLButtonElement | undefined;

const loadMore = debounce(() => {
button!.click();
button!.textContent = 'Loading…';

// If GH hasn't loaded the JS, the click will not load anything.
// We can detect if it worked by looking at the button's state,
// and then trying again (auto-debounced)
if (!button!.disabled) {
loadMore();
}
}, {wait: 200});

const inView = new IntersectionObserver(([{isIntersecting}]) => {
if (isIntersecting) {
loadMore();
} else {
// The button may have been changed after it's gone out of view, so try finding it again
findButton();
}
}, {
rootMargin: '500px' // https://github.com/sindresorhus/refined-github/pull/505#issuecomment-309273098
});

const findButton = (): void => {
// If the old button is still there, leave
if (button && document.contains(button)) {
return;
}

// Forget the old button
inView.disconnect();

// Watch the new button, or stop everything
button = select<HTMLButtonElement>('.ajax-pagination-btn')!;
if (button) {
inView.observe(button);
}
};
function loadMore(button: HTMLButtonElement): void {
console.log('will click', button.disabled)
button.click();
button.textContent = 'Loading…';
}

function init(): void {
const form = select('.ajax-pagination-form');
Expand All @@ -52,7 +18,7 @@ function init(): void {
// the fake click will submit the form without ajax.
form.addEventListener('submit', event => event.preventDefault());

findButton();
lazilyObserveSelector('.ajax-pagination-btn', loadMore as ElementCallback);
}
}

Expand All @@ -64,7 +30,6 @@ features.add({
include: [
pageDetect.isDashboard
],
onlyAdditionalListeners: true,
repeatOnAjax: false,
init
});
29 changes: 17 additions & 12 deletions source/features/linkify-labels-on-dashboard.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,20 +1,26 @@
import React from 'dom-chef';
import select from 'select-dom';
import oneTime from 'onetime';
import {observe} from 'selector-observer';
import * as pageDetect from 'github-url-detection';

import {wrap} from '../libs/dom-utils';
import features from '../libs/features';

async function init(): Promise<void> {
for (const label of select.all('.js-recent-activity-container :not(a) > .IssueLabel')) {
const activity = label.closest('li')!;
const isPR = select.exists('.octicon-git-pull-request', activity);
const repository = select<HTMLAnchorElement>('a[data-hovercard-type="repository"]', activity)!;
const url = new URL(`${repository.href}/${isPR ? 'pulls' : 'issues'}`);
const labelName = label.textContent!.trim();
url.searchParams.set('q', `is:${isPR ? 'pr' : 'issue'} is:open sort:updated-desc label:"${labelName}"`);
wrap(label, <a href={String(url)}/>);
}
function linkify(label: Element): void {
const activity = label.closest('li')!;
const isPR = select.exists('.octicon-git-pull-request', activity);
const repository = select<HTMLAnchorElement>('a[data-hovercard-type="repository"]', activity)!;
const url = new URL(`${repository.href}/${isPR ? 'pulls' : 'issues'}`);
const labelName = label.textContent!.trim();
url.searchParams.set('q', `is:${isPR ? 'pr' : 'issue'} is:open sort:updated-desc label:"${labelName}"`);
wrap(label, <a href={String(url)}/>);
}

function init(): void {
observe('.js-recent-activity-container :not(a) > .IssueLabel', {
add: linkify
})
}

features.add({
Expand All @@ -25,7 +31,6 @@ features.add({
include: [
pageDetect.isDashboard
],
onlyAdditionalListeners: true,
repeatOnAjax: false,
init
init: oneTime(init)
});
61 changes: 29 additions & 32 deletions source/features/parse-backticks.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,35 +1,37 @@
import './parse-backticks.css';
import select from 'select-dom';
import oneTime from 'onetime';
import {observe} from 'selector-observer';
import * as pageDetect from 'github-url-detection';

import features from '../libs/features';
import {parseBackticks} from '../libs/dom-formatters';

const selector = [
'.commit-title', // `isCommit`
'.commit-desc', // `isCommit`, `isCommitList`, `isRepoTree`
'.commit-message', // Pushed commits in `isPRConversation`, `isCompare`, `isReleasesOrTags`
'.message', // `isCommitList`, `isRepoTree`, `isBlame`
'.Box--condensed .link-gray[href*="/commit/"]', // `isSingleFile`
'[aria-label="Issues"][role="group"] .js-navigation-open', // `isDiscussionList`
'[id^=ref-issue-]', // Issue references in `isIssue`, `isPRConversation`
'[id^=ref-pullrequest-]', // PR references in `isIssue`, `isPRConversation`
'.TimelineItem-body > del, .TimelineItem-body > ins', // Title edits in `isIssue`, `isPRConversation`
'.js-pinned-issue-list-item > span', // Pinned Issues
'.pulse-section li', // `isPulse`
'.issues_labeled .text-gray-dark > a', // `isDashboard` "help wanted" event titles
'.js-recent-activity-container .text-bold', // `isDashboard`"Recent activity" titles
'.commits blockquote', // Newsfeed commits
'.release-header', // `isReleasesOrTags` Headers
'.Box-row.js-navigation-item a.link-gray-dark', // `isGlobalDiscussionList`
'[data-channel^="check_suites"] a', // `isActions`
'.repository-content .pr-toolbar h2', // `isActions` run
'#wiki-wrapper h1' // `isWiki`
].join();

function init(): void {
for (const title of select.all([
'.commit-title', // `isCommit`
'.commit-desc', // `isCommit`, `isCommitList`, `isRepoTree`
'.commit-message', // Pushed commits in `isPRConversation`, `isCompare`, `isReleasesOrTags`
'.message', // `isCommitList`, `isRepoTree`, `isBlame`
'.Box--condensed .link-gray[href*="/commit/"]', // `isSingleFile`
'[aria-label="Issues"][role="group"] .js-navigation-open', // `isDiscussionList`
'[id^=ref-issue-]', // Issue references in `isIssue`, `isPRConversation`
'[id^=ref-pullrequest-]', // PR references in `isIssue`, `isPRConversation`
'.TimelineItem-body > del, .TimelineItem-body > ins', // Title edits in `isIssue`, `isPRConversation`
'.js-pinned-issue-list-item > span', // Pinned Issues
'.pulse-section li', // `isPulse`
'.issues_labeled .text-gray-dark > a', // `isDashboard` "help wanted" event titles
'.js-recent-activity-container .text-bold', // `isDashboard`"Recent activity" titles
'.commits blockquote', // Newsfeed commits
'.release-header', // `isReleasesOrTags` Headers
'.Box-row.js-navigation-item a.link-gray-dark', // `isGlobalDiscussionList`
'[data-channel^="check_suites"] a', // `isActions`
'.repository-content .pr-toolbar h2', // `isActions` run
'#wiki-wrapper h1' // `isWiki`
].map(selector => selector + ':not(.rgh-backticks-already-parsed)'))) {
title.classList.add('rgh-backticks-already-parsed');
parseBackticks(title);
}
observe(selector, {
add: parseBackticks
});
}

features.add({
Expand All @@ -38,13 +40,8 @@ features.add({
screenshot: 'https://user-images.githubusercontent.com/170270/55060505-31179b00-50a4-11e9-99a9-c3691ba38d66.png'
}, {
include: [
pageDetect.isRepo
],
init
}, {
include: [
pageDetect.isRepo,
pageDetect.isDashboard
],
onlyAdditionalListeners: true,
init
init: oneTime(init)
});