- {{template "shared/user/org_profile_avatar" .}}
-
- {{template "user/overview/header" .}}
-
+
+ {{if .ContextUser.IsOrganization}}
+ {{template "org/header" .}}
+ {{else}}
+ {{template "shared/user/org_profile_avatar" .}}
+
+ {{template "user/overview/header" .}}
+
+ {{end}}
{{template "projects/view" .}}
diff --git a/templates/repo/issue/view_title.tmpl b/templates/repo/issue/view_title.tmpl
index 7fa77b3f1c..1591c2cadf 100644
--- a/templates/repo/issue/view_title.tmpl
+++ b/templates/repo/issue/view_title.tmpl
@@ -102,7 +102,7 @@
{{$sameBase := ne $.BaseName $.HeadUserName}}
{{$differentBranch := ne . $.HeadBranch}}
{{if or $sameBase $differentBranch}}
-
{{$.BaseName}}{{if $.HeadRepo}}/{{$.HeadRepo}}{{end}}:{{.}}
+
{{$.BaseName}}:{{.}}
{{end}}
{{end}}
diff --git a/web_src/js/components/ContextPopup.vue b/web_src/js/components/ContextPopup.vue
index 8c56af858e..b0e8447302 100644
--- a/web_src/js/components/ContextPopup.vue
+++ b/web_src/js/components/ContextPopup.vue
@@ -3,6 +3,7 @@ import {SvgIcon} from '../svg.ts';
import {GET} from '../modules/fetch.ts';
import {getIssueColor, getIssueIcon} from '../features/issue.ts';
import {computed, onMounted, ref} from 'vue';
+import type {IssuePathInfo} from '../types.ts';
const {appSubUrl, i18n} = window.config;
@@ -25,19 +26,19 @@ const root = ref
(null);
onMounted(() => {
root.value.addEventListener('ce-load-context-popup', (e: CustomEvent) => {
- const data = e.detail;
+ const data: IssuePathInfo = e.detail;
if (!loading.value && issue.value === null) {
load(data);
}
});
});
-async function load(data) {
+async function load(issuePathInfo: IssuePathInfo) {
loading.value = true;
i18nErrorMessage.value = null;
try {
- const response = await GET(`${appSubUrl}/${data.owner}/${data.repo}/issues/${data.index}/info`); // backend: GetIssueInfo
+ const response = await GET(`${appSubUrl}/${issuePathInfo.ownerName}/${issuePathInfo.repoName}/issues/${issuePathInfo.indexString}/info`); // backend: GetIssueInfo
const respJson = await response.json();
if (!response.ok) {
i18nErrorMessage.value = respJson.message ?? i18n.network_error;
diff --git a/web_src/js/components/DiffCommitSelector.vue b/web_src/js/components/DiffCommitSelector.vue
index b95e18796c..c78531cf9f 100644
--- a/web_src/js/components/DiffCommitSelector.vue
+++ b/web_src/js/components/DiffCommitSelector.vue
@@ -142,11 +142,11 @@ export default {
Object.assign(this.locale, results.locale);
},
showAllChanges() {
- window.location = `${this.issueLink}/files${this.queryParams}`;
+ window.location.assign(`${this.issueLink}/files${this.queryParams}`);
},
/** Called when user clicks on since last review */
changesSinceLastReviewClick() {
- window.location = `${this.issueLink}/files/${this.lastReviewCommitSha}..${this.commits.at(-1).id}${this.queryParams}`;
+ window.location.assign(`${this.issueLink}/files/${this.lastReviewCommitSha}..${this.commits.at(-1).id}${this.queryParams}`);
},
/** Clicking on a single commit opens this specific commit */
commitClicked(commitId, newWindow = false) {
@@ -154,7 +154,7 @@ export default {
if (newWindow) {
window.open(url);
} else {
- window.location = url;
+ window.location.assign(url);
}
},
/**
@@ -176,14 +176,14 @@ export default {
const lastCommitIdx = this.commits.findLastIndex((x) => x.selected);
if (lastCommitIdx === this.commits.length - 1) {
// user selected all commits - just show the normal diff page
- window.location = `${this.issueLink}/files${this.queryParams}`;
+ window.location.assign(`${this.issueLink}/files${this.queryParams}`);
} else {
- window.location = `${this.issueLink}/files/${this.commits[lastCommitIdx].id}${this.queryParams}`;
+ window.location.assign(`${this.issueLink}/files/${this.commits[lastCommitIdx].id}${this.queryParams}`);
}
} else {
const start = this.commits[this.commits.findIndex((x) => x.selected) - 1].id;
const end = this.commits.findLast((x) => x.selected).id;
- window.location = `${this.issueLink}/files/${start}..${end}${this.queryParams}`;
+ window.location.assign(`${this.issueLink}/files/${start}..${end}${this.queryParams}`);
}
}
},
diff --git a/web_src/js/components/RepoActivityTopAuthors.vue b/web_src/js/components/RepoActivityTopAuthors.vue
index 054bf6126e..1f5e9825ba 100644
--- a/web_src/js/components/RepoActivityTopAuthors.vue
+++ b/web_src/js/components/RepoActivityTopAuthors.vue
@@ -17,7 +17,7 @@ const colors = ref({
const activityTopAuthors = window.config.pageData.repoActivityTopAuthors || [];
const graphPoints = computed(() => {
- return activityTopAuthors.value.map((item) => {
+ return activityTopAuthors.map((item) => {
return {
value: item.commits,
label: item.name,
@@ -26,7 +26,7 @@ const graphPoints = computed(() => {
});
const graphAuthors = computed(() => {
- return activityTopAuthors.value.map((item, idx) => {
+ return activityTopAuthors.map((item, idx) => {
return {
position: idx + 1,
...item,
@@ -35,7 +35,7 @@ const graphAuthors = computed(() => {
});
const graphWidth = computed(() => {
- return activityTopAuthors.value.length * 40;
+ return activityTopAuthors.length * 40;
});
const styleElement = ref(null);
diff --git a/web_src/js/features/comp/TextExpander.ts b/web_src/js/features/comp/TextExpander.ts
index 6ac4c4bf32..e0c4abed75 100644
--- a/web_src/js/features/comp/TextExpander.ts
+++ b/web_src/js/features/comp/TextExpander.ts
@@ -1,39 +1,29 @@
import {matchEmoji, matchMention, matchIssue} from '../../utils/match.ts';
import {emojiString} from '../emoji.ts';
import {svg} from '../../svg.ts';
-import {parseIssueHref} from '../../utils.ts';
+import {parseIssueHref, parseIssueNewHref} from '../../utils.ts';
import {createElementFromAttrs, createElementFromHTML} from '../../utils/dom.ts';
import {getIssueColor, getIssueIcon} from '../issue.ts';
import {debounce} from 'perfect-debounce';
const debouncedSuggestIssues = debounce((key: string, text: string) => new Promise<{matched:boolean; fragment?: HTMLElement}>(async (resolve) => {
- const {owner, repo, index} = parseIssueHref(window.location.href);
- const matches = await matchIssue(owner, repo, index, text);
+ let issuePathInfo = parseIssueHref(window.location.href);
+ if (!issuePathInfo.ownerName) issuePathInfo = parseIssueNewHref(window.location.href);
+ if (!issuePathInfo.ownerName) return resolve({matched: false});
+
+ const matches = await matchIssue(issuePathInfo.ownerName, issuePathInfo.repoName, issuePathInfo.indexString, text);
if (!matches.length) return resolve({matched: false});
- const ul = document.createElement('ul');
- ul.classList.add('suggestions');
+ const ul = createElementFromAttrs('ul', {class: 'suggestions'});
for (const issue of matches) {
- const li = createElementFromAttrs('li', {
- role: 'option',
- 'data-value': `${key}${issue.id}`,
- class: 'tw-flex tw-gap-2',
- });
-
- const icon = svg(getIssueIcon(issue), 16, ['text', getIssueColor(issue)].join(' '));
- li.append(createElementFromHTML(icon));
-
- const id = document.createElement('span');
- id.textContent = issue.id.toString();
- li.append(id);
-
- const nameSpan = document.createElement('span');
- nameSpan.textContent = issue.title;
- li.append(nameSpan);
-
+ const li = createElementFromAttrs(
+ 'li', {role: 'option', class: 'tw-flex tw-gap-2', 'data-value': `${key}${issue.number}`},
+ createElementFromHTML(svg(getIssueIcon(issue), 16, ['text', getIssueColor(issue)])),
+ createElementFromAttrs('span', null, `#${issue.number}`),
+ createElementFromAttrs('span', null, issue.title),
+ );
ul.append(li);
}
-
resolve({matched: true, fragment: ul});
}), 100);
diff --git a/web_src/js/features/contextpopup.ts b/web_src/js/features/contextpopup.ts
index 5af7d176b6..33eead8431 100644
--- a/web_src/js/features/contextpopup.ts
+++ b/web_src/js/features/contextpopup.ts
@@ -10,12 +10,10 @@ export function initContextPopups() {
export function attachRefIssueContextPopup(refIssues) {
for (const refIssue of refIssues) {
- if (refIssue.classList.contains('ref-external-issue')) {
- return;
- }
+ if (refIssue.classList.contains('ref-external-issue')) continue;
- const {owner, repo, index} = parseIssueHref(refIssue.getAttribute('href'));
- if (!owner) return;
+ const issuePathInfo = parseIssueHref(refIssue.getAttribute('href'));
+ if (!issuePathInfo.ownerName) continue;
const el = document.createElement('div');
el.classList.add('tw-p-3');
@@ -38,7 +36,7 @@ export function attachRefIssueContextPopup(refIssues) {
role: 'dialog',
interactiveBorder: 5,
onShow: () => {
- el.firstChild.dispatchEvent(new CustomEvent('ce-load-context-popup', {detail: {owner, repo, index}}));
+ el.firstChild.dispatchEvent(new CustomEvent('ce-load-context-popup', {detail: issuePathInfo}));
},
});
}
diff --git a/web_src/js/features/repo-issue.ts b/web_src/js/features/repo-issue.ts
index 5d5e3568b9..520f2081b0 100644
--- a/web_src/js/features/repo-issue.ts
+++ b/web_src/js/features/repo-issue.ts
@@ -97,7 +97,7 @@ function excludeLabel(item) {
const regStr = `labels=((?:-?[0-9]+%2c)*)(${id})((?:%2c-?[0-9]+)*)&`;
const newStr = 'labels=$1-$2$3&';
- window.location = href.replace(new RegExp(regStr), newStr);
+ window.location.assign(href.replace(new RegExp(regStr), newStr));
}
export function initRepoIssueSidebarList() {
diff --git a/web_src/js/svg.ts b/web_src/js/svg.ts
index 6a4bfafc92..6227a85e33 100644
--- a/web_src/js/svg.ts
+++ b/web_src/js/svg.ts
@@ -153,7 +153,8 @@ export type SvgName = keyof typeof svgs;
// most of the SVG icons in assets couldn't be used directly.
// retrieve an HTML string for given SVG icon name, size and additional classes
-export function svg(name: SvgName, size = 16, className = '') {
+export function svg(name: SvgName, size = 16, classNames: string|string[]): string {
+ const className = Array.isArray(classNames) ? classNames.join(' ') : classNames;
if (!(name in svgs)) throw new Error(`Unknown SVG icon: ${name}`);
if (size === 16 && !className) return svgs[name];
diff --git a/web_src/js/types.ts b/web_src/js/types.ts
index c38c8bda96..9c601456bd 100644
--- a/web_src/js/types.ts
+++ b/web_src/js/types.ts
@@ -30,15 +30,16 @@ export type RequestOpts = {
data?: RequestData,
} & RequestInit;
-export type IssueData = {
- owner: string,
- repo: string,
- type: string,
- index: string,
+export type IssuePathInfo = {
+ ownerName: string,
+ repoName: string,
+ pathType: string,
+ indexString?: string,
}
export type Issue = {
id: number;
+ number: number;
title: string;
state: 'open' | 'closed';
pull_request?: {
diff --git a/web_src/js/utils.test.ts b/web_src/js/utils.test.ts
index 55896706ff..647676bf20 100644
--- a/web_src/js/utils.test.ts
+++ b/web_src/js/utils.test.ts
@@ -1,7 +1,7 @@
import {
basename, extname, isObject, stripTags, parseIssueHref,
parseUrl, translateMonth, translateDay, blobToDataURI,
- toAbsoluteUrl, encodeURLEncodedBase64, decodeURLEncodedBase64, isImageFile, isVideoFile,
+ toAbsoluteUrl, encodeURLEncodedBase64, decodeURLEncodedBase64, isImageFile, isVideoFile, parseIssueNewHref,
} from './utils.ts';
test('basename', () => {
@@ -28,21 +28,27 @@ test('stripTags', () => {
});
test('parseIssueHref', () => {
- expect(parseIssueHref('/owner/repo/issues/1')).toEqual({owner: 'owner', repo: 'repo', type: 'issues', index: '1'});
- expect(parseIssueHref('/owner/repo/pulls/1?query')).toEqual({owner: 'owner', repo: 'repo', type: 'pulls', index: '1'});
- expect(parseIssueHref('/owner/repo/issues/1#hash')).toEqual({owner: 'owner', repo: 'repo', type: 'issues', index: '1'});
- expect(parseIssueHref('/sub/owner/repo/issues/1')).toEqual({owner: 'owner', repo: 'repo', type: 'issues', index: '1'});
- expect(parseIssueHref('/sub/sub2/owner/repo/pulls/1')).toEqual({owner: 'owner', repo: 'repo', type: 'pulls', index: '1'});
- expect(parseIssueHref('/sub/sub2/owner/repo/issues/1?query')).toEqual({owner: 'owner', repo: 'repo', type: 'issues', index: '1'});
- expect(parseIssueHref('/sub/sub2/owner/repo/issues/1#hash')).toEqual({owner: 'owner', repo: 'repo', type: 'issues', index: '1'});
- expect(parseIssueHref('https://example.com/owner/repo/issues/1')).toEqual({owner: 'owner', repo: 'repo', type: 'issues', index: '1'});
- expect(parseIssueHref('https://example.com/owner/repo/pulls/1?query')).toEqual({owner: 'owner', repo: 'repo', type: 'pulls', index: '1'});
- expect(parseIssueHref('https://example.com/owner/repo/issues/1#hash')).toEqual({owner: 'owner', repo: 'repo', type: 'issues', index: '1'});
- expect(parseIssueHref('https://example.com/sub/owner/repo/issues/1')).toEqual({owner: 'owner', repo: 'repo', type: 'issues', index: '1'});
- expect(parseIssueHref('https://example.com/sub/sub2/owner/repo/pulls/1')).toEqual({owner: 'owner', repo: 'repo', type: 'pulls', index: '1'});
- expect(parseIssueHref('https://example.com/sub/sub2/owner/repo/issues/1?query')).toEqual({owner: 'owner', repo: 'repo', type: 'issues', index: '1'});
- expect(parseIssueHref('https://example.com/sub/sub2/owner/repo/issues/1#hash')).toEqual({owner: 'owner', repo: 'repo', type: 'issues', index: '1'});
- expect(parseIssueHref('')).toEqual({owner: undefined, repo: undefined, type: undefined, index: undefined});
+ expect(parseIssueHref('/owner/repo/issues/1')).toEqual({ownerName: 'owner', repoName: 'repo', pathType: 'issues', indexString: '1'});
+ expect(parseIssueHref('/owner/repo/pulls/1?query')).toEqual({ownerName: 'owner', repoName: 'repo', pathType: 'pulls', indexString: '1'});
+ expect(parseIssueHref('/owner/repo/issues/1#hash')).toEqual({ownerName: 'owner', repoName: 'repo', pathType: 'issues', indexString: '1'});
+ expect(parseIssueHref('/sub/owner/repo/issues/1')).toEqual({ownerName: 'owner', repoName: 'repo', pathType: 'issues', indexString: '1'});
+ expect(parseIssueHref('/sub/sub2/owner/repo/pulls/1')).toEqual({ownerName: 'owner', repoName: 'repo', pathType: 'pulls', indexString: '1'});
+ expect(parseIssueHref('/sub/sub2/owner/repo/issues/1?query')).toEqual({ownerName: 'owner', repoName: 'repo', pathType: 'issues', indexString: '1'});
+ expect(parseIssueHref('/sub/sub2/owner/repo/issues/1#hash')).toEqual({ownerName: 'owner', repoName: 'repo', pathType: 'issues', indexString: '1'});
+ expect(parseIssueHref('https://example.com/owner/repo/issues/1')).toEqual({ownerName: 'owner', repoName: 'repo', pathType: 'issues', indexString: '1'});
+ expect(parseIssueHref('https://example.com/owner/repo/pulls/1?query')).toEqual({ownerName: 'owner', repoName: 'repo', pathType: 'pulls', indexString: '1'});
+ expect(parseIssueHref('https://example.com/owner/repo/issues/1#hash')).toEqual({ownerName: 'owner', repoName: 'repo', pathType: 'issues', indexString: '1'});
+ expect(parseIssueHref('https://example.com/sub/owner/repo/issues/1')).toEqual({ownerName: 'owner', repoName: 'repo', pathType: 'issues', indexString: '1'});
+ expect(parseIssueHref('https://example.com/sub/sub2/owner/repo/pulls/1')).toEqual({ownerName: 'owner', repoName: 'repo', pathType: 'pulls', indexString: '1'});
+ expect(parseIssueHref('https://example.com/sub/sub2/owner/repo/issues/1?query')).toEqual({ownerName: 'owner', repoName: 'repo', pathType: 'issues', indexString: '1'});
+ expect(parseIssueHref('https://example.com/sub/sub2/owner/repo/issues/1#hash')).toEqual({ownerName: 'owner', repoName: 'repo', pathType: 'issues', indexString: '1'});
+ expect(parseIssueHref('')).toEqual({ownerName: undefined, repoName: undefined, type: undefined, index: undefined});
+});
+
+test('parseIssueNewHref', () => {
+ expect(parseIssueNewHref('/owner/repo/issues/new')).toEqual({ownerName: 'owner', repoName: 'repo', pathType: 'issues'});
+ expect(parseIssueNewHref('/owner/repo/issues/new?query')).toEqual({ownerName: 'owner', repoName: 'repo', pathType: 'issues'});
+ expect(parseIssueNewHref('/sub/owner/repo/issues/new#hash')).toEqual({ownerName: 'owner', repoName: 'repo', pathType: 'issues'});
});
test('parseUrl', () => {
diff --git a/web_src/js/utils.ts b/web_src/js/utils.ts
index c52bf500d4..066a7c7b54 100644
--- a/web_src/js/utils.ts
+++ b/web_src/js/utils.ts
@@ -1,5 +1,5 @@
import {encode, decode} from 'uint8-to-base64';
-import type {IssueData} from './types.ts';
+import type {IssuePathInfo} from './types.ts';
// transform /path/to/file.ext to file.ext
export function basename(path: string): string {
@@ -31,10 +31,16 @@ export function stripTags(text: string): string {
return text.replace(/<[^>]*>?/g, '');
}
-export function parseIssueHref(href: string): IssueData {
+export function parseIssueHref(href: string): IssuePathInfo {
const path = (href || '').replace(/[#?].*$/, '');
- const [_, owner, repo, type, index] = /([^/]+)\/([^/]+)\/(issues|pulls)\/([0-9]+)/.exec(path) || [];
- return {owner, repo, type, index};
+ const [_, ownerName, repoName, pathType, indexString] = /([^/]+)\/([^/]+)\/(issues|pulls)\/([0-9]+)/.exec(path) || [];
+ return {ownerName, repoName, pathType, indexString};
+}
+
+export function parseIssueNewHref(href: string): IssuePathInfo {
+ const path = (href || '').replace(/[#?].*$/, '');
+ const [_, ownerName, repoName, pathType, indexString] = /([^/]+)\/([^/]+)\/(issues|pulls)\/new/.exec(path) || [];
+ return {ownerName, repoName, pathType, indexString};
}
// parse a URL, either relative '/path' or absolute 'https://localhost/path'
diff --git a/web_src/js/utils/dom.test.ts b/web_src/js/utils/dom.test.ts
index 13df82d9b4..5c235795fd 100644
--- a/web_src/js/utils/dom.test.ts
+++ b/web_src/js/utils/dom.test.ts
@@ -8,11 +8,11 @@ test('createElementFromAttrs', () => {
const el = createElementFromAttrs('button', {
id: 'the-id',
class: 'cls-1 cls-2',
- 'data-foo': 'the-data',
disabled: true,
checked: false,
required: null,
tabindex: 0,
- });
- expect(el.outerHTML).toEqual('');
+ 'data-foo': 'the-data',
+ }, 'txt', createElementFromHTML('inner'));
+ expect(el.outerHTML).toEqual('');
});
diff --git a/web_src/js/utils/dom.ts b/web_src/js/utils/dom.ts
index 7dd63ecbbf..a6e0fe2854 100644
--- a/web_src/js/utils/dom.ts
+++ b/web_src/js/utils/dom.ts
@@ -92,7 +92,7 @@ export function onDomReady(cb: () => Promisable) {
// checks whether an element is owned by the current document, and whether it is a document fragment or element node
// if it is, it means it is a "normal" element managed by us, which can be modified safely.
-export function isDocumentFragmentOrElementNode(el: Element) {
+export function isDocumentFragmentOrElementNode(el: Element | Node) {
try {
return el.ownerDocument === document && el.nodeType === Node.ELEMENT_NODE || el.nodeType === Node.DOCUMENT_FRAGMENT_NODE;
} catch {
@@ -167,7 +167,7 @@ export function autosize(textarea: HTMLTextAreaElement, {viewportMarginBottom =
const isBorderBox = computedStyle.boxSizing === 'border-box';
const borderAddOn = isBorderBox ? topBorderWidth + bottomBorderWidth : 0;
- const adjustedViewportMarginBottom = bottom < viewportMarginBottom ? bottom : viewportMarginBottom;
+ const adjustedViewportMarginBottom = Math.min(bottom, viewportMarginBottom);
const curHeight = parseFloat(computedStyle.height);
const maxHeight = curHeight + bottom - adjustedViewportMarginBottom;
@@ -281,7 +281,7 @@ export function replaceTextareaSelection(textarea: HTMLTextAreaElement, text: st
textarea.contentEditable = 'true';
try {
- success = document.execCommand('insertText', false, text); // eslint-disable-line deprecation/deprecation
+ success = document.execCommand('insertText', false, text); // eslint-disable-line @typescript-eslint/no-deprecated
} catch {
success = false;
}
@@ -298,22 +298,24 @@ export function replaceTextareaSelection(textarea: HTMLTextAreaElement, text: st
}
// Warning: Do not enter any unsanitized variables here
-export function createElementFromHTML(htmlString: string) {
+export function createElementFromHTML(htmlString: string): HTMLElement {
const div = document.createElement('div');
div.innerHTML = htmlString.trim();
- return div.firstChild as Element;
+ return div.firstChild as HTMLElement;
}
-export function createElementFromAttrs(tagName: string, attrs: Record) {
+export function createElementFromAttrs(tagName: string, attrs: Record, ...children: (Node|string)[]): HTMLElement {
const el = document.createElement(tagName);
- for (const [key, value] of Object.entries(attrs)) {
+ for (const [key, value] of Object.entries(attrs || {})) {
if (value === undefined || value === null) continue;
if (typeof value === 'boolean') {
el.toggleAttribute(key, value);
} else {
el.setAttribute(key, String(value));
}
- // TODO: in the future we could make it also support "textContent" and "innerHTML" properties if needed
+ }
+ for (const child of children) {
+ el.append(child instanceof Node ? child : document.createTextNode(child));
}
return el;
}
diff --git a/web_src/js/utils/match.ts b/web_src/js/utils/match.ts
index 2c7271f16e..1161ea6250 100644
--- a/web_src/js/utils/match.ts
+++ b/web_src/js/utils/match.ts
@@ -1,6 +1,6 @@
import emojis from '../../../assets/emoji.json';
-import type {Issue} from '../features/issue.ts';
import {GET} from '../modules/fetch.ts';
+import type {Issue} from '../features/issue.ts';
const maxMatches = 6;
@@ -49,8 +49,8 @@ export async function matchIssue(owner: string, repo: string, issueIndexStr: str
const res = await GET(`${window.config.appSubUrl}/${owner}/${repo}/issues/suggestions?q=${encodeURIComponent(query)}`);
const issues: Issue[] = await res.json();
- const issueIndex = parseInt(issueIndexStr);
+ const issueNumber = parseInt(issueIndexStr);
// filter out issue with same id
- return issues.filter((i) => i.id !== issueIndex);
+ return issues.filter((i) => i.number !== issueNumber);
}
diff --git a/web_src/js/vendor/jquery.are-you-sure.ts b/web_src/js/vendor/jquery.are-you-sure.ts
index e7bb203c5a..858f9871b8 100644
--- a/web_src/js/vendor/jquery.are-you-sure.ts
+++ b/web_src/js/vendor/jquery.are-you-sure.ts
@@ -1,3 +1,4 @@
+// @ts-nocheck
// Fork of the upstream module. The only changes are:
// * use export to make it work with ES6 modules.
// * the addition of `const` to make it strict mode compatible.
diff --git a/web_src/js/webcomponents/absolute-date.test.ts b/web_src/js/webcomponents/absolute-date.test.ts
index a591df7c10..a3866829a7 100644
--- a/web_src/js/webcomponents/absolute-date.test.ts
+++ b/web_src/js/webcomponents/absolute-date.test.ts
@@ -7,9 +7,20 @@ test('toAbsoluteLocaleDate', () => {
day: 'numeric',
})).toEqual('March 15, 2024');
- expect(toAbsoluteLocaleDate('2024-03-15', 'de-DE', {
+ expect(toAbsoluteLocaleDate('2024-03-15T01:02:03', 'de-DE', {
year: 'numeric',
month: 'long',
day: 'numeric',
})).toEqual('15. März 2024');
+
+ // these cases shouldn't happen
+ expect(toAbsoluteLocaleDate('2024-03-15 01:02:03', '', {})).toEqual('Invalid Date');
+ expect(toAbsoluteLocaleDate('10000-01-01', '', {})).toEqual('Invalid Date');
+
+ // test different timezone
+ const oldTZ = process.env.TZ;
+ process.env.TZ = 'America/New_York';
+ expect(new Date('2024-03-15').toLocaleString()).toEqual('3/14/2024, 8:00:00 PM');
+ expect(toAbsoluteLocaleDate('2024-03-15')).toEqual('3/15/2024, 12:00:00 AM');
+ process.env.TZ = oldTZ;
});
diff --git a/web_src/js/webcomponents/absolute-date.ts b/web_src/js/webcomponents/absolute-date.ts
index d2be455302..8eb1c3e37e 100644
--- a/web_src/js/webcomponents/absolute-date.ts
+++ b/web_src/js/webcomponents/absolute-date.ts
@@ -1,33 +1,32 @@
-import {Temporal} from 'temporal-polyfill';
-
-export function toAbsoluteLocaleDate(dateStr, lang, opts) {
- return Temporal.PlainDate.from(dateStr).toLocaleString(lang ?? [], opts);
+export function toAbsoluteLocaleDate(date: string, lang?: string, opts?: Intl.DateTimeFormatOptions) {
+ // only use the date part, it is guaranteed to be in ISO format (YYYY-MM-DDTHH:mm:ss.sssZ) or (YYYY-MM-DD)
+ // if there is an "Invalid Date" error, there must be something wrong in code and should be fixed.
+ // TODO: there is a root problem in backend code: the date "YYYY-MM-DD" is passed to backend without timezone (eg: deadline),
+ // then backend parses it in server's timezone and stores the parsed timestamp into database.
+ // If the user's timezone is different from the server's, the date might be displayed in the wrong day.
+ const dateSep = date.indexOf('T');
+ date = dateSep === -1 ? date : date.substring(0, dateSep);
+ return new Date(`${date}T00:00:00`).toLocaleString(lang || [], opts);
}
window.customElements.define('absolute-date', class extends HTMLElement {
static observedAttributes = ['date', 'year', 'month', 'weekday', 'day'];
+ initialized = false;
+
update = () => {
- const year = this.getAttribute('year') ?? '';
- const month = this.getAttribute('month') ?? '';
- const weekday = this.getAttribute('weekday') ?? '';
- const day = this.getAttribute('day') ?? '';
+ const opt: Intl.DateTimeFormatOptions = {};
+ for (const attr of ['year', 'month', 'weekday', 'day']) {
+ if (this.getAttribute(attr)) opt[attr] = this.getAttribute(attr);
+ }
const lang = this.closest('[lang]')?.getAttribute('lang') ||
this.ownerDocument.documentElement.getAttribute('lang') || '';
- // only use the first 10 characters, e.g. the `yyyy-mm-dd` part
- const dateStr = this.getAttribute('date').substring(0, 10);
-
if (!this.shadowRoot) this.attachShadow({mode: 'open'});
- this.shadowRoot.textContent = toAbsoluteLocaleDate(dateStr, lang, {
- ...(year && {year}),
- ...(month && {month}),
- ...(weekday && {weekday}),
- ...(day && {day}),
- });
+ this.shadowRoot.textContent = toAbsoluteLocaleDate(this.getAttribute('date'), lang, opt);
};
- attributeChangedCallback(_name, oldValue, newValue) {
+ attributeChangedCallback(_name: string, oldValue: string | null, newValue: string | null) {
if (!this.initialized || oldValue === newValue) return;
this.update();
}
diff --git a/web_src/js/webcomponents/origin-url.test.ts b/web_src/js/webcomponents/origin-url.test.ts
index 4082e53aea..19cc467d7d 100644
--- a/web_src/js/webcomponents/origin-url.test.ts
+++ b/web_src/js/webcomponents/origin-url.test.ts
@@ -1,9 +1,9 @@
import {toOriginUrl} from './origin-url.ts';
test('toOriginUrl', () => {
- const oldLocation = window.location;
+ const oldLocation = String(window.location);
for (const origin of ['https://example.com', 'https://example.com:3000']) {
- window.location = new URL(`${origin}/`);
+ window.location.assign(`${origin}/`);
expect(toOriginUrl('/')).toEqual(`${origin}/`);
expect(toOriginUrl('/org/repo.git')).toEqual(`${origin}/org/repo.git`);
expect(toOriginUrl('https://another.com')).toEqual(`${origin}/`);
@@ -13,5 +13,5 @@ test('toOriginUrl', () => {
expect(toOriginUrl('https://another.com:4000/')).toEqual(`${origin}/`);
expect(toOriginUrl('https://another.com:4000/org/repo.git')).toEqual(`${origin}/org/repo.git`);
}
- window.location = oldLocation;
+ window.location.assign(oldLocation);
});
diff --git a/web_src/js/webcomponents/origin-url.ts b/web_src/js/webcomponents/origin-url.ts
index 09aa77f2c0..d407fe0dff 100644
--- a/web_src/js/webcomponents/origin-url.ts
+++ b/web_src/js/webcomponents/origin-url.ts
@@ -1,7 +1,7 @@
// Convert an absolute or relative URL to an absolute URL with the current origin. It only
// processes absolute HTTP/HTTPS URLs or relative URLs like '/xxx' or '//host/xxx'.
// NOTE: Keep this function in sync with clone_script.tmpl
-export function toOriginUrl(urlStr) {
+export function toOriginUrl(urlStr: string) {
try {
if (urlStr.startsWith('http://') || urlStr.startsWith('https://') || urlStr.startsWith('/')) {
const {origin, protocol, hostname, port} = window.location;
diff --git a/web_src/js/webcomponents/overflow-menu.ts b/web_src/js/webcomponents/overflow-menu.ts
index 2efeb9222b..777d7dc65d 100644
--- a/web_src/js/webcomponents/overflow-menu.ts
+++ b/web_src/js/webcomponents/overflow-menu.ts
@@ -4,6 +4,14 @@ import {isDocumentFragmentOrElementNode} from '../utils/dom.ts';
import octiconKebabHorizontal from '../../../public/assets/img/svg/octicon-kebab-horizontal.svg';
window.customElements.define('overflow-menu', class extends HTMLElement {
+ tippyContent: HTMLDivElement;
+ tippyItems: Array;
+ button: HTMLButtonElement;
+ menuItemsEl: HTMLElement;
+ resizeObserver: ResizeObserver;
+ mutationObserver: MutationObserver;
+ lastWidth: number;
+
updateItems = throttle(100, () => { // eslint-disable-line unicorn/consistent-function-scoping -- https://github.com/sindresorhus/eslint-plugin-unicorn/issues/2088
if (!this.tippyContent) {
const div = document.createElement('div');
@@ -11,7 +19,7 @@ window.customElements.define('overflow-menu', class extends HTMLElement {
div.tabIndex = -1; // for initial focus, programmatic focus only
div.addEventListener('keydown', (e) => {
if (e.key === 'Tab') {
- const items = this.tippyContent.querySelectorAll('[role="menuitem"]');
+ const items = this.tippyContent.querySelectorAll('[role="menuitem"]');
if (e.shiftKey) {
if (document.activeElement === items[0]) {
e.preventDefault();
@@ -32,27 +40,27 @@ window.customElements.define('overflow-menu', class extends HTMLElement {
if (document.activeElement?.matches('[role="menuitem"]')) {
e.preventDefault();
e.stopPropagation();
- document.activeElement.click();
+ (document.activeElement as HTMLElement).click();
}
} else if (e.key === 'ArrowDown') {
if (document.activeElement?.matches('.tippy-target')) {
e.preventDefault();
e.stopPropagation();
- document.activeElement.querySelector('[role="menuitem"]:first-of-type').focus();
+ document.activeElement.querySelector('[role="menuitem"]:first-of-type').focus();
} else if (document.activeElement?.matches('[role="menuitem"]')) {
e.preventDefault();
e.stopPropagation();
- document.activeElement.nextElementSibling?.focus();
+ (document.activeElement.nextElementSibling as HTMLElement)?.focus();
}
} else if (e.key === 'ArrowUp') {
if (document.activeElement?.matches('.tippy-target')) {
e.preventDefault();
e.stopPropagation();
- document.activeElement.querySelector('[role="menuitem"]:last-of-type').focus();
+ document.activeElement.querySelector('[role="menuitem"]:last-of-type').focus();
} else if (document.activeElement?.matches('[role="menuitem"]')) {
e.preventDefault();
e.stopPropagation();
- document.activeElement.previousElementSibling?.focus();
+ (document.activeElement.previousElementSibling as HTMLElement)?.focus();
}
}
});
@@ -60,8 +68,8 @@ window.customElements.define('overflow-menu', class extends HTMLElement {
this.tippyContent = div;
}
- const itemFlexSpace = this.menuItemsEl.querySelector('.item-flex-space');
- const itemOverFlowMenuButton = this.querySelector('.overflow-menu-button');
+ const itemFlexSpace = this.menuItemsEl.querySelector('.item-flex-space');
+ const itemOverFlowMenuButton = this.querySelector('.overflow-menu-button');
// move items in tippy back into the menu items for subsequent measurement
for (const item of this.tippyItems || []) {
@@ -78,7 +86,7 @@ window.customElements.define('overflow-menu', class extends HTMLElement {
itemOverFlowMenuButton?.style.setProperty('display', 'none', 'important');
this.tippyItems = [];
const menuRight = this.offsetLeft + this.offsetWidth;
- const menuItems = this.menuItemsEl.querySelectorAll('.item, .item-flex-space');
+ const menuItems = this.menuItemsEl.querySelectorAll('.item, .item-flex-space');
let afterFlexSpace = false;
for (const item of menuItems) {
if (item.classList.contains('item-flex-space')) {
@@ -189,14 +197,14 @@ window.customElements.define('overflow-menu', class extends HTMLElement {
// template rendering, wait for its addition.
// The eslint rule is not sophisticated enough or aware of this problem, see
// https://github.com/43081j/eslint-plugin-wc/pull/130
- const menuItemsEl = this.querySelector('.overflow-menu-items'); // eslint-disable-line wc/no-child-traversal-in-connectedcallback
+ const menuItemsEl = this.querySelector('.overflow-menu-items'); // eslint-disable-line wc/no-child-traversal-in-connectedcallback
if (menuItemsEl) {
this.menuItemsEl = menuItemsEl;
this.init();
} else {
this.mutationObserver = new MutationObserver((mutations) => {
for (const mutation of mutations) {
- for (const node of mutation.addedNodes) {
+ for (const node of mutation.addedNodes as NodeListOf) {
if (!isDocumentFragmentOrElementNode(node)) continue;
if (node.classList.contains('overflow-menu-items')) {
this.menuItemsEl = node;
diff --git a/web_src/js/webcomponents/polyfills.ts b/web_src/js/webcomponents/polyfills.ts
index 38f50fa02f..4a84ee9562 100644
--- a/web_src/js/webcomponents/polyfills.ts
+++ b/web_src/js/webcomponents/polyfills.ts
@@ -4,10 +4,11 @@ try {
new Intl.NumberFormat('en', {style: 'unit', unit: 'minute'}).format(1);
} catch {
const intlNumberFormat = Intl.NumberFormat;
- Intl.NumberFormat = function(locales, options) {
+ // @ts-expect-error - polyfill is incomplete
+ Intl.NumberFormat = function(locales: string | string[], options: Intl.NumberFormatOptions) {
if (options.style === 'unit') {
return {
- format(value) {
+ format(value: number | bigint | string) {
return ` ${value} ${options.unit}`;
},
};