erudit 3.0.0-dev.2 → 3.0.0-dev.21

package/app/composables/bitran.ts

@@ -1,127 +1,108 @@
-import eruditConfig from '#erudit/config';
-import bitranConfig from '#erudit/client/bitran';
-
-import {
-    createPhraseCaller,
-    getDefaultRenderers,
-    getElementIcon,
-    type ElementVueRenderers,
-} from '@bitran-js/renderer-vue';
-import {
-    defineBitranTranspiler,
-    type BitranTranspiler,
-    type ElementTranspilers,
-} from '@bitran-js/transpiler';
-import { aliasesName } from '@erudit-js/bitran-elements/aliases/shared';
-import { aliasesTranspiler } from '@erudit-js/bitran-elements/aliases/transpiler';
-import { headingName } from '@erudit-js/bitran-elements/heading/shared';
-import { headingTranspiler } from '@erudit-js/bitran-elements/heading/transpiler';
-import { includeName } from '@erudit-js/bitran-elements/include/shared';
-import { includeTranspiler } from '@erudit-js/bitran-elements/include/transpiler';
-import { linkName } from '@erudit/shared/bitran/link/shared';
-import { linkTranspiler } from '@erudit/shared/bitran/link/transpiler';
-import { aliasesRenderer } from '@erudit-js/bitran-elements/aliases/renderer';
-import { headingRenderer } from '@erudit-js/bitran-elements/heading/renderer';
-import { includeRenderer } from '@erudit-js/bitran-elements/include/renderer';
-import { linkRenderer } from '@erudit/shared/bitran/link/renderer';
-
-let bitranTranspiler!: BitranTranspiler;
-let bitranRenderers!: ElementVueRenderers;
-
-//
-// Transpiler
-//
-
-export async function useBitranTranspiler() {
-    if (bitranTranspiler) return bitranTranspiler;
-
-    const projectTranspilers = await getProjectTranspilers();
-
-    const defaultTranspilers = {
-        [aliasesName]: aliasesTranspiler,
-        [includeName]: includeTranspiler,
-        [headingName]: headingTranspiler,
-        [linkName]: linkTranspiler,
-    };
-
-    bitranTranspiler = defineBitranTranspiler({
-        ...projectTranspilers,
-        ...defaultTranspilers,
-    });
-
-    return bitranTranspiler;
-}
-
-async function getProjectTranspilers(): Promise<ElementTranspilers> {
-    const bitranElements = bitranConfig.elements;
-
-    if (!bitranElements) return {};
-
-    const projectTranspilers: ElementTranspilers = {};
-    for (const [name, bitranElement] of Object.entries(bitranElements))
-        projectTranspilers[name] = await bitranElement.transpiler();
-
-    return projectTranspilers;
-}
-
-//
-// Renderers
-//
-
-export async function useBitranRenderers() {
-    if (bitranRenderers) return bitranRenderers;
-
-    const projectRenderers = await getProjectRenderers();
-
-    const defaultRenderers = {
-        [aliasesName]: aliasesRenderer,
-        [includeName]: includeRenderer,
-        [headingName]: headingRenderer,
-        [linkName]: linkRenderer,
-    };
-
-    // @ts-ignore
-    bitranRenderers = {
-        ...projectRenderers,
-        ...defaultRenderers,
-    };
-
-    return bitranRenderers!;
-}
-
-async function getProjectRenderers() {
-    const bitranElements = bitranConfig.elements;
-
-    if (!bitranElements) return {};
-
-    const projectRenderers: ElementVueRenderers = {};
-    for (const [name, bitranElement] of Object.entries(bitranElements))
-        projectRenderers[name] = await bitranElement.renderer();
-
-    return projectRenderers;
-}
-
-//
-// Utils
-//
-
-export async function useBitranElementRenderer(productName: string) {
-    const renderer =
-        (await useBitranRenderers())[productName] ||
-        getDefaultRenderers()[productName];
-
-    if (!renderer)
-        throw new Error(`Missing Bitran product render "${productName}"!`);
-
-    return renderer;
-}
-
-export async function useBitranElementIcon(productName: string) {
-    const renderer = await useBitranElementRenderer(productName);
-    return await getElementIcon(renderer);
-}
-
-export async function useBitranElementLanguage(productName: string) {
-    const renderer = await useBitranElementRenderer(productName);
-    return await createPhraseCaller(renderer, eruditConfig?.language || 'en');
-}
+import {
+    createPhraseCaller,
+    getDefaultRenderers as getDefaultBitranRenderers,
+    getElementIcon,
+    type ElementVueRenderers,
+} from '@bitran-js/renderer-vue';
+import {
+    defineBitranTranspiler,
+    type BitranTranspiler,
+    type ElementTranspilers,
+} from '@bitran-js/transpiler';
+import type { EruditBitranElements } from '@erudit-js/cog/schema';
+
+import eruditConfig from '#erudit/config';
+import getBitranElements from '#erudit/bitran/app';
+
+let elements!: EruditBitranElements;
+let transpilers!: ElementTranspilers;
+let renderers!: ElementVueRenderers;
+
+let bitranTranspiler!: BitranTranspiler;
+let bitranRenderers!: ElementVueRenderers;
+
+//
+//
+//
+
+async function getElements() {
+    if (!elements) elements = await getBitranElements();
+
+    return elements;
+}
+
+async function getTranspilers() {
+    if (!transpilers) {
+        const elements = await getElements();
+        transpilers = Object.fromEntries(
+            Object.entries(elements).map(([key, item]) => [
+                key,
+                item.transpiler,
+            ]),
+        );
+    }
+    return transpilers;
+}
+
+async function getRenderers() {
+    if (!renderers) {
+        const elements = await getElements();
+        renderers = Object.fromEntries(
+            Object.entries(elements).map(([key, item]) => [key, item.renderer]),
+        );
+    }
+    return renderers;
+}
+
+//
+// Transpiler
+//
+
+export async function useBitranTranspiler() {
+    if (bitranTranspiler) return bitranTranspiler;
+
+    bitranTranspiler = defineBitranTranspiler({
+        ...(await getTranspilers()),
+    });
+
+    return bitranTranspiler;
+}
+
+//
+// Renderers
+//
+
+export async function useBitranRenderers() {
+    if (bitranRenderers) return bitranRenderers;
+
+    bitranRenderers = {
+        ...(await getRenderers()),
+    };
+
+    return bitranRenderers!;
+}
+
+//
+// Utils
+//
+
+export async function useBitranElementRenderer(productName: string) {
+    const renderer =
+        (await getRenderers())[productName] ||
+        getDefaultBitranRenderers()[productName];
+
+    if (!renderer)
+        throw new Error(`Missing Bitran product render "${productName}"!`);
+
+    return renderer;
+}
+
+export async function useBitranElementIcon(productName: string) {
+    const renderer = await useBitranElementRenderer(productName);
+    return await getElementIcon(renderer);
+}
+
+export async function useBitranElementLanguage(productName: string) {
+    const renderer = await useBitranElementRenderer(productName);
+    return await createPhraseCaller(renderer, eruditConfig?.language || 'en');
+}

