Major JavaScript / TypeScript code cleanup #263

irvingoujAtDevolution · 2023-11-03T18:32:51Z

Cherry pick (and a bit more manual changes) for lint/format changes. All changes are manually made except package-lock.json . Tried to minimize the formatter automatically applied changes,

It is very hard to get rid of commited formatter changes, so I created another branch.

irvingoujAtDevolution · 2023-11-03T18:48:41Z

web-client/iron-svelte-client/package.json

@@ -1,47 +1,49 @@
 {


cherry picked file

irvingoujAtDevolution · 2023-11-03T19:13:47Z

web-client/iron-remote-gui/package.json

+        "svelte": "^3.54.0",
+        "svelte-check": "^2.10.0",
+        "tslib": "^2.4.1",
+        "typescript": "^4.9.3",


Svelte known error, does not yet support typescript over 5.0
sveltejs/kit#8650

irvingoujAtDevolution · 2023-11-03T19:14:28Z

web-client/iron-remote-gui/public/package.json

@@ -1,18 +1,18 @@
 {


cherry picked package.json, no change

irvingoujAtDevolution · 2023-11-03T19:14:55Z

web-client/iron-remote-gui/src/main.ts

@@ -1,9 +1,10 @@
-import IronRemoteGui from './iron-remote-gui.svelte';
+export * as default from './iron-remote-gui.svelte';


no unused import

irvingoujAtDevolution · 2023-11-03T19:15:36Z

web-client/iron-remote-gui/src/services/wasm-bridge.service.ts

-import type {MousePosition} from '../interfaces/MousePosition';
-import type {SessionEvent} from '../interfaces/session-event';
-import type {DesktopSize as IDesktopSize} from '../interfaces/DesktopSize';
+import { BehaviorSubject, from, Observable, of, Subject } from 'rxjs';


No implicit any fixes

irvingoujAtDevolution · 2023-11-03T19:16:05Z

web-client/iron-svelte-client/.eslintrc.cjs

+        node: true,
+    },
+    rules: {
+        '@typescript-eslint/no-unused-vars': ['error', { argsIgnorePattern: '^_' }],


rust style ignore unused var with _ prefix

CBenoit · 2023-11-03T19:26:48Z

web-client/iron-svelte-client/src/lib/messages/message.svelte

-                    ui('#toast');
+                    // ui('#toast');
                    break;
                case 'error':
-                    ui('#toast-error');
+                    // ui('#toast-error');


Why is it commented?

I should've mention this one earlier.
the symbol ui is not imported, nor a global value. It was previously allowed by eslint and tsc because of non-strict rules. I tried to search what function named ui we have, but there is none, so I commented it out and thought you or Nicolas might know something about it.

beercss must be updated to v3.x, and then you can import the ui function:

import {ui} from "beercss";

I fact, updating to v3.x version is breaking the UI, so we can’t fix this lint, let’s ignore it instead

irvingoujAtDevolution · 2023-11-03T19:32:21Z

web-client/iron-remote-gui/tsconfig.json

-    "allowJs": true,
-    "checkJs": true,
-    "isolatedModules": true
+    "allowJs": false,


"allowJs": false,"checkJs":true
cannot be used together

irvingoujAtDevolution · 2023-11-03T19:34:07Z

web-client/iron-remote-gui/src/services/PublicAPI.ts

    }
 }

