fix: refactor code by formatting the components and types

Your Name · Your Name · commit 5043d74f9e02 · 2026-04-23T12:37:16.000+05:30
diff --git a/app/components/Compare/FacetSelector.vue b/app/components/Compare/FacetSelector.vue
@@ -106,7 +106,11 @@ function deselectAllFacet(category: string) {
           :key="facet.id"
           :title="facet.comingSoon ? $t('compare.facets.coming_soon') : facet.description"
           class="inline-flex items-center gap-1 px-1.5 rounded border transition-colors text-fg-subtle bg-bg-subtle border-border-subtle hover:(text-fg-muted border-border) has-[:checked]:(text-fg-muted bg-fg/10 border-fg/20 hover:(bg-fg/20 text-fg/50)) has-[:focus-visible]:(outline outline-accent/70)"
-          :class="facet.comingSoon ? 'cursor-not-allowed text-fg-subtle/50 bg-bg-subtle border-border-subtle hover:(text-fg-subtle/50 border-border-subtle)' : 'cursor-pointer'"
+          :class="
+            facet.comingSoon
+              ? 'cursor-not-allowed text-fg-subtle/50 bg-bg-subtle border-border-subtle hover:(text-fg-subtle/50 border-border-subtle)'
+              : 'cursor-pointer'
+          "
         >
           <input
             type="checkbox"
diff --git a/app/composables/useKeytraceProfile.ts b/app/composables/useKeytraceProfile.ts
@@ -1,54 +1,54 @@
-import type { KeytraceAccount, KeytraceResponse } from "#shared/types/keytrace";
+import type { KeytraceAccount, KeytraceResponse } from '#shared/types/keytrace'
 
-const statusPriority: Record<KeytraceAccount["status"], number> = {
+const statusPriority: Record<KeytraceAccount['status'], number> = {
   verified: 0,
   unverified: 1,
   stale: 2,
   failed: 3,
-};
+}
 
 export function useKeytraceProfile(domain: MaybeRefOrGetter<string>) {
   const asyncData = useFetch<KeytraceResponse>(
     () => `/api/keytrace/${encodeURIComponent(toValue(domain))}`,
     {
       default: () => ({
         profile: {
-          name: "",
-          avatar: "",
-          description: "",
+          name: '',
+          avatar: '',
+          description: '',
         },
         accounts: [],
       }),
     },
-  );
+  )
 
-  const profile = computed(() => asyncData.data.value?.profile);
-  const accounts = computed(() => asyncData.data.value?.accounts ?? []);
+  const profile = computed(() => asyncData.data.value?.profile)
+  const accounts = computed(() => asyncData.data.value?.accounts ?? [])
 
   const sortedAccounts = computed(() =>
     [...accounts.value].sort((a, b) => {
-      const statusSort = statusPriority[a.status] - statusPriority[b.status];
+      const statusSort = statusPriority[a.status] - statusPriority[b.status]
       if (statusSort !== 0) {
-        return statusSort;
+        return statusSort
       }
 
-      return a.platform.localeCompare(b.platform);
+      return a.platform.localeCompare(b.platform)
     }),
-  );
+  )
 
   const verifiedAccounts = computed(() =>
-    sortedAccounts.value.filter((account) => account.status === "verified"),
-  );
+    sortedAccounts.value.filter(account => account.status === 'verified'),
+  )
 
   const nonVerifiedAccounts = computed(() =>
-    sortedAccounts.value.filter((account) => account.status !== "verified"),
-  );
+    sortedAccounts.value.filter(account => account.status !== 'verified'),
+  )
 
   return {
     profile,
     accounts: sortedAccounts,
     verifiedAccounts,
     nonVerifiedAccounts,
     loading: asyncData.pending,
-  };
+  }
 }
