chore: format codebase using @prettier

Author: ladunjexa

.eslintrc.json

@@ -1,9 +1,4 @@
 {
-  "extends": [
-    "next/core-web-vitals",
-    "standard",
-    "plugin:tailwindcss/recommended",
-    "prettier"
-  ],
+  "extends": ["next/core-web-vitals", "standard", "plugin:tailwindcss/recommended", "prettier"],
   "ignorePatterns": ["/components/ui/*"]
 }

.prettierignore

@@ -0,0 +1,3 @@
+/.next
+/.git
+node_modules

app/Room.tsx

@@ -20,9 +20,7 @@ export function Room({ children }: { children: ReactNode }) {
         canvasObjects: new LiveMap(),
       }}
     >
-      <ClientSideSuspense fallback={<Loader />}>
-        {() => children}
-      </ClientSideSuspense>
+      <ClientSideSuspense fallback={<Loader />}>{() => children}</ClientSideSuspense>
     </RoomProvider>
   );
 }

app/api/liveblocks/auth.ts

@@ -22,9 +22,7 @@ export default async function auth(req: NextApiRequest, res: NextApiResponse) {
       color: COLORS[Math.floor(Math.random() * COLORS.length)],
 
       // Uncomment below and refresh to see with avatar graphics
-      avatar: `https://liveblocks.io/avatars/avatar-${Math.floor(
-        Math.random() * 30
-      )}.png`,
+      avatar: `https://liveblocks.io/avatars/avatar-${Math.floor(Math.random() * 30)}.png`,
     },
   });
 

app/globals.css

@@ -5,7 +5,9 @@
 @import "@liveblocks/react-comments/styles.css";
 
 * {
-  font-family: work sans, sans-serif;
+  font-family:
+    work sans,
+    sans-serif;
 }
 
 body {

app/layout.tsx

@@ -1,10 +1,11 @@
+import React from "react";
 import type { Metadata } from "next";
-import { Work_Sans } from "next/font/google";
+import { Work_Sans as WorkSans } from "next/font/google";
 
 import "./globals.css";
 import { Room } from "./Room";
 
-const workSans = Work_Sans({
+const workSans = WorkSans({
   subsets: ["latin"],
   variable: "--font-work-sans",
   weight: ["400", "600", "700"],

app/page.tsx

@@ -20,7 +20,6 @@ import {
 } from "@/lib/canvas";
 import { ActiveElement, Attributes } from "@/types";
 import { useMutation, useRedo, useStorage, useUndo } from "@/liveblocks.config";
-import { LiveMap } from "@liveblocks/client";
 import { defaultNavElement } from "@/constants";
 import { handleDelete, handleKeyDown } from "@/lib/key-events";
 import { handleImageUpload } from "@/lib/shapes";
@@ -38,7 +37,7 @@ export default function Home() {
   const imageInputRef = useRef<HTMLInputElement | null>(null);
   const isEditingRef = useRef<boolean>(false);
 
-  const canvasObjects = useStorage((root) => root.canvasObjects);
+  const canvasObjects = useStorage(root => root.canvasObjects);
 
   const [elementAttributes, setElementAttributes] = useState<Attributes>({
     width: "",
@@ -76,7 +75,7 @@ export default function Home() {
 
     const entries = Array.from(canvasObjects.entries());
 
-    for (const [key, value] of entries) {
+    for (const [key] of entries) {
       canvasObjects.delete(key);
     }
 

components/comments/comments-overlay.tsx

@@ -33,13 +33,9 @@ export const CommentsOverlay = () => {
   return (
     <div>
       {threads
-        .filter((thread) => !thread.metadata.resolved)
-        .map((thread) => (
-          <OverlayThread
-            key={thread.id}
-            thread={thread}
-            maxZIndex={maxZIndex}
-          />
+        .filter(thread => !thread.metadata.resolved)
+        .map(thread => (
+          <OverlayThread key={thread.id} thread={thread} maxZIndex={maxZIndex} />
         ))}
     </div>
   );

components/comments/comments.tsx

@@ -5,7 +5,5 @@ import { ClientSideSuspense } from "@liveblocks/react";
 import { CommentsOverlay } from "@/components/comments/comments-overlay";
 
 export const Comments = () => (
-  <ClientSideSuspense fallback={null}>
-    {() => <CommentsOverlay />}
-  </ClientSideSuspense>
+  <ClientSideSuspense fallback={null}>{() => <CommentsOverlay />}</ClientSideSuspense>
 );

components/comments/new-thread-cursor.tsx

@@ -73,7 +73,7 @@ const NewThreadCursor = ({ display }: { display: boolean }) => {
     // Portal.Root is used to render a component outside of its parent component
     <Portal.Root>
       <div
-        className="pointer-events-none fixed left-0 top-0 h-9 w-9 cursor-grab select-none rounded-bl-full rounded-br-full rounded-tl-md rounded-tr-full bg-white shadow-2xl"
+        className="pointer-events-none fixed left-0 top-0 size-9 cursor-grab select-none rounded-r-full rounded-bl-full rounded-tl-md bg-white shadow-2xl"
         style={{
           transform: `translate(${coords.x}px, ${coords.y}px)`,
         }}