Apply and Upgrade Eslint (#288)

* Upgrade ESLINT and fix issues

* feat: add frontend linting job to GitHub Actions workflow

* Move UI linting to separate file

* More linting fixes

* Remove pull_request trigger from UI linting workflow

* Update UI linting workflow

* Rename frontend-lint workflow to ui-lint for clarity

ui/.eslintrc.cjs

@@ -8,6 +8,8 @@ module.exports = {
     "plugin:react-hooks/recommended",
     "plugin:react/recommended",
     "plugin:react/jsx-runtime",
+    "plugin:import/recommended",
+    "prettier",
   ],
   ignorePatterns: ["dist", ".eslintrc.cjs", "tailwind.config.js", "postcss.config.js"],
   parser: "@typescript-eslint/parser",
@@ -20,5 +22,45 @@ module.exports = {
   },
   rules: {
     "react-refresh/only-export-components": ["warn", { allowConstantExport: true }],
+    "import/order": [
+      "error",
+      {
+        /**
+         * @description
+         *
+         * This keeps imports separate from one another, ensuring that imports are separated
+         * by their relative groups. As you move through the groups, imports become closer
+         * to the current file.
+         *
+         * @example
+         * ```
+         * import fs from 'fs';
+         *
+         * import package from 'npm-package';
+         *
+         * import xyz from '~/project-file';
+         *
+         * import index from '../';
+         *
+         * import sibling from './foo';
+         * ```
+         */
+        groups: ["builtin", "external", "internal", "parent", "sibling"],
+        "newlines-between": "always",
+      },
+    ],
+  },
+  settings: {
+    "import/resolver": {
+      alias: {
+        map: [
+          ["@components", "./src/components"],
+          ["@routes", "./src/routes"],
+          ["@assets", "./src/assets"],
+          ["@", "./src"],
+        ],
+        extensions: [".ts", ".tsx", ".js", ".jsx", ".json"],
+      },
+    },
   },
 };