From da5b2a1c230ec83f36560c25e8d48d8d5f7433c4 Mon Sep 17 00:00:00 2001 From: GauthierWebDev Date: Sat, 19 Apr 2025 14:08:54 +0200 Subject: [PATCH] feat: Add Image and Link components --- app/bun.lock | 3 +++ app/components/Image.tsx | 18 +++++++++++++++ app/components/Link.tsx | 43 ++++++++++++++++++++++++++--------- app/package.json | 11 +++++---- app/tsconfig.json | 49 ++++++++++++++++++---------------------- app/vite.config.ts | 18 +++++++++++---- 6 files changed, 94 insertions(+), 48 deletions(-) mode change 100755 => 100644 app/bun.lock create mode 100644 app/components/Image.tsx diff --git a/app/bun.lock b/app/bun.lock old mode 100755 new mode 100644 index f97af40..9a9e6d1 --- a/app/bun.lock +++ b/app/bun.lock @@ -7,6 +7,7 @@ "@fastify/static": "^8.1.1", "@universal-middleware/core": "^0.4.7", "@universal-middleware/fastify": "^0.5.16", + "clsx": "^2.1.1", "fastify": "^5.3.0", "solid-js": "^1.9.5", "telefunc": "^0.2.3", @@ -369,6 +370,8 @@ "chalk": ["chalk@4.1.2", "", { "dependencies": { "ansi-styles": "^4.1.0", "supports-color": "^7.1.0" } }, "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA=="], + "clsx": ["clsx@2.1.1", "", {}, "sha512-eYm0QWBtUrBWZWG0d386OGAw16Z995PiOVo2B7bjWSbHedGl5e0ZWaq65kOGgUSNesEIDkB9ISbTg/JK9dhCZA=="], + "code-block-writer": ["code-block-writer@12.0.0", "", {}, "sha512-q4dMFMlXtKR3XNBHyMHt/3pwYNA69EDk00lloMOaaUMKPUXBw6lpXtbu3MMVG6/uOihGnRDOlkyqsONEUj60+w=="], "color-convert": ["color-convert@2.0.1", "", { "dependencies": { "color-name": "~1.1.4" } }, "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ=="], diff --git a/app/components/Image.tsx b/app/components/Image.tsx new file mode 100644 index 0000000..6f62439 --- /dev/null +++ b/app/components/Image.tsx @@ -0,0 +1,18 @@ +import type { JSX } from "solid-js"; + +type ImageProps = JSX.IntrinsicElements["img"] & { src: string; alt: string }; + +export function Image(props: ImageProps) { + const isDecorationImage = props.alt === ""; + + return ( + {isDecorationImage + ); +} diff --git a/app/components/Link.tsx b/app/components/Link.tsx index 2e303dc..82b36f5 100755 --- a/app/components/Link.tsx +++ b/app/components/Link.tsx @@ -1,14 +1,35 @@ -import { createMemo } from "solid-js"; +import type { JSX } from "solid-js"; + import { usePageContext } from "vike-solid/usePageContext"; -export function Link(props: { href: string; children: string }) { - const pageContext = usePageContext(); - const isActive = createMemo(() => - props.href === "/" ? pageContext.urlPathname === props.href : pageContext.urlPathname.startsWith(props.href), - ); - return ( - - {props.children} - - ); +type LinkProps = JSX.IntrinsicElements["a"] & { href: string }; + +export function Link(props: LinkProps) { + const { urlPathname } = usePageContext(); + + const isActive = + props.href === "/" + ? urlPathname === props.href + : urlPathname.startsWith(props.href); + + const isSameDomain = !( + props.href.startsWith("http") || props.href.startsWith("mailto") + ); + + const downloadExtensions = [".pdf", ".zip"]; + + const isDownload = downloadExtensions.some(props.href.endsWith); + + return ( + + {props.children} + + ); } diff --git a/app/package.json b/app/package.json index e2413e5..ac8b1d7 100755 --- a/app/package.json +++ b/app/package.json @@ -8,15 +8,16 @@ "format": "biome format --write ." }, "dependencies": { - "vike": "^0.4.228", "@fastify/middie": "^9.0.3", "@fastify/static": "^8.1.1", - "@universal-middleware/fastify": "^0.5.16", - "fastify": "^5.3.0", "@universal-middleware/core": "^0.4.7", + "@universal-middleware/fastify": "^0.5.16", + "clsx": "^2.1.1", + "fastify": "^5.3.0", "solid-js": "^1.9.5", - "vike-solid": "^0.7.9", - "telefunc": "^0.2.3" + "telefunc": "^0.2.3", + "vike": "^0.4.228", + "vike-solid": "^0.7.9" }, "devDependencies": { "@biomejs/biome": "1.9.4", diff --git a/app/tsconfig.json b/app/tsconfig.json index 7e26065..adb0a4f 100755 --- a/app/tsconfig.json +++ b/app/tsconfig.json @@ -1,28 +1,23 @@ { - "compilerOptions": { - "strict": true, - "esModuleInterop": true, - "forceConsistentCasingInFileNames": true, - "resolveJsonModule": true, - "skipLibCheck": true, - "sourceMap": true, - "module": "ESNext", - "noEmit": true, - "moduleResolution": "Bundler", - "target": "ES2022", - "lib": [ - "DOM", - "DOM.Iterable", - "ESNext" - ], - "types": [ - "vite/client", - "vike-solid/client" - ], - "jsx": "react-jsx", - "jsxImportSource": "solid-js" - }, - "exclude": [ - "dist" - ] -} \ No newline at end of file + "compilerOptions": { + "strict": true, + "esModuleInterop": true, + "forceConsistentCasingInFileNames": true, + "resolveJsonModule": true, + "skipLibCheck": true, + "sourceMap": true, + "module": "ESNext", + "noEmit": true, + "moduleResolution": "Bundler", + "target": "ES2022", + "lib": ["DOM", "DOM.Iterable", "ESNext"], + "types": ["vite/client", "vike-solid/client"], + "jsx": "react-jsx", + "jsxImportSource": "solid-js", + "baseUrl": ".", + "paths": { + "@/*": ["./*"] + } + }, + "exclude": ["dist"] +} diff --git a/app/vite.config.ts b/app/vite.config.ts index d9fb5a2..acfb34a 100755 --- a/app/vite.config.ts +++ b/app/vite.config.ts @@ -1,12 +1,20 @@ -import { telefunc } from "telefunc/vite"; import tailwindcss from "@tailwindcss/vite"; +import { telefunc } from "telefunc/vite"; import vikeSolid from "vike-solid/vite"; import { defineConfig } from "vite"; import vike from "vike/plugin"; +import path from "node:path"; + +const __dirname = path.resolve(); export default defineConfig({ - plugins: [vike(), vikeSolid(), tailwindcss(), telefunc()], - build: { - target: "es2022", - }, + plugins: [vike(), vikeSolid(), tailwindcss(), telefunc()], + build: { + target: "es2022", + }, + resolve: { + alias: { + "@": __dirname, + }, + }, });