Files
freno-dev/src/routes/downloads.tsx
Michael Freno 898c891bd5 chore: remediate pygienium audit findings
Dead code: 77 verified-unused exports, files (BackArrow, MenuBars,
cookies.ts, db/create.ts, schemas/comment.ts, security-headers.ts) and
12 unused dependencies removed
Comments: ~370 RESTATE comments stripped across 53 files; 2 verbose
blocks tightened; dead commented-out config removed
Complexity: bulkUpsert extracted into 11 per-entity helpers (CCN 156->~10);
login formHandler split into 3 submitters (CCN 63->~5); account page render
split into 8 section components (CCN 40); updatePost SQL builder rebuilt;
assert*Owned consolidated behind generic assertOwnedBy
Defensive guards: 4 redundant rethrow/nullish guards removed
2026-08-11 13:36:18 -04:00

329 lines
12 KiB
TypeScript

import { PageHead } from "~/components/PageHead";
import { A } from "@solidjs/router";
import { createSignal, onMount, onCleanup, Switch, Match } from "solid-js";
import DownloadOnAppStore from "~/components/icons/DownloadOnAppStore";
import { glitchText } from "~/lib/client-utils";
import { buildSubdomainUrl } from "~/lib/subdomain-url";
import Button from "~/components/ui/Button";
import { useSite } from "~/context/SiteContext";
import LineageDownloadsPage from "./lineage/downloads";
import GazeDownloadsPage from "./gaze/downloads";
import InputHaloDownloadsPage from "./inputhalo/downloads";
function MainDownloadsPage() {
const [LaLText, setLaLText] = createSignal("Life and Lineage");
const [SwAText, setSwAText] = createSignal("Shapes with Abigail!");
const [corkText, setCorkText] = createSignal("Cork");
const [gazeText, setGazeText] = createSignal("Gaze");
const [inputHaloText, setInputHaloText] = createSignal("InputHalo");
const [loadingState, setLoadingState] = createSignal<Record<string, boolean>>(
{
lineage: false,
cork: false,
gaze: false,
"shapes-with-abigail": false,
inputhalo: false
}
);
const download = (assetName: string) => {
// Prevent multiple rapid clicks
if (loadingState()[assetName]) return;
setLoadingState((prev) => ({ ...prev, [assetName]: true }));
import("~/lib/api").then(({ api }) => {
api.downloads.getDownloadUrl
.query({ asset_name: assetName })
.then((data) => {
const url = data.downloadURL;
window.location.href = url;
})
.catch((error) => {
console.error("Download error:", error);
alert("Failed to initiate download. Please try again.");
})
.finally(() => {
setLoadingState((prev) => ({ ...prev, [assetName]: false }));
});
});
};
onMount(() => {
const lalInterval = glitchText(LaLText(), setLaLText);
const swaInterval = glitchText(SwAText(), setSwAText);
const corkInterval = glitchText(corkText(), setCorkText);
const gazeInterval = glitchText(gazeText(), setGazeText);
const inputHaloInterval = glitchText(inputHaloText(), setInputHaloText);
onCleanup(() => {
clearInterval(lalInterval);
clearInterval(swaInterval);
clearInterval(corkInterval);
clearInterval(gazeInterval);
clearInterval(inputHaloInterval);
});
});
return (
<>
<PageHead
title="Downloads"
description="Download InputHalo, Gaze, Life and Lineage, Shapes with Abigail, and Cork. Available on iOS, Android, and macOS."
/>
<div class="bg-base relative min-h-screen overflow-hidden px-4 pt-[15vh] pb-12 md:px-8">
{/* Subtle scanline effect */}
<div class="pointer-events-none absolute inset-0 opacity-5">
<div
class="h-full w-full"
style={{
"background-image":
"repeating-linear-gradient(0deg, transparent, transparent 2px, rgba(0,0,0,0.2) 2px, rgba(0,0,0,0.2) 4px)"
}}
/>
</div>
<div class="relative z-10">
<div class="text-center text-xl italic">
Ordered by date of initial release
</div>
<div class="mx-auto max-w-5xl space-y-16">
{/* InputHalo */}
<div class="border-overlay0 rounded-lg border p-6 md:p-8">
<h2 class="text-text mb-6 font-mono text-2xl">
<span class="text-yellow">{">"}</span>{" "}
<A
href={buildSubdomainUrl("inputhalo")}
class="text-text hover:text-yellow transition-colors"
>
{inputHaloText()}
</A>
</h2>
<div class="flex flex-col gap-8 lg:flex-row lg:flex-wrap lg:justify-around">
<div class="flex flex-col items-center gap-3">
<span class="text-subtext0 font-mono text-sm">
platform: macOS (14.6+)
</span>
<Button
variant="download"
size="lg"
loading={loadingState()["inputhalo"]}
onClick={() => download("inputhalo")}
>
download.dmg
</Button>
</div>
<div class="flex flex-col items-center gap-3">
<span class="text-subtext0 font-mono text-sm">
variant: paid (coming soon)
</span>
<A
class="transition-all duration-200 ease-out hover:scale-105 active:scale-95"
href="https://apps.apple.com/us/app/inputhalo/"
>
<DownloadOnAppStore size={50} />
</A>
</div>
<div class="flex flex-col items-center gap-3">
<span class="text-subtext0 font-mono text-sm">
variant: free (coming soon)
</span>
<A
class="transition-all duration-200 ease-out hover:scale-105 active:scale-95"
href=""
>
<DownloadOnAppStore size={50} />
</A>
</div>
</div>
</div>
{/* Gaze */}
<div class="border-overlay0 rounded-lg border p-6 md:p-8">
<h2 class="text-text mb-6 font-mono text-2xl">
<span class="text-yellow">{">"}</span>{" "}
<A
href={buildSubdomainUrl("gaze")}
class="text-text hover:text-yellow transition-colors"
>
{gazeText()}
</A>
</h2>
<div class="flex flex-col gap-8 lg:flex-row lg:flex-wrap lg:justify-around">
<div class="flex flex-col items-center gap-3">
<span class="text-subtext0 font-mono text-sm">
platform: macOS (14.6+)
</span>
<Button
variant="download"
size="lg"
loading={loadingState()["gaze"]}
onClick={() => download("gaze")}
>
download.dmg
</Button>
</div>
<div class="flex flex-col items-center gap-3">
<span class="text-subtext0 font-mono text-sm">
variant: paid
</span>
<A
class="transition-all duration-200 ease-out hover:scale-105 active:scale-95"
href="https://apps.apple.com/us/app/gaze/id6757759498"
>
<DownloadOnAppStore size={50} />
</A>
</div>
<div class="flex flex-col items-center gap-3">
<span class="text-subtext0 font-mono text-sm">
variant: free (coming soon)
</span>
<A
class="transition-all duration-200 ease-out hover:scale-105 active:scale-95"
href=""
>
<DownloadOnAppStore size={50} />
</A>
</div>
</div>
</div>
<div class="border-overlay0 rounded-lg border p-6 md:p-8">
<h2 class="text-text mb-6 font-mono text-2xl">
<span class="text-yellow">{">"}</span>{" "}
<A
href={buildSubdomainUrl("lineage")}
class="text-text hover:text-yellow transition-colors"
>
{LaLText()}
</A>
</h2>
<div class="flex flex-col gap-8 lg:flex-row lg:flex-wrap lg:justify-around">
<div class="flex flex-col items-center gap-3">
<span class="text-subtext0 font-mono text-sm">
platform: android
</span>
<Button
variant="download"
size="lg"
loading={loadingState()["lineage"]}
onClick={() => download("lineage")}
>
download.apk
</Button>
<span class="text-subtext1 max-w-xs text-center text-xs italic">
# android build not optimized
</span>
</div>
<div class="flex flex-col items-center gap-3">
<span class="text-subtext0 font-mono text-sm">
platform: ios
</span>
<A
class="transition-all duration-200 ease-out hover:scale-105 active:scale-95"
href="https://apps.apple.com/us/app/life-and-lineage/id6737252442"
>
<DownloadOnAppStore size={50} />
</A>
</div>
</div>
</div>
{/* Cork */}
<div class="border-overlay0 rounded-lg border p-6 md:p-8">
<h2 class="text-text mb-6 font-mono text-2xl">
<span class="text-yellow">{">"}</span> {corkText()}
</h2>
<div class="flex flex-col items-center gap-3">
<span class="text-subtext0 font-mono text-sm">
platform: macOS (13.0+)
</span>
<Button
variant="download"
size="lg"
loading={loadingState()["cork"]}
onClick={() => download("cork")}
>
download.zip
</Button>
<span class="text-subtext1 text-xs">
# unzip drag to /Applications
</span>
</div>
</div>
{/* Shapes with Abigail */}
<div class="border-overlay0 rounded-lg border p-6 md:p-8">
<h2 class="text-text mb-6 font-mono text-2xl">
<span class="text-yellow">{">"}</span> {SwAText()}
</h2>
<div class="flex flex-col gap-8 lg:flex-row lg:flex-wrap lg:justify-around">
<div class="flex flex-col items-center gap-3">
<span class="text-subtext0 font-mono text-sm">
platform: android
</span>
<Button
variant="download"
size="lg"
loading={loadingState()["shapes-with-abigail"]}
onClick={() => download("shapes-with-abigail")}
>
download.apk
</Button>
</div>
<div class="flex flex-col items-center gap-3">
<span class="text-subtext0 font-mono text-sm">
platform: ios
</span>
<A
class="transition-all duration-200 ease-out hover:scale-105 active:scale-95"
href="https://apps.apple.com/us/app/shapes-with-abigail/id6474561117"
>
<DownloadOnAppStore size={50} />
</A>
</div>
</div>
</div>
</div>
</div>
</div>
</>
);
}
/**
* Host-aware downloads route handler.
*
* Dispatches to the per-subdomain download surface based on the resolved
* site (see `src/routes/index.tsx` for the pattern). Nessa has no dedicated
* downloads page, so it falls back to the unified downloads listing —
* matching the pre-middleware behavior. Resolving the public path on both
* server and client avoids the hydration mismatch the path-rewriting
* middleware caused.
*/
export default function DownloadsPage() {
const site = useSite();
return (
<Switch fallback={<MainDownloadsPage />}>
<Match when={site().id === "lineage"}>
<LineageDownloadsPage />
</Match>
<Match when={site().id === "gaze"}>
<GazeDownloadsPage />
</Match>
<Match when={site().id === "inputhalo"}>
<InputHaloDownloadsPage />
</Match>
</Switch>
);
}