diff --git a/server/api/keytrace/[domain].ts b/server/api/keytrace/[domain].ts
@@ -1,68 +1,65 @@
-import type { KeytraceResponse } from "#shared/types/keytrace";
+import type { KeytraceResponse } from '#shared/types/keytrace'
 
 const MOCK_KEYTRACE_PROFILES: Record<string, KeytraceResponse> = {
-  "npmx.dev": {
+  'npmx.dev': {
     profile: {
-      name: "npmx Team",
-      avatar: "https://api.dicebear.com/9.x/shapes/svg?seed=npmx",
+      name: 'npmx Team',
+      avatar: 'https://api.dicebear.com/9.x/shapes/svg?seed=npmx',
       banner:
-        "https://images.unsplash.com/photo-1515879218367-8466d910aaa4?auto=format&fit=crop&w=1400&q=80",
-      description:
-        "Open source developers building better tooling around package discovery.",
+        'https://images.unsplash.com/photo-1515879218367-8466d910aaa4?auto=format&fit=crop&w=1400&q=80',
+      description: 'Open source developers building better tooling around package discovery.',
     },
     accounts: [
       {
-        platform: "github",
-        username: "npmx-dev",
-        displayName: "npmx-dev",
-        avatar: "https://avatars.githubusercontent.com/u/178563400?v=4",
-        url: "https://github.com/npmx-dev",
-        status: "verified",
-        proofMethod: "github",
-        addedAt: "2026-03-10T12:00:00.000Z",
-        lastCheckedAt: "2026-04-20T09:30:00.000Z",
+        platform: 'github',
+        username: 'npmx-dev',
+        displayName: 'npmx-dev',
+        avatar: 'https://avatars.githubusercontent.com/u/178563400?v=4',
+        url: 'https://github.com/npmx-dev',
+        status: 'verified',
+        proofMethod: 'github',
+        addedAt: '2026-03-10T12:00:00.000Z',
+        lastCheckedAt: '2026-04-20T09:30:00.000Z',
       },
       {
-        platform: "npm",
-        username: "npmx",
-        displayName: "npmx",
-        avatar: "https://api.dicebear.com/9.x/identicon/svg?seed=npmx",
-        url: "https://www.npmjs.com/~npmx",
-        status: "stale",
-        proofMethod: "npm",
-        addedAt: "2026-02-18T15:20:00.000Z",
-        lastCheckedAt: "2026-03-05T08:00:00.000Z",
-        failureReason: "Proof has not been re-verified recently.",
+        platform: 'npm',
+        username: 'npmx',
+        displayName: 'npmx',
+        avatar: 'https://api.dicebear.com/9.x/identicon/svg?seed=npmx',
+        url: 'https://www.npmjs.com/~npmx',
+        status: 'stale',
+        proofMethod: 'npm',
+        addedAt: '2026-02-18T15:20:00.000Z',
+        lastCheckedAt: '2026-03-05T08:00:00.000Z',
+        failureReason: 'Proof has not been re-verified recently.',
       },
       {
-        platform: "mastodon",
-        username: "@npmx@fosstodon.org",
-        displayName: "npmx",
-        avatar:
-          "https://api.dicebear.com/9.x/identicon/svg?seed=fosstodon-npmx",
-        url: "https://fosstodon.org/@npmx",
-        status: "failed",
-        proofMethod: "mastodon",
-        addedAt: "2026-01-22T11:40:00.000Z",
-        lastCheckedAt: "2026-04-19T22:15:00.000Z",
-        failureReason:
-          "Linked proof URL could not be resolved during verification.",
+        platform: 'mastodon',
+        username: '@npmx@fosstodon.org',
+        displayName: 'npmx',
+        avatar: 'https://api.dicebear.com/9.x/identicon/svg?seed=fosstodon-npmx',
+        url: 'https://fosstodon.org/@npmx',
+        status: 'failed',
+        proofMethod: 'mastodon',
+        addedAt: '2026-01-22T11:40:00.000Z',
+        lastCheckedAt: '2026-04-19T22:15:00.000Z',
+        failureReason: 'Linked proof URL could not be resolved during verification.',
       },
     ],
   },
-  "empty.dev": {
+  'empty.dev': {
     profile: {
-      name: "Empty Developer",
-      avatar: "https://api.dicebear.com/9.x/initials/svg?seed=empty.dev",
-      description: "A profile with no linked accounts yet.",
+      name: 'Empty Developer',
+      avatar: 'https://api.dicebear.com/9.x/initials/svg?seed=empty.dev',
+      description: 'A profile with no linked accounts yet.',
     },
     accounts: [],
   },
-};
+}
 
 function domainToDisplayName(domain: string): string {
-  const firstSegment = domain.split(".")[0] || domain;
-  return firstSegment.charAt(0).toUpperCase() + firstSegment.slice(1);
+  const firstSegment = domain.split('.')[0] || domain
+  return firstSegment.charAt(0).toUpperCase() + firstSegment.slice(1)
 }
 
 function buildFallbackProfile(domain: string): KeytraceResponse {
@@ -74,52 +71,52 @@ function buildFallbackProfile(domain: string): KeytraceResponse {
     },
     accounts: [
       {
-        platform: "github",
+        platform: 'github',
         username: domain,
         displayName: domain,
         avatar: `https://api.dicebear.com/9.x/identicon/svg?seed=github-${encodeURIComponent(domain)}`,
         url: `https://github.com/${domain}`,
-        status: "verified",
-        proofMethod: "github",
-        addedAt: "2026-04-01T10:00:00.000Z",
-        lastCheckedAt: "2026-04-21T10:00:00.000Z",
+        status: 'verified',
+        proofMethod: 'github',
+        addedAt: '2026-04-01T10:00:00.000Z',
+        lastCheckedAt: '2026-04-21T10:00:00.000Z',
       },
       {
-        platform: "npm",
+        platform: 'npm',
         username: domain,
         displayName: domain,
         avatar: `https://api.dicebear.com/9.x/identicon/svg?seed=npm-${encodeURIComponent(domain)}`,
         url: `https://www.npmjs.com/~${domain}`,
-        status: "unverified",
-        proofMethod: "npm",
-        addedAt: "2026-04-01T10:00:00.000Z",
-        lastCheckedAt: "2026-04-01T10:00:00.000Z",
-        failureReason: "Proof exists but has not been verified yet.",
+        status: 'unverified',
+        proofMethod: 'npm',
+        addedAt: '2026-04-01T10:00:00.000Z',
+        lastCheckedAt: '2026-04-01T10:00:00.000Z',
+        failureReason: 'Proof exists but has not been verified yet.',
       },
       {
-        platform: "mastodon",
+        platform: 'mastodon',
         username: `@${domain}@mastodon.social`,
         displayName: domain,
         avatar: `https://api.dicebear.com/9.x/identicon/svg?seed=mastodon-${encodeURIComponent(domain)}`,
         url: `https://mastodon.social/@${encodeURIComponent(domain)}`,
-        status: "stale",
-        proofMethod: "mastodon",
-        addedAt: "2026-04-01T10:00:00.000Z",
-        lastCheckedAt: "2026-04-08T10:00:00.000Z",
-        failureReason: "Verification check is out of date.",
+        status: 'stale',
+        proofMethod: 'mastodon',
+        addedAt: '2026-04-01T10:00:00.000Z',
+        lastCheckedAt: '2026-04-08T10:00:00.000Z',
+        failureReason: 'Verification check is out of date.',
       },
     ],
-  };
+  }
 }
 
