fix: clear commands after entering

This commit is contained in:
max_richter 2025-01-17 16:54:53 +01:00
parent 6e82d9ca73
commit 6112d007c2
5 changed files with 28 additions and 21 deletions

View File

@ -127,6 +127,9 @@ export const KMenu = (
if (ev.key === "Enter") { if (ev.key === "Enter") {
activateEntry(entries[activeIndex.value]); activateEntry(entries[activeIndex.value]);
if (input.current) {
input.current.value = "";
}
} }
if (ev.key === "ArrowUp") { if (ev.key === "ArrowUp") {

View File

@ -2,11 +2,13 @@ import { PageProps } from "$fresh/server.ts";
import { Head } from "$fresh/runtime.ts"; import { Head } from "$fresh/runtime.ts";
export default function App({ Component }: PageProps) { export default function App({ Component }: PageProps) {
const css = Deno.readTextFileSync("./static/global.css").replace("\n", ""); const globalCss = Deno
.readTextFileSync("./static/global.css")
.replaceAll("\n", "");
return ( return (
<> <>
<Head> <Head>
<link href="/prism-material-dark.css" rel="stylesheet" /> <link rel="stylesheet" href="/styles.css" />
<link <link
rel="apple-touch-icon" rel="apple-touch-icon"
sizes="180x180" sizes="180x180"
@ -25,14 +27,13 @@ export default function App({ Component }: PageProps) {
href="/favicon-16x16.png" href="/favicon-16x16.png"
/> />
<link rel="manifest" href="/site.webmanifest" /> <link rel="manifest" href="/site.webmanifest" />
<link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5" />
<link rel="stylesheet" href="/styles.css" />
<meta name="msapplication-TileColor" content="#da532c" /> <meta name="msapplication-TileColor" content="#da532c" />
<meta name="theme-color" content="#141218" /> <meta name="theme-color" content="#141218" />
<script src="/thumbnails.js" type="module"></script> <style>{globalCss}</style>
<style>{css}</style> <title>app</title>
</Head> </Head>
<Component /> <Component />
<script src="/thumbnails.js" type="module" async defer />
</> </>
); );
} }

View File

@ -1,7 +1,5 @@
import { PageProps } from "$fresh/server.ts"; import { PageProps } from "$fresh/server.ts";
import { resources } from "@lib/resources.ts"; import { resources } from "@lib/resources.ts";
import { CSS, KATEX_CSS } from "gfm";
import { Head } from "$fresh/runtime.ts";
import { Emoji } from "@components/Emoji.tsx"; import { Emoji } from "@components/Emoji.tsx";
export default function MyLayout({ Component }: PageProps) { export default function MyLayout({ Component }: PageProps) {
@ -10,10 +8,6 @@ export default function MyLayout({ Component }: PageProps) {
class="md:grid mx-auto" class="md:grid mx-auto"
style={{ gridTemplateColumns: "200px 1fr", maxWidth: "1024px" }} style={{ gridTemplateColumns: "200px 1fr", maxWidth: "1024px" }}
> >
<Head>
<style>{CSS}</style>
<style>{KATEX_CSS}</style>
</Head>
<aside class="p-4 hidden md:block"> <aside class="p-4 hidden md:block">
<nav class="min-h-fit rounded-3xl p-3 grid gap-3 fixed t-0"> <nav class="min-h-fit rounded-3xl p-3 grid gap-3 fixed t-0">
{Object.values(resources).map((m) => { {Object.values(resources).map((m) => {

View File

@ -61,11 +61,17 @@ function parseParams(reqUrl: URL): ImageParams | string {
return "Invalid parameters provided."; return "Invalid parameters provided.";
} }
} }
// Helper function to generate ETag
async function generateETag(content: ArrayBuffer): Promise<string> {
const hashBuffer = await crypto.subtle.digest("SHA-256", content);
return `"${
Array.from(new Uint8Array(hashBuffer))
.map((b) => b.toString(16).padStart(2, "0"))
.join("")
}"`;
}
const GET = async ( async function GET(req: Request, _ctx: FreshContext): Promise<Response> {
req: Request,
_ctx: FreshContext,
): Promise<Response> => {
try { try {
const url = new URL(req.url); const url = new URL(req.url);
const params = parseParams(url); const params = parseParams(url);
@ -85,9 +91,16 @@ const GET = async (
const image = await getImageContent(imageUrl, params); const image = await getImageContent(imageUrl, params);
// Generate ETag based on image content
const eTag = await generateETag(image.content);
// Set caching headers
return new Response(image.content, { return new Response(image.content, {
headers: { headers: {
"Content-Type": image.mimeType, "Content-Type": image.mimeType,
"Cache-Control": "public, max-age=31536000, immutable", // Cache for 1 year
"ETag": eTag,
"Last-Modified": new Date().toUTCString(), // Replace with image's actual modified date if available
}, },
}); });
} catch (error) { } catch (error) {
@ -97,7 +110,7 @@ const GET = async (
headers: { "Content-Type": "text/plain" }, headers: { "Content-Type": "text/plain" },
}); });
} }
}; }
export const handler: Handlers = { export const handler: Handlers = {
GET, GET,

View File

@ -1,4 +1,3 @@
import { Head } from "$fresh/runtime.ts";
import { MainLayout } from "@components/layouts/main.tsx"; import { MainLayout } from "@components/layouts/main.tsx";
import { Card } from "@components/Card.tsx"; import { Card } from "@components/Card.tsx";
import { PageProps } from "$fresh/server.ts"; import { PageProps } from "$fresh/server.ts";
@ -9,9 +8,6 @@ import { KMenu } from "@islands/KMenu.tsx";
export default function Home(props: PageProps) { export default function Home(props: PageProps) {
return ( return (
<> <>
<Head>
<title>app</title>
</Head>
<RedirectSearchHandler /> <RedirectSearchHandler />
<KMenu type="main" context={false} /> <KMenu type="main" context={false} />
<MainLayout url={props.url}> <MainLayout url={props.url}>