style: run prettier format

Argus-Labs · Mar 4, 2024 · 8e0d915 · 8e0d915
1 parent cb1794b
commit 8e0d915
Show file tree

Hide file tree

Showing 37 changed files with 529 additions and 541 deletions.
diff --git a/.eslintrc.cjs b/.eslintrc.cjs
@@ -12,12 +12,9 @@ module.exports = {
   parser: '@typescript-eslint/parser',
   plugins: ['react-refresh'],
   rules: {
-    'react-refresh/only-export-components': [
-      'warn',
-      { allowConstantExport: true },
-    ],
+    'react-refresh/only-export-components': ['warn', { allowConstantExport: true }],
     'react/no-unescaped-entities': 0,
-    '@typescript-eslint/no-explicit-any': 0
+    '@typescript-eslint/no-explicit-any': 0,
   },
   parserOptions: {
     ecmaVersion: 'latest',
@@ -27,7 +24,7 @@ module.exports = {
   },
   settings: {
     react: {
-      version: 'detect'
-    }
-  }
+      version: 'detect',
+    },
+  },
 }
diff --git a/README.md b/README.md
@@ -1,7 +1,9 @@
 # Cardinal Editor
+
 tba...
 
 ## Development
+
 ```shell
 git clone https://github.com/Argus-Labs/cardinal-editor
 cd cardinal-editor

diff --git a/components.json b/components.json
@@ -14,4 +14,4 @@
     "components": "@/components",
     "utils": "@/lib/utils"
   }
-}
+}
diff --git a/index.html b/index.html
@@ -5,10 +5,16 @@
     <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <!-- TODO: change to Argus' brand font (Beausite Classic Web) -->
-    <link rel="preconnect" href="https://fonts.googleapis.com">
-    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
-    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap" rel="stylesheet">
-    <link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500;700&display=swap" rel="stylesheet">
+    <link rel="preconnect" href="https://fonts.googleapis.com" />
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
+    <link
+      href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap"
+      rel="stylesheet"
+    />
+    <link
+      href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500;700&display=swap"
+      rel="stylesheet"
+    />
     <title>Cardinal Editor</title>
   </head>
   <body>

diff --git a/src/components/bottom-bar.tsx b/src/components/bottom-bar.tsx
@@ -1,12 +1,13 @@
-import { useEffect, useRef, useState } from 'react';
-import { ImperativePanelHandle } from 'react-resizable-panels';
-import { ResizablePanel } from './ui/resizable';
-import { Button } from './ui/button';
-import { ChevronsDown, ChevronsUp } from 'lucide-react';
-import { useQuery } from '@tanstack/react-query';
+import { useQuery } from '@tanstack/react-query'
+import { ChevronsDown, ChevronsUp } from 'lucide-react'
+import { useEffect, useRef, useState } from 'react'
+import { ImperativePanelHandle } from 'react-resizable-panels'
+
+import { Button } from '@/components/ui/button'
+import { ResizablePanel } from '@/components/ui/resizable'
 
 export function BottomBar() {
-  const ref = useRef<ImperativePanelHandle>(null);
+  const ref = useRef<ImperativePanelHandle>(null)
   const [collapsed, setCollapsed] = useState(true)
   const { data } = useQuery({ queryKey: ['last-query'], initialData: null })
 

diff --git a/src/components/entity-group-sheets.tsx b/src/components/entity-group-sheets.tsx
@@ -1,26 +1,49 @@
-import { useState } from 'react';
-import { useQuery } from '@tanstack/react-query';
-import { Edit } from 'lucide-react';
+import { useQuery } from '@tanstack/react-query'
+import { Edit } from 'lucide-react'
+import { useState } from 'react'
 
-import { Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger } from '@/components/ui/sheet';
-import { Button } from '@/components/ui/button';
-import { Label } from '@/components/ui/label';
-import { Input } from '@/components/ui/input';
-import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from '@/components/ui/accordion';
-import { Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger } from '@/components/ui/dialog';
-import { useToast } from '@/components/ui/use-toast';
-import { MultiSelect } from '@/components/multi-select';
-import { EntityCard } from '@/components/entity-views';
-import { Entity } from '@/lib/types';
-import { useCardinal } from '@/lib/cardinal-provider';
-import { worldQueryOptions } from '@/lib/query-options';
-import { useConfig } from '@/lib/config-provider';
+import { EntityCard } from '@/components/entity-views'
+import { MultiSelect } from '@/components/multi-select'
+import {
+  Accordion,
+  AccordionContent,
+  AccordionItem,
+  AccordionTrigger,
+} from '@/components/ui/accordion'
+import { Button } from '@/components/ui/button'
+import {
+  Dialog,
+  DialogClose,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+  DialogTrigger,
+} from '@/components/ui/dialog'
+import { Input } from '@/components/ui/input'
+import { Label } from '@/components/ui/label'
+import {
+  Sheet,
+  SheetClose,
+  SheetContent,
+  SheetDescription,
+  SheetFooter,
+  SheetHeader,
+  SheetTitle,
+  SheetTrigger,
+} from '@/components/ui/sheet'
+import { useToast } from '@/components/ui/use-toast'
+import { useCardinal } from '@/lib/cardinal-provider'
+import { useConfig } from '@/lib/config-provider'
+import { worldQueryOptions } from '@/lib/query-options'
+import { Entity } from '@/lib/types'
 
 // TODO: update this when registered components endpoint is done
 const sampleEntity = (components: string[]): Entity => {
   return {
     id: 0,
-    components: components.reduce((acc, c) => ({ ...acc, [c]: { attribute: 'dummy data' } }), {})
+    components: components.reduce((acc, c) => ({ ...acc, [c]: { attribute: 'dummy data' } }), {}),
   }
 }
 
@@ -37,7 +60,7 @@ export function NewEntityGroupSheet() {
 
   const components = data?.components.map((c) => ({ label: c, value: c })) ?? []
   const hasSelectedComponents = selected && selected.length > 0
-  const accordionValue = hasSelectedComponents ? "default" : ""
+  const accordionValue = hasSelectedComponents ? 'default' : ''
 
   const handleClick = (e: React.MouseEvent<HTMLElement>) => {
     if (entityGroupName.length === 0) {
@@ -56,11 +79,11 @@ export function NewEntityGroupSheet() {
     }
     const newEntityGroup = {
       name: entityGroupName,
-      components: selected
+      components: selected,
     }
     setConfig({ ...config, entityGroups: [...config.entityGroups, newEntityGroup] })
     toast({
-      title: 'Successfully created entity group'
+      title: 'Successfully created entity group',
     })
   }
 
@@ -104,9 +127,7 @@ export function NewEntityGroupSheet() {
                 <AccordionItem value="default" className="border-0 space-y-2">
                   <AccordionTrigger className="py-2 text-sm">Sample entities</AccordionTrigger>
                   <AccordionContent>
-                    {hasSelectedComponents && (
-                      <EntityCard entity={sampleEntity(selected)} />
-                    )}
+                    {hasSelectedComponents && <EntityCard entity={sampleEntity(selected)} />}
                   </AccordionContent>
                 </AccordionItem>
               </Accordion>
@@ -125,8 +146,8 @@ export function NewEntityGroupSheet() {
 
 interface EditEntityGroupProps {
   entityGroup: {
-    name: string,
-    components: string[],
+    name: string
+    components: string[]
   }
 }
 
@@ -143,7 +164,7 @@ export function EditEntityGroupSheet({ entityGroup }: EditEntityGroupProps) {
 
   const components = data?.components.map((c) => ({ label: c, value: c })) ?? []
   const hasSelectedComponents = selected && selected.length > 0
-  const accordionValue = hasSelectedComponents ? "default" : ""
+  const accordionValue = hasSelectedComponents ? 'default' : ''
 
   const handleEdit = (e: React.MouseEvent<HTMLElement>) => {
     if (entityGroupName.length === 0) {
@@ -164,20 +185,20 @@ export function EditEntityGroupSheet({ entityGroup }: EditEntityGroupProps) {
       if (eg.name !== entityGroup.name) return eg
       return {
         name: entityGroupName,
-        components: selected
+        components: selected,
       }
     })
     setConfig({ ...config, entityGroups: newEntityGroups })
     toast({
-      title: 'Successfully updated entity group'
+      title: 'Successfully updated entity group',
     })
   }
   const handleDelete = () => {
     const newEntityGroups = config.entityGroups.filter((eg) => eg.name !== entityGroupName)
     setConfig({ ...config, entityGroups: newEntityGroups })
     setOpen(false)
     toast({
-      title: 'Successfully deleted entity group'
+      title: 'Successfully deleted entity group',
     })
   }
 
@@ -219,9 +240,7 @@ export function EditEntityGroupSheet({ entityGroup }: EditEntityGroupProps) {
                 <AccordionItem value="default" className="border-0 space-y-2">
                   <AccordionTrigger className="py-2 text-sm">Sample entities</AccordionTrigger>
                   <AccordionContent>
-                    {hasSelectedComponents && (
-                      <EntityCard entity={sampleEntity(selected)} />
-                    )}
+                    {hasSelectedComponents && <EntityCard entity={sampleEntity(selected)} />}
                   </AccordionContent>
                 </AccordionItem>
               </Accordion>
@@ -245,7 +264,9 @@ export function EditEntityGroupSheet({ entityGroup }: EditEntityGroupProps) {
                       <Button variant="outline">Cancel</Button>
                     </DialogClose>
                     <DialogClose asChild>
-                      <Button variant="destructive" onClick={handleDelete}>Delete</Button>
+                      <Button variant="destructive" onClick={handleDelete}>
+                        Delete
+                      </Button>
                     </DialogClose>
                   </DialogFooter>
                 </DialogContent>

diff --git a/src/components/entity-views.tsx b/src/components/entity-views.tsx
@@ -1,5 +1,10 @@
-import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from "@/components/ui/accordion"
-import { Entity } from "@/lib/types"
+import {
+  Accordion,
+  AccordionContent,
+  AccordionItem,
+  AccordionTrigger,
+} from '@/components/ui/accordion'
+import { Entity } from '@/lib/types'
 
 interface EntityCardsListProps {
   entities: Entity[]
@@ -25,9 +30,7 @@ export function EntityCard({ entity }: EntityCardProps) {
   return (
     <>
       <div className="3xl:min-w-96 bg-background border border-border rounded-lg font-mono text-sm">
-        <div className="px-3 py-2 font-bold border-b border-border">
-          Entity {entity.id}
-        </div>
+        <div className="px-3 py-2 font-bold border-b border-border">Entity {entity.id}</div>
         <div className="px-3 py-2 space-y-2">
           {Object.keys(entity.components).map((name) => (
             <ComponentDetails key={name} name={name} component={entity.components[name]} />
@@ -44,9 +47,7 @@ export function EntityList({ entities }: EntityCardsListProps) {
       <Accordion type="multiple" className="font-mono space-y-1">
         {entities.map((entity) => (
           <AccordionItem key={entity.id} value={entity.id.toString()} className="border-0">
-            <AccordionTrigger
-              className="px-3 py-2 border border-border rounded-lg data-[state=open]:rounded-b-none bg-background font-bold text-sm"
-            >
+            <AccordionTrigger className="px-3 py-2 border border-border rounded-lg data-[state=open]:rounded-b-none bg-background font-bold text-sm">
               Entity {entity.id}
             </AccordionTrigger>
             <AccordionContent
@@ -72,15 +73,19 @@ interface ComponentDetailsProps {
 // TODO: add case for object types (arrays are included as objects too)
 const formatAttribute = (attr: any): React.ReactNode => {
   switch (typeof attr) {
-    case 'string': return <span className="text-green-500">{`"${attr}"`}</span>
-    case 'number': return <span className="text-orange-500">{attr}</span>
-    case 'boolean': return <span className="text-blue-500">{attr}</span>
-    default: return <span>{attr}</span>
+    case 'string':
+      return <span className="text-green-500">{`"${attr}"`}</span>
+    case 'number':
+      return <span className="text-orange-500">{attr}</span>
+    case 'boolean':
+      return <span className="text-blue-500">{attr}</span>
+    default:
+      return <span>{attr}</span>
   }
 }
 
 function ComponentDetails({ name, component }: ComponentDetailsProps) {
-  const attributes = Object.keys(component).filter((k) => !k.startsWith("_"))
+  const attributes = Object.keys(component).filter((k) => !k.startsWith('_'))
 
   return (
     // 0.8125rem / 13px since the default sizes are too small/big
-Original file line number
+Diff line change
@@ Expand Up / @@ -14,4 +14,4 @@ @@
         "components": "@/components",
         "utils": "@/lib/utils"
       }
-    }
+    }