diff --git a/packages/ia-pic-uploader/eslint.config.mjs b/packages/ia-pic-uploader/eslint.config.mjs new file mode 100644 index 000000000..58b563324 --- /dev/null +++ b/packages/ia-pic-uploader/eslint.config.mjs @@ -0,0 +1,53 @@ +import typescriptEslint from '@typescript-eslint/eslint-plugin'; +import html from 'eslint-plugin-html'; +import tsParser from '@typescript-eslint/parser'; +import path from 'node:path'; +import { fileURLToPath } from 'node:url'; +import js from '@eslint/js'; +import { FlatCompat } from '@eslint/eslintrc'; + +const __filename = fileURLToPath(import.meta.url); +const __dirname = path.dirname(__filename); +const compat = new FlatCompat({ + baseDirectory: __dirname, + recommendedConfig: js.configs.recommended, + allConfig: js.configs.all, +}); + +export default [ + ...compat.extends('plugin:@typescript-eslint/recommended'), + { + plugins: { + '@typescript-eslint': typescriptEslint, + html, + }, + + languageOptions: { + parser: tsParser, + }, + + settings: { + 'import/resolver': { + node: { + extensions: ['.ts', '.tsx'], + moduleDirectory: ['node_modules', 'src', 'demo'], + }, + }, + }, + + rules: { + '@typescript-eslint/no-unsafe-function-type': 'warn', + '@typescript-eslint/no-unused-vars': 'warn', + '@typescript-eslint/no-explicit-any': 'warn', + }, + }, + { + ignores: ['**/*.js', '**/*.mjs'], + }, + { + files: ['**/*.test.ts'], + rules: { + '@typescript-eslint/no-unused-expressions': 'off', + }, + }, +]; diff --git a/packages/ia-pic-uploader/package.json b/packages/ia-pic-uploader/package.json index 0146f7c80..dc5b323e4 100644 --- a/packages/ia-pic-uploader/package.json +++ b/packages/ia-pic-uploader/package.json @@ -1,6 +1,6 @@ { "name": "@internetarchive/ia-pic-uploader", - "version": "0.1.8", + "version": "0.1.9", "description": "A Web Component for Picture upload.", "license": "AGPL-3.0-only", "author": "Internet Archive", @@ -10,10 +10,10 @@ "start": "tsc && concurrently -k -r \"tsc --watch --preserveWatchOutput\" \"wds\"", "prepare": "rimraf dist && tsc && yarn run build", "build": "tsc", - "lint": "eslint --ext .ts,.html . --ignore-path .gitignore && prettier \"**/*.ts\" --check --ignore-path .gitignore", - "format": "eslint --ext .ts,.html . --fix --ignore-path .gitignore && prettier \"**/*.ts\" --write --ignore-path .gitignore", + "lint": "eslint . && prettier \"**/*.ts\" --check", + "format": "eslint . --fix && prettier \"**/*.ts\" --write", "circular": "madge --circular --extensions ts .", - "test": "yarn format && tsc && yarn run lint && yarn run circular && wtr --coverage", + "test": "yarn format && tsc && yarn run lint && yarn run circular && wtr --coverage --debug", "test:watch": "tsc && concurrently -k -r \"tsc --watch --preserveWatchOutput\" \"wtr --watch\"", "ghpages:build": "rimraf ghpages && yarn run prepare && vite build", "ghpages:publish": "yarn run ghpages:prepare -e $(git branch --show-current)", @@ -22,66 +22,38 @@ }, "types": "dist/index.d.ts", "devDependencies": { - "@open-wc/eslint-config": "^9.0.0", - "@open-wc/testing": "^3.1.6", - "@typescript-eslint/eslint-plugin": "^5.30.0", - "@typescript-eslint/parser": "^5.30.0", - "@types/express": "^4.17.9", - "@types/express-serve-static-core": "^4.17.21", - "@web/dev-server": "^0.1.32", - "@web/test-runner": "^0.15.0", - "concurrently": "^7.2.2", - "eslint": "^8.18.0", - "eslint-config-prettier": "^8.5.0", - "eslint-plugin-html": "^7.1.0", - "eslint-plugin-import": "^2.26.0", - "eslint-plugin-lit": "^1.7.2", - "eslint-plugin-lit-a11y": "^2.3.0", - "eslint-plugin-no-only-tests": "^3.1.0", - "eslint-plugin-wc": "^1.3.2", - "gh-pages": "^5.0.0", - "madge": "^6.0.0", - "prettier": "^2.7.1", - "rimraf": "^4.0.0", - "sinon": "^15.0.0", - "ts-lit-plugin": "^1.2.1", - "tslib": "^2.4.0", - "typescript": "^4.7.4", - "vite": "^4.0.0" + "@open-wc/eslint-config": "^12.0.3", + "@open-wc/testing": "^4.0.0", + "@types/express": "^5.0.0", + "@types/express-serve-static-core": "^5.0.5", + "@types/mocha": "^10.0.10", + "@typescript-eslint/eslint-plugin": "^8.20.0", + "@typescript-eslint/parser": "^8.20.0", + "@web/dev-server": "^0.4.6", + "@web/dev-server-esbuild": "^1.0.3", + "@web/test-runner": "^0.19.0", + "concurrently": "^9.1.2", + "eslint": "^9.18.0", + "eslint-config-prettier": "^10.0.1", + "eslint-plugin-html": "^8.1.2", + "eslint-plugin-import": "^2.31.0", + "eslint-plugin-lit": "^1.15.0", + "eslint-plugin-lit-a11y": "^4.1.4", + "eslint-plugin-no-only-tests": "^3.3.0", + "eslint-plugin-wc": "^2.2.0", + "gh-pages": "^6.3.0", + "madge": "^8.0.0", + "prettier": "^3.4.2", + "rimraf": "^6.0.1", + "sinon": "^19.0.2", + "ts-lit-plugin": "^2.0.2", + "tslib": "^2.8.1", + "typescript": "^5.7.3", + "vite": "^6.0.7" }, "publishConfig": { "access": "public" }, - "eslintConfig": { - "parser": "@typescript-eslint/parser", - "extends": [ - "@open-wc", - "prettier" - ], - "plugins": [ - "@typescript-eslint" - ], - "rules": { - "no-unused-vars": "off", - "@typescript-eslint/no-unused-vars": [ - "error" - ], - "no-shadow": "off", - "@typescript-eslint/no-shadow": [ - "error" - ], - "class-methods-use-this": "off", - "import/no-unresolved": "off", - "import/extensions": [ - "off", - "ignorePackages", - { - "js": "never", - "ts": "never" - } - ] - } - }, "prettier": { "singleQuote": true, "arrowParens": "avoid" @@ -94,7 +66,7 @@ ] }, "dependencies": { - "@internetarchive/ia-activity-indicator": "^0.0.4", - "lit": "^2.7.4" + "@internetarchive/ia-activity-indicator": "^0.0.6", + "lit": "^2.8.0" } } diff --git a/packages/ia-pic-uploader/src/ia-pic-uploader.ts b/packages/ia-pic-uploader/src/ia-pic-uploader.ts index 54451f991..5cfe41887 100644 --- a/packages/ia-pic-uploader/src/ia-pic-uploader.ts +++ b/packages/ia-pic-uploader/src/ia-pic-uploader.ts @@ -1,10 +1,9 @@ -import { html, css, LitElement, CSSResultGroup, nothing, svg } from 'lit'; -import { property, customElement, state, query } from 'lit/decorators.js'; -import iaButtonStyle from './style/ia-button-style'; +import '@internetarchive/ia-activity-indicator'; +import { css, CSSResultGroup, html, LitElement, nothing, svg } from 'lit'; +import { customElement, property, query, state } from 'lit/decorators.js'; import { BackendServiceHandler } from './services/backend-service'; import log from './services/log'; - -import '@internetarchive/ia-activity-indicator/ia-activity-indicator'; +import iaButtonStyle from './style/ia-button-style'; @customElement('ia-pic-uploader') export class IAPicUploader extends LitElement { @@ -57,7 +56,7 @@ export class IAPicUploader extends LitElement { * * @memberof IAPicUploader */ - @property({ type: Number }) validFileTypes: String[] = [ + @property({ type: Number }) validFileTypes: string[] = [ 'image/jpeg', 'image/png', 'image/gif', @@ -187,7 +186,7 @@ export class IAPicUploader extends LitElement { e => { this.relatedTarget = e.target; }, - false + false, ); document.addEventListener('dragover', e => this.dragOver(e), false); document.addEventListener('dragleave', e => this.dragLeave(e), true); @@ -199,14 +198,14 @@ export class IAPicUploader extends LitElement { }); [this.overlay, this.dropRegion, this.selfSubmitEle].forEach(element => - element?.addEventListener('drop', this.handleDropImage.bind(this), false) + element?.addEventListener('drop', this.handleDropImage.bind(this), false), ); // execute when submit to save picture this.saveFile?.addEventListener( 'submit', this.handleSaveFile.bind(this), - false + false, ); // execute when user change picture @@ -340,7 +339,7 @@ export class IAPicUploader extends LitElement { detail: { error: this.fileValidationError ?? '', }, - }) + }), ); } @@ -359,7 +358,7 @@ export class IAPicUploader extends LitElement { // get input file const inputFile = this.fileSelector?.files[0]; const getParams = `identifier=${this.identifier}&fname=${encodeURIComponent( - inputFile.name + inputFile.name, )}&submit=1`; await BackendServiceHandler({ @@ -393,7 +392,9 @@ export class IAPicUploader extends LitElement { const metadataApiInterval = setInterval(async () => { const res = BackendServiceHandler({ action: 'verify-upload', - endpoint: `https://archive.org/metadata/${this.identifier}?rand=${Math.random()}`, + endpoint: `https://archive.org/metadata/${ + this.identifier + }?rand=${Math.random()}`, }); res.then((json: any) => { const waitCount = @@ -401,7 +402,7 @@ export class IAPicUploader extends LitElement { if (waitCount) { const adminError = json.tasks.filter( - (e: any) => e.wait_admin === 2 + (e: any) => e.wait_admin === 2, ).length; if (adminError) { this.taskStatus = @@ -460,13 +461,13 @@ export class IAPicUploader extends LitElement { */ get selfSubmitFormTemplate() { const formAction = encodeURIComponent( - `${this.endpoint}?identifier=${this.identifier}&submit=1` + `${this.endpoint}?identifier=${this.identifier}&submit=1`, ); return html`