Tooling refresh (eslint/prettier/vitest)

adeira-source-id: b5247c24c5bc272a5a982b2d6873f1f16431f680
trytriplex · Oct 10, 2023 · 33b05be · 33b05be
1 parent 940c345
commit 33b05be
Show file tree

Hide file tree

Showing 156 changed files with 2,472 additions and 2,213 deletions.
diff --git a/.changeset/tough-pianos-dream.md b/.changeset/tough-pianos-dream.md
@@ -0,0 +1,14 @@
+---
+"create-triplex-project": patch
+"@triplex/ws-client": patch
+"@triplex/bridge": patch
+"@triplex/client": patch
+"@triplex/editor": patch
+"@triplex/server": patch
+"@triplex/scene": patch
+"@triplex/electron": patch
+"@triplex/run": patch
+"@docs/triplex": patch
+---
+
+Apply lint and prettier fixes.
diff --git a/.eslintrc.json b/.eslintrc.json
@@ -1,15 +1,6 @@
 {
-  "env": {
-    "browser": true,
-    "es2021": true,
-    "node": true
-  },
-  "extends": [
-    "eslint:recommended",
-    "plugin:react/jsx-runtime",
-    "plugin:react-hooks/recommended",
-    "plugin:@typescript-eslint/recommended"
-  ],
+  "extends": ["@nkzw"],
+  "plugins": ["header"],
   "ignorePatterns": ["dist", "build"],
   "overrides": [
     {
@@ -25,23 +16,15 @@
       }
     }
   ],
-  "parser": "@typescript-eslint/parser",
-  "parserOptions": {
-    "ecmaVersion": "latest",
-    "sourceType": "module"
-  },
-  "plugins": ["@typescript-eslint", "import", "react", "header"],
   "rules": {
     "@typescript-eslint/no-empty-function": "off",
     "@typescript-eslint/no-explicit-any": "error",
     "@typescript-eslint/no-inferrable-types": "off",
-    "@typescript-eslint/no-non-null-assertion": "off",
     "@typescript-eslint/no-unnecessary-type-constraint": "off",
     "@typescript-eslint/no-unused-vars": [
       "error",
       { "argsIgnorePattern": "^_" }
     ],
-    "@typescript-eslint/no-var-requires": "off",
     "import/no-extraneous-dependencies": [
       "error",
       {
@@ -57,8 +40,6 @@
       }
     ],
     "no-inner-declarations": "off",
-    "prefer-const": "off",
-    "react-hooks/exhaustive-deps": "error",
     "header/header": ["error", "scripts/header.js"]
   }
 }
