mirror of
https://github.com/snapotter-hq/SnapOtter.git
synced 2026-08-03 07:46:42 +02:00
A release-readiness QA pass over the whole product. The commits split into defects a user would hit and gates that were reporting green while measuring nothing. ## Fixes that change behaviour Rate limiting was bypassable on every install: TRUST_PROXY defaulted to true, so request.ip came from a client-set header and a forged X-Forwarded-For got past the login limiter. The default is now a private-network trust list. A transient Postgres outage stranded in-flight jobs, leaving finished output on disk with no row pointing at it. A reconciler now resolves those rows and adopts the bytes rather than dropping the work. A Redis connection that moved to a new address wedged every read-blocked consumer, so completions stopped signalling while health still answered 200. Socket timeouts plus subscriber pings recover it. Installing more than one AI bundle left the shared venv multi-versioned and silently broke three tools. The installer now reconciles distributions to one version each. Converting an image to JXL at quality 1 through 4 returned a 500, because libjxl 0.7 rejects the distance those values compute. The quality is floored at what the encoder honours. A missing ffmpeg was also reported to the user as a corrupt upload; it now says the engine is unavailable. RAW uploads reached an unpatched LibRaw on arm64, so it is built from source at 0.22.2, and the release scan was split so it can fail on an unfixed critical instead of hiding it behind ignore-unfixed. ## Gates that could not fail Two mutation lanes ran zero mutants because Stryker crawled the gitignored docs build; coverage discarded its whole report on any failing test; the lint gate skipped root tests, scripts, and two workspaces; and several generated matrices counted a host missing ffmpeg as a passing tool. Each now measures what it claims. Full evidence and the outstanding release items are tracked locally and are not part of this branch.
185 lines
10 KiB
Vue
185 lines
10 KiB
Vue
<script setup lang="ts">
|
|
import { useData } from "vitepress";
|
|
import { computed, ref } from "vue";
|
|
import { normalizeLocale, t } from "../i18n/ui.mjs";
|
|
import { data as sectionCounts } from "./section-counts.data.ts";
|
|
|
|
const { lang } = useData();
|
|
const locale = computed(() => normalizeLocale(lang.value));
|
|
const tt = (key: string) => t(locale.value, key);
|
|
|
|
const command =
|
|
"docker run -d --name SnapOtter -p 1349:1349 -v SnapOtter-data:/data snapotter/snapotter:latest";
|
|
|
|
const selfLinks = [
|
|
{ key: "home.link.quickStart", href: "/guide/getting-started#quick-start" },
|
|
{ key: "home.link.configuration", href: "/guide/configuration" },
|
|
{ key: "home.link.hardwareSizing", href: "/guide/deployment#hardware-requirements" },
|
|
{ key: "home.link.databaseBackups", href: "/guide/database" },
|
|
{ key: "home.link.dockerTagsGpu", href: "/guide/docker-tags" },
|
|
{ key: "home.link.supportedFormats", href: "/guide/supported-formats" },
|
|
];
|
|
const entLinks = [
|
|
{ key: "home.link.architecture", href: "/guide/architecture" },
|
|
{ key: "home.link.securityHardening", href: "/guide/security" },
|
|
{ key: "home.link.ssoSamlOidc", href: "/guide/oidc" },
|
|
{ key: "home.link.scimProvisioning", href: "/guide/scim" },
|
|
{ key: "home.link.usersRolesAudit", href: "/guide/users-roles" },
|
|
{ key: "home.link.complianceSbom", href: "/guide/security#compliance-artifacts" },
|
|
];
|
|
const modalities = [
|
|
{ key: "home.mod.image", count: sectionCounts.image, href: "/tools/image/resize" },
|
|
{ key: "home.mod.video", count: sectionCounts.video, href: "/tools/video/convert-video" },
|
|
{ key: "home.mod.audio", count: sectionCounts.audio, href: "/tools/audio/convert-audio" },
|
|
{ key: "home.mod.pdf", count: sectionCounts.pdf, href: "/tools/pdf/merge-pdf" },
|
|
{ key: "home.mod.files", count: sectionCounts.files, href: "/tools/files/chart-maker" },
|
|
];
|
|
const shared = [
|
|
{ key: "home.card.restApi", subKey: "home.card.restApiSub", href: "/api/rest" },
|
|
{ key: "home.card.changelog", subKey: "home.card.changelogSub", href: "/changelog" },
|
|
{ key: "home.card.llmsTxt", subKey: "home.card.llmsTxtSub", href: "/llms.txt" },
|
|
];
|
|
|
|
const copyLabel = ref(t(locale.value, "home.copy"));
|
|
function copyCommand() {
|
|
navigator.clipboard?.writeText(command);
|
|
copyLabel.value = t(locale.value, "home.copied");
|
|
setTimeout(() => {
|
|
copyLabel.value = t(locale.value, "home.copy");
|
|
}, 1500);
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<!-- <main>, not <div>: this page uses layout "page", which gives it no main
|
|
landmark of its own, so every element on it fell outside a landmark. -->
|
|
<main class="so-home">
|
|
<section class="hero">
|
|
<h1 class="hero-title">{{ tt("home.title") }}</h1>
|
|
<p class="hero-sub">{{ tt("home.heroSub") }}</p>
|
|
<div class="cmd" :title="tt('home.clickToCopy')" @click="copyCommand">
|
|
<code tabindex="0">$ {{ command }}</code>
|
|
<button class="copy" type="button" :aria-label="tt('home.copyCommandAria')" @click.stop="copyCommand">{{ copyLabel }}</button>
|
|
</div>
|
|
<p class="hero-meta">
|
|
<a href="/guide/getting-started">{{ tt("home.fullInstallGuide") }}</a> ·
|
|
<a href="/guide/getting-started#docker-compose">{{ tt("home.gpuComposeSetup") }}</a> ·
|
|
<a href="https://demo.snapotter.com">{{ tt("home.tryDemo") }}</a>
|
|
</p>
|
|
</section>
|
|
|
|
<section class="doors">
|
|
<div class="door self">
|
|
<div class="door-head">
|
|
<span class="door-icon" aria-hidden="true">
|
|
<svg viewBox="0 0 24 24" width="20" height="20" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M4.5 16.5c-1.5 1.26-2 5-2 5s3.74-.5 5-2c.71-.84.7-2.13-.09-2.91a2.18 2.18 0 0 0-2.91-.09z"/><path d="M12 15l-3-3a22 22 0 0 1 2-3.95A12.88 12.88 0 0 1 22 2c0 2.72-.78 7.5-6 11a22.35 22.35 0 0 1-4 2z"/></svg>
|
|
</span>
|
|
<h2>{{ tt("home.selfHosting") }}</h2>
|
|
</div>
|
|
<p class="door-sub">{{ tt("home.selfHostingSub") }}</p>
|
|
<ul class="door-links">
|
|
<li v-for="l in selfLinks" :key="l.href"><a :href="l.href">{{ tt(l.key) }}</a></li>
|
|
</ul>
|
|
<a class="door-cta" href="/guide/getting-started">{{ tt("home.startSelfHosting") }}</a>
|
|
</div>
|
|
|
|
<div class="door ent">
|
|
<div class="door-head">
|
|
<span class="door-icon" aria-hidden="true">
|
|
<svg viewBox="0 0 24 24" width="20" height="20" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 21h18M5 21V7l8-4v18M19 21V11l-6-4"/></svg>
|
|
</span>
|
|
<h2>{{ tt("home.enterprise") }}</h2>
|
|
</div>
|
|
<p class="door-sub">{{ tt("home.enterpriseSub") }}</p>
|
|
<ul class="door-links">
|
|
<li v-for="l in entLinks" :key="l.href"><a :href="l.href">{{ tt(l.key) }}</a></li>
|
|
</ul>
|
|
<a class="door-cta" href="https://snapotter.com/enterprise">{{ tt("home.evaluate") }}</a>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="mod">
|
|
<p class="mod-head"><strong>{{ tt("home.modalities") }}</strong> <span>{{ tt("home.browseByType") }}</span></p>
|
|
<div class="chips">
|
|
<a v-for="m in modalities" :key="m.href" class="chip" :href="m.href">
|
|
<span class="chip-label">{{ tt(m.key) }}</span>
|
|
<span class="chip-count">{{ m.count }} {{ tt("home.toolsSuffix") }}</span>
|
|
</a>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="shared">
|
|
<a v-for="s in shared" :key="s.href" class="scard" :href="s.href">
|
|
<strong>{{ tt(s.key) }}</strong>
|
|
<span>{{ tt(s.subKey) }}</span>
|
|
</a>
|
|
</section>
|
|
</main>
|
|
</template>
|
|
|
|
<style scoped>
|
|
.so-home { max-width: 1080px; margin: 0 auto; padding: 16px 24px 64px; }
|
|
.hero { text-align: center; padding: 48px 16px 28px; }
|
|
.hero-title { font-family: var(--so-font-heading); font-size: 42px; font-weight: 800; letter-spacing: -.03em; margin-bottom: 12px; }
|
|
.hero-sub { color: var(--vp-c-text-2); font-size: 17px; max-width: 60ch; margin: 0 auto 20px; }
|
|
.cmd { display: flex; gap: 14px; align-items: center; max-width: 860px; margin: 0 auto; background: #15100B; border: 1px solid #3A2A1E; border-radius: 10px; padding: 13px 16px; text-align: left; cursor: pointer; transition: border-color .15s, background-color .15s; }
|
|
.cmd:hover { border-color: #5A4636; background: #1B140D; }
|
|
.cmd code { flex: 1; min-width: 0; font: 600 13px/1.5 var(--vp-font-family-mono); color: #FFD9B0; white-space: nowrap; overflow-x: auto; scrollbar-width: none; }
|
|
.cmd code::-webkit-scrollbar { display: none; }
|
|
.copy { flex: none; min-width: 62px; text-align: center; font: 600 10.5px/1 var(--vp-font-family-mono); color: #cbb9a6; border: 1px solid #4a3a2c; border-radius: 6px; padding: 8px 11px; background: transparent; cursor: pointer; transition: border-color .15s, color .15s; }
|
|
.copy:hover { border-color: #6a5340; color: #FFD9B0; }
|
|
.hero-meta { margin-top: 12px; font-size: 13px; color: var(--vp-c-text-2); }
|
|
.hero-meta a { color: #A85518; font-weight: 600; }
|
|
.doors { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
|
|
.door { border: 1px solid var(--vp-c-border); border-radius: 16px; padding: 24px; transition: transform .15s, box-shadow .15s; }
|
|
.door:hover { transform: translateY(-3px); box-shadow: 0 22px 44px -26px rgba(20,12,4,.5); }
|
|
.door.self { background: linear-gradient(180deg, #FFF5ED, #fff); }
|
|
.door.ent { background: linear-gradient(165deg, #241A13, #15100B); color: #F0EBE4; border-color: #3A2A1E; }
|
|
.door-head { display: flex; align-items: center; gap: 12px; margin-bottom: 6px; }
|
|
.door-icon { width: 40px; height: 40px; border-radius: 11px; display: flex; align-items: center; justify-content: center; flex: none; }
|
|
.door.self .door-icon { background: #E07832; color: #fff; }
|
|
.door.ent .door-icon { background: #3A2A1E; color: #F09550; }
|
|
.door-head h2 { font-family: var(--so-font-heading); font-size: 22px; font-weight: 700; border: 0; padding: 0; margin: 0; }
|
|
.door-sub { font-size: 13.5px; margin-bottom: 18px; }
|
|
.door.self .door-sub { color: var(--vp-c-text-2); }
|
|
.door.ent .door-sub { color: #C9BCAE; }
|
|
.door-links { display: grid; grid-template-columns: 1fr 1fr; gap: 0 18px; list-style: none; margin: 0 0 20px; padding: 0; }
|
|
.door-links li { border-bottom: 1px solid; padding: 0; }
|
|
.door.self .door-links li { border-color: #EBDDCC; }
|
|
.door.ent .door-links li { border-color: #3A2C20; }
|
|
.door-links a { display: block; padding: 10px 2px; font-size: 13.5px; font-weight: 500; text-decoration: none; color: inherit; }
|
|
.door.self .door-links a:hover { color: #A85518; }
|
|
.door.ent .door-links a:hover { color: #F09550; }
|
|
.door-cta { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; font-size: 13.5px; padding: 11px 18px; border-radius: 10px; text-decoration: none; }
|
|
.door.self .door-cta { background: #A85518; color: #fff; }
|
|
.door.ent .door-cta { background: #F09550; color: #231A12; }
|
|
.mod { padding: 28px 0 6px; }
|
|
.mod-head { margin-bottom: 13px; }
|
|
.mod-head strong { font-family: var(--so-font-heading); font-size: 15px; }
|
|
.mod-head span { font-size: 12.5px; color: var(--vp-c-text-2); margin-left: 8px; }
|
|
.chips { display: grid; grid-template-columns: repeat(5, 1fr); gap: 11px; }
|
|
.chip { display: flex; flex-direction: column; gap: 2px; border: 1px solid var(--vp-c-border); border-radius: 11px; padding: 12px 13px; text-decoration: none; transition: border-color .15s, transform .15s; }
|
|
.chip:hover { border-color: #E07832; transform: translateY(-2px); }
|
|
.chip-label { font-size: 12.5px; font-weight: 600; color: var(--vp-c-text-1); }
|
|
.chip-count { font: 700 12px/1 var(--vp-font-family-mono); color: #A85518; }
|
|
.shared { display: grid; grid-template-columns: repeat(3, 1fr); gap: 13px; padding: 18px 0 0; }
|
|
.scard { display: flex; flex-direction: column; gap: 2px; border: 1px solid var(--vp-c-border); border-radius: 12px; padding: 14px 15px; text-decoration: none; transition: border-color .15s, transform .15s; }
|
|
.scard:hover { border-color: #E07832; transform: translateY(-2px); }
|
|
.scard strong { font-family: var(--so-font-heading); font-size: 13.5px; color: var(--vp-c-text-1); }
|
|
.scard span { font-size: 11.5px; color: var(--vp-c-text-2); }
|
|
|
|
:root.dark .chip-label, :root.dark .scard strong { color: var(--vp-c-text-1); }
|
|
:root.dark .door.self { background: linear-gradient(180deg, #2A1F16, #221A13); border-color: #3A2C20; color: #F0EBE4; }
|
|
:root.dark .door.self .door-links li { border-color: #3A2C20; }
|
|
:root.dark .chip-count { color: #F0A766; }
|
|
:root.dark .hero-meta a { color: #F0A766; }
|
|
:root.dark .door.self .door-sub { color: #C9BCAE; }
|
|
:root.dark .door.self .door-links a:hover { color: #F09550; }
|
|
:root.dark .door.self .door-cta { background: #A85518; }
|
|
|
|
@media (max-width: 840px) {
|
|
.doors, .shared { grid-template-columns: 1fr; }
|
|
.chips { grid-template-columns: repeat(2, 1fr); }
|
|
}
|
|
</style>
|