package/app/composables/bitranLocation.ts

@@ -1,7 +1,7 @@
-import { locationFromPath, type BitranLocation } from '@shared/bitran/location';
-
-export function useBitranLocation(): ComputedRef<BitranLocation | undefined> {
-    const route = useRoute();
-
-    return computed(() => locationFromPath(route.path));
-}
+import { locationFromPath, type BitranLocation } from '@erudit-js/cog/schema';
+
+export function useBitranLocation(): ComputedRef<BitranLocation | undefined> {
+    const route = useRoute();
+
+    return computed(() => locationFromPath(route.path));
+}

package/app/composables/contentData.ts

@@ -1,36 +1,38 @@
-import type { ContentData } from '@shared/content/data';
-
-export function useContentData<T extends ContentData>() {
-    const nuxtApp = useNuxtApp();
-    const contentRoute = useContentRoute();
-
-    const payloadKey = 'content-data';
-    const payload =
-        (nuxtApp.static.data[payloadKey] ||=
-        nuxtApp.payload.data[payloadKey] ||=
-            {});
-
-    const data = ref<T>();
-    let promise: Promise<typeof data> | undefined;
-
-    watchEffect(() => {
-        // @ts-ignore
-        promise = (async () => {
-            if (!contentRoute.value) {
-                data.value = undefined;
-                return;
-            }
-
-            const contentId = contentRoute.value.contentId;
-
-            const payloadValue = (payload[contentId] ||= await $fetch(
-                '/api/content/data',
-                { query: { contentId } },
-            ));
-            data.value = payloadValue as T;
-            return data;
-        })();
-    });
-
-    return promise as any as Promise<Ref<T>>;
-}
+import { trailingSlash } from '@erudit/utils/url';
+import type { ContentData } from '@shared/content/data';
+
+export function useContentData<T extends ContentData>() {
+    const nuxtApp = useNuxtApp();
+    const contentRoute = useContentRoute();
+
+    const payloadKey = 'content-data';
+    const payload =
+        (nuxtApp.static.data[payloadKey] ||=
+        nuxtApp.payload.data[payloadKey] ||=
+            {});
+
+    const data = ref<T>();
+    let promise: Promise<typeof data> | undefined;
+
+    watchEffect(() => {
+        // @ts-ignore
+        promise = (async () => {
+            if (!contentRoute.value) {
+                data.value = undefined;
+                return;
+            }
+
+            const dataKey = trailingSlash(contentRoute.value.contentId, false);
+
+            const payloadValue = (payload[dataKey] ||= await $fetch(
+                '/api/content/data',
+                { query: { contentId: dataKey } },
+            ));
+
+            data.value = payloadValue as T;
+            return data;
+        })();
+    });
+
+    return promise as any as Promise<Ref<T>>;
+}

