Adds Prettierx - or how I broke TGUI for the nth time (tgstation#67935)

Co-authored-by: Aleksej Komarov <[email protected]>

.editorconfig

@@ -1,10 +1,13 @@
+# http://editorconfig.org
+root = true
+
 [*]
 indent_style = tab
 indent_size = 4
+end_of_line = lf
 charset = utf-8
 trim_trailing_whitespace = true
 insert_final_newline = true
-end_of_line = lf
 
 [*.yml]
 indent_style = space

.vscode/extensions.json

@@ -6,6 +6,7 @@
 		"dbaeumer.vscode-eslint",
 		"stylemistake.auto-comment-blocks",
 		"Donkie.vscode-tgstation-test-adapter",
-		"anturk.dmi-editor"
+		"anturk.dmi-editor",
+		"esbenp.prettier-vscode"
 	]
 }

.vscode/settings.json

@@ -1,8 +1,7 @@
 {
 	"eslint.nodePath": "./tgui/.yarn/sdks",
-	"eslint.workingDirectories": [
-		"./tgui"
-	],
+	"eslint.workingDirectories": ["./tgui"],
+	"prettier.prettierPath": "./tgui/.yarn/sdks/prettier/index.js",
 	"typescript.tsdk": "./tgui/.yarn/sdks/typescript/lib",
 	"typescript.enablePromptUseWorkspaceTsdk": true,
 	"search.exclude": {
@@ -17,12 +16,28 @@
 	"gitlens.advanced.blame.customArguments": ["-w"],
 	"tgstationTestExplorer.project.resultsType": "json",
 	"[javascript]": {
-		"editor.rulers": [80]
+		"editor.rulers": [80],
+		"editor.defaultFormatter": "esbenp.prettier-vscode",
+		"editor.formatOnSave": true
+	},
+	"[javascriptreact]": {
+		"editor.rulers": [80],
+		"editor.defaultFormatter": "esbenp.prettier-vscode",
+		"editor.formatOnSave": true
 	},
 	"[typescript]": {
-		"editor.rulers": [80]
+		"editor.rulers": [80],
+		"editor.defaultFormatter": "esbenp.prettier-vscode",
+		"editor.formatOnSave": true
+	},
+	"[typescriptreact]": {
+		"editor.rulers": [80],
+		"editor.defaultFormatter": "esbenp.prettier-vscode",
+		"editor.formatOnSave": true
 	},
 	"[scss]": {
-		"editor.rulers": [80]
+		"editor.rulers": [80],
+		"editor.defaultFormatter": "esbenp.prettier-vscode",
+		"editor.formatOnSave": true
 	}
 }

tgui/.eslintrc.yml

@@ -1,4 +1,5 @@
 root: true
+extends: prettier
 parser: '@typescript-eslint/parser'
 parserOptions:
   ecmaVersion: 2020
@@ -17,7 +18,6 @@ settings:
   react:
     version: '16.10'
 rules:
-
   ## Possible Errors
   ## ----------------------------------------
   ## Enforce “for” loop update clause moving the counter in the right
@@ -349,15 +349,15 @@ rules:
   ## Enforce the location of arrow function bodies
   # implicit-arrow-linebreak: error
   ## Enforce consistent indentation
-  indent: [error, 2, { SwitchCase: 1 }]
+  # indent: [error, 2, { SwitchCase: 1 }]
   ## Enforce the consistent use of either double or single quotes in JSX
   ## attributes
-  jsx-quotes: [error, prefer-double]
+  # jsx-quotes: [error, prefer-double]
   ## Enforce consistent spacing between keys and values in object literal
   ## properties
-  key-spacing: [error, { beforeColon: false, afterColon: true }]
+  # key-spacing: [error, { beforeColon: false, afterColon: true }]
   ## Enforce consistent spacing before and after keywords
-  keyword-spacing: [error, { before: true, after: true }]
+  # keyword-spacing: [error, { before: true, after: true }]
   ## Enforce position of line comments
   # line-comment-position: error
   ## Enforce consistent linebreak style
@@ -369,15 +369,15 @@ rules:
   ## Enforce a maximum depth that blocks can be nested
   # max-depth: error
   ## Enforce a maximum line length
-  max-len: [error, {
-    code: 80,
-    ## Ignore imports
-    ignorePattern: '^(import\s.+\sfrom\s|.*require\()',
-    ignoreUrls: true,
-    ignoreRegExpLiterals: true,
-    ignoreStrings: true,
-    ignoreTemplateLiterals: true,
-  }]
+  # max-len: [error, {
+  #   code: 80,
+  #   ## Ignore imports
+  #   ignorePattern: '^(import\s.+\sfrom\s|.*require\()',
+  #   ignoreUrls: true,
+  #   ignoreRegExpLiterals: true,
+  #   ignoreStrings: true,
+  #   ignoreTemplateLiterals: true,
+  # }]
   ## Enforce a maximum number of lines per file
   # max-lines: error
   ## Enforce a maximum number of line of code in a function
@@ -414,7 +414,7 @@ rules:
   ## Disallow mixed binary operators
   # no-mixed-operators: error
   ## Disallow mixed spaces and tabs for indentation
-  no-mixed-spaces-and-tabs: error
+  # no-mixed-spaces-and-tabs: error
   ## Disallow use of chained assignment expressions
   # no-multi-assign: error
   ## Disallow multiple empty lines
@@ -440,7 +440,7 @@ rules:
   ## Disallow ternary operators when simpler alternatives exist
   # no-unneeded-ternary: error
   ## Disallow whitespace before properties
-  no-whitespace-before-property: error
+  # no-whitespace-before-property: error
   ## Enforce the location of single-line statements
   # nonblock-statement-body-position: error
   ## Enforce consistent line breaks inside braces
@@ -457,7 +457,7 @@ rules:
   ## Require or disallow assignment operator shorthand where possible
   # operator-assignment: error
   ## Enforce consistent linebreak style for operators
-  operator-linebreak: [error, before]
+  # operator-linebreak: [error, before]
   ## Require or disallow padding within blocks
   # padded-blocks: error
   ## Require or disallow padding lines between statements
@@ -482,11 +482,11 @@ rules:
   ## Enforce consistent spacing before blocks
   space-before-blocks: [error, always]
   ## Enforce consistent spacing before function definition opening parenthesis
-  space-before-function-paren: [error, {
-    anonymous: always,
-    named: never,
-    asyncArrow: always,
-  }]
+  # space-before-function-paren: [error, {
+  #   anonymous: always,
+  #   named: never,
+  #   asyncArrow: always,
+  # }]
   ## Enforce consistent spacing inside parentheses
   space-in-parens: [error, never]
   ## Require spacing around infix operators
@@ -695,7 +695,7 @@ rules:
   react/jsx-closing-tag-location: error
   ## Enforce or disallow newlines inside of curly braces in JSX attributes and
   ## expressions (fixable)
-  react/jsx-curly-newline: error
+  # react/jsx-curly-newline: error
   ## Enforce or disallow spaces inside of curly braces in JSX attributes and
   ## expressions (fixable)
   react/jsx-curly-spacing: error
@@ -708,11 +708,11 @@ rules:
   ## Enforce event handler naming conventions in JSX
   react/jsx-handler-names: error
   ## Validate JSX indentation (fixable)
-  react/jsx-indent: [error, 2, {
-    checkAttributes: true,
-  }]
+  # react/jsx-indent: [error, 2, {
+  #   checkAttributes: true,
+  # }]
   ## Validate props indentation in JSX (fixable)
-  react/jsx-indent-props: [error, 2]
+  # react/jsx-indent-props: [error, 2]
   ## Validate JSX has key prop when in array or iterator
   react/jsx-key: error
   ## Validate JSX maximum depth

tgui/.prettierignore

@@ -0,0 +1,15 @@
+## NPM
+/**/node_modules
+
+## Yarn
+/.yarn
+/yarn.lock
+/.pnp.*
+
+/docs
+/public
+/packages/tgui-polyfill
+/packages/tgfont/static
+**/*.json
+**/*.yml
+**/*.md

tgui/.prettierrc.yml

@@ -1,12 +1,15 @@
 arrowParens: always
-bracketSpacing: true
+breakLongMethodChains: true
 endOfLine: lf
+importFormatting: oneline
 jsxBracketSameLine: true
 jsxSingleQuote: false
+offsetTernaryExpressions: true
 printWidth: 80
 proseWrap: preserve
 quoteProps: preserve
 semi: true
 singleQuote: true
 tabWidth: 2
 trailingComma: es5
+useTabs: false

tgui/.yarn/sdks/eslint/lib/api.js

@@ -11,10 +11,10 @@ const absRequire = (createRequire || createRequireFromPath)(absPnpApiPath);
 
 if (existsSync(absPnpApiPath)) {
   if (!process.versions.pnp) {
-    // Setup the environment to be able to require eslint/lib/api.js
+    // Setup the environment to be able to require eslint
     require(absPnpApiPath).setup();
   }
 }
 
-// Defer to the real eslint/lib/api.js your application uses
-module.exports = absRequire(`eslint/lib/api.js`);
+// Defer to the real eslint your application uses
+module.exports = absRequire(`eslint`);

tgui/.yarn/sdks/prettier/index.js

@@ -0,0 +1,20 @@
+#!/usr/bin/env node
+
+const {existsSync} = require(`fs`);
+const {createRequire, createRequireFromPath} = require(`module`);
+const {resolve} = require(`path`);
+
+const relPnpApiPath = "../../../.pnp.cjs";
+
+const absPnpApiPath = resolve(__dirname, relPnpApiPath);
+const absRequire = (createRequire || createRequireFromPath)(absPnpApiPath);
+
+if (existsSync(absPnpApiPath)) {
+  if (!process.versions.pnp) {
+    // Setup the environment to be able to require prettier/index.js
+    require(absPnpApiPath).setup();
+  }
+}
+
+// Defer to the real prettier/index.js your application uses
+module.exports = absRequire(`prettier/index.js`);

tgui/.yarn/sdks/prettier/package.json

@@ -0,0 +1,6 @@
+{
+  "name": "prettier",
+  "version": "0.19.0-sdk",
+  "main": "./index.js",
+  "type": "commonjs"
+}