refactor: 🔥 Remove more old code

README.md

@@ -23,7 +23,7 @@
 - [x] Alt text support everywhere
 - [x] Media uploads
 - [x] WCAG 2.2 AAA compliance
-  - Testing is automated and may not catch all issues, please report any accessibility issues you find.
+  - Testing is automated and will not catch all issues, please report any accessibility issues you find.
 - [x] Settings
 - [x] Profile editing
 
@@ -45,13 +45,13 @@ Other browsers may work, but are not guaranteed to.
 
 ## Performance
 
-### JavaScript Bloat
+### JavaScript
 
-The **total** JavaScript bundle size is less than `900 kB`, but this is made even smaller by the fact that the bundle is split into multiple files, and only the necessary files are loaded on each page.
+The **total** JavaScript bundle size is less than `1000 kB`, but this is made even smaller by the fact that the bundle is split into multiple files, and only the necessary files are loaded on each page.
 
 ### Benchmarks
 
-Benchmarks are due to be conducted soon™.
+Soon™.
 
 ## Installation
 

app.vue

@@ -17,7 +17,6 @@
 import "~/styles/theme.css";
 import "~/styles/index.css";
 import { convert } from "html-to-text";
-import "iconify-icon";
 import ConfirmationModal from "./components/modals/confirm.vue";
 import { Toaster } from "./components/ui/sonner";
 import { type EnumSetting, SettingIds } from "./settings";

components/inputs/field-error.vue

@@ -1,9 +0,0 @@
-<template>
-    <p class="text-base/6 disabled:opacity-50 sm:text-sm/6 text-red-500">
-        <slot />
-    </p>
-</template>
-
-<script lang="ts" setup>
-
-</script>

components/inputs/field.vue

@@ -1,9 +0,0 @@
-<template>
-    <div class="mt-3 flex flex-col gap-2">
-        <slot />
-    </div>
-</template>
-
-<script lang="ts" setup>
-
-</script>

components/inputs/label-and-error.vue

@@ -1,9 +0,0 @@
-<template>
-    <div class="flex flex-col gap-1">
-        <slot />
-    </div>
-</template>
-
-<script lang="ts" setup>
-
-</script>

components/inputs/label.vue

@@ -1,20 +0,0 @@
-<template>
-    <div class="flex flex-row justify-between">
-        <label v-bind="$attrs"
-            class="select-none font-semibold text-base/6 disabled:opacity-50 sm:text-sm/6 text-gray-100">
-            <slot />
-        </label>
-        <div :id="`${$attrs.for}-label-slot`"></div>
-    </div>
-</template>
-
-<script lang="ts" setup>
-import type { LabelHTMLAttributes } from "vue";
-
-interface Props extends /* @vue-ignore */ LabelHTMLAttributes {}
-
-defineOptions({
-    inheritAttrs: false,
-});
-const props = defineProps<Props>();
-</script>

components/inputs/password-input.vue

@@ -1,73 +0,0 @@
-<template>
-    <TextInput @input="e => content = (e.target as HTMLInputElement).value" v-bind="$attrs, $props" v-model="content"
-        :type="showPassword ? 'text' : 'password'" :spellcheck="false" />
-    <Progress.Root class="flex flex-row items-center gap-x-2" v-if="showStrength">
-        <Progress.Label class="text-xs text-gray-300 font-semibold w-12">
-            {{ text }}
-        </Progress.Label>
-        <Progress.Track class="rounded-sm w-full h-2 duration-300" :style="{
-            backgroundColor: color,
-        }">
-            <Progress.Range />
-        </Progress.Track>
-    </Progress.Root>
-    <Teleport :to="`#${$attrs.id}-label-slot`" v-if="teleport">
-        <button type="button" @click="showPassword = !showPassword"
-            class="text-xs ml-auto block mt-2 font-semibold text-gray-400">
-            <iconify-icon icon="tabler:eye" class="size-4 align-text-top" height="none" />
-            {{ showPassword ? "Hide password" : "Show password" }}
-        </button>
-    </Teleport>
-</template>
-
-<script lang="ts" setup>
-import { Progress } from "@ark-ui/vue";
-import { passwordStrength } from "~/utils/passwords";
-const showPassword = ref(false);
-const content = ref("");
-
-import type { InputHTMLAttributes } from "vue";
-import TextInput from "./text-input.vue";
-
-interface Props extends /* @vue-ignore */ InputHTMLAttributes {
-    isInvalid?: boolean;
-    showStrength?: boolean;
-}
-
-defineOptions({
-    inheritAttrs: false,
-});
-defineProps<Props>();
-
-const teleport = ref(false);
-const strength = computed(() => passwordStrength(content.value ?? ""));
-const text = computed(() => {
-    if (strength.value < 6) {
-        return "Weak";
-    }
-    if (strength.value < 7) {
-        return "Fair";
-    }
-    if (strength.value < 11) {
-        return "Good";
-    }
-    return "Strong";
-});
-const color = computed(() => {
-    if (strength.value < 6) {
-        return "red";
-    }
-    if (strength.value < 7) {
-        return "pink";
-    }
-    if (strength.value < 11) {
-        return "yellow";
-    }
-    return "green";
-});
-
-onMounted(() => {
-    // Workaround to make sure the teleport is rendered after the parent component
-    teleport.value = true;
-});
-</script>

composables/EventBus.ts

@@ -1,12 +1,7 @@
-import type { createToaster } from "@ark-ui/vue";
 import type { Account, Attachment, Status } from "@versia/client/types";
 import mitt from "mitt";
 import type { Identity } from "./Identities";
 
-export type NotificationEvent = Parameters<
-    ReturnType<typeof createToaster>["create"]
->[0];
-
 type ApplicationEvents = {
     "note:reply": Status;
     "note:delete": Status;
@@ -26,7 +21,6 @@ type ApplicationEvents = {
     "composer:close": undefined;
     "account:report": Account;
     "account:update": Account;
-    "notification:new": NotificationEvent;
     "attachment:view": Attachment;
     "identity:change": Identity;
     error: {

package.json

@@ -29,7 +29,6 @@
         "check": "bunx tsc -p ."
     },
     "dependencies": {
-        "@ark-ui/vue": "^4.4.2",
         "@nuxt/fonts": "^0.10.2",
         "@nuxtjs/color-mode": "3.5.2",
         "@tailwindcss/typography": "^0.5.15",
@@ -43,7 +42,6 @@
         "embla-carousel-vue": "^8.5.1",
         "fastest-levenshtein": "^1.0.16",
         "html-to-text": "^9.0.5",
-        "iconify-icon": "^2.1.0",
         "lucide-vue-next": "^0.464.0",
         "magic-regexp": "^0.8.0",
         "mitt": "^3.0.1",