diff --git a/.eslintignore b/.eslintignore deleted file mode 100644 index d7a70bae7..000000000 --- a/.eslintignore +++ /dev/null @@ -1,27 +0,0 @@ -# unconventional js -/blueprints/*/files/ - -# compiled output -/declarations/ -/dist/ -/electron-out/ - -# misc -/coverage/ -!.* -.*/ - -# ember-try -/.node_modules.ember-try/ - -# ember-electron -/electron-app/node_modules/ -/electron-app/out/ -/electron-app/ember-dist/ -/electron-app/ember-test/ - -# Sentry -/electron-app/sentry-symbols.js - -# Types -/types/ diff --git a/.eslintrc.js b/.eslintrc.js deleted file mode 100644 index 3a4d2783d..000000000 --- a/.eslintrc.js +++ /dev/null @@ -1,101 +0,0 @@ -'use strict'; - -module.exports = { - root: true, - parser: '@babel/eslint-parser', - parserOptions: { - ecmaVersion: 'latest', - sourceType: 'module', - requireConfigFile: false, - babelOptions: { - plugins: [ - ['@babel/plugin-proposal-decorators', { decoratorsBeforeExport: true }], - ], - }, - }, - plugins: ['ember'], - extends: [ - 'eslint:recommended', - 'plugin:ember/recommended', - 'plugin:prettier/recommended', - ], - env: { - browser: true, - }, - globals: { - requireNode: false, - }, - rules: { - 'require-yield': 'off', - 'sort-imports': [ - 'error', - { allowSeparatedGroups: true, ignoreDeclarationSort: true }, - ], - 'ember/no-array-prototype-extensions': 'off', - }, - overrides: [ - // node files - { - files: [ - './.eslintrc.js', - './.prettierrc.js', - './.stylelintrc.js', - './.template-lintrc.js', - './ember-cli-build.js', - './tailwind.config.js', - './testem.js', - './testem-electron.js', - './blueprints/*/index.js', - './config/**/*.js', - './electron-app/**/*.js', - './lib/*/index.js', - './server/**/*.js', - ], - parserOptions: { - sourceType: 'script', - }, - env: { - browser: false, - node: true, - }, - globals: { - document: false, - }, - extends: ['plugin:n/recommended'], - rules: { - '@typescript-eslint/no-var-requires': 'off', - // this can be removed once the following is fixed - // https://github.com/mysticatea/eslint-plugin-node/issues/77 - 'no-console': 'off', - 'n/no-unpublished-require': 'off', - 'n/no-extraneous-require': [ - 'error', - { - allowModules: ['ember-electron', 'electron'], - }, - ], - 'n/no-missing-require': [ - 'error', - { - allowModules: ['electron'], - }, - ], - }, - }, - // Typescript files - { - parser: '@typescript-eslint/parser', - files: ['app/**/*.{gts,ts}', 'tests/**/*.ts'], - plugins: ['@typescript-eslint'], - extends: ['plugin:@typescript-eslint/recommended'], - rules: { - 'prefer-rest-params': 'off', - }, - }, - { - // test files - files: ['tests/**/*-test.{js,ts}'], - extends: ['plugin:qunit/recommended'], - }, - ], -}; diff --git a/.gitignore b/.gitignore index 1421e0853..e09b5781b 100644 --- a/.gitignore +++ b/.gitignore @@ -19,13 +19,6 @@ /testem.log /yarn-error.log -# ember-try -/.node_modules.ember-try/ -/npm-shrinkwrap.json.ember-try -/package.json.ember-try -/package-lock.json.ember-try -/yarn.lock.ember-try - # broccoli-debug /DEBUG/ diff --git a/.prettierignore b/.prettierignore index ae3204424..d36183eaf 100644 --- a/.prettierignore +++ b/.prettierignore @@ -8,6 +8,9 @@ /coverage/ !.* .*/ +/pnpm-lock.yaml +ember-cli-update.json +*.html # ember-try /.node_modules.ember-try/ diff --git a/.prettierrc.js b/.prettierrc.js index a98259d7b..bf194ba80 100644 --- a/.prettierrc.js +++ b/.prettierrc.js @@ -47,22 +47,9 @@ module.exports = { importOrderSortSpecifiers, overrides: [ { - files: ['**/*.hbs'], - options: { - singleQuote: false, - }, - }, - { - files: '*.{js,ts,gjs,gts}', - options: { - singleQuote: true, - }, - }, - { - files: '*.{yaml,yml}', - options: { - singleQuote: true, - }, + files: '*.{js,gjs,ts,gts,mjs,mts,cjs,cts}', + options: { singleQuote: true, templateSingleQuote: false }, }, + { files: '*.{yaml,yml}', options: { singleQuote: true } }, ], }; diff --git a/.stylelintignore b/.stylelintignore index a0cf71cbd..fc178a0b9 100644 --- a/.stylelintignore +++ b/.stylelintignore @@ -3,6 +3,3 @@ # compiled output /dist/ - -# addons -/.node_modules.ember-try/ diff --git a/.stylelintrc.js b/.stylelintrc.js index 95b3217e9..accbb66fa 100644 --- a/.stylelintrc.js +++ b/.stylelintrc.js @@ -1,13 +1,9 @@ 'use strict'; module.exports = { - extends: ['stylelint-config-standard-scss', 'stylelint-prettier/recommended'], + extends: ['stylelint-config-standard-scss'], rules: { - 'scss/at-rule-no-unknown': [ - true, - { - ignoreAtRules: ['tailwind'], - }, - ], + 'at-rule-no-deprecated': [true, { ignoreAtRules: ['/^view/', 'apply'] }], + 'scss/at-rule-no-unknown': [true, { ignoreAtRules: ['tailwind'] }], }, }; diff --git a/.template-lintrc.js b/.template-lintrc.js index 8921c1a1a..450080d2c 100644 --- a/.template-lintrc.js +++ b/.template-lintrc.js @@ -3,6 +3,8 @@ module.exports = { extends: ['recommended'], rules: { + 'no-at-ember-render-modifiers': false, + 'no-builtin-form-components': false, 'no-curly-component-invocation': { allow: ['svg-jar', '-with-dynamic-vars'], }, diff --git a/CHANGELOG.md b/CHANGELOG.md index fc34db6c7..8917046fc 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,4 +1,3 @@ - ## v1.2.15 (2024-01-10) ## v1.2.14 (2024-01-10) @@ -32,26 +31,29 @@ ## v1.2.0 (2024-01-07) #### :bug: Bug Fix -* [#1948](https://github.com/shipshapecode/swach/pull/1948) Update ember-animated, fix menu not working on contrast checker screen ([@RobbieTheWagner](https://github.com/RobbieTheWagner)) + +- [#1948](https://github.com/shipshapecode/swach/pull/1948) Update ember-animated, fix menu not working on contrast checker screen ([@RobbieTheWagner](https://github.com/RobbieTheWagner)) #### :house: Internal -* [#1949](https://github.com/shipshapecode/swach/pull/1949) Update release-it ([@RobbieTheWagner](https://github.com/RobbieTheWagner)) -* [#1946](https://github.com/shipshapecode/swach/pull/1946) Add gts support ([@RobbieTheWagner](https://github.com/RobbieTheWagner)) -* [#1918](https://github.com/shipshapecode/swach/pull/1918) ember-cli 5.2.0 ([@RobbieTheWagner](https://github.com/RobbieTheWagner)) -* [#1945](https://github.com/shipshapecode/swach/pull/1945) Update linting deps, fix lint ([@RobbieTheWagner](https://github.com/RobbieTheWagner)) -* [#1944](https://github.com/shipshapecode/swach/pull/1944) Node 18 ([@RobbieTheWagner](https://github.com/RobbieTheWagner)) -* [#1732](https://github.com/shipshapecode/swach/pull/1732) Ember 5 ([@RobbieTheWagner](https://github.com/RobbieTheWagner)) -* [#1646](https://github.com/shipshapecode/swach/pull/1646) ember-cli 5 beta, switch from yarn to pnpm ([@RobbieTheWagner](https://github.com/RobbieTheWagner)) -* [#1644](https://github.com/shipshapecode/swach/pull/1644) Ember 4.12 ([@RobbieTheWagner](https://github.com/RobbieTheWagner)) -* [#1634](https://github.com/shipshapecode/swach/pull/1634) Run on ubuntu-latest ([@RobbieTheWagner](https://github.com/RobbieTheWagner)) -* [#1540](https://github.com/shipshapecode/swach/pull/1540) More glint updates ([@RobbieTheWagner](https://github.com/RobbieTheWagner)) -* [#1536](https://github.com/shipshapecode/swach/pull/1536) ember-cli 4.10 ([@RobbieTheWagner](https://github.com/RobbieTheWagner)) -* [#1504](https://github.com/shipshapecode/swach/pull/1504) Update electron deps ([@RobbieTheWagner](https://github.com/RobbieTheWagner)) -* [#1405](https://github.com/shipshapecode/swach/pull/1405) Embroider 2.x ([@RobbieTheWagner](https://github.com/RobbieTheWagner)) -* [#1360](https://github.com/shipshapecode/swach/pull/1360) Pin embroider to 1.8.3 ([@RobbieTheWagner](https://github.com/RobbieTheWagner)) -* [#1329](https://github.com/shipshapecode/swach/pull/1329) Electron 21 ([@RobbieTheWagner](https://github.com/RobbieTheWagner)) + +- [#1949](https://github.com/shipshapecode/swach/pull/1949) Update release-it ([@RobbieTheWagner](https://github.com/RobbieTheWagner)) +- [#1946](https://github.com/shipshapecode/swach/pull/1946) Add gts support ([@RobbieTheWagner](https://github.com/RobbieTheWagner)) +- [#1918](https://github.com/shipshapecode/swach/pull/1918) ember-cli 5.2.0 ([@RobbieTheWagner](https://github.com/RobbieTheWagner)) +- [#1945](https://github.com/shipshapecode/swach/pull/1945) Update linting deps, fix lint ([@RobbieTheWagner](https://github.com/RobbieTheWagner)) +- [#1944](https://github.com/shipshapecode/swach/pull/1944) Node 18 ([@RobbieTheWagner](https://github.com/RobbieTheWagner)) +- [#1732](https://github.com/shipshapecode/swach/pull/1732) Ember 5 ([@RobbieTheWagner](https://github.com/RobbieTheWagner)) +- [#1646](https://github.com/shipshapecode/swach/pull/1646) ember-cli 5 beta, switch from yarn to pnpm ([@RobbieTheWagner](https://github.com/RobbieTheWagner)) +- [#1644](https://github.com/shipshapecode/swach/pull/1644) Ember 4.12 ([@RobbieTheWagner](https://github.com/RobbieTheWagner)) +- [#1634](https://github.com/shipshapecode/swach/pull/1634) Run on ubuntu-latest ([@RobbieTheWagner](https://github.com/RobbieTheWagner)) +- [#1540](https://github.com/shipshapecode/swach/pull/1540) More glint updates ([@RobbieTheWagner](https://github.com/RobbieTheWagner)) +- [#1536](https://github.com/shipshapecode/swach/pull/1536) ember-cli 4.10 ([@RobbieTheWagner](https://github.com/RobbieTheWagner)) +- [#1504](https://github.com/shipshapecode/swach/pull/1504) Update electron deps ([@RobbieTheWagner](https://github.com/RobbieTheWagner)) +- [#1405](https://github.com/shipshapecode/swach/pull/1405) Embroider 2.x ([@RobbieTheWagner](https://github.com/RobbieTheWagner)) +- [#1360](https://github.com/shipshapecode/swach/pull/1360) Pin embroider to 1.8.3 ([@RobbieTheWagner](https://github.com/RobbieTheWagner)) +- [#1329](https://github.com/shipshapecode/swach/pull/1329) Electron 21 ([@RobbieTheWagner](https://github.com/RobbieTheWagner)) #### Committers: 1 + - Robbie Wagner ([@RobbieTheWagner](https://github.com/RobbieTheWagner)) ## v1.1.13 (2022-08-02) diff --git a/app/app.js b/app/app.ts similarity index 73% rename from app/app.js rename to app/app.ts index 37777555c..4a31de78c 100644 --- a/app/app.js +++ b/app/app.ts @@ -4,8 +4,14 @@ import { InitSentryForEmber } from '@sentry/ember'; import loadInitializers from 'ember-load-initializers'; import Resolver from 'ember-resolver'; +import { importSync, isDevelopingApp, macroCondition } from '@embroider/macros'; + import config from 'swach/config/environment'; +if (macroCondition(isDevelopingApp())) { + importSync('./deprecation-workflow'); +} + InitSentryForEmber(); export default class App extends Application { diff --git a/app/components/about.ts b/app/components/about.ts index 23f644f87..687119c12 100644 --- a/app/components/about.ts +++ b/app/components/about.ts @@ -1,4 +1,5 @@ import { action } from '@ember/object'; +import type Owner from '@ember/owner'; import Component from '@glimmer/component'; import { tracked } from '@glimmer/tracking'; @@ -14,7 +15,7 @@ export default class AboutComponent extends Component { copyrightYear = new Date().getFullYear(); @tracked version = 'Version not available'; - constructor(owner: unknown, args: Record) { + constructor(owner: Owner, args: Record) { super(owner, args); if (typeof requireNode !== 'undefined') { @@ -22,7 +23,7 @@ export default class AboutComponent extends Component { this.ipcRenderer = ipcRenderer; - this.ipcRenderer.invoke('getAppVersion').then((version: string) => { + void this.ipcRenderer.invoke('getAppVersion').then((version: string) => { this.version = version; }); } @@ -33,7 +34,7 @@ export default class AboutComponent extends Component { event.preventDefault(); if (typeof requireNode !== 'undefined') { - requireNode('electron').shell.openExternal('https://swach.io/'); + void this.ipcRenderer.invoke('open-external', 'https://swach.io/'); } } } diff --git a/app/components/animated-drag-sort-list.ts b/app/components/animated-drag-sort-list.ts index 1adf420b6..d9b47182b 100644 --- a/app/components/animated-drag-sort-list.ts +++ b/app/components/animated-drag-sort-list.ts @@ -17,6 +17,7 @@ export default class AnimatedDragSortList extends DragSortList { @action rules(): unknown { if (!this.didDrag) { + // eslint-disable-next-line @typescript-eslint/unbound-method return this.transition; } @@ -25,6 +26,7 @@ export default class AnimatedDragSortList extends DragSortList { return null; } + // eslint-disable-next-line require-yield *transition({ keptSprites, insertedSprites, diff --git a/app/components/color-picker.ts b/app/components/color-picker.ts index 2ee000b65..49f20b1ec 100644 --- a/app/components/color-picker.ts +++ b/app/components/color-picker.ts @@ -93,7 +93,7 @@ export default class ColorPickerComponent extends Component c.hex)); } /** diff --git a/app/components/color-row.ts b/app/components/color-row.ts index 142cc2cb9..7b57a759f 100644 --- a/app/components/color-row.ts +++ b/app/components/color-row.ts @@ -23,7 +23,7 @@ export default class ColorRowComponent extends Component { @service declare colorUtils: ColorUtils; @service declare router: Router; - get showActions(): boolean { + get showActions() { if (isEmpty(this.args.showActions)) { return true; } diff --git a/app/components/colors-list.ts b/app/components/colors-list.ts index 02544ec45..47359cfbe 100644 --- a/app/components/colors-list.ts +++ b/app/components/colors-list.ts @@ -31,10 +31,12 @@ export default class ColorsListComponent extends Component if (!palette.$isDisconnected) { if (palette.isColorHistory) { - return palette.colors.sortBy('createdAt').reverse(); + return [...palette.colors].sort((a, b) => { + return b.createdAt?.localeCompare(a.createdAt); + }); } else { - return palette.colorOrder.map((color: ColorModel) => { - return palette.colors.findBy('id', color.id); + return palette.colorOrder.map((color: { type: string; id: string }) => { + return palette.colors.find((c) => c.id === color.id); }); } } @@ -42,6 +44,7 @@ export default class ColorsListComponent extends Component return undefined; } + // eslint-disable-next-line require-yield *transition({ keptSprites, insertedSprites, @@ -69,7 +72,7 @@ export default class ColorsListComponent extends Component } @action - async deleteColor(color: ColorModel): Promise { + async deleteColor(color: ColorModel) { const { palette } = this.args; if (color && palette && !palette.isLocked) { @@ -77,10 +80,10 @@ export default class ColorsListComponent extends Component return { type: 'color', id: color.id }; }); - const colorToRemove = colorsList.findBy('id', color.id); + const colorToRemove = colorsList.find((c) => c.id === color.id); if (colorToRemove) { - colorsList.removeObject(colorToRemove); + colorsList.splice(colorsList.indexOf(colorToRemove), 1); await this.store.update((t) => { const operations: RecordOperationTerm[] = [ diff --git a/app/components/contrast-checker.hbs b/app/components/contrast-checker.hbs index 106a20a73..c0de863a7 100644 --- a/app/components/contrast-checker.hbs +++ b/app/components/contrast-checker.hbs @@ -12,7 +12,10 @@ ) }} > -
+

