@datagouv/components-next 1.0.2-dev.40 → 1.0.2-dev.41

package/src/components/ResourceAccordion/XmlPreview.client.vue

@@ -1,45 +1,24 @@
 <template>
-  <div class="fr-text--xs">
-    <div v-if="xmlData">
-      <XmlViewer :xml="xmlData" />
-    </div>
-    <div
-      v-else-if="loading"
-      class="text-gray-medium"
-    >
-      {{ t("Chargement de l'aperçu XML...") }}
-    </div>
-    <PreviewUnavailable v-else-if="fileTooLarge">
-      {{ fileSizeBytes
-        ? t("Le fichier XML est trop volumineux pour être prévisualisé. Téléchargez-le depuis l'onglet Téléchargements.")
-        : t("La taille du fichier est inconnue, l'aperçu n'est pas disponible. Téléchargez-le depuis l'onglet Téléchargements.")
-      }}
-    </PreviewUnavailable>
-    <PreviewUnavailable v-else-if="error === 'cors'">
-      {{ t("Ce fichier XML ne peut pas être prévisualisé car il est hébergé sur un site distant qui restreint l'accès (CORS). Téléchargez-le depuis l'onglet Téléchargements.") }}
-    </PreviewUnavailable>
-    <PreviewUnavailable v-else-if="error === 'network'">
-      {{ t("Ce fichier est hébergé sur un site externe qui ne permet pas la prévisualisation. Téléchargez-le depuis l'onglet Téléchargements.") }}
-    </PreviewUnavailable>
-    <PreviewUnavailable v-else-if="error">
-      {{ t("L'aperçu de ce fichier n'a pas pu être chargé. Téléchargez-le depuis l'onglet Téléchargements.") }}
-    </PreviewUnavailable>
-  </div>
+  <PreviewWrapper
+    v-slot="{ data }"
+    file-type="XML"
+    :resource="resource"
+    :max-size="config.maxXmlPreviewCharSize"
+    :load="load"
+  >
+    <XmlViewer :xml="(data as string)" />
+  </PreviewWrapper>
 </template>
 
 <script setup lang="ts">
-import { computed, defineAsyncComponent, onMounted, ref } from 'vue'
+import { defineAsyncComponent } from 'vue'
 import { useComponentsConfig } from '../../config'
-import PreviewUnavailable from './PreviewUnavailable.vue'
+import PreviewWrapper from './PreviewWrapper.vue'
 import type { Resource } from '../../types/resources'