package/app/composables/contentPage.ts

@@ -1,156 +1,168 @@
-import eruditConfig from '#erudit/config';
-
-import { createOgImageTags, defaultOgImage } from '@app/scripts/og';
-import type { ContentData } from '@shared/content/data';
-
-export function useContentPage(contentData: Ref<ContentData>) {
-    const contentRoute = useContentRoute();
-    const siteUrl = useSiteUrl();
-    const favicon = useFavicon();
-
-    const phrasePromise = usePhrases(
-        'article',
-        'summary',
-        'practice',
-        'site_info_title',
-        'seo_article_description',
-        'seo_summary_description',
-        'seo_practice_description',
-    );
-
-    //
-    // Favicon
-    //
-
-    const contentFavicon = () => {
-        setTimeout(() => {
-            const newFavicon = (() => {
-                switch (contentRoute.value?.type) {
-                    case 'topic':
-                        const topicPart = contentRoute.value.topicPart;
-                        return (
-                            eruditConfig.site?.favicon?.[topicPart] ||
-                            eruditAsset(`favicon/${topicPart}.svg`)
-                        );
-                }
-
-                return defaultFavicon;
-            })();
-
-            favicon.value = newFavicon;
-        }, 500);
-    };
-
-    //
-    // SEO
-    //
-
-    let seoTitlePromise: Promise<void>, seoDescriptionPromise: Promise<void>;
-
-    const seo = {
-        title: ref<string>(),
-        description: ref<string>(),
-    };
-
-    const setupSeoTitle = () => {
-        seoTitlePromise = (async () => {
-            const phrase = await phrasePromise;
-
-            let title: string = '';
-            title +=
-                contentData.value.generic?.seo?.title ||
-                contentData.value.generic.title ||
-                contentData.value.generic.contentId.split('/').pop();
-
-            if (contentData.value.type !== 'book') {
-                const bookTitle = contentData.value?.bookTitle;
-                title += bookTitle ? ` | ${bookTitle}` : '';
-            }
-
-            if (contentRoute.value!.type === 'topic') {
-                const topicPart = contentRoute.value!.topicPart;
-
-                if (topicPart !== 'article') title += ` | ${phrase[topicPart]}`;
-            }
-
-            title +=
-                ' - ' + eruditConfig.seo?.title ||
-                eruditConfig.site?.title ||
-                phrase.site_info_title;
-
-            seo.title.value = title;
-        })();
-    };
-
-    const setupSeoDescription = () => {
-        seoDescriptionPromise = (async () => {
-            const phrase = await phrasePromise;
-            const customDescription =
-                contentData.value.generic?.seo?.description ||
-                contentData.value.generic?.description;
-
-            if (customDescription) {
-                seo.description.value = customDescription;
-                return;
-            }
-
-            if (contentRoute.value!.type === 'topic') {
-                const phraseFunc =
-                    phrase[`seo_${contentRoute.value!.topicPart}_description`];
-                seo.description.value = phraseFunc(
-                    contentData.value.generic?.seo?.title ||
-                        contentData.value.generic.title!,
-                );
-                return;
-            }
-
-            seo.description.value = '';
-        })();
-    };
-
-    useSeoMeta({
-        // @ts-ignore
-        title: seo.title,
-        ogTitle: seo.title,
-        description: seo.description,
-        ogDescription: seo.description,
-    });
-
-    const meta = computed(() => {
-        return [
-            ...createOgImageTags(siteUrl, defaultOgImage),
-            ...(contentData.value.generic?.ogImage
-                ? createOgImageTags(siteUrl, contentData.value.generic?.ogImage)
-                : []),
-        ];
-    });
-
-    useHead({
-        meta,
-    });
-
-    //
-    //
-    //
-
-    watchEffect(() => {
-        setupSeoTitle();
-        setupSeoDescription();
-    });
-
-    onMounted(() => {
-        watchEffect(() => {
-            contentFavicon();
-        });
-    });
-
-    onBeforeUnmount(() => {
-        favicon.value = defaultFavicon;
-    });
-
-    //
-    //
-    //
-
-    return Promise.all([seoTitlePromise!, seoDescriptionPromise!]);
-}
+import eruditConfig from '#erudit/config';
+
+import { createOgImageTags, defaultOgImage } from '@app/scripts/og';
+import type { ContentData } from '@shared/content/data';
+
+export function useContentPage(contentData: Ref<ContentData>) {
+    const contentRoute = useContentRoute();
+    const siteUrl = useSiteUrl();
+    const favicon = useFavicon();
+
+    const phrasePromise = usePhrases(
+        'article',
+        'summary',
+        'practice',
+        'site_info_title',
+        'seo_article_description',
+        'seo_summary_description',
+        'seo_practice_description',
+    );
+
+    //
+    // Favicon
+    //
+
+    const contentFavicon = () => {
+        setTimeout(() => {
+            const newFavicon = (() => {
+                switch (contentRoute.value?.type) {
+                    case 'topic':
+                        const topicPart = contentRoute.value.topicPart;
+                        return (
+                            eruditConfig.site?.favicon?.[topicPart] ||
+                            eruditAsset(`favicon/${topicPart}.svg`)
+                        );
+                }
+
+                return defaultFavicon;
+            })();
+
+            favicon.value = newFavicon;
+        }, 500);
+    };
+
+    //
+    // SEO
+    //
+
+    let seoTitlePromise: Promise<void>, seoDescriptionPromise: Promise<void>;
+
+    const seo = {
+        title: ref<string>(),
+        description: ref<string>(),
+    };
+
+    const setupSeoTitle = () => {
+        seoTitlePromise = (async () => {
+            const phrase = await phrasePromise;
+
+            let title: string = '';
+            title +=
+                contentData.value.generic?.seo?.title ||
+                contentData.value.generic.title ||
+                contentData.value.generic.contentId.split('/').pop();
+
+            if (contentRoute.value!.type === 'topic') {
+                const topicPart = contentRoute.value!.topicPart;
+                if (topicPart !== 'article') title += ` | ${phrase[topicPart]}`;
+            }
+
+            // Add book title in the middle section only if not using it as the site title
+            if (
+                contentData.value.type !== 'book' &&
+                contentData.value?.bookTitle &&
+                !eruditConfig.content?.bookSiteTitle
+            ) {
+                title += ` | ${contentData.value.bookTitle}`;
+            }
+
+            // Choose the site title based on configuration
+            const siteTitle =
+                contentData.value.type !== 'book' &&
+                eruditConfig.content?.bookSiteTitle &&
+                contentData.value?.bookTitle
+                    ? contentData.value.bookTitle
+                    : eruditConfig.seo?.title ||
+                      eruditConfig.site?.title ||
+                      phrase.site_info_title;
+
+            title += ' - ' + siteTitle;
+
+            seo.title.value = title;
+        })();
+    };
+
+    const setupSeoDescription = () => {
+        seoDescriptionPromise = (async () => {
+            const phrase = await phrasePromise;
+            const customDescription =
+                contentData.value.generic?.seo?.description ||
+                contentData.value.generic?.description;
+
+            if (customDescription) {
+                seo.description.value = customDescription
+                    .trim()
+                    .replace(/\n/g, ' ');
+                return;
+            }
+
+            if (contentRoute.value!.type === 'topic') {
+                const phraseFunc =
+                    phrase[`seo_${contentRoute.value!.topicPart}_description`];
+                seo.description.value = phraseFunc(
+                    contentData.value.generic?.seo?.title ||
+                        contentData.value.generic.title!,
+                );
+                return;
+            }
+
+            seo.description.value = '';
+        })();
+    };
+
+    useSeoMeta({
+        // @ts-ignore
+        title: seo.title,
+        ogTitle: seo.title,
+        description: seo.description,
+        ogDescription: seo.description,
+    });
+
+    const meta = computed(() => {
+        return [
+            ...createOgImageTags(siteUrl, defaultOgImage),
+            ...(contentData.value.generic?.ogImage
+                ? createOgImageTags(siteUrl, contentData.value.generic?.ogImage)
+                : []),
+        ];
+    });
+
+    useHead({
+        meta,
+    });
+
+    //
+    //
+    //
+
+    watchEffect(() => {
+        setupSeoTitle();
+        setupSeoDescription();
+    });
+
+    onMounted(() => {
+        watchEffect(() => {
+            contentFavicon();
+        });
+    });
+
+    onBeforeUnmount(() => {
+        favicon.value = defaultFavicon;
+    });
+
+    //
+    //
+    //
+
+    return Promise.all([seoTitlePromise!, seoDescriptionPromise!]);
+}