-export default defineEventHandler((event) => {
-  const domain = getRouterParam(event, "domain")?.trim().toLowerCase();
+export default defineEventHandler(event => {
+  const domain = getRouterParam(event, 'domain')?.trim().toLowerCase()
   if (!domain) {
     throw createError({
       statusCode: 400,
-      message: "Domain is required",
-    });
+      message: 'Domain is required',
+    })
   }
 
-  return MOCK_KEYTRACE_PROFILES[domain] ?? buildFallbackProfile(domain);
-});
+  return MOCK_KEYTRACE_PROFILES[domain] ?? buildFallbackProfile(domain)
+})
diff --git a/server/api/keytrace/reverify.post.ts b/server/api/keytrace/reverify.post.ts
@@ -1,30 +1,27 @@
-import type {
-  KeytraceReverifyRequest,
-  KeytraceReverifyResponse,
-} from "#shared/types/keytrace";
+import type { KeytraceReverifyRequest, KeytraceReverifyResponse } from '#shared/types/keytrace'
 
-export default defineEventHandler(async (event) => {
-  const body = await readBody<KeytraceReverifyRequest>(event);
+export default defineEventHandler(async event => {
+  const body = await readBody<KeytraceReverifyRequest>(event)
 
-  const platform = body?.platform?.trim().toLowerCase();
-  const username = body?.username?.trim();
+  const platform = body?.platform?.trim().toLowerCase()
+  const username = body?.username?.trim()
 
   if (!platform || !username) {
     throw createError({
       statusCode: 400,
-      message: "platform and username are required",
-    });
+      message: 'platform and username are required',
+    })
   }
 
-  const lastCheckedAt = new Date().toISOString();
+  const lastCheckedAt = new Date().toISOString()
 
   // TODO: Implement per-platform proof verification for KeytraceReverifyResponse
   // construction here (including mastodon and npm short-username logic), ideally
   // via a verifyProofForPlatform(platform, username, proofData) helper.
   const response: KeytraceReverifyResponse = {
-    status: "unverified",
+    status: 'unverified',
     lastCheckedAt,
-    failureReason: "Proof verification is not implemented yet.",
-  };
-  return response;
-});
+    failureReason: 'Proof verification is not implemented yet.',
+  }
+  return response
+})
diff --git a/shared/types/keytrace.ts b/shared/types/keytrace.ts
@@ -1,50 +1,40 @@
 export type KeytraceProfile = {
-  name: string;
-  avatar: string;
-  banner?: string;
-  description: string;
-};
+  name: string
+  avatar: string
+  banner?: string
+  description: string
+}
 
