style: 🎨 Format code with Biome

app/components/composer/composer.vue

@@ -1,69 +1,105 @@
 <template>
     <div v-if="relation" class="overflow-auto max-h-72">
-        <Note :note="relation.note" :hide-actions="true" :small-layout="true" />
+        <Note :note="relation.note" :hide-actions="true" :small-layout="true"/>
     </div>
 
-
     <InputGroup class="p-1">
-        <InputGroupAddon v-if="store.sensitive" align="block-start" class="pt-3">
-            <Input v-model:model-value="store.contentWarning" placeholder="Put your content warning here" />
+        <InputGroupAddon
+            v-if="store.sensitive"
+            align="block-start"
+            class="pt-3"
+        >
+            <Input
+                v-model:model-value="store.contentWarning"
+                placeholder="Put your content warning here"
+            />
         </InputGroupAddon>
 
-        <EditorContent data-slot="input-group-control" @paste-files="uploadFiles" v-model:content="store.content"
-            v-model:raw-content="store.rawContent" :placeholder="getRandomSplash()"
+        <EditorContent
+            data-slot="input-group-control"
+            @paste-files="uploadFiles"
+            v-model:content="store.content"
+            v-model:raw-content="store.rawContent"
+            :placeholder="getRandomSplash()"
             class=" placeholder:text-muted-foreground flex field-sizing-content min-h-58 w-full px-4 text-base disabled:opacity-50 md:text-sm flex-1 resize-none rounded-none border-0 bg-transparent py-3 shadow-none"
-            :disabled="store.sending" :mode="store.contentType === 'text/html' ? 'rich' : 'plain'" />
+            :disabled="store.sending"
+            :mode="store.contentType === 'text/html' ? 'rich' : 'plain'"
+        />
 
-        <InputGroupAddon v-if="store.files.length > 0" align="block-end" class="overflow-x-auto *:shrink-0">
-            <Files v-model:files="store.files" :composer-key="composerKey" />
+        <InputGroupAddon
+            v-if="store.files.length > 0"
+            align="block-end"
+            class="overflow-x-auto *:shrink-0"
+        >
+            <Files v-model:files="store.files" :composer-key="composerKey"/>
         </InputGroupAddon>
 
         <InputGroupAddon align="block-end">
             <Select v-model:model-value="store.contentType">
-                <SelectTrigger as-child disable-default-classes disable-select-icon>
+                <SelectTrigger
+                    as-child
+                    disable-default-classes
+                    disable-select-icon
+                >
                     <InputGroupButton variant="ghost" size="icon-sm">
-                        <LetterText v-if="store.contentType === 'text/html'" />
-                        <Type v-else />
+                        <LetterText v-if="store.contentType === 'text/html'"/>
+                        <Type v-else/>
                     </InputGroupButton>
                 </SelectTrigger>
                 <SelectContent>
-                    <SelectItem value="text/plain">
-                        Plain text
-                    </SelectItem>
-                    <SelectItem value="text/html">
-                        Rich text
-                    </SelectItem>
+                    <SelectItem value="text/plain">Plain text</SelectItem>
+                    <SelectItem value="text/html">Rich text</SelectItem>
                 </SelectContent>
             </Select>
             <VisibilityPicker v-model:visibility="store.visibility">
-                <InputGroupButton variant="ghost" size="icon-sm" :disabled="store.relation?.type === 'edit'">
-                    <component :is="visibilities[store.visibility].icon" />
+                <InputGroupButton
+                    variant="ghost"
+                    size="icon-sm"
+                    :disabled="store.relation?.type === 'edit'"
+                >
+                    <component :is="visibilities[store.visibility].icon"/>
                 </InputGroupButton>
             </VisibilityPicker>
-            <InputGroupButton variant="ghost" size="icon-sm" @click="fileInput?.click()">
-                <FilePlus2 />
+            <InputGroupButton
+                variant="ghost"
+                size="icon-sm"
+                @click="fileInput?.click()"
+            >
+                <FilePlus2/>
             </InputGroupButton>
             <Toggle size="sm" v-model="store.sensitive">
-                <TriangleAlert />
+                <TriangleAlert/>
             </Toggle>
-            <InputGroupText :class="['ml-auto', charactersLeft < 0 && 'text-destructive']">
+            <InputGroupText
+                :class="['ml-auto', charactersLeft < 0 && 'text-destructive']"
+            >
                 {{ charactersLeft.toLocaleString(getLocale(), {
                     maximumFractionDigits: 2,
                     notation: 'compact',
                     compactDisplay: 'short',
                 }) }}
             </InputGroupText>
-            <Separator orientation="vertical" class="h-4!" />
-            <InputGroupButton variant="default" size="icon-sm" :disabled="store.sending || !store.canSend"
-                @click="send">
-                <Spinner v-if="store.sending" />
-                <ArrowUp v-else />
+            <Separator orientation="vertical" class="h-4!"/>
+            <InputGroupButton
+                variant="default"
+                size="icon-sm"
+                :disabled="store.sending || !store.canSend"
+                @click="send"
+            >
+                <Spinner v-if="store.sending"/>
+                <ArrowUp v-else/>
                 <span class="sr-only">Send</span>
             </InputGroupButton>
         </InputGroupAddon>
     </InputGroup>
 
-    <input type="file" ref="fileInput" @change="uploadFileFromEvent" class="hidden" multiple />
+    <input
+        type="file"
+        ref="fileInput"
+        @change="uploadFileFromEvent"
+        class="hidden"
+        multiple
+    >
 </template>
 
 <script lang="ts" setup>