big updats

This commit is contained in:
Daniel Ledda
2025-12-20 00:10:42 +01:00
parent a93ffff00d
commit 51e44db779
25 changed files with 570 additions and 203 deletions

View File

@@ -1,9 +1,9 @@
import { createTextVNode, computed, defineComponent, h, inject, onServerPrefetch, ref, type VNode, watchEffect } from "vue";
import { createTextVNode, computed, defineComponent, h, inject, ref, type VNode } from "vue";
import { RouterLink } from "vue-router";
import useAsyncState from "@/useAsyncState.ts";
import useHead from "@/useHead.ts";
import DJEmail from "@/DJEmail.tsx";
import getDJAPI from "@/api.ts";
import DjEmail from "@/DjEmail.tsx";
import getDjAPI from "@/api.ts";
export default defineComponent({
name: "ge-deutsch-article",
@@ -25,8 +25,8 @@ export default defineComponent({
(innerHTML: string) => Object.assign(document.createElement("div"), { innerHTML }),
);
const { result: articleContent, stateIsReady } = useAsyncState(
"ge-deutsch-article-data",
const articleContent = useAsyncState(
"ge-deutsch-article-content",
async ({ hostUrl }) => {
const articleResponse = await fetch(`${hostUrl}/generative-energy/content/${props.articleName}.html`);
const result = await articleResponse.text();
@@ -34,15 +34,12 @@ export default defineComponent({
},
);
const {
result: articleData,
stateIsReady: articleDataReady,
} = useAsyncState('article-data', ({hostUrl}) => getDJAPI(hostUrl, '/rp-articles'));
const articlesMetadata = useAsyncState('article-metadata', ({hostUrl}) => getDjAPI(hostUrl, '/rp-articles'));
const articleMetadata = computed(() => articleData.value?.find(_ => _.slug === props.articleName));
const articleMetadata = computed(() => articlesMetadata.result.value?.find(_ => _.slug === props.articleName));
useHead({
title: () => articleMetadata.value?.title ?? '',
useHead({
title: () => articleMetadata.value?.title ?? '',
metatags: () => articleMetadata.value ? [
{ name: 'title', content: articleMetadata.value.title },
{ name: 'author', content: articleMetadata.value.author },
@@ -92,14 +89,14 @@ export default defineComponent({
}
function ArticleContentTransformed() {
if (articleContent.value) {
const dom = parseDom(articleContent.value);
if (articleContent.result.value) {
const dom = parseDom(articleContent.result.value);
return h("div", {}, [...dom.children].map((_) => transformArticleNode(_)));
}
return <div>Artikel lädt...</div>;
}
await Promise.all([stateIsReady, articleDataReady]);
await Promise.all([ articleContent.done, articlesMetadata.done ]);
return () => (
<div class="ge-article">
@@ -111,7 +108,7 @@ export default defineComponent({
</div>
<p class="text-slab">
Bei dem untenstehenden Artikel handelt es sich um eine hobbymäßige, amateurhafte Übersetzung des
Artikels { articleMetadata.value?.titleEn } von Ray Peat. Bei Ungenauigkeiten oder Fehlübersetzungen freue ich mich über <DJEmail>eine Mail</DJEmail>!
Artikels { articleMetadata.value?.titleEn } von Ray Peat. Bei Ungenauigkeiten oder Fehlübersetzungen freue ich mich über <DjEmail>eine Mail</DjEmail>!
</p>
{ articleMetadata.value?.tags?.includes('in-arbeit') && <h5 class="baustelle">🚧 Bitte beachte, dass diese Übersetzung noch in Arbeit ist! 🚧</h5> }
<hr />