-export type KeytraceVerificationStatus =
-  | "verified"
-  | "unverified"
-  | "stale"
-  | "failed";
+export type KeytraceVerificationStatus = 'verified' | 'unverified' | 'stale' | 'failed'
 
-export type KeytraceProofMethod =
-  | "dns"
-  | "github"
-  | "npm"
-  | "mastodon"
-  | "pgp"
-  | "other";
+export type KeytraceProofMethod = 'dns' | 'github' | 'npm' | 'mastodon' | 'pgp' | 'other'
 
 export type KeytraceAccount = {
-  platform: string;
-  username: string;
-  displayName?: string;
-  avatar?: string;
-  url?: string;
-  status: KeytraceVerificationStatus;
-  proofMethod: KeytraceProofMethod;
-  addedAt: string;
-  lastCheckedAt: string;
-  failureReason?: string;
-};
+  platform: string
+  username: string
+  displayName?: string
+  avatar?: string
+  url?: string
+  status: KeytraceVerificationStatus
+  proofMethod: KeytraceProofMethod
+  addedAt: string
+  lastCheckedAt: string
+  failureReason?: string
+}
 
 export type KeytraceResponse = {
-  profile: KeytraceProfile;
-  accounts: KeytraceAccount[];
-};
+  profile: KeytraceProfile
+  accounts: KeytraceAccount[]
+}
 
 export type KeytraceReverifyRequest = {
-  platform: string;
-  username: string;
-  url?: string;
-};
+  platform: string
+  username: string
+  url?: string
+}
 
 export type KeytraceReverifyResponse = {
-  status: KeytraceVerificationStatus;
-  lastCheckedAt: string;
-  failureReason?: string;
-};
+  status: KeytraceVerificationStatus
+  lastCheckedAt: string
+  failureReason?: string
+}
