Merge pull request #7418 from nextcloud-libraries/chore/eslint-9

[stable8] chore: migrate to ESLint 9 and @nextcloud/eslint-config 9

Author: ShGKme

.eslintrc.js

@@ -3,7 +3,7 @@
  * SPDX-License-Identifier: AGPL-3.0-or-later
  */
 
-import { GettextExtractor, JsExtractors, HtmlExtractors } from 'gettext-extractor'
+import { GettextExtractor, HtmlExtractors, JsExtractors } from 'gettext-extractor'
 
 const extractor = new GettextExtractor()
 
@@ -30,6 +30,7 @@ extractor.createHtmlParser([
 
 /**
  * remove references to avoid conflicts but save them for code splitting
+ *
  * @type {Record<string,string[]>}
  */
 export const context = extractor.getMessages().map((msg) => {
@@ -41,10 +42,10 @@ export const context = extractor.getMessages().map((msg) => {
 	if (usage in localContext) {
 		localContext[usage].push(id)
 		return localContext
-	 } else {
+	} else {
 		localContext[usage] = [id]
-	 }
-	 return localContext
+	}
+	return localContext
 })
 
 extractor.savePotFile('./l10n/messages.pot')

build/extract-l10n.mjs

@@ -5,14 +5,16 @@
 import { readFile, writeFile } from 'node:fs/promises'
 import { join } from 'node:path'
 
+/* eslint-disable no-console */
+
 console.info('🔎 checking format of CHANGELOG.md')
 
 const file = join(import.meta.dirname, '..', 'CHANGELOG.md')
 const content = await readFile(file, { encoding: 'utf-8' })
 
 const formatted = content.replaceAll(
 	/by @([^ ]+) in ((https:\/\/github.com\/)nextcloud-libraries\/nextcloud-vue\/pull\/(\d+))/g,
-	'[\#$4]($2) \([$1]($3$1)\)'
+	'[\\#$4]($2) \\([$1]($3$1)\\)',
 )
 
 if (formatted !== content) {

build/format-changelog.mjs

@@ -3,10 +3,11 @@
  * SPDX-License-Identifier: AGPL-3.0-or-later
  */
 
-import { Plugin } from 'vite'
-import { loadTranslations } from './translations.mts'
+import type { Plugin } from 'vite'
+
 import { readFileSync } from 'fs'
 import { dirname, join, resolve } from 'path'
+import { loadTranslations } from './translations.mts'
 
 /**
  * This is a plugin to split all translations into chunks of users meaning components that use that translation
@@ -63,6 +64,7 @@ export default (dir: string) => {
 
 		/**
 		 * Hook into module resolver and fake all '../[...]/l10n.js' imports to inject our splitted translations
+		 *
 		 * @param source The file which is imported
 		 * @param importer The file that imported the file
 		 */
@@ -84,6 +86,7 @@ export default (dir: string) => {
 
 		/**
 		 * This function injects the translation chunks by returning a module that exports one translation object per component
+		 *
 		 * @param id The name of the module that should be loaded
 		 */
 		load(id) {

build/l10n-plugin.mts

@@ -15,7 +15,10 @@ export const n = (...args) => gettext.ngettext(...args)
 export const t = (...args) => gettext.gettext(...args)
 
 /**
- * @param {{ l: string, t: Record<string, { v: string[], p?: string }> }[]} chunks 
+ * This is called by the l10n plugin for the chunk(s) of translations used by a used component.
+ * So that only those chunks used by the imported components are loaded.
+ *
+ * @param {{ l: string, t: Record<string, { v: string[], p?: string }> }[]} chunks - The translation chunk to be registered
  */
 export function register(...chunks) {
 	for (const chunk of chunks) {
@@ -29,17 +32,15 @@ export function register(...chunks) {
 				continue
 			}
 
-			const decompressed = Object.fromEntries(
-				Object.entries(translations)
+			const decompressed = Object.fromEntries(Object.entries(translations)
 				.map(([id, value]) => [
 					id,
 					{
 						msgid: id,
 						msgid_plural: value.p,
 						msgstr: value.v,
-					}
-				])
-			)
+					},
+				]))
 
 			gettext.addTranslations({
 				translations: {

build/l10n-registration-implementation.js

@@ -3,16 +3,19 @@
  * SPDX-License-Identifier: AGPL-3.0-or-later
  */
 
-import { join, basename } from 'path'
 import { readdir, readFile } from 'fs/promises'
 import { po as poParser } from 'gettext-parser'
+import { basename, join } from 'path'
 
+/**
+ * @param baseDir - Base directory to look for translations
+ */
 export async function loadTranslations(baseDir: string) {
 	const files = await readdir(baseDir)
 
 	const promises = files
-		.filter(name => name !== 'messages.pot' && name.endsWith('.pot'))
-		.map(file => join(baseDir, file))
+		.filter((name) => name !== 'messages.pot' && name.endsWith('.pot'))
+		.map((file) => join(baseDir, file))
 		.map(parseFile)
 
 	const parsedTranslations = await Promise.all(promises)

build/translations.mts

@@ -5,9 +5,9 @@
 
 import { createAppConfig } from '@nextcloud/vite-config'
 import { defineConfig } from 'cypress'
+import { configureVisualRegression } from 'cypress-visual-regression'
 import { resolve } from 'path'
 import { fileURLToPath } from 'url'
-import { configureVisualRegression } from 'cypress-visual-regression'
 
 const __dirname = fileURLToPath(new URL('.', import.meta.url))
 const SCOPE_VERSION = Date.now().toString()
@@ -49,7 +49,6 @@ export default defineConfig({
 					return launchOptions
 				}
 			})
-
 		},
 
 		devServer: {

cypress.config.mjs

@@ -8,7 +8,6 @@ import type { mount } from '@cypress/vue2'
 // Augment the Cypress namespace to include type definitions for
 // your custom commands
 declare global {
-	// eslint-disable-next-line @typescript-eslint/no-namespace
 	namespace Cypress {
 		interface Chainable {
 			mount: typeof mount

cypress/commands.d.ts

@@ -45,7 +45,7 @@ describe('NcAppNavigation hotkeys', () => {
 			cy.document().then((doc) => {
 				const activeElement = doc.activeElement
 				const navigation = doc.querySelector('nav')
-				// eslint-disable-next-line no-unused-expressions
+				// eslint-disable-next-line @typescript-eslint/no-unused-expressions
 				expect(navigation?.contains(activeElement)).to.be.true
 			})
 		})

cypress/component/NcAppNavigation.cy.ts

@@ -4,9 +4,9 @@
  */
 
 import { mount } from 'cypress/vue2'
+import { defineComponent } from 'vue'
 import NcAppSettingsDialog from '../../src/components/NcAppSettingsDialog/NcAppSettingsDialog.vue'
 import NcAppSettingsSection from '../../src/components/NcAppSettingsSection/NcAppSettingsSection.vue'
-import { defineComponent } from 'vue'
 
 describe('NcAppSettingsDialog', () => {
 	it('Dialog is correctly labelled', () => {
@@ -17,8 +17,8 @@ describe('NcAppSettingsDialog', () => {
 			},
 			slots: {
 				default: defineComponent({
-					render: (h) => h(NcAppSettingsSection, { props: { name: 'First section', id: 'first' } })
-				})
+					render: (h) => h(NcAppSettingsSection, { props: { name: 'First section', id: 'first' } }),
+				}),
 			},
 		})
 
@@ -34,8 +34,8 @@ describe('NcAppSettingsDialog', () => {
 			},
 			slots: {
 				default: defineComponent({
-					render: (h) => h(NcAppSettingsSection, { props: { name: 'First section', id: 'first' } }, ['The section content'])
-				})
+					render: (h) => h(NcAppSettingsSection, { props: { name: 'First section', id: 'first' } }, ['The section content']),
+				}),
 			},
 		})