@tekkare/auriga 0.2.50 → 0.2.51

package/dist/module.json

@@ -4,5 +4,5 @@
   "compatibility": {
     "nuxt": "^3.0.0"
   },
-  "version": "0.2.50"
+  "version": "0.2.51"
 }

package/dist/runtime/components/argDropdownSelect.vue

@@ -2,7 +2,15 @@
   <div>
     <!-- Simple select -->
     <div class="oip_select_display">
-      <p class="oip_filter_label">{{ dropdown_label }}</p>
+      <p
+        class="oip_filter_label"
+        :class="labelInfo ? 'oip_row v-center gap-4' : ''"
+      >
+        {{ dropdown_label }}
+        <span v-if="labelInfo" @click="openInfo" class="open-info">
+          <arg-icon name="Info" size="14" color="var(--medium)"
+        /></span>
+      </p>
       <arg-simple-label
         :disabled="disabled"
         @click="changeDisplay()"
@@ -174,9 +182,10 @@ export default defineComponent({
     categories: { type: Array, default: null },
     fuzzySearch: { type: Boolean, default: false },
     fuzzyThreshold: { type: Number, default: 0.5 },
-    filterSearch: { type: Boolean, default: true }
+    filterSearch: { type: Boolean, default: true },
+    labelInfo: { type: Boolean, default: false }
   },
-  emits: ["changeElement", "update:Selection", "changeInputValue"],
+  emits: ["changeElement", "update:Selection", "changeInputValue", "openInfo"],
   setup(props, { emit }) {
     const isDisplay = ref(false);
     const searchName = ref("");
@@ -205,6 +214,9 @@ export default defineComponent({
         setLang();
       }
     );
+    function openInfo() {
+      emit("openInfo");
+    }
     onMounted(() => {
       table_values.value = props.element_table;
       selected_item.value = props.default_select !== null ? props.element_table[props.default_select] : null;
@@ -410,7 +422,8 @@ export default defineComponent({
       getLoaderText,
       getPlaceholder,
       getEmptyContentMsg,
-      getSepPositions
+      getSepPositions,
+      openInfo
     };
   }
 });

package/dist/runtime/components/argDropdownSelect.vue.d.ts

@@ -107,6 +107,10 @@ declare const _default: import("vue").DefineComponent<{
         type: BooleanConstructor;
         default: boolean;
     };
+    labelInfo: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }, {
     isDisplay: import("vue").Ref<boolean>;
     searchName: import("vue").Ref<string>;
@@ -126,7 +130,8 @@ declare const _default: import("vue").DefineComponent<{
     getPlaceholder: import("vue").ComputedRef<any>;
     getEmptyContentMsg: import("vue").ComputedRef<any>;
     getSepPositions: import("vue").Ref<any>;
-}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("changeElement" | "update:Selection" | "changeInputValue")[], "changeElement" | "update:Selection" | "changeInputValue", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    openInfo: () => void;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("changeElement" | "update:Selection" | "openInfo" | "changeInputValue")[], "changeElement" | "update:Selection" | "openInfo" | "changeInputValue", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     element_table: {
         type: {
             (arrayLength: number): string[];
@@ -235,9 +240,14 @@ declare const _default: import("vue").DefineComponent<{
         type: BooleanConstructor;
         default: boolean;
     };
+    labelInfo: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }>> & {
     onChangeElement?: ((...args: any[]) => any) | undefined;
     "onUpdate:Selection"?: ((...args: any[]) => any) | undefined;
+    onOpenInfo?: ((...args: any[]) => any) | undefined;
     onChangeInputValue?: ((...args: any[]) => any) | undefined;
 }, {
     lang: string;
@@ -252,6 +262,7 @@ declare const _default: import("vue").DefineComponent<{
     empty_content_msg: string;
     fuzzySearch: boolean;
     filterSearch: boolean;
+    labelInfo: boolean;
     filter_placeholder: string;
     close_on_click: boolean;
     default_select: number;

package/dist/runtime/components/argSourceCollapse.vue

@@ -15,14 +15,14 @@
           <arg-tags class="source_tag">
             <div class="oip_row v-center gap-4">
               <arg-flag
-                :slug="getCountryName.toLowerCase()"
+                :slug="getCountryName(sourceContent?.country?.toLowerCase())"
                 emoji
                 height="10"
               />
-              <p>{{ sourceCountry }}</p>
+              <p>{{ sourceContent?.country }}</p>
             </div>
           </arg-tags>
-          <p class="source_title">{{ sourceTitle }}</p>
+          <p class="source_title">{{ sourceContent?.title }}</p>
         </div>
       </div>
       <div class="copy_action" @click.stop="copy()">
@@ -41,12 +41,34 @@
       <div class="oip_row v-start gap-16">
         <div class="tag_display">
           <p class="toolbar_tag_title">{{ langData?.sector }}</p>
-          <arg-tags>{{ sourceSector }}</arg-tags>
+          <arg-tags>Public</arg-tags>
         </div>
       </div>
-      <span class="oip_body">
-        <slot />
-      </span>
+      <div class="oip_body">
+        <div v-if="directusToken !== null" class="oip_list v-start gap-24">
+          <div
+            v-if="sourceContent?.providerDescr"
+            class="oip_list v-start gap-8"
+          >
+            <p class="bold">About the provider :</p>
+            <div class="oip_list v-start gap-4">
+              <div v-html="sourceContent?.providerDescr" />
+              <slot name="moreProvider" />
+            </div>
+          </div>
+          <div class="oip_list v-start gap-8">
+            <p class="bold">About the source :</p>
+            <div
+              v-if="sourceContent?.sourceDescr"
+              class="oip_list v-start gap-4"
+            >
+              <div v-html="sourceContent?.sourceDescr" />
+              <slot name="moreSource" />
+            </div>
+          </div>
+        </div>
+        <slot v-else />
+      </div>
     </div>
   </div>
 </template>
@@ -69,15 +91,15 @@ export default defineComponent({
   props: {
     sourceTitle: {
       type: String,
-      required: true
+      default: null
     },
     sourceCountry: {
       type: String,
-      default: "France"
+      default: null
     },
     sourceSector: {
       type: String,
-      default: "Public"
+      default: null
     },
     defaultOpen: {
       type: Boolean,
@@ -89,12 +111,25 @@ export default defineComponent({
       validator: (value) => {
         return ["en", "fr", "es", "jp"].includes(value);
       }
+    },
+    directusToken: {
+      type: String,
+      default: null
+    },
+    providerId: {
+      type: String,
+      default: null
+    },
+    sourceId: {
+      type: String,
+      default: null
     }
   },
   emits: ["copyTitle"],
   setup(props, { emit }) {
     const sourceOpen = ref(false);
     const langData = ref(null);
+    const sourceData = ref(null);
     async function setLang() {
       const jsonFiles = import.meta.glob("./locales/*.json");
       for (const path in jsonFiles) {
@@ -104,8 +139,179 @@ export default defineComponent({
         }
       }
     }
+    async function fetchAll() {
+      const graphqlQuery = `
+{
+    DataProvider(
+        limit: -1
+    ) {
+        provider_uuid
+        provider_country
+        sources {
+            source_uuid
+            translations {
+                source_name
+                source_description
+                languages_code {
+                    code
+                    name
+                }
+            }
+            datasets {
+                id
+                Dataset_id {
+                    id
+                    table_name
+                    schema_name
+                    status
+                }
+            }
+        }
+        translations {
+            provider_name
+            provider_description
+            languages_code {
+                code
+                name
+            }
+        }
+    }
+}
+`;
+      const headers = {
+        Authorization: `Bearer ${props.directusToken}`,
+        "Content-Type": "application/json"
+      };
+      const payload = {
+        query: graphqlQuery
+      };
+      try {
+        const response = await fetch(
+          "https://metadata.rcd.lensuscloud.com/graphql",
+          {
+            method: "POST",
+            headers,
+            body: JSON.stringify(payload)
+          }
+        );
+        if (response.ok) {
+          const responseData = await response.json();
+          console.log("zebi", responseData);
+        } else {
+          const errorText = await response.text();
+          console.log(`Error: ${response.status}. ${errorText}`);
+        }
+      } catch (err) {
+        console.log(`Request failed: ${err.message}`);
+      }
+    }
+    async function fetchData() {
+      const graphqlQuery = `
+        query {
+          DataProvider(
+            filter: {
+                    provider_uuid: { _eq: "${props.providerId}" },
+            }
+          ) {
+              provider_uuid
+              provider_country
+              sources {
+                  source_uuid
+                  translations {
+                      source_name
+                      source_description
+                      languages_code {
+                          code
+                          name
+                      }
+                  }
+                  datasets {
+                      id
+                      Dataset_id {
+                          id
+                          table_name
+                          schema_name
+                          status
+                      }
+                  }
+              }
+              translations {
+                  provider_name
+                  provider_description
+                  languages_code {
+                      code
+                      name
+                  }
+              }
+          }
+        }
+      `;
+      const headers = {
+        Authorization: `Bearer ${props.directusToken}`,
+        "Content-Type": "application/json"
+      };
+      const payload = {
+        query: graphqlQuery
+      };
+      try {
+        const response = await fetch(
+          "https://metadata.rcd.lensuscloud.com/graphql",
+          {
+            method: "POST",
+            headers,
+            body: JSON.stringify(payload)
+          }
+        );
+        if (response.ok) {
+          const responseData = await response.json();
+          sourceData.value = responseData;
+        } else {
+          const errorText = await response.text();
+          console.log(`Error: ${response.status}. ${errorText}`);
+        }
+      } catch (err) {
+        console.log(`Request failed: ${err.message}`);
+      }
+    }
+    function getCountryName(name) {
+      if (name === "united states") {
+        return "usa";
+      } else if (name === "united kingdom") {
+        return "uk";
+      } else if (name === "poland") {
+        return "republic-of-poland";
+      } else
+        return name;
+    }
+    const sourceContent = computed(() => {
+      if (sourceData.value !== null) {
+        const sourceObject = sourceData.value.data.DataProvider[0]?.sources.find((source) => source.source_uuid === props.sourceId).translations.find(
+          (a) => a.languages_code.code.includes(props.lang)
+        );
+        const providerObject = sourceData.value.data.DataProvider[0]?.translations.find(
+          (a) => a.languages_code.code.includes(props.lang)
+        );
+        return {
+          title: `${providerObject?.provider_name} - ${sourceObject?.source_name}`,
+          country: sourceData.value.data.DataProvider[0]?.provider_country,
+          providerDescr: providerObject?.provider_description,
+          sourceDescr: sourceObject?.source_description,
+          sector: "Public"
+        };
+      } else {
+        return {
+          title: props.sourceTitle,
+          country: props.sourceCountry,
+          sector: props.sourceSector
+        };
+      }
+    });
     onBeforeMount(async () => {
       setLang();
+      if (props.directusToken !== null) {
+        await fetchData();
+        await fetchAll();
+      }
     });
     watch(
       () => props.lang,
@@ -116,16 +322,6 @@ export default defineComponent({
     function closeSource() {
       sourceOpen.value = false;
     }
-    const getCountryName = computed(() => {
-      if (props.sourceCountry === "United States") {
-        return "usa";
-      } else if (props.sourceCountry === "United Kingdom") {
-        return "uk";
-      } else if (props.sourceCountry === "Poland") {
-        return "republic-of-poland";
-      } else
-        return props.sourceCountry;
-    });
     onMounted(() => {
       sourceOpen.value = props.defaultOpen;
     });
@@ -158,11 +354,18 @@ export default defineComponent({
       navigator.clipboard.writeText(props.sourceTitle);
       emit("copyTitle");
     }
-    return { closeSource, sourceOpen, copy, getCountryName, langData };
+    return {
+      closeSource,
+      sourceOpen,
+      copy,
+      getCountryName,
+      langData,
+      sourceContent
+    };
   }
 });
 </script>
 
 <style scoped>
-.oip_source_card_collapse{align-self:stretch;border:1px solid var(--light,#dbdef0);border-radius:8px;cursor:pointer;display:flex;flex-direction:column;overflow:hidden;padding:8px 8px 8px 16px;transition:gap .3s linear,max-height .3s linear,background-color .3s linear,padding .3s linear}.oip_source_card_collapse:hover .header>svg{color:var(--primary)!important}.oip_source_card_collapse.close{background-color:var(--white,#fff);gap:0;max-height:110px}.oip_source_card_collapse.open{background-color:var(--demi-fond);gap:16px;max-height:800px;padding:8px 8px 16px 16px}.icon_open{transition:transform .3s}.icon_rotate{transform:rotateX(180deg)}.source_card_header{align-items:center;align-self:stretch;display:flex;flex-direction:row;gap:8px;justify-content:space-between}.source_title{font-family:Figtree;font-size:14px;font-style:normal;font-weight:700;line-height:160%}.source_content{display:flex;flex-direction:column;gap:16px;margin-right:-6px;padding-right:4px;transition:max-height .3s linear,opacity .3s linear}.hide_content{max-height:0;opacity:0}.show_content{max-height:100%;opacity:1;overflow-y:scroll}.show_content::-webkit-scrollbar{height:5px;width:5px}.show_content::-webkit-scrollbar-thumb{background:var(--medium);border-radius:12px!important}.show_content::-webkit-scrollbar-thumb:hover{background:var(--medium)!important}.source_tag{align-self:stretch;display:flex}.toolbar_source_update,.toolbar_tag_title{color:var(--dark);font-size:12px;font-style:normal;font-weight:400;line-height:normal}.tag_display{align-items:flex-start;display:flex;flex-direction:column;gap:var(--s,8px);justify-content:center}.copy_action{align-items:center;background:var(--white);border:1px solid var(--light);border-radius:6px;box-shadow:0 1px 2px 0 rgba(30,41,59,.1);color:var(--dark);cursor:pointer;display:flex;flex-direction:row;font-size:12px;font-style:normal;font-weight:500;gap:4px;line-height:normal;padding:4px 8px 4px 6px;white-space:nowrap}.copy_action:hover,.copy_action:hover svg{color:var(--primary)!important}.title_container{display:flex;flex-direction:column;gap:4px}
+.oip_source_card_collapse{align-self:stretch;border:1px solid var(--light,#dbdef0);border-radius:8px;cursor:pointer;display:flex;flex-direction:column;overflow:hidden;padding:8px 8px 8px 16px;transition:gap .3s linear,max-height .3s linear,background-color .3s linear,padding .3s linear}.bold{font-weight:700}.oip_source_card_collapse:hover .header>svg{color:var(--primary)!important}.oip_source_card_collapse.close{background-color:var(--white,#fff);gap:0;max-height:110px}.oip_source_card_collapse.open{background-color:var(--demi-fond);gap:16px;max-height:800px;padding:8px 8px 16px 16px}.icon_open{transition:transform .3s}.icon_rotate{transform:rotateX(180deg)}.source_card_header{align-items:center;align-self:stretch;display:flex;flex-direction:row;gap:8px;justify-content:space-between}.source_title{font-family:Figtree;font-size:14px;font-style:normal;font-weight:700;line-height:160%}.source_content{display:flex;flex-direction:column;gap:16px;margin-right:-6px;padding-right:4px;transition:max-height .3s linear,opacity .3s linear}.hide_content{max-height:0;opacity:0}.show_content{max-height:100%;opacity:1;overflow-y:scroll}.show_content::-webkit-scrollbar{height:5px;width:5px}.show_content::-webkit-scrollbar-thumb{background:var(--medium);border-radius:12px!important}.show_content::-webkit-scrollbar-thumb:hover{background:var(--medium)!important}.source_tag{align-self:stretch;display:flex}.toolbar_source_update,.toolbar_tag_title{color:var(--dark);font-size:12px;font-style:normal;font-weight:400;line-height:normal}.tag_display{align-items:flex-start;display:flex;flex-direction:column;gap:var(--s,8px);justify-content:center}.copy_action{align-items:center;background:var(--white);border:1px solid var(--light);border-radius:6px;box-shadow:0 1px 2px 0 rgba(30,41,59,.1);color:var(--dark);cursor:pointer;display:flex;flex-direction:row;font-size:12px;font-style:normal;font-weight:500;gap:4px;line-height:normal;padding:4px 8px 4px 6px;white-space:nowrap}.copy_action:hover,.copy_action:hover svg{color:var(--primary)!important}.title_container{display:flex;flex-direction:column;gap:4px}
 </style>

package/dist/runtime/components/argSourceCollapse.vue.d.ts

@@ -1,15 +1,15 @@
 declare const _default: import("vue").DefineComponent<{
     sourceTitle: {
         type: StringConstructor;
-        required: true;
+        default: null;
     };
     sourceCountry: {
         type: StringConstructor;
-        default: string;
+        default: null;
     };
     sourceSector: {
         type: StringConstructor;
-        default: string;
+        default: null;
     };
     defaultOpen: {
         type: BooleanConstructor;
@@ -20,24 +20,49 @@ declare const _default: import("vue").DefineComponent<{
         default: string;
         validator: (value: string) => boolean;
     };
+    directusToken: {
+        type: StringConstructor;
+        default: null;
+    };
+    providerId: {
+        type: StringConstructor;
+        default: null;
+    };
+    sourceId: {
+        type: StringConstructor;
+        default: null;
+    };
 }, {
     closeSource: () => void;
     sourceOpen: import("vue").Ref<boolean>;
     copy: () => void;
-    getCountryName: import("vue").ComputedRef<string>;
+    getCountryName: (name: string) => string;
     langData: import("vue").Ref<any>;
+    sourceContent: import("vue").ComputedRef<{
+        title: string;
+        country: any;
+        providerDescr: any;
+        sourceDescr: any;
+        sector: string;
+    } | {
+        title: string;
+        country: string;
+        sector: string;
+        providerDescr?: undefined;
+        sourceDescr?: undefined;
+    }>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "copyTitle"[], "copyTitle", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     sourceTitle: {
         type: StringConstructor;
-        required: true;
+        default: null;
     };
     sourceCountry: {
         type: StringConstructor;
-        default: string;
+        default: null;
     };
     sourceSector: {
         type: StringConstructor;
-        default: string;
+        default: null;
     };
     defaultOpen: {
         type: BooleanConstructor;
@@ -48,12 +73,28 @@ declare const _default: import("vue").DefineComponent<{
         default: string;
         validator: (value: string) => boolean;
     };
+    directusToken: {
+        type: StringConstructor;
+        default: null;
+    };
+    providerId: {
+        type: StringConstructor;
+        default: null;
+    };
+    sourceId: {
+        type: StringConstructor;
+        default: null;
+    };
 }>> & {
     onCopyTitle?: ((...args: any[]) => any) | undefined;
 }, {
     lang: string;
+    sourceTitle: string;
     sourceCountry: string;
     sourceSector: string;
     defaultOpen: boolean;
+    directusToken: string;
+    providerId: string;
+    sourceId: string;
 }, {}>;
 export default _default;

package/dist/runtime/components/locales/en.json

@@ -81,7 +81,9 @@
     },
     "sourceCollapse": {
         "copySource": "Copy",
-        "sector": "Sector"
+        "sector": "Sector",
+        "aboutProvider": "About the provider :",
+        "aboutSource": "About the source :"
     },
 
     "backOIP": "Back to OIP",

package/dist/runtime/components/locales/es.json

@@ -81,7 +81,9 @@
     },
     "sourceCollapse": {
         "copySource": "Copiar",
-        "sector": "Sector"
+        "sector": "Sector",
+        "aboutProvider": "Sobre el proveedor :",
+        "aboutSource": "Sobre la fuente :"
     },
     "backOIP": "Volver a OIP",
     "footer": {

package/dist/runtime/components/locales/fr.json

@@ -81,7 +81,9 @@
     },
     "sourceCollapse": {
         "copySource": "Copier",
-        "sector": "Secteur"
+        "sector": "Secteur",
+        "aboutProvider": "À propos du provider :",
+        "aboutSource": "À propos de la source :"
     },
     "backOIP": "Retour OIP",
     "footer": {

package/dist/runtime/components/locales/jp.json

@@ -81,7 +81,9 @@
   },
   "sourceCollapse": {
     "copySource": "コピー",
-    "sector": "セクター"
+    "sector": "セクター",
+    "aboutProvider": "Sプロバイダーについて :",
+    "aboutSource": "ソースについて :"
   },
   "backOIP": "OIPに戻る",
   "footer": {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tekkare/auriga",
-  "version": "0.2.50",
+  "version": "0.2.51",
   "description": "Aurgia is a UI kit developped by Tekkare",
   "license": "MIT",
   "type": "module",