diff --git a/.prettierrc b/.prettierrc
@@ -1,5 +1,10 @@
 {
-  "plugins": ["prettier-plugin-jsdoc", "prettier-plugin-tailwindcss"],
+  "plugins": [
+    "@ianvs/prettier-plugin-sort-imports",
+    "prettier-plugin-jsdoc",
+    "prettier-plugin-tailwindcss",
+    "prettier-plugin-packagejson"
+  ],
   "proseWrap": "always",
   "jsdocSingleLineComment": false,
   "jsdocCapitalizeDescription": false,

diff --git a/.vscode/settings.json b/.vscode/settings.json
@@ -1,3 +1,7 @@
 {
-  "typescript.tsdk": "node_modules/typescript/lib"
+  "typescript.tsdk": "node_modules/typescript/lib",
+  "editor.formatOnSave": true,
+  "editor.codeActionsOnSave": {
+    "source.fixAll.eslint": true
+  }
 }
diff --git a/apps/docs/components/download-button.tsx b/apps/docs/components/download-button.tsx
@@ -54,14 +54,15 @@ export function DownloadButton() {
   return (
     <>
       <a
-        href={assets[0] ? assets[0].browser_download_url : "#"}
-        target="_blank"
         className={cn([
           platform === "Unsupported"
             ? "cursor-not-allowed bg-neutral-500/80"
             : "cursor-pointer bg-blue-400",
           "mb-2 rounded-full px-12 py-4 text-center text-xl font-bold tracking-tight text-neutral-900",
         ])}
+        href={assets[0] ? assets[0].browser_download_url : "#"}
+        rel="noreferrer"
+        target="_blank"
       >
         {platform === "Unsupported"
           ? "Unsupported Platform"
@@ -76,10 +77,11 @@ export function DownloadButton() {
 
       {assets.map((asset) => (
         <a
-          key={asset.name}
+          className="pt-3 text-center text-sm text-neutral-400 hover:text-neutral-300"
           href={asset.browser_download_url}
+          key={asset.name}
+          rel="noreferrer"
           target="_blank"
-          className="pt-3 text-center text-sm text-neutral-400 hover:text-neutral-300"
         >
           {asset.name}
         </a>

diff --git a/apps/docs/components/footer.tsx b/apps/docs/components/footer.tsx
@@ -19,10 +19,11 @@ export function Footer() {
           </div>
           <div className="mt-4 flex gap-2">
             <a
-              className="-mt-0.5 text-neutral-400 hover:text-neutral-200"
-              target="_blank"
               aria-label="Github"
+              className="-mt-0.5 text-neutral-400 hover:text-neutral-200"
               href="https://github.com/try-triplex/triplex"
+              rel="noreferrer"
+              target="_blank"
             >
               <svg
                 fill="none"
@@ -51,10 +52,11 @@ export function Footer() {
               </svg>
             </a>
             <a
-              className="text-neutral-400 hover:text-neutral-200"
-              target="_blank"
               aria-label="Twitter"
+              className="text-neutral-400 hover:text-neutral-200"
               href="https://twitter.com/_douges"
+              rel="noreferrer"
+              target="_blank"
             >
               <svg
                 aria-label="twitter"
@@ -76,32 +78,32 @@ export function Footer() {
             <span className="text-sm font-bold text-neutral-200">Product</span>
             <li>
               <Link
-                href="/docs/setup/overview"
                 className="text-sm text-neutral-400 hover:text-neutral-200"
+                href="/docs/setup/overview"
               >
                 Setup
               </Link>
             </li>
             <li>
               <Link
-                href="/docs/get-started/user-interface"
                 className="text-sm text-neutral-400 hover:text-neutral-200"
+                href="/docs/get-started/user-interface"
               >
                 User Interface
               </Link>
             </li>
             <li>
               <Link
-                href="/docs/get-started/settings"
                 className="text-sm text-neutral-400 hover:text-neutral-200"
+                href="/docs/get-started/settings"
               >
                 Settings
               </Link>
             </li>
             <li>
               <Link
-                href="https://github.com/try-triplex/triplex/releases"
                 className="text-sm text-neutral-400 hover:text-neutral-200"
+                href="https://github.com/try-triplex/triplex/releases"
               >
                 Changelog
               </Link>
@@ -114,24 +116,24 @@ export function Footer() {
             </span>
             <li>
               <Link
-                href="https://discord.gg/nBzRBUEs4b"
                 className="text-sm text-neutral-400 hover:text-neutral-200"
+                href="https://discord.gg/nBzRBUEs4b"
               >
                 Community
               </Link>
             </li>
             <li>
               <Link
-                href="https://github.com/try-triplex/triplex/issues/new"
                 className="text-sm text-neutral-400 hover:text-neutral-200"
+                href="https://github.com/try-triplex/triplex/issues/new"
               >
                 Raise an Issue
               </Link>
             </li>
             <li>
               <Link
-                href="/docs/faq"
                 className="text-sm text-neutral-400 hover:text-neutral-200"
+                href="/docs/faq"
               >
                 FAQ
               </Link>
@@ -144,16 +146,16 @@ export function Footer() {
             </span>
             <li>
               <Link
-                href="https://github.com/try-triplex/triplex"
                 className="text-sm text-neutral-400 hover:text-neutral-200"
+                href="https://github.com/try-triplex/triplex"
               >
                 Github
               </Link>
             </li>
             <li>
               <Link
-                href="/license"
                 className="text-sm text-neutral-400 hover:text-neutral-200"
+                href="/license"
               >
                 License
               </Link>

diff --git a/apps/docs/components/header.tsx b/apps/docs/components/header.tsx
@@ -4,20 +4,20 @@
  * This source code is licensed under the GPL-3.0 license found in the LICENSE
  * file in the root directory of this source tree.
  */
+import { HamburgerMenuIcon, MagnifyingGlassIcon } from "@radix-ui/react-icons";
 import Link from "next/link";
 import { ReactNode, useEffect } from "react";
-import { MagnifyingGlassIcon, HamburgerMenuIcon } from "@radix-ui/react-icons";
-import { cn } from "../util/cn";
 import { useSearchStore } from "../stores/search";
+import { cn } from "../util/cn";
 
 export function Header({
+  appearance = "default",
   children,
   onShowNav,
-  appearance = "default",
 }: {
+  appearance?: "default" | "transparent";
   children: ReactNode;
   onShowNav: () => void;
-  appearance?: "default" | "transparent";
 }) {
   const showSearch = useSearchStore((store) => () => store.setIsOpen(true));
 
@@ -55,7 +55,7 @@ export function Header({
             className="font text-[2.5rem] text-white/90"
             href="/"
           >
-            <svg width="32px" viewBox="0 0 200 200">
+            <svg viewBox="0 0 200 200" width="32px">
               <polygon
                 className="fill-none stroke-current [stroke-width:0.8rem]"
                 points="183,172 26,172 100,28"
@@ -65,8 +65,8 @@ export function Header({
         </span>
 
         <Link
-          href="/download"
           className="flex h-full items-center bg-blue-400 px-6 py-3 text-lg font-semibold text-neutral-950 md:text-base"
+          href="/download"
         >
           Download
         </Link>
@@ -75,18 +75,18 @@ export function Header({
           <div className="ml-auto md:hidden" />
 
           <button
+            className="relative flex h-8 flex-shrink-0 cursor-default items-center rounded px-3 text-sm text-neutral-400 -outline-offset-1 outline-blue-400 hover:bg-white/5 focus-visible:outline focus-visible:outline-1 active:bg-white/10 md:hidden"
             onClick={onShowNav}
             type="submit"
-            className="relative flex h-8 flex-shrink-0 cursor-default items-center rounded px-3 text-sm text-neutral-400 -outline-offset-1 outline-blue-400 hover:bg-white/5 focus-visible:outline focus-visible:outline-1 active:bg-white/10 md:hidden"
           >
             <HamburgerMenuIcon className="flex-shrink-0" />
           </button>
 
           <div className="hidden md:contents">{children}</div>
 
           <button
-            onClick={showSearch}
             className="relative flex h-8 cursor-default items-center rounded-md border-neutral-700 px-3 text-sm text-neutral-400 -outline-offset-1 outline-blue-400 hover:bg-white/5 focus-visible:outline focus-visible:outline-1 active:bg-white/10 md:ml-auto md:w-64 md:cursor-text md:border md:pl-3 md:pr-1.5"
+            onClick={showSearch}
             type="button"
           >
             <MagnifyingGlassIcon className="flex-shrink-0 md:hidden" />

diff --git a/apps/docs/components/hero.tsx b/apps/docs/components/hero.tsx
@@ -10,12 +10,12 @@ import { cn } from "../util/cn";
 export function DownloadLink({ variant }: { variant: "outline" | "bold" }) {
   return (
     <Link
-      href="/download"
       className={cn([
         variant === "outline" && "border-2 border-blue-400 text-blue-400",
         variant === "bold" && "bg-blue-400 text-black/90",
         "flex h-[54px] w-[250px] items-center justify-center rounded-full text-xl font-bold",
       ])}
+      href="/download"
     >
       Gain Early Access
     </Link>
@@ -25,12 +25,12 @@ export function DownloadLink({ variant }: { variant: "outline" | "bold" }) {
 export function BigDownloadLink({ variant }: { variant: "outline" | "bold" }) {
   return (
     <Link
-      href="/download"
       className={cn([
         variant === "outline" && "border-2 border-blue-400 text-blue-400",
         variant === "bold" && "bg-blue-400 text-black/90",
         "flex items-center justify-center rounded-full px-20 py-6 text-2xl font-bold md:px-28 md:py-8 md:text-4xl",
       ])}
+      href="/download"
     >
       Download Now
     </Link>
@@ -40,8 +40,8 @@ export function BigDownloadLink({ variant }: { variant: "outline" | "bold" }) {
 export function Hero() {
   return (
     <div
-      id="hero-section"
       className="relative flex h-[100lvh] min-h-[700px] items-center"
+      id="hero-section"
     >
       <div className="max-w-[80rem] px-10 pt-16 xl:px-28">
         <div className="flex flex-col items-center gap-8 md:items-start lg:gap-4">
@@ -57,37 +57,38 @@ export function Hero() {
 
             <a
               aria-label="View Triplex Product Hunt Page"
+              className="rounded-full bg-white"
               href="https://www.producthunt.com/posts/triplex?utm_source=badge-featured&utm_medium=badge&utm_souce=badge-triplex"
+              rel="noreferrer"
               target="_blank"
-              className="rounded-full bg-white"
             >
-              <svg width="250" height="54" viewBox="0 0 250 54">
-                <g stroke="none" strokeWidth="1" fill="none" fillRule="evenodd">
+              <svg height="54" viewBox="0 0 250 54" width="250">
+                <g fill="none" fillRule="evenodd" stroke="none" strokeWidth="1">
                   <g transform="translate(-130.000000, -73.000000)">
                     <g transform="translate(130.000000, 73.000000)">
                       <text
+                        fill="#4B587C"
                         fontFamily="inherit"
                         fontSize="9"
                         fontWeight="bold"
-                        fill="#4B587C"
                       >
                         <tspan x="53" y="20">
                           FEATURED ON
                         </tspan>
                       </text>
                       <text
+                        fill="#4B587C"
                         fontFamily="inherit"
                         fontSize="21"
                         fontWeight="bold"
-                        fill="#4B587C"
                       >
                         <tspan x="52" y="40">
                           Product Hunt
                         </tspan>
                       </text>
                       <g
-                        transform="translate(201.000000, 13.000000)"
                         fill="#4B587C"
+                        transform="translate(201.000000, 13.000000)"
                       >
                         <g>
                           <polygon points="26.0024997 10 15 10 20.5012498 0"></polygon>

diff --git a/apps/docs/components/intro-video.tsx b/apps/docs/components/intro-video.tsx
@@ -23,15 +23,15 @@ export function IntroVideo() {
           </svg>
         </button> */}
         <Image
-          fill
-          className="object-contain md:hidden"
           alt="Screenshot of the Triplex user interface running on macOS"
+          className="object-contain md:hidden"
+          fill
           src="/landing-ui_sm.png"
         />
         <Image
-          fill
-          className="hidden object-contain md:block"
           alt="Screenshot of the Triplex user interface running on macOS"
+          className="hidden object-contain md:block"
+          fill
           src="/landing-ui.png"
         />
       </div>