-import { getResourceFilesize, getResourceCorsStatus } from '../../functions/resources'
-import { useTranslation } from '../../composables/useTranslation'
 import '../../types/vue3-xml-viewer.d'
 
 const XmlViewer = defineAsyncComponent(() =>
-  import('vue3-xml-viewer').then((module) => {
-    return module.default || module.XmlViewer
-  }),
+  import('vue3-xml-viewer').then(module => module.default || module.XmlViewer),
 )
 
 const props = defineProps<{
@@ -47,75 +26,10 @@ const props = defineProps<{
 }>()
 
 const config = useComponentsConfig()
-const { t } = useTranslation()
 
-const xmlData = ref<string | null>(null)
-const loading = ref(false)
-const error = ref<string | null>(null)
-const fileTooLarge = ref(false)
-
-const fileSizeBytes = computed(() => getResourceFilesize(props.resource))
-
-const corsStatus = computed(() => getResourceCorsStatus(props.resource))
-
-const isSizeAllowed = computed(() => {
-  const size = fileSizeBytes.value
-  // Convert maxXmlPreviewCharSize from characters to bytes (rough estimate)
-  // Assuming average 1 byte per character for XML
-  const maxByteSize = config.maxXmlPreviewCharSize
-
-  // If we don't know the size or the max size, don't risk loading a potentially huge file
-  if (!size || !maxByteSize) return false
-
-  return size <= maxByteSize
-})
-
-const fetchXmlData = async () => {
-  error.value = null
-  fileTooLarge.value = false
-
-  // Check if file is too large or size is unknown
-  if (!isSizeAllowed.value) {
-    fileTooLarge.value = true
-    return
-  }
-
-  // Check if CORS is allowed
-  if (corsStatus.value === 'blocked') {
-    error.value = 'cors'
-    return
-  }
-
-  loading.value = true
-  try {
-    const response = await fetch(props.resource.url)
-    // const response = await fetch('/test-data.xml') // For testing locally without CORS issues
-    if (!response.ok) {
-      throw new Error(`HTTP error! status: ${response.status}`)
-    }
-    const data = await response.text()
-
-    // Use the XML data as string - let the XML viewer handle large files
-    xmlData.value = data
-  }
-  catch (err) {
-    console.error('Error loading XML:', err)
-
-    if (err instanceof TypeError) {
-      error.value = 'network'
-    }
-    else {
-      error.value = 'generic'
-    }
-
-    xmlData.value = null
-  }
-  finally {
-    loading.value = false
-  }
+const load = async () => {
+  const response = await fetch(props.resource.url)
+  if (!response.ok) throw new Error(`HTTP error! status: ${response.status}`)
+  return response.text()
 }
-
-onMounted(() => {
-  fetchXmlData()
-})
 </script>

package/src/main.ts

@@ -13,7 +13,7 @@ import type { License } from './types/licenses'
 import type { Member, MemberRole, NewOrganization, Organization, OrganizationOrSuggest, OrganizationReference, OrganizationSuggest } from './types/organizations'
 import type { Owned, OwnedWithFullObject, OwnedWithId } from './types/owned'
 import type { Comment, Thread } from './types/discussions'
-import type { Page, PageBloc, ContentBloc, BlocWithTitle, DatasetsListBloc, DataservicesListBloc, ReusesListBloc, LinkInBloc, LinksListBloc, MarkdownBloc, AccordionItemBloc, AccordionListBloc, HeroBloc } from './types/pages'
+import type { PageBloc, ContentBloc, BlocWithTitle, DatasetsListBloc, DataservicesListBloc, ReusesListBloc, LinkInBloc, LinksListBloc, MarkdownBloc, AccordionItemBloc, AccordionListBloc, HeroBloc } from './types/pages'
 import type { Post } from './types/posts'
 import type { ReuseReference, NewReuse, Reuse, ReuseTopic, ReuseType } from './types/reuses'
 import type { RegisteredSchema, Schema, SchemaDetails, SchemaField, SchemaPath, SchemaPublicationMode, SchemaResponseData, SchemaVersion, ValidataError } from './types/schemas'
@@ -167,7 +167,6 @@ export type {
   Owned,
   OwnedWithFullObject,
   OwnedWithId,
-  Page,
   PageBloc,
   ContentBloc,
   BlocWithTitle,

package/src/types/pages.ts

@@ -2,11 +2,6 @@ import type { DatasetV2 } from './datasets'
 import type { Dataservice } from './dataservices'
 import type { Reuse } from './reuses'
 
-export type Page = {
-  id: string
-  blocs: Array<PageBloc>
-}
-
 export type BlocWithTitle = {
   title: string
   subtitle: string | null

package/src/types/posts.ts

@@ -1,12 +1,12 @@
 import type { Dataset } from './datasets'
-import type { Page } from './pages'
+import type { PageBloc } from './pages'
 import type { Reuse } from './reuses'
 import type { User } from './users'
 
 export type Post = {
   body_type: 'markdown' | 'html' | 'blocs'
+  blocs: Array<PageBloc>
   content: string
-  content_as_page: Page | null
   created_at: string
   credit_to: string
   credit_url: string

package/src/types/site.ts

@@ -1,9 +1,11 @@
+import type { PageBloc } from './pages'
+
 export type Site = {
   id: string
   title: string
-  datasets_page: string | null
-  reuses_page: string | null
-  dataservices_page: string | null
+  datasets_blocs: Array<PageBloc>
+  reuses_blocs: Array<PageBloc>
+  dataservices_blocs: Array<PageBloc>
   version: string
   metrics: {
     'dataservices': number

package/dist/JsonPreview.client-B6aU3vl4.js

@@ -1,78 +0,0 @@
-import { defineComponent as S, defineAsyncComponent as z, ref as u, computed as g, onMounted as J, createElementBlock as m, openBlock as r, createBlock as i, createCommentVNode as N, createVNode as b, unref as s, toDisplayString as l, withCtx as c, createTextVNode as p } from "vue";
-import { u as B, a as O, g as V, b as E, _ as d } from "./main-ifX24DGW.js";
-const L = { class: "fr-text--xs" }, D = { key: 0 }, P = {
-  key: 1,
-  class: "text-gray-medium"
-}, q = /* @__PURE__ */ S({
-  __name: "JsonPreview.client",
-  props: {
-    resource: {}
-  },
-  setup(T) {
-    const y = z(
-      () => import("./vue3-json-viewer-BXwup7nO.js").then((e) => (Promise.resolve({                     }), e.JsonViewer))
-    ), f = T, x = B(), { t: a } = O(), o = u(null), h = u(!1), t = u(null), v = u(!1), _ = g(() => V(f.resource)), k = g(() => E(f.resource)), w = g(() => {
-      const e = _.value, n = x.maxJsonPreviewCharSize;
-      return !e || !n ? !1 : e <= n;
-    }), C = async () => {
-      if (t.value = null, v.value = !1, !w.value) {
-        v.value = !0;
-        return;
-      }
-      if (k.value === "blocked") {
-        t.value = "cors";
-        return;
-      }
-      h.value = !0;
-      try {
-        const e = await fetch(f.resource.url);
-        if (!e.ok)
-          throw new Error(`HTTP error! status: ${e.status}`);
-        const n = await e.json();
-        o.value = n;
-      } catch (e) {
-        console.error("Error loading JSON:", e), e instanceof TypeError ? t.value = "network" : t.value = "generic", o.value = null;
-      } finally {
-        h.value = !1;
-      }
-    };
-    return J(() => {
-      C();
-    }), (e, n) => (r(), m("div", L, [
-      o.value ? (r(), m("div", D, [
-        b(s(y), {
-          value: o.value,
-          boxed: "",
-          sort: "",
-          theme: "light",
-          "max-depth": 3,
-          "expand-depth": 2,
-          "indent-width": 2
-        }, null, 8, ["value"])
-      ])) : h.value ? (r(), m("div", P, l(s(a)("Chargement de l'aperçu JSON...")), 1)) : v.value ? (r(), i(d, { key: 2 }, {
-        default: c(() => [
-          p(l(_.value ? s(a)("Le fichier JSON est trop volumineux pour être prévisualisé. Téléchargez-le depuis l'onglet Téléchargements.") : s(a)("La taille du fichier est inconnue, l'aperçu n'est pas disponible. Téléchargez-le depuis l'onglet Téléchargements.")), 1)
-        ]),
-        _: 1
-      })) : t.value === "cors" ? (r(), i(d, { key: 3 }, {
-        default: c(() => [
-          p(l(s(a)("Ce fichier JSON ne peut pas être prévisualisé car il est hébergé sur un site distant qui restreint l'accès (CORS). Téléchargez-le depuis l'onglet Téléchargements.")), 1)
-        ]),
-        _: 1
-      })) : t.value === "network" ? (r(), i(d, { key: 4 }, {
-        default: c(() => [
-          p(l(s(a)("Ce fichier est hébergé sur un site externe qui ne permet pas la prévisualisation. Téléchargez-le depuis l'onglet Téléchargements.")), 1)
-        ]),
-        _: 1
-      })) : t.value ? (r(), i(d, { key: 5 }, {
-        default: c(() => [
-          p(l(s(a)("L'aperçu de ce fichier n'a pas pu être chargé. Téléchargez-le depuis l'onglet Téléchargements.")), 1)
-        ]),
-        _: 1
-      })) : N("", !0)
-    ]));
-  }
-});
-export {
-  q as default
-};

package/dist/Swagger.client-FpYXdDuX.js

@@ -1,4 +0,0 @@
-import { j as f } from "./main-ifX24DGW.js";
-export {
-  f as default
-};

package/dist/XmlPreview.client-BNGHvVnU.js

@@ -1,70 +0,0 @@
-import { defineComponent as z, defineAsyncComponent as X, ref as u, computed as v, onMounted as L, createElementBlock as g, openBlock as r, createBlock as i, createCommentVNode as S, createVNode as b, unref as s, toDisplayString as n, withCtx as c, createTextVNode as f } from "vue";
-import { u as B, a as M, g as V, b as E, _ as p } from "./main-ifX24DGW.js";
-const D = { class: "fr-text--xs" }, N = { key: 0 }, P = {
-  key: 1,
-  class: "text-gray-medium"
-}, A = /* @__PURE__ */ z({
-  __name: "XmlPreview.client",
-  props: {
-    resource: {}
-  },
-  setup(T) {
-    const x = X(
-      () => import("./vue3-xml-viewer.common-Bkgr-tAS.js").then((e) => e.v).then((e) => e.default || e.XmlViewer)
-    ), d = T, y = B(), { t: a } = M(), o = u(null), m = u(!1), t = u(null), h = u(!1), _ = v(() => V(d.resource)), k = v(() => E(d.resource)), w = v(() => {
-      const e = _.value, l = y.maxXmlPreviewCharSize;
-      return !e || !l ? !1 : e <= l;
-    }), C = async () => {
-      if (t.value = null, h.value = !1, !w.value) {
-        h.value = !0;
-        return;
-      }
-      if (k.value === "blocked") {
-        t.value = "cors";
-        return;
-      }
-      m.value = !0;
-      try {
-        const e = await fetch(d.resource.url);
-        if (!e.ok)
-          throw new Error(`HTTP error! status: ${e.status}`);
-        const l = await e.text();
-        o.value = l;
-      } catch (e) {
-        console.error("Error loading XML:", e), e instanceof TypeError ? t.value = "network" : t.value = "generic", o.value = null;
-      } finally {
-        m.value = !1;
-      }
-    };
-    return L(() => {
-      C();
-    }), (e, l) => (r(), g("div", D, [
-      o.value ? (r(), g("div", N, [
-        b(s(x), { xml: o.value }, null, 8, ["xml"])
-      ])) : m.value ? (r(), g("div", P, n(s(a)("Chargement de l'aperçu XML...")), 1)) : h.value ? (r(), i(p, { key: 2 }, {
-        default: c(() => [
-          f(n(_.value ? s(a)("Le fichier XML est trop volumineux pour être prévisualisé. Téléchargez-le depuis l'onglet Téléchargements.") : s(a)("La taille du fichier est inconnue, l'aperçu n'est pas disponible. Téléchargez-le depuis l'onglet Téléchargements.")), 1)
-        ]),
-        _: 1
-      })) : t.value === "cors" ? (r(), i(p, { key: 3 }, {
-        default: c(() => [
-          f(n(s(a)("Ce fichier XML ne peut pas être prévisualisé car il est hébergé sur un site distant qui restreint l'accès (CORS). Téléchargez-le depuis l'onglet Téléchargements.")), 1)
-        ]),
-        _: 1
-      })) : t.value === "network" ? (r(), i(p, { key: 4 }, {
-        default: c(() => [
-          f(n(s(a)("Ce fichier est hébergé sur un site externe qui ne permet pas la prévisualisation. Téléchargez-le depuis l'onglet Téléchargements.")), 1)
-        ]),
-        _: 1
-      })) : t.value ? (r(), i(p, { key: 5 }, {
-        default: c(() => [
-          f(n(s(a)("L'aperçu de ce fichier n'a pas pu être chargé. Téléchargez-le depuis l'onglet Téléchargements.")), 1)
-        ]),
-        _: 1
-      })) : S("", !0)
-    ]));
-  }
-});
-export {
-  A as default
-};