Socials.svelte: split data and model

src/routes/_social/Socials.svelte

@@ -1,18 +1,6 @@
 <script
   lang="ts">
-  import SocialsMenu from "./Socials";
-
-  const socials = SocialsMenu([
-    "Instagram",
-    "Facebook",
-    "Substack",
-    "GitHub",
-    "YouTube",
-    "Spotify",
-    "SoundCloud",
-    "Duolingo",
-    "LinkedIn",
-  ]);
+  import { socials } from "./Socials";
 </script>
 
 <style

src/routes/_social/Socials.ts

@@ -1,31 +1,13 @@
-import { SocialButton } from "./button";
-import { SocialManifest } from "./manifest";
-import { SocialIcons } from "./lib";
-
-export default function (apps: readonly SocialApp[]) {
-  if (new Set(apps).size !== apps.length)
-    throw new RangeError("Duplicate social menu buttons");
-
-  function assemble(app: SocialApp) {
-    const {
-      host,
-      username = "",
-      path: {
-        pre = "",
-        post = "",
-      } = {},
-    } = SocialManifest[app],
-    icon = SocialIcons[app];
-
-    return new SocialButton(
-      app,
-      host,
-      username,
-      pre,
-      post,
-      icon,
-    );
-  }
-
-  return apps.map(app => assemble(app));
-}
+import menu from "./menu";
+
+export const socials = menu([
+  "Instagram",
+  "Facebook",
+  "Substack",
+  "GitHub",
+  "YouTube",
+  "Spotify",
+  "SoundCloud",
+  "Duolingo",
+  "LinkedIn",
+]);

src/routes/_social/manifest/index.ts → src/routes/_social/apps/index.ts

@@ -1,4 +1,6 @@
-export const SocialManifest: Record<
+export { icons } from "./lib";
+
+export const manifest: Record<
   SocialApp,
   {
     host: string;

src/routes/_social/lib/index.ts → src/routes/_social/apps/lib.ts

@@ -8,7 +8,7 @@ import Spotify from "$lib/images/socials/spotify.svg";
 import Substack from "$lib/images/socials/substack.svg";
 import YouTube from "$lib/images/socials/youtube.svg";
 
-export const SocialIcons: Record<SocialApp, string> = {
+export const icons: Record<SocialApp, string> = {
   Duolingo,
   Facebook,
   GitHub,

src/routes/_social/button/index.ts → src/routes/_social/menu/button.ts

@@ -1,4 +1,4 @@
-export class SocialButton {
+export class Button {
   public readonly url: string;
 
   constructor(

src/routes/_social/menu/index.ts

@@ -0,0 +1,29 @@
+import { Button } from "./button";
+import { manifest, icons } from "../apps";
+
+export function menu(apps: readonly SocialApp[]) {
+  if (new Set(apps).size !== apps.length)
+    throw new RangeError("Duplicate social menu buttons");
+
+  function assemble(app: SocialApp) {
+    const {
+      host,
+      username = "",
+      path: {
+        pre = "",
+        post = "",
+      } = {},
+    } = manifest[app],
+
+    return new Button(
+      app,
+      host,
+      username,
+      pre,
+      post,
+      icons[app],
+    );
+  }
+
+  return apps.map(app => assemble(app));
+}