Fix a number of typescript issuest

Author: silverwind

web_src/js/features/common-issue-list.ts

@@ -7,21 +7,20 @@ const reIssueSharpIndex = /^#(\d+)$/; // eg: "#123"
 const reIssueOwnerRepoIndex = /^([-.\w]+)\/([-.\w]+)#(\d+)$/;  // eg: "{owner}/{repo}#{index}"
 
 // if the searchText can be parsed to an "issue goto link", return the link, otherwise return empty string
-export function parseIssueListQuickGotoLink(repoLink, searchText) {
+export function parseIssueListQuickGotoLink(repoLink: string, searchText: string) {
   searchText = searchText.trim();
   let targetUrl = '';
   if (repoLink) {
     // try to parse it in current repo
     if (reIssueIndex.test(searchText)) {
       targetUrl = `${repoLink}/issues/${searchText}`;
     } else if (reIssueSharpIndex.test(searchText)) {
-      targetUrl = `${repoLink}/issues/${searchText.substr(1)}`;
+      targetUrl = `${repoLink}/issues/${searchText.substring(1)}`;
     }
   } else {
     // try to parse it for a global search (eg: "owner/repo#123")
-    const matchIssueOwnerRepoIndex = searchText.match(reIssueOwnerRepoIndex);
-    if (matchIssueOwnerRepoIndex) {
-      const [_, owner, repo, index] = matchIssueOwnerRepoIndex;
+    const [_, owner, repo, index] = reIssueOwnerRepoIndex.exec(searchText) || [];
+    if (owner) {
       targetUrl = `${appSubUrl}/${owner}/${repo}/issues/${index}`;
     }
   }
@@ -33,7 +32,7 @@ export function initCommonIssueListQuickGoto() {
   if (!goto) return;
 
   const form = goto.closest('form');
-  const input = form.querySelector('input[name=q]');
+  const input = form.querySelector<HTMLInputElement>('input[name=q]');
   const repoLink = goto.getAttribute('data-repo-link');
 
   form.addEventListener('submit', (e) => {

web_src/js/features/comp/ComboMarkdownEditor.ts

@@ -283,8 +283,8 @@ export class ComboMarkdownEditor {
     ];
   }
 
-  parseEasyMDEToolbar(EasyMDE, actions) {
-    this.easyMDEToolbarActions = this.easyMDEToolbarActions || easyMDEToolbarActions(EasyMDE, this);
+  parseEasyMDEToolbar(easyMde: typeof EasyMDE, actions) {
+    this.easyMDEToolbarActions = this.easyMDEToolbarActions || easyMDEToolbarActions(easyMde, this);
     const processed = [];
     for (const action of actions) {
       const actionButton = this.easyMDEToolbarActions[action];

web_src/js/features/comp/EasyMDEToolbarActions.ts

@@ -1,100 +1,102 @@
 import {svg} from '../../svg.ts';
+import type EasyMDE from 'easymde';
+import type {ComboMarkdownEditor} from './ComboMarkdownEditor.ts';
 
-export function easyMDEToolbarActions(EasyMDE, editor) {
-  const actions = {
+export function easyMDEToolbarActions(easyMde: typeof EasyMDE, editor: ComboMarkdownEditor): Record<string, Partial<EasyMDE.ToolbarIcon | string>> {
+  const actions: Record<string, Partial<EasyMDE.ToolbarIcon> | string> = {
     '|': '|',
     'heading-1': {
-      action: EasyMDE.toggleHeading1,
+      action: easyMde.toggleHeading1,
       icon: svg('octicon-heading'),
       title: 'Heading 1',
     },
     'heading-2': {
-      action: EasyMDE.toggleHeading2,
+      action: easyMde.toggleHeading2,
       icon: svg('octicon-heading'),
       title: 'Heading 2',
     },
     'heading-3': {
-      action: EasyMDE.toggleHeading3,
+      action: easyMde.toggleHeading3,
       icon: svg('octicon-heading'),
       title: 'Heading 3',
     },
     'heading-smaller': {
-      action: EasyMDE.toggleHeadingSmaller,
+      action: easyMde.toggleHeadingSmaller,
       icon: svg('octicon-heading'),
       title: 'Decrease Heading',
     },
     'heading-bigger': {
-      action: EasyMDE.toggleHeadingBigger,
+      action: easyMde.toggleHeadingBigger,
       icon: svg('octicon-heading'),
       title: 'Increase Heading',
     },
     'bold': {
-      action: EasyMDE.toggleBold,
+      action: easyMde.toggleBold,
       icon: svg('octicon-bold'),
       title: 'Bold',
     },
     'italic': {
-      action: EasyMDE.toggleItalic,
+      action: easyMde.toggleItalic,
       icon: svg('octicon-italic'),
       title: 'Italic',
     },
     'strikethrough': {
-      action: EasyMDE.toggleStrikethrough,
+      action: easyMde.toggleStrikethrough,
       icon: svg('octicon-strikethrough'),
       title: 'Strikethrough',
     },
     'quote': {
-      action: EasyMDE.toggleBlockquote,
+      action: easyMde.toggleBlockquote,
       icon: svg('octicon-quote'),
       title: 'Quote',
     },
     'code': {
-      action: EasyMDE.toggleCodeBlock,
+      action: easyMde.toggleCodeBlock,
       icon: svg('octicon-code'),
       title: 'Code',
     },
     'link': {
-      action: EasyMDE.drawLink,
+      action: easyMde.drawLink,
       icon: svg('octicon-link'),
       title: 'Link',
     },
     'unordered-list': {
-      action: EasyMDE.toggleUnorderedList,
+      action: easyMde.toggleUnorderedList,
       icon: svg('octicon-list-unordered'),
       title: 'Unordered List',
     },
     'ordered-list': {
-      action: EasyMDE.toggleOrderedList,
+      action: easyMde.toggleOrderedList,
       icon: svg('octicon-list-ordered'),
       title: 'Ordered List',
     },
     'image': {
-      action: EasyMDE.drawImage,
+      action: easyMde.drawImage,
       icon: svg('octicon-image'),
       title: 'Image',
     },
     'table': {
-      action: EasyMDE.drawTable,
+      action: easyMde.drawTable,
       icon: svg('octicon-table'),
       title: 'Table',
     },
     'horizontal-rule': {
-      action: EasyMDE.drawHorizontalRule,
+      action: easyMde.drawHorizontalRule,
       icon: svg('octicon-horizontal-rule'),
       title: 'Horizontal Rule',
     },
     'preview': {
-      action: EasyMDE.togglePreview,
+      action: easyMde.togglePreview,
       icon: svg('octicon-eye'),
       title: 'Preview',
     },
     'fullscreen': {
-      action: EasyMDE.toggleFullScreen,
+      action: easyMde.toggleFullScreen,
       icon: svg('octicon-screen-full'),
       title: 'Fullscreen',
     },
     'side-by-side': {
-      action: EasyMDE.toggleSideBySide,
+      action: easyMde.toggleSideBySide,
       icon: svg('octicon-columns'),
       title: 'Side by Side',
     },

web_src/js/features/comp/ReactionSelector.ts

@@ -3,7 +3,7 @@ import {fomanticQuery} from '../../modules/fomantic/base.ts';
 
 export function initCompReactionSelector(parent: ParentNode = document) {
   for (const container of parent.querySelectorAll('.issue-content, .diff-file-body')) {
-    container.addEventListener('click', async (e) => {
+    container.addEventListener('click', async (e: MouseEvent & {target: HTMLElement}) => {
       // there are 2 places for the "reaction" buttons, one is the top-right reaction menu, one is the bottom of the comment
       const target = e.target.closest('.comment-reaction-button');
       if (!target) return;

web_src/js/features/comp/WebHookEditor.ts

@@ -23,7 +23,7 @@ export function initCompWebHookEditor() {
   }
 
   // some webhooks (like Gitea) allow to set the request method (GET/POST), and it would toggle the "Content Type" field
-  const httpMethodInput = document.querySelector('#http_method');
+  const httpMethodInput = document.querySelector<HTMLInputElement>('#http_method');
   if (httpMethodInput) {
     const updateContentType = function () {
       const visible = httpMethodInput.value === 'POST';

web_src/js/features/dropzone.ts

@@ -22,7 +22,7 @@ async function createDropzone(el, opts) {
   return new Dropzone(el, opts);
 }
 
-export function generateMarkdownLinkForAttachment(file, {width, dppx} = {}) {
+export function generateMarkdownLinkForAttachment(file, {width, dppx}: {width?: number, dppx?: number} = {}) {
   let fileMarkdown = `[${file.name}](/attachments/${file.uuid})`;
   if (isImageFile(file)) {
     fileMarkdown = `!${fileMarkdown}`;
@@ -60,14 +60,14 @@ function addCopyLink(file) {
 /**
  * @param {HTMLElement} dropzoneEl
  */
-export async function initDropzone(dropzoneEl) {
+export async function initDropzone(dropzoneEl: HTMLElement) {
   const listAttachmentsUrl = dropzoneEl.closest('[data-attachment-url]')?.getAttribute('data-attachment-url');
   const removeAttachmentUrl = dropzoneEl.getAttribute('data-remove-url');
   const attachmentBaseLinkUrl = dropzoneEl.getAttribute('data-link-url');
 
   let disableRemovedfileEvent = false; // when resetting the dropzone (removeAllFiles), disable the "removedfile" event
   let fileUuidDict = {}; // to record: if a comment has been saved, then the uploaded files won't be deleted from server when clicking the Remove in the dropzone
-  const opts = {
+  const opts: Record<string, any> = {
     url: dropzoneEl.getAttribute('data-upload-url'),
     headers: {'X-Csrf-Token': csrfToken},
     acceptedFiles: ['*/*', ''].includes(dropzoneEl.getAttribute('data-accepts')) ? null : dropzoneEl.getAttribute('data-accepts'),

web_src/js/features/emoji.ts

@@ -1,4 +1,4 @@
-import emojis from '../../../assets/emoji.json';
+import emojis from '../../../assets/emoji.json' with {type: 'json'};
 
 const {assetUrlPrefix, customEmojis} = window.config;
 

web_src/js/features/eventsource.sharedworker.ts

@@ -2,6 +2,11 @@ const sourcesByUrl = {};
 const sourcesByPort = {};
 
 class Source {
+  url: string;
+  eventSource: EventSource;
+  listening: Record<string, any>;
+  clients: Array<any>;
+
   constructor(url) {
     this.url = url;
     this.eventSource = new EventSource(url);
@@ -67,7 +72,7 @@ class Source {
   }
 }
 
-self.addEventListener('connect', (e) => {
+self.addEventListener('connect', (e: Event & {ports: Array<any>}) => {
   for (const port of e.ports) {
     port.addEventListener('message', (event) => {
       if (!self.EventSource) {

web_src/js/features/heatmap.ts

@@ -21,8 +21,8 @@ export function initHeatmap() {
     // last heatmap tooltip localization attempt https://github.com/go-gitea/gitea/pull/24131/commits/a83761cbbae3c2e3b4bced71e680f44432073ac8
     const locale = {
       heatMapLocale: {
-        months: new Array(12).fill().map((_, idx) => translateMonth(idx)),
-        days: new Array(7).fill().map((_, idx) => translateDay(idx)),
+        months: new Array(12).fill(undefined).map((_, idx) => translateMonth(idx)),
+        days: new Array(7).fill(undefined).map((_, idx) => translateDay(idx)),
         on: ' - ', // no correct locale support for it, because in many languages the sentence is not "something on someday"
         more: el.getAttribute('data-locale-more'),
         less: el.getAttribute('data-locale-less'),

web_src/js/features/install.ts

@@ -22,9 +22,9 @@ function initPreInstall() {
     mssql: '127.0.0.1:1433',
   };
 
-  const dbHost = document.querySelector('#db_host');
-  const dbUser = document.querySelector('#db_user');
-  const dbName = document.querySelector('#db_name');
+  const dbHost = document.querySelector<HTMLInputElement>('#db_host');
+  const dbUser = document.querySelector<HTMLInputElement>('#db_user');
+  const dbName = document.querySelector<HTMLInputElement>('#db_name');
 
   // Database type change detection.
   document.querySelector('#db_type').addEventListener('change', function () {
@@ -48,56 +48,56 @@ function initPreInstall() {
   });
   document.querySelector('#db_type').dispatchEvent(new Event('change'));
 
-  const appUrl = document.querySelector('#app_url');
+  const appUrl = document.querySelector<HTMLInputElement>('#app_url');
   if (appUrl.value.includes('://localhost')) {
     appUrl.value = window.location.href;
   }
 
-  const domain = document.querySelector('#domain');
+  const domain = document.querySelector<HTMLInputElement>('#domain');
   if (domain.value.trim() === 'localhost') {
     domain.value = window.location.hostname;
   }
 
   // TODO: better handling of exclusive relations.
   document.querySelector('#offline-mode input').addEventListener('change', function () {
     if (this.checked) {
-      document.querySelector('#disable-gravatar input').checked = true;
-      document.querySelector('#federated-avatar-lookup input').checked = false;
+      document.querySelector<HTMLInputElement>('#disable-gravatar input').checked = true;
+      document.querySelector<HTMLInputElement>('#federated-avatar-lookup input').checked = false;
     }
   });
   document.querySelector('#disable-gravatar input').addEventListener('change', function () {
     if (this.checked) {
-      document.querySelector('#federated-avatar-lookup input').checked = false;
+      document.querySelector<HTMLInputElement>('#federated-avatar-lookup input').checked = false;
     } else {
-      document.querySelector('#offline-mode input').checked = false;
+      document.querySelector<HTMLInputElement>('#offline-mode input').checked = false;
     }
   });
   document.querySelector('#federated-avatar-lookup input').addEventListener('change', function () {
     if (this.checked) {
-      document.querySelector('#disable-gravatar input').checked = false;
-      document.querySelector('#offline-mode input').checked = false;
+      document.querySelector<HTMLInputElement>('#disable-gravatar input').checked = false;
+      document.querySelector<HTMLInputElement>('#offline-mode input').checked = false;
     }
   });
   document.querySelector('#enable-openid-signin input').addEventListener('change', function () {
     if (this.checked) {
-      if (!document.querySelector('#disable-registration input').checked) {
-        document.querySelector('#enable-openid-signup input').checked = true;
+      if (!document.querySelector<HTMLInputElement>('#disable-registration input').checked) {
+        document.querySelector<HTMLInputElement>('#enable-openid-signup input').checked = true;
       }
     } else {
-      document.querySelector('#enable-openid-signup input').checked = false;
+      document.querySelector<HTMLInputElement>('#enable-openid-signup input').checked = false;
     }
   });
   document.querySelector('#disable-registration input').addEventListener('change', function () {
     if (this.checked) {
-      document.querySelector('#enable-captcha input').checked = false;
-      document.querySelector('#enable-openid-signup input').checked = false;
+      document.querySelector<HTMLInputElement>('#enable-captcha input').checked = false;
+      document.querySelector<HTMLInputElement>('#enable-openid-signup input').checked = false;
     } else {
-      document.querySelector('#enable-openid-signup input').checked = true;
+      document.querySelector<HTMLInputElement>('#enable-openid-signup input').checked = true;
     }
   });
   document.querySelector('#enable-captcha input').addEventListener('change', function () {
     if (this.checked) {
-      document.querySelector('#disable-registration input').checked = false;
+      document.querySelector<HTMLInputElement>('#disable-registration input').checked = false;
     }
   });
 }