{{this.wcagString}} diff --git a/app/components/contrast-checker.ts b/app/components/contrast-checker.ts index 384e13bd1..b56eb1a6c 100644 --- a/app/components/contrast-checker.ts +++ b/app/components/contrast-checker.ts @@ -1,7 +1,9 @@ import { action } from '@ember/object'; +import type Owner from '@ember/owner'; import Component from '@glimmer/component'; import { tracked } from '@glimmer/tracking'; +import { type IroColorValue } from '@irojs/iro-core'; import iro from '@jaames/iro'; import type { IpcRenderer } from 'electron'; import { hex, score } from 'wcag-contrast'; @@ -28,7 +30,7 @@ export default class ContrastChecker extends Component return score(this.wcagScore); } - constructor(owner: unknown, args: object) { + constructor(owner: Owner, args: object) { super(owner, args); if (typeof requireNode !== 'undefined') { @@ -36,13 +38,19 @@ export default class ContrastChecker extends Component this.ipcRenderer = ipcRenderer; - this.ipcRenderer.on('pickContrastBgColor', async (_event, color) => { - this.setBgColor(color); - }); + this.ipcRenderer.on( + 'pickContrastBgColor', + (_event, color: IroColorValue) => { + this.setBgColor(color); + }, + ); - this.ipcRenderer.on('pickContrastFgColor', async (_event, color) => { - this.setFgColor(color); - }); + this.ipcRenderer.on( + 'pickContrastFgColor', + (_event, color: IroColorValue) => { + this.setFgColor(color); + }, + ); } } @@ -138,16 +146,14 @@ export default class ContrastChecker extends Component @action onBlurBg(ev: Event) { - this.setBgColor((ev.target as HTMLInputElement).value); + this.setBgColor((ev.target as HTMLInputElement).value as IroColorValue); } - // TODO: correctly type this instead of using `any` - // eslint-disable-next-line @typescript-eslint/no-explicit-any - setBgColor(color: any) { + setBgColor(color: IroColorValue) { try { this.bgPickr.setColors([color]); this.backgroundColor = this.bgPickr.color.hexString; - } catch (err) { + } catch { // TODO: maybe mention the color is invalid here? } } @@ -157,13 +163,11 @@ export default class ContrastChecker extends Component this.setFgColor((ev.target as HTMLInputElement).value); } - // TODO: correctly type this instead of using `any` - // eslint-disable-next-line @typescript-eslint/no-explicit-any - setFgColor(color: any) { + setFgColor(color: IroColorValue) { try { this.fgPickr.setColors([color]); this.foregroundColor = this.fgPickr.color.hexString; - } catch (err) { + } catch { // TODO: maybe mention the color is invalid here? } } diff --git a/app/components/edit-selected-color.ts b/app/components/edit-selected-color.ts index 01aa7de80..8884f3bb7 100644 --- a/app/components/edit-selected-color.ts +++ b/app/components/edit-selected-color.ts @@ -83,7 +83,7 @@ export default class EditSelectedColorComponent extends Component c.hex), this.args.palette.selectedColorIndex, ); } diff --git a/app/components/forgot-password.ts b/app/components/forgot-password.ts index 26d4d67e9..51643438d 100644 --- a/app/components/forgot-password.ts +++ b/app/components/forgot-password.ts @@ -30,8 +30,8 @@ export default class ForgotPasswordComponent extends Component { await this.cognito.forgotPassword(this.username); this.isConfirming = true; - } catch (err) { - this.errorMessage = err.message; + } catch (err: unknown) { + this.errorMessage = (err as Error)?.message; } finally { this.loading = false; } @@ -49,8 +49,8 @@ export default class ForgotPasswordComponent extends Component { await this.cognito.forgotPasswordSubmit(username, code, password); this.router.transitionTo('settings.cloud'); - } catch (err) { - this.errorMessage = err.message; + } catch (err: unknown) { + this.errorMessage = (err as Error)?.message; } finally { this.loading = false; } diff --git a/app/components/kuler-palette-row.ts b/app/components/kuler-palette-row.ts index 0900d9ad7..53f5974d8 100644 --- a/app/components/kuler-palette-row.ts +++ b/app/components/kuler-palette-row.ts @@ -3,6 +3,7 @@ import type Router from '@ember/routing/router-service'; import { service } from '@ember/service'; import Component from '@glimmer/component'; +import type MotionService from 'ember-animated/services/-ea-motion'; import fade from 'ember-animated/transitions/fade'; import type { Store } from 'ember-orbit'; @@ -20,9 +21,7 @@ interface KulerPaletteRowSignature { export default class KulerPaletteRowComponent extends Component { @service declare colorUtils: ColorUtils; - // TODO: correctly type this instead of using `any` - // eslint-disable-next-line @typescript-eslint/no-explicit-any - @service('-ea-motion') declare eaMotion: any; + @service('-ea-motion') declare eaMotion: MotionService; @service declare router: Router; @service declare store: Store; @service declare undoManager: UndoManager; diff --git a/app/components/kuler.ts b/app/components/kuler.ts index 562e80220..f9f93997e 100644 --- a/app/components/kuler.ts +++ b/app/components/kuler.ts @@ -1,4 +1,6 @@ +/* eslint-disable @typescript-eslint/unbound-method */ import { action } from '@ember/object'; +import type Owner from '@ember/owner'; import { service } from '@ember/service'; import { capitalize } from '@ember/string'; import Component from '@glimmer/component'; @@ -12,13 +14,14 @@ import type { IpcRenderer } from 'electron'; import { debounce } from 'throttle-debounce'; import 'swach/components/kuler-palette-row'; +import type ColorModel from 'swach/data-models/color'; import type { ColorPOJO } from 'swach/services/color-utils'; import type ColorUtils from 'swach/services/color-utils'; type harmonyTypes = 'analogous' | 'monochromatic' | 'tetrad' | 'triad'; class Palette { - @tracked colors = []; + @tracked colors: ColorModel[] = []; @tracked selectedColorIndex = 0; createdAt: Date; @@ -38,9 +41,7 @@ class Palette { interface KulerSignature { Element: HTMLDivElement; Args: { - // TODO: correctly type this instead of using `any` - // eslint-disable-next-line @typescript-eslint/no-explicit-any - baseColor: any; + baseColor: ColorModel; }; } @@ -48,11 +49,9 @@ export default class KulerComponent extends Component { @service declare colorUtils: ColorUtils; @service declare store: Store; - // TODO: correctly type this instead of using `any` - // eslint-disable-next-line @typescript-eslint/no-explicit-any - _debouncedColorChange!: any; + _debouncedColorChange!: (color: iro.Color | string) => void; colorPicker!: iro.ColorPicker; - harmonies = ['analogous', 'monochromatic', 'tetrad', 'triad']; + harmonies = ['analogous', 'monochromatic', 'tetrad', 'triad'] as const; declare ipcRenderer: IpcRenderer; @tracked baseColor; @@ -60,13 +59,13 @@ export default class KulerComponent extends Component { @tracked palettes: Palette[] = []; @tracked selectedPalette!: Palette; - constructor(owner: unknown, args: KulerSignature['Args']) { + constructor(owner: Owner, args: KulerSignature['Args']) { super(owner, args); this._debouncedColorChange = debounce(10, this._onColorChange); this.baseColor = this.args.baseColor; - this.baseColorChanged().then(() => { + void this.baseColorChanged().then(() => { this._setupColorWheel(); if (typeof requireNode !== 'undefined') { @@ -76,17 +75,18 @@ export default class KulerComponent extends Component { this.ipcRenderer.on( 'selectKulerColor', - async (_event: unknown, colorIndex: number) => { + (_event: unknown, colorIndex: number) => { this.setSelectedIroColor(colorIndex); }, ); this.ipcRenderer.on( 'updateKulerColor', - async (_event: unknown, color) => { + // eslint-disable-next-line @typescript-eslint/no-misused-promises + async (_event: unknown, color: string | iro.Color) => { await this._onColorChange(color); this.colorPicker.setColors( - this.selectedPalette.colors.mapBy('hex'), + this.selectedPalette.colors.map((c) => c.hex), this.selectedPalette.selectedColorIndex, ); }, @@ -109,6 +109,7 @@ export default class KulerComponent extends Component { } @action + // eslint-disable-next-line @typescript-eslint/require-await async baseColorChanged(selectedPaletteTypeIndex = 0): Promise { this._destroyLeftoverPalettes(); @@ -116,34 +117,34 @@ export default class KulerComponent extends Component { for (const harmony of this.harmonies) { const palette = new Palette(harmony as harmonyTypes); - - //@ts-expect-error TODO fix this error later - let colors = new TinyColor(this.baseColor.hex)[harmony](5); - - colors = colors.map((color: TinyColor) => { + const tinyColors = new TinyColor(this.baseColor.hex)[harmony](5); + const colorPOJOs = tinyColors.map((color: TinyColor) => { return this.colorUtils.createColorPOJO(color.toHexString()); }); - colors = colors.map((color: ColorPOJO) => color.attributes); + const colors = colorPOJOs.map( + (color: ColorPOJO) => color.attributes, + ) as unknown as ColorModel[]; palette.colors = colors; - palettes.pushObject(palette); + palettes.push(palette); } this.palettes = palettes; - this.selectedPalette = this.palettes[selectedPaletteTypeIndex]; + this.selectedPalette = this.palettes[selectedPaletteTypeIndex] as Palette; } @action setColorAsBase(): Promise { - this.baseColor = - this.selectedPalette.colors[this.selectedPalette.selectedColorIndex]; + this.baseColor = this.selectedPalette.colors[ + this.selectedPalette.selectedColorIndex + ] as ColorModel; return this.baseColorChanged( this.palettes.indexOf(this.selectedPalette), ).then(() => { this.colorPicker.setColors( - this.selectedPalette.colors.mapBy('hex'), + this.selectedPalette.colors.map((c) => c.hex), this.selectedPalette.selectedColorIndex, ); }); @@ -164,12 +165,12 @@ export default class KulerComponent extends Component { @action setSelectedPalette(event: InputEvent): void { const paletteName = (event.target).value; - const palette = this.palettes.findBy('name', paletteName); + const palette = this.palettes.find((p) => p.name === paletteName); if (palette) { this.selectedPalette = palette; this.colorPicker.setColors( - this.selectedPalette.colors.mapBy('hex'), + this.selectedPalette.colors.map((c) => c.hex), palette.selectedColorIndex, ); } @@ -188,18 +189,20 @@ export default class KulerComponent extends Component { color instanceof iro.Color ? color.rgba : color, ); + // @ts-expect-error TODO: fix this to be able to not use prototype extensions this.selectedPalette.colors.replace(selectedColorIndex, 1, [ newColor.attributes, ]); if (selectedColorIndex === 0) { - this.baseColor = - this.selectedPalette.colors[this.selectedPalette.selectedColorIndex]; + this.baseColor = this.selectedPalette.colors[ + this.selectedPalette.selectedColorIndex + ] as ColorModel; await this.setColorAsBase(); } this.colorPicker.setColors( - this.selectedPalette.colors.mapBy('hex'), + this.selectedPalette.colors.map((c) => c.hex), this.selectedPalette.selectedColorIndex, ); } @@ -218,7 +221,7 @@ export default class KulerComponent extends Component { this.colorPicker = (iro.ColorPicker as any)( '#kuler-color-picker-container', { - colors: this.selectedPalette.colors.mapBy('hex'), + colors: this.selectedPalette.colors.map((c) => c.hex), layoutDirection: 'horizontal', layout: [ { diff --git a/app/components/loading-button.ts b/app/components/loading-button.ts index ccd84fa2c..2c1b70775 100644 --- a/app/components/loading-button.ts +++ b/app/components/loading-button.ts @@ -8,6 +8,7 @@ interface LoadingButtonSignature { }; } +// eslint-disable-next-line ember/no-empty-glimmer-component-classes export default class LoadingButton extends Component {} declare module '@glint/environment-ember-loose/registry' { diff --git a/app/components/login.ts b/app/components/login.ts index 30cda1e92..75af2fad0 100644 --- a/app/components/login.ts +++ b/app/components/login.ts @@ -37,8 +37,8 @@ export default class LoginComponent extends Component { } this.router.transitionTo('settings.cloud'); - } catch (error) { - this.errorMessage = error.message || error; + } catch (error: unknown) { + this.errorMessage = (error as Error).message || (error as string); } finally { this.loading = false; } diff --git a/app/components/options-menu.ts b/app/components/options-menu.ts index 032c18122..506eb6a96 100644 --- a/app/components/options-menu.ts +++ b/app/components/options-menu.ts @@ -1,3 +1,4 @@ +import type Owner from '@ember/owner'; import Component from '@glimmer/component'; import { tracked } from '@glimmer/tracking'; @@ -16,7 +17,7 @@ export default class OptionsMenu extends Component { @tracked position: 'left' | 'right' = 'right'; @tracked isShown = false; - constructor(owner: unknown, args: OptionsMenuSignature['Args']) { + constructor(owner: Owner, args: OptionsMenuSignature['Args']) { super(owner, args); this.position = this.args.position ?? 'right'; diff --git a/app/components/palette-row.ts b/app/components/palette-row.ts index f044699e0..f104f71bd 100644 --- a/app/components/palette-row.ts +++ b/app/components/palette-row.ts @@ -1,4 +1,4 @@ -import { action } from '@ember/object'; +import type Owner from '@ember/owner'; import type Router from '@ember/routing/router-service'; import { service } from '@ember/service'; import Component from '@glimmer/component'; @@ -9,6 +9,7 @@ import type DragSortService from 'ember-drag-sort/services/drag-sort'; import type { Store } from 'ember-orbit'; import type { RecordSchema } from '@orbit/records'; +import type { IpcRenderer } from 'electron'; import type ColorModel from 'swach/data-models/color'; import type PaletteModel from 'swach/data-models/palette'; @@ -119,14 +120,22 @@ export default class PaletteRowComponent extends Component @service declare store: Store; @service declare undoManager: UndoManager; + declare ipcRenderer: IpcRenderer; + menuItems: (MenuOption | FavoriteOption | LockOption)[] | null = null; fade = fade; nameInput!: HTMLElement; @tracked isEditing = false; - constructor(owner: unknown, args: PaletteRowSignature['Args']) { + constructor(owner: Owner, args: PaletteRowSignature['Args']) { super(owner, args); + if (typeof requireNode !== 'undefined') { + const { ipcRenderer } = requireNode('electron'); + + this.ipcRenderer = ipcRenderer; + } + this.menuItems = [ new MenuOption( this.toggleIsEditing, @@ -135,6 +144,7 @@ export default class PaletteRowComponent extends Component this.args.palette, ), new MenuOption( + // eslint-disable-next-line @typescript-eslint/no-misused-promises this.duplicatePalette, 'duplicate', 'Duplicate Palette', @@ -149,6 +159,7 @@ export default class PaletteRowComponent extends Component this.args.palette, ), new MenuOption( + // eslint-disable-next-line @typescript-eslint/no-misused-promises this.deletePalette, 'trash', 'Delete Palette', @@ -156,6 +167,7 @@ export default class PaletteRowComponent extends Component ), ]; + // @ts-expect-error dragSort.on does not seem to exist in TS this.dragSort.on( 'start', (event: { draggedItem: { hex: string | null } }) => { @@ -167,28 +179,26 @@ export default class PaletteRowComponent extends Component ); } - get isLocked(): boolean { + get isLocked() { return this.args.palette.isLocked; } get sortedColors(): (ColorModel | undefined)[] { return this.args?.palette?.colorOrder?.map( (color: { type: string; id: string }) => { - return this.args.palette.colors.findBy('id', color.id); + return this.args.palette.colors.find((c) => c.id === color.id); }, ); } - @action - async deletePalette(): Promise { + deletePalette = async () => { if (!this.isLocked) { await this.store.update((t) => t.removeRecord(this.args.palette)); this.undoManager.setupUndoRedo(); } - } + }; - @action - async duplicatePalette(): Promise { + duplicatePalette = async () => { let colorOrder = this.args.palette.colorOrder; const newColors = this.args.palette.colors.map((color) => { const colorData = color.$getData(); @@ -225,19 +235,17 @@ export default class PaletteRowComponent extends Component ]); this.undoManager.setupUndoRedo(); - } + }; - @action - enterPress(event: KeyboardEvent): void { + enterPress = (event: KeyboardEvent) => { if (event.keyCode === 13) { this.nameInput.blur(); } - } + }; - @action - favoritePalette(): void { + favoritePalette = () => { if (!this.isLocked) { - this.store.update((t) => + void this.store.update((t) => t.replaceAttribute( this.args.palette, 'isFavorite', @@ -245,27 +253,24 @@ export default class PaletteRowComponent extends Component ), ); } - } + }; - @action - insertedNameInput(element: HTMLElement): void { + insertedNameInput = (element: HTMLElement): void => { this.nameInput = element; this.nameInput.focus(); - } + }; - @action - lockPalette(): void { - this.store.update((t) => + lockPalette = () => { + void this.store.update((t) => t.replaceAttribute( this.args.palette, 'isLocked', !this.args.palette.isLocked, ), ); - } + }; - @action - sharePalette(): void { + sharePalette = () => { const { colors, name } = this.args.palette; if (colors.length) { @@ -278,39 +283,35 @@ export default class PaletteRowComponent extends Component )}`; if (typeof requireNode !== 'undefined') { - requireNode('electron').shell.openExternal(url); + void this.ipcRenderer.invoke('open-external', url); } } - } + }; - @action - toggleIsEditing(): void { + toggleIsEditing = () => { this.isEditing = !this.isEditing; - } + }; - @action - transitionToColors(event: Event): void { + transitionToColors = (event: Event) => { event.stopPropagation(); this.router.transitionTo('colors', { queryParams: { paletteId: this.args.palette.id }, }); - } + }; - @action - stopEditing(): void { + stopEditing = () => { this.isEditing = false; - } + }; - @action - updatePaletteName(e: InputEvent): void { - this.store.update((t) => + updatePaletteName = (e: InputEvent) => { + void this.store.update((t) => t.replaceAttribute( this.args.palette, 'name', (e.target).value, ), ); - } + }; } declare module '@glint/environment-ember-loose/registry' { diff --git a/app/components/palettes-list.ts b/app/components/palettes-list.ts index e72808db8..53e61ed43 100644 --- a/app/components/palettes-list.ts +++ b/app/components/palettes-list.ts @@ -61,10 +61,10 @@ export default class PalettesListComponent extends Component { if (sourceList === targetList && sourceIndex === targetIndex) return; - const movedItem = sourceList.objectAt(sourceIndex) as PaletteModel; + const movedItem = sourceList[sourceIndex] as PaletteModel; - sourceList.removeAt(sourceIndex); - targetList.insertAt(targetIndex, movedItem); + sourceList.splice(sourceIndex, 1); + targetList.splice(targetIndex, 0, movedItem); await this.store.update((t) => { const operations: RecordOperationTerm[] = []; diff --git a/app/components/register-confirm.ts b/app/components/register-confirm.ts index 4b4cbc9aa..c856e1742 100644 --- a/app/components/register-confirm.ts +++ b/app/components/register-confirm.ts @@ -23,8 +23,8 @@ export default class RegisterConfirm extends Component { await this.cognito.confirmSignUp(username, code); this.router.transitionTo('settings.cloud'); - } catch (err) { - this.errorMessage = err?.message; + } catch (err: unknown) { + this.errorMessage = (err as Error)?.message; } } } diff --git a/app/components/register.ts b/app/components/register.ts index 8cd924361..4dc3b9b74 100644 --- a/app/components/register.ts +++ b/app/components/register.ts @@ -27,8 +27,8 @@ export default class RegisterComponent extends Component { await this.cognito.signUp(username, password, attributes); this.router.transitionTo('settings.cloud.register.confirm'); - } catch (err) { - this.errorMessage = err?.message; + } catch (err: unknown) { + this.errorMessage = (err as Error)?.message; } } } diff --git a/app/components/settings-data.ts b/app/components/settings-data.ts index 70e9464e6..453010b90 100644 --- a/app/components/settings-data.ts +++ b/app/components/settings-data.ts @@ -1,4 +1,4 @@ -import { action } from '@ember/object'; +import type Owner from '@ember/owner'; import { service } from '@ember/service'; import Component from '@glimmer/component'; import { tracked } from '@glimmer/tracking'; @@ -29,7 +29,7 @@ export default class SettingsData extends Component { @tracked isExporting = false; @tracked isImporting = false; - constructor(owner: unknown, args: Record) { + constructor(owner: Owner, args: Record) { super(owner, args); if (typeof requireNode !== 'undefined') { @@ -39,8 +39,7 @@ export default class SettingsData extends Component { } } - @action - exportIndexedDB(): void { + exportIndexedDB = () => { if (this.ipcRenderer) { this.isExporting = true; @@ -51,10 +50,10 @@ export default class SettingsData extends Component { IDBExportImport.exportToJsonString( idbDatabase, - (err: Event, jsonString: string) => { + (err: Event | null, jsonString: string) => { if (err) { this.flashMessages.danger('An error occurred.'); - // eslint-disable-next-line no-console + console.error(err); } else { this.ipcRenderer.send('exportData', jsonString); @@ -69,26 +68,26 @@ export default class SettingsData extends Component { ); }; } - } + }; - @action - importIndexedDB(): void { + importIndexedDB = async () => { if (this.ipcRenderer) { this.isImporting = true; - this.ipcRenderer.invoke('importData').then((jsonString: string) => { + await this.ipcRenderer.invoke('importData').then((jsonString: string) => { if (jsonString) { const DBOpenRequest = getDBOpenRequest(); DBOpenRequest.onsuccess = () => { const idbDatabase = DBOpenRequest.result; - IDBExportImport.clearDatabase(idbDatabase, (err: Event) => { + IDBExportImport.clearDatabase(idbDatabase, (err: Event | null) => { if (!err) { // cleared data successfully IDBExportImport.importFromJsonString( idbDatabase, jsonString, - async (err: Event) => { + // eslint-disable-next-line @typescript-eslint/no-misused-promises + async (err: Event | null) => { if (!err) { idbDatabase.close(); @@ -105,8 +104,8 @@ export default class SettingsData extends Component { await this.store.sync((t) => records.map((r) => { - if (r?.attributes?.hex) { - delete r.attributes.hex; + if (r?.attributes?.['hex']) { + delete r.attributes['hex']; } return t.addRecord(r); @@ -129,7 +128,7 @@ export default class SettingsData extends Component { } }); } - } + }; } declare module '@glint/environment-ember-loose/registry' { diff --git a/app/components/settings-menu.ts b/app/components/settings-menu.ts index 186bf60f3..959e14588 100644 --- a/app/components/settings-menu.ts +++ b/app/components/settings-menu.ts @@ -1,4 +1,5 @@ import { action } from '@ember/object'; +import type Owner from '@ember/owner'; import Component from '@glimmer/component'; import { tracked } from '@glimmer/tracking'; @@ -25,7 +26,7 @@ export default class SettingsMenu extends Component { @tracked platform?: string; - constructor(owner: unknown, args: SettingsMenuSignature['Args']) { + constructor(owner: Owner, args: SettingsMenuSignature['Args']) { super(owner, args); if (typeof requireNode !== 'undefined') { @@ -33,17 +34,17 @@ export default class SettingsMenu extends Component { this.ipcRenderer = ipcRenderer; - this.ipcRenderer.invoke('getPlatform').then((platform: string) => { + void this.ipcRenderer.invoke('getPlatform').then((platform: string) => { this.platform = platform; }); } } - get isMacOS(): boolean { + get isMacOS() { return this.platform === 'darwin'; } - get isMacOSOrWindows(): boolean { + get isMacOSOrWindows() { return this.platform === 'darwin' || this.platform === 'win32'; } diff --git a/app/components/toggle-switch.gts b/app/components/toggle-switch.gts index 12489a7ed..707c72361 100644 --- a/app/components/toggle-switch.gts +++ b/app/components/toggle-switch.gts @@ -7,69 +7,69 @@ interface ToggleSwitchSignature { } export const ToggleSwitch: TOC =