+export type CustomEventWithUserInteraction = CustomEvent<{
+    userInteraction: UserInteraction;


export type

irvingoujAtDevolution · 2023-11-03T19:34:53Z

web-client/iron-svelte-client/src/lib/login/login.svelte

@@ -1,11 +1,11 @@
 <script lang="ts">
    import {currentSession, userInteractionService} from '../../services/session.service';
    import {catchError, filter} from "rxjs/operators";
-    import type {IRGUserInteraction, NewSessionInfo} from '../../../static/iron-remote-gui';
+    import type {UserInteraction} from '../../../static/iron-remote-gui';


IRGUserInteraction was not a valid type

irvingoujAtDevolution · 2023-11-03T19:35:22Z

web-client/iron-svelte-client/src/lib/remote-screen/remote-screen.svelte

        el.addEventListener('ready', (e) => {
-            userInteractionService.set(e.detail.irgUserInteraction);
+			const customEvent = e as CustomEventWithUserInteraction;


type assertion for custom event

Co-authored-by: irving ou <[email protected]>

Everything (except .svelte files) is already TypeScript. Co-authored-by: irving ou <[email protected]>

Co-authored-by: irving ou <[email protected]>

CBenoit · 2023-11-04T06:09:19Z

web-client/iron-remote-gui/.eslintrc.yaml

+# ESLint:
+# - https://eslint.org/docs/latest/use/configure/
+
+# eslint-plugin-prettier:
+# - https://github.com/prettier/eslint-plugin-prettier
+# - https://www.npmjs.com/package/eslint-plugin-prettier
+
+# eslint-plugin-svelte:
+# - https://github.com/sveltejs/eslint-plugin-svelte
+# - https://sveltejs.github.io/eslint-plugin-svelte/user-guide/
+---
+root: true
+
+plugins:
+  - '@typescript-eslint'
+
+extends:
+  - 'eslint:recommended'
+  - 'plugin:@typescript-eslint/recommended'
+  - 'plugin:svelte/prettier' # Turns off rules that may conflict with Prettier
+  - 'plugin:prettier/recommended'
+
+parser: '@typescript-eslint/parser'
+parserOptions:
+  project: ./tsconfig.json
+  sourceType: module
+  ecmaVersion: 2020
+  extraFileExtensions:
+    - '.svelte'
+
+ignorePatterns:
+  - '*.cjs'
+
+overrides:
+  - files: '*.svelte'
+    parser: svelte-eslint-parser
+    parserOptions:
+      parser: '@typescript-eslint/parser'
+
+env:
+  browser: true
+  es2017: true
+  node: true
+
+rules:
+  strict: 2
+  '@typescript-eslint/no-unused-vars':
+    - 'error'
+    - argsIgnorePattern: '^_'
+  '@typescript-eslint/strict-boolean-expressions':
+    - 2
+    - allowString: false
+      allowNumber: false


I modified the config file to be in yaml, so we can easily annotate with comments

CBenoit · 2023-11-04T06:09:48Z

web-client/.prettierrc.yaml

+  - files:
+      - '*.yml'
+      - '*.yaml'
+      - '*.json'
+      - '*.html'
+      - '*.md'
+    options:
+      tabWidth: 2


Adjusted a bit the tabWidth for some files

CBenoit · 2023-11-04T06:11:10Z

web-client/iron-remote-gui/package.json

+    "check": "svelte-check --tsconfig ./tsconfig.json",
+    "check:watch": "svelte-check --tsconfig ./tsconfig.json --watch",
+    "lint": "npm run lint:prettier && npm run lint:eslint",
+    "lint:prettier": "prettier . --check",
+    "lint:eslint": "eslint src/**",
+    "format": "prettier . --write ."


Here are the scripts:

npm run check will verify svelte and typescript code

npm run lint will very eslint and prettier

npm run format will actually run the formatter

CBenoit · 2023-11-04T06:13:56Z

web-client/iron-remote-gui/public/test.html

-<!DOCTYPE html>
+<!doctype html>


This was actually the default for prettier, and some big projects such as bootstrap were already using lowercase since before the default changed: twbs/bootstrap#24217
I don’t feel like fighting against that, let’s just stick to what is considered to be a good default by prettier

CBenoit · 2023-11-04T06:14:22Z

web-client/iron-remote-gui/src/enums/OS.ts

-    MACOS = 'macos'
-}
+    ANDROID = 'android',


I just removed the MACOS variant since it wasn’t used

github-actions · 2023-11-04T06:22:25Z

Coverage Report 🤖 ⚙️

Past:
Total lines: 25239
Covered lines: 15676 (62.11%)

New:
Total lines: 25239
Covered lines: 15680 (62.13%)

Diff: +0.02%

[this comment will be updated automatically]

irvingoujAtDevolution requested review from CBenoit and ngirot-devolutions November 3, 2023 18:32

irvingoujAtDevolution closed this Nov 3, 2023

irvingoujAtDevolution reopened this Nov 3, 2023

irvingoujAtDevolution marked this pull request as ready for review November 3, 2023 18:44

irvingoujAtDevolution commented Nov 3, 2023

View reviewed changes

web-client/iron-svelte-client/package.json Outdated

@@ -1,47 +1,49 @@

{

Copy link

Contributor Author

irvingoujAtDevolution Nov 3, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

cherry picked file

irvingoujAtDevolution commented Nov 3, 2023

View reviewed changes

CBenoit reviewed Nov 3, 2023

View reviewed changes

irvingoujAtDevolution commented Nov 3, 2023

View reviewed changes

irvingoujAtDevolution requested a review from CBenoit November 3, 2023 19:51

CBenoit and others added 11 commits November 3, 2023 23:07

chore(web-client): update .gitignore files

bca73eb

Co-authored-by: irving ou <[email protected]>

chore(web-client): configure prettier

c693222

Co-authored-by: irving ou <[email protected]>

refactor(web-client): enable strictNullChecks

5349c17

refactor(svelte): remove dead code

5b0094d

chore(web-client): set allowJs to false

4017cb0

Everything (except .svelte files) is already TypeScript. Co-authored-by: irving ou <[email protected]>

refactor(web-client): set noImplicitAny to true

3adccc8

Co-authored-by: irving ou <[email protected]>

refactor(iron-remote-gui): enable strict mode

92fb327

chore(web-client): configure ESLint

6ece320

Co-authored-by: irving ou <[email protected]>

refactor(web-client): fix lints emitted by ESLint

200aee7

Co-authored-by: irving ou <[email protected]>

build(web-client): update npm dependencies

016d328

style(web-client): run prettier

6e6a848

CBenoit force-pushed the cherry-pick-non-formatter-changes branch from eda59c7 to 832c70e Compare November 4, 2023 06:05

CBenoit changed the title ~~Update Linter/Formatter, fix implict any, fix eslint issues, fix tsc issues~~ Major JavaScript / TypeScript cleanup Nov 4, 2023

CBenoit changed the title ~~Major JavaScript / TypeScript cleanup~~ Major JavaScript / TypeScript code cleanup Nov 4, 2023

CBenoit enabled auto-merge (rebase) November 4, 2023 06:07

CBenoit reviewed Nov 4, 2023

View reviewed changes

CBenoit approved these changes Nov 4, 2023

View reviewed changes

chore: check web client for lints and formatting

79346c5

CBenoit force-pushed the cherry-pick-non-formatter-changes branch from 832c70e to 79346c5 Compare November 4, 2023 06:19

CBenoit merged commit 1d0b5fa into master Nov 4, 2023
6 checks passed

CBenoit deleted the cherry-pick-non-formatter-changes branch November 4, 2023 06:26

CBenoit mentioned this pull request Nov 6, 2023

feat: clipboard support for web client #259

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Major JavaScript / TypeScript code cleanup #263

Major JavaScript / TypeScript code cleanup #263

irvingoujAtDevolution commented Nov 3, 2023

irvingoujAtDevolution Nov 3, 2023

irvingoujAtDevolution Nov 3, 2023

irvingoujAtDevolution Nov 3, 2023

irvingoujAtDevolution Nov 3, 2023

irvingoujAtDevolution Nov 3, 2023

irvingoujAtDevolution Nov 3, 2023

CBenoit Nov 3, 2023

irvingoujAtDevolution Nov 3, 2023

CBenoit Nov 3, 2023 •

edited

Loading

CBenoit Nov 4, 2023

irvingoujAtDevolution Nov 3, 2023

irvingoujAtDevolution Nov 3, 2023

irvingoujAtDevolution Nov 3, 2023

irvingoujAtDevolution Nov 3, 2023

CBenoit Nov 4, 2023

CBenoit Nov 4, 2023

CBenoit Nov 4, 2023 •

edited

Loading

CBenoit Nov 4, 2023

CBenoit Nov 4, 2023

github-actions bot commented Nov 4, 2023

		@@ -1,9 +1,10 @@
		import IronRemoteGui from './iron-remote-gui.svelte';
		export * as default from './iron-remote-gui.svelte';

		<!DOCTYPE html>
		<!doctype html>

Major JavaScript / TypeScript code cleanup #263

Major JavaScript / TypeScript code cleanup #263

Conversation

irvingoujAtDevolution commented Nov 3, 2023

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

CBenoit Nov 3, 2023 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

CBenoit Nov 4, 2023 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

github-actions bot commented Nov 4, 2023

Coverage Report 🤖 ⚙️

CBenoit Nov 3, 2023 •

edited

Loading

CBenoit Nov 4, 2023 •

edited

Loading