npm - @silexlabs/silex-dashboard - Versions diffs - 1.0.57 → 1.0.59 - Mend

@silexlabs/silex-dashboard 1.0.57 → 1.0.59

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (45) hide show

package/templates/connectors-en.html CHANGED Viewed

@@ -8,7 +8,7 @@ collection: "Connectors"
 <html lang="">
 <head>
 <meta charset="UTF-8">
-<link rel="stylesheet" href="/css/connectors-bb5104e4124d29465b3866b632c9a173d84b60bc78e4cd1607bc92a1ca85fb5b.css" />
+<link rel="stylesheet" href="/css/connectors-748797d88cc32c0787052966e54e4f794629b8460d24f2aadac83c13899574fb.css" />
 <!--  font google -->
 <link rel="preconnect" href="https://fonts.gstatic.com" />
 <link href="https://fonts.googleapis.com/css2?family=Ubuntu:wght@300;700&display=swap" rel="stylesheet">
@@ -40,6 +40,16 @@ collection: "Connectors"
   .button{
     min-width:110px;
   }
+  details {
+	max-height: 2em;
+    display: block;
+    overflow: hidden;
+    transition: max-height .75s ease;
+  }
+  details[open] {
+    max-height: 40em;
+  }
   /*BTNS*/
   a {
     text-decoration: none;
@@ -151,288 +161,163 @@ collection: "Connectors"
 <script src="/js/vue.global.prod.js"></script>
 <script src="/js/main.js"></script>
 <script type="module">
-const CONNECTORS_PATH = '/connectors/'
-window.addEventListener('load', function() {
-  const { createApp } = Vue;
-  const { api, constants, types } = silex;
-  const {
-    ConnectorType,
-  } = types
-  const {
-    setServerUrl,
-    getUser,
-    logout,
-    websiteDelete,
-    websiteDuplicate,
-    websiteList,
-    websiteCreate,
-    websiteMetaWrite,
-  } = api
-  function toSafeId(name) {
-    return name.replace(/[/\\?%*:|"<>]/g, '_')
-  }
+const CONNECTORS_PATH = ''
+const { createApp } = Vue;
+const { api, constants, types } = silex;
+const {
+  ConnectorType,
+} = types
+const {
+  setServerUrl,
+  getUser,
+  logout,
+  websiteDelete,
+  websiteDuplicate,
+  websiteList,
+  websiteCreate,
+  websiteMetaWrite,
+  connectorList,
+} = api
+function toSafeId(name) {
+  return name.replace(/[/\\?%*:|"<>]/g, '_')
+}
-  const App = {
-    data() {
-      return {
-        websites: [],
-        newWebsiteName: '',
-        showCreationForm: false,
-        error: null,
-        message: null,
-        loggedIn: false,
-        loading: true,
-        storage: null,
-        user: null,
-        showMenu: false,
-        empty: false,
+const App = {
+  data() {
+    return {
+      websites: [],
+      connectors: [],
+      newWebsiteName: '',
+      showCreationForm: false,
+      error: null,
+      message: null,
+      loggedIn: false,
+      loading: true,
+      storage: null,
+      user: null,
+      showMenu: false,
+      empty: false,
+    }
+  },
+  mounted() {
+    this.init()
+  },
+  methods: {
+    async init() {
+      try {
+        // Init Silex server path
+        // Go up one level because of the language prefix
+        setServerUrl(window.location.origin)
+        await this.getConnectors()
+      } catch (error) {
+        console.error(error)
+        this.loading = false
+        this.error = `{{ api-translations[lang]["Failed to start dashboard"] }} - ${error.message}`
+        this.message = ''
       }
     },
-    mounted() {
-      this.init()
-    },
-    methods: {
-      async init() {
-        try {
-          // Init Silex server path
-          // Go up one level because of the language prefix
-          setServerUrl(window.location.origin)
-          // Start
-          const user = await getUser({type: ConnectorType.STORAGE})
-          // Escape single quotes in the picture URL and decode the picture URL
-          user.picture = decodeURIComponent(user.picture).replace(/'/g, "\\'")
-          if(user) {
-            this.user = user
-            this.loggedIn = true
-            this.websites = await websiteList({connectorId: this.user.storage.connectorId})
-            this.empty = this.websites.length === 0
-            this.loading = false
-          } else {
-            this.openLogin()
-          }
-        } catch (error) {
-          console.error(error)
-          this.loading = false
-          if(error.code === 401 || error.httpStatusCode === 401) {
-            this.loggedIn = false
-            this.openLogin()
-          } else {
-            this.error = `{{ api-translations[lang]["Failed to start dashboard"] }} - ${error.message}`
-            this.message = ''
-          }
-        }
-      },
-      openLogin(id, lang) {
-        //throw new Error('debug')
-        const path = `/{{lang}}${CONNECTORS_PATH}`
-        console.log(window.location.pathname, window.location.path, path)
-        if(window.location.pathname === path) return
-        window.open(path, '_self')
-      },
-      openEditor(id, lang) {
-        window.open(`/?id=${id}&lang=${lang}&connectorId=${this.user.storage.connectorId}`, '_self')
-      },
-      async logout() {
-        await logout({
-          type: ConnectorType.STORAGE,
-          connectorId: this.user.storage.connectorId,
-        })
-        window.location.reload()
-      },
-      async createWebsite() {
-        try {
-          if (!this.newWebsiteName) throw new Error('{{ api-translations[lang]["You need to provide a website name"] }}')
-          this.loading = true
-          const websiteId = toSafeId(this.newWebsiteName)
-          const result = await websiteCreate({
-            websiteId,
-            data: {
-              name: this.newWebsiteName,
-              imageUrl: null,
-            },
-            connectorId: this.user.storage.connectorId
-          })
-          this.message = '{{ api-translations[lang]["Website created successfully"] }}'
-          this.error = ''
-          this.newWebsiteName = ''
-          this.showCreationForm = false;
-          this.websites = await websiteList({connectorId: this.user.storage.connectorId})
-          this.empty = this.websites.length === 0
-          this.loading = false
-          return result
-        } catch (error) {
-          this.loading = false
-          console.error(error)
-          this.error = `{{ api-translations[lang]["Failed to create website"] }} - ${error.message}`
-          this.message = ''
-        }
-      },
+    getIcon(connector) {
+      return decodeURIComponent(connector.icon.split(',').slice(1).join(','))
+    },
-      async deleteWebsite(websiteId) {
-        const ok = confirm('{{ api-translations[lang]["Deleting a website? Are your sure? Really?"] }}')
-        if (!ok) return
-        this.loading = true
-        try {
-          const result = await websiteDelete({websiteId, connectorId: this.user.storage.connectorId})
-          this.message = '{{ api-translations[lang]["Website deleted successfully"] }}'
-          this.error = ''
-          this.websites = await websiteList({connectorId: this.user.storage.connectorId})
-          this.empty = this.websites.length === 0
-          this.loading = false
-          return result
-        } catch (error) {
-          this.loading = false
-          this.error = `{{ api-translations[lang]["Failed to delete website"] }} - ${error.message}`
-          this.message = ''
-        }
-      },
+    getHref(connector) {
+      console.log(connector, connector.oauthUrl)
+      return connector.oauthUrl
+    },
-      async duplicateWebsite(websiteId) {
-        this.loading = true
-        try {
-          await websiteDuplicate({websiteId, connectorId: this.user.storage.connectorId, data: { name }})
-          this.error = ''
-          this.websites = await websiteList({connectorId: this.user.storage.connectorId})
-          this.message = '{{ api-translations[lang]["Website duplicated successfully"] }}'
-          this.empty = this.websites.length === 0
-          this.loading = false
-        } catch (error) {
-          this.loading = false
-          this.error = `{{ api-translations[lang]["Failed to duplicate website"] }} - ${error.message}`
-          this.message = ''
-        }
-      },
+    getConnectorStyle(connector) {
+      return {
+        backgroundImage: `url(${connector.icon})`,
+        //color: connector.color,
+        //backgroundColor: connector.background
+      }
+    },
-      async renameWebsite(websiteId) {
-        const website = this.websites.find(w => w.websiteId === websiteId)
-        const name = prompt('{{ api-translations[lang]["New name for this website"] }}', website.name)
-        if (!name) return
+    async getConnectors() {
+      try {
         this.loading = true
-        try {
-          const result = await websiteMetaWrite({websiteId, connectorId: this.user.storage.connectorId, data: { name }})
-          this.message = '{{ api-translations[lang]["Website renamed successfully"] }}'
-          this.error = ''
-          this.websites = await websiteList({connectorId: this.user.storage.connectorId})
-          this.empty = this.websites.length === 0
-          this.loading = false
-          return result
-        } catch (error) {
-          this.loading = false
-          this.error = `{{ api-translations[lang]["Failed to rename website"] }} - ${error.message}`
-          this.message = ''
-        }
-      },
+        const connectors = await connectorList({ type: ConnectorType.STORAGE })
+        this.connectors = connectors
+        this.loading = false
+      } catch (error) {
+        this.loading = false
+        console.error(error)
+        this.error = `{{ api-translations[lang]["Failed to get connectors"] }} - ${error.message}`
+        this.message = ''
+      }
     },
-  };
-  // Prepare elements for vue
-  document.querySelectorAll('[v-text], [v-html]')
+	openLogin() {}
+  },
+};
+// Prepare elements for vue
+document.querySelectorAll('[v-text], [v-html]')
   .forEach(el => el.innerText = '')
-  // Create the app
-  const app = createApp(App);
+document.querySelectorAll('[data-remove-href]')
+  .forEach(el => {
+  	el.removeAttribute('href')
+    el.removeAttribute('data-remove-href')
+  })
-  // Suppress "v-text will override element children" warning
-  app.config.compilerOptions.directiveTransforms = {
-    text: false,
-  }
-  // Mount the app
-  app.mount('.app');
+// Create the app
+const app = createApp(App);
+// Mount the app
+app.mount('.app');
+// Remove loading
+setTimeout(() => {
+  document.querySelector('.before-js').classList.add('after-js')
+}, 100)
-  // Remove loading
-  setTimeout(() => {
-    document.querySelector('.before-js').classList.add('after-js')
-  }, 100)
-})
 </script>
 <title>Silex Dashboard</title>
 <link rel="icon" href="/assets/favicon-32x32.png" />
 <meta name="og:title" property="og:title" content="Silex Dashboard"/>
 <link href="https://fonts.googleapis.com" rel="preconnect" ><link href="https://fonts.gstatic.com" rel="preconnect" crossorigin ><link href="https://fonts.googleapis.com/css?family=Ubuntu&display=swap" rel="stylesheet" ></head>
-<body id="i2hcfw" class="body app before-js"><A id="ixzhcr" href="/" class="button button-bar__item--secondary">{{ api-translations[lang]["Back to home"] }}</A><div id="imawg3" class="bg-silex-purpel">{% liquid
-    assign var_imgx81_1983 = tina.connectorsConnection.edges | where: "node.lang", page.lang | first
-	assign var_imgx81_1984 = var_imgx81_1983.node
-    assign state_imgx81-1985_imgx81-7uhkrqd2giq = var_imgx81_1984
+{% liquid
+    assign var_i2hcfw_22919 = tina.settingsConnection.edges | where: "node.lang", page.lang | first
+    assign state_i2hcfw-1214_i2hcfw-xbsn5ipretk = var_i2hcfw_22919
+  %}<body id="i2hcfw" class="body app before-js"><A id="ixzhcr" href="/" class="button button-bar__item--secondary">{{ api-translations[lang]["Back to home"] }}</A><div id="imawg3" class="bg-silex-purpel">{% liquid
+    assign var_imgx81_22906 = tina.connectorsConnection.edges | where: "node.lang", page.lang | first
+	assign var_imgx81_22907 = var_imgx81_22906.node
+    assign state_imgx81-1985_imgx81-7uhkrqd2giq = var_imgx81_22907
   %}<div id="imgx81" class=""><div id="iikf0s" class="box box_login"><div id="ie0dxn" class="text-centered"><img id="ior0hl" src="/assets/logo-silex.svg"/><p id="it2175" class="subtitle-16">{% liquid
-    assign var_it2175_1937 = state_imgx81-1985_imgx81-7uhkrqd2giq.subtitle
-    echo var_it2175_1937
+    assign var_it2175_22902 = state_imgx81-1985_imgx81-7uhkrqd2giq.subtitle
+    echo var_it2175_22902
   %}</p></div><h3 id="iqc1xf" class="margin-top">{% liquid
-    assign var_iqc1xf_1938 = state_imgx81-1985_imgx81-7uhkrqd2giq.recommended
-    echo var_iqc1xf_1938
-  %}</h3><div id="in62y2">{% liquid
-    assign var_isqe61_1959 = state_imgx81-1985_imgx81-7uhkrqd2giq.connectors
+    assign var_iqc1xf_22903 = state_imgx81-1985_imgx81-7uhkrqd2giq.recommended
+    echo var_iqc1xf_22903
+  %}</h3><div id="in62y2"><div id="isqe61" class="" v-for="(connector, index) in connectors.slice(0, 1)"><a id="i44y9w" href="https://" class="connector__card" :href="getHref(connector)" data-remove-href="true"><div id="io3lid" class="button-bar__item__icon" :style="getConnectorStyle(connector)"></div><div id="i87asw" class="connector__description" v-text="connector.displayName">Login with <span href="" id="i0tt68">Name</span><br/></div></a></div></div><DETAILS id="ihn6fj"><summary id="i8w75b" class="margin-30">{% liquid
+    assign var_i8w75b_22904 = state_imgx81-1985_imgx81-7uhkrqd2giq.advanced_users
+    echo var_i8w75b_22904
+  %}</summary><div class="" v-for="(connector, index) in connectors.slice(1)"><a href="/" class="connector__card" v-bind:href="connector.oauthUrl" :key="index"><div class="button-bar__item__icon" :style="getConnectorStyle(connector)"></div><div class="connector__description" v-text="connector.displayName">Login with <span href="">Name</span><br/></div></a></div></DETAILS><div id="i3cney" class="button-bar"><a id="iacshy" class="button big-button connector__card" v-if="!loading" :key="index" :style="{ backgroundColor: connector.background, color: connector.color }" v-for="(connector, index) in connectors" v-on-click="openLogin(connector)"><div id="iiwn36"><div class="button-bar__item__icon" :style="`background: url('${connector.icon}'); background-repeat: no-repeat; background-size: contain;`"></div><div id="if4gvb" class="" v-text="connector.displayName">Name<br/></div></div><div id="isndui">This connector is about blablabla<br/></div></a></div><div id="ijflxq" class="text-centered">{% liquid
+    assign var_ijflxq_22905 = state_imgx81-1985_imgx81-7uhkrqd2giq.help
+    echo var_ijflxq_22905
+  %}</div></div><div id="i9msnk" class="text-white top-space-20" v-if="error" v-text="message" :test="message">Insert your text here</div><div id="i6akll" class="button button--tertiary text-centered" v-if="error" v-on:click="logout()">{{ api-translations[lang]["Logout"] }}</div></div></div><FOOTER class="footer">{% liquid
+    assign var_iprzeh_22918 = state_i2hcfw-1214_i2hcfw-xbsn5ipretk.node.footer_links
     %}
-    {% for state_isqe61-589___data in var_isqe61_1959 %}
-  {% liquid
-    assign var_isqe61_1957 = forloop.index0
-	assign var_isqe61_1958 = "0"
+    {% for state_isucae-3308___data in var_iprzeh_22918 %}
+  <div id="iprzeh" class="footer__column"><h3 href="" class="footer__item">{% liquid
+    assign var_ineync_22913 = state_isucae-3308___data.title
+    echo var_ineync_22913
+  %}</h3>{% liquid
+    assign var_i6qx92_22915 = state_isucae-3308___data.columns
     %}
-    {% if var_isqe61_1957 <= var_isqe61_1958 %}
-  <div id="isqe61" class="">{% liquid
-    assign var_i0vhjr_1952 = state_isqe61-589___data.background_color
-    assign state_i0vhjr-6879_i0vhjr-uop2xr4ta4 = var_i0vhjr_1952
-  %}
-{% liquid
-    assign var_i0vhjr_1953 = state_isqe61-589___data.color
-    assign state_i0vhjr-6879_i0vhjr-q0yr34th38p = var_i0vhjr_1953
-  %}<a id="i0vhjr" href="{% liquid
-    assign var_i0vhjr_1954 = state_isqe61-589___data.auth_url
-    echo var_i0vhjr_1954
-  %}" class="connector__card" data-style="{% liquid
-    assign var_i0vhjr_1955 = "background: " | append: state_i0vhjr-6879_i0vhjr-uop2xr4ta4 | append: "; color: " | append: state_i0vhjr-6879_i0vhjr-q0yr34th38p | append: ";"
-    echo var_i0vhjr_1955
-  %}" title="{% liquid
-    assign var_i0vhjr_1956 = state_isqe61-589___data.description | strip_html
-    echo var_i0vhjr_1956
-  %}"><div id="io3lid" class="button-bar__item__icon">{% liquid
-    assign var_io3lid_1950 = state_isqe61-589___data.icon
-    echo var_io3lid_1950
-  %}</div><div id="i87asw" class="connector__description">{% liquid
-    assign var_i87asw_1951 = state_isqe61-589___data.text
-    echo var_i87asw_1951
-  %}</div></a></div>{% endif %}{% endfor %}</div><DETAILS id="igp4xl"><summary id="i8w75b" class="margin-30">{% liquid
-    assign var_i8w75b_1960 = state_imgx81-1985_imgx81-7uhkrqd2giq.advanced_users
-    echo var_i8w75b_1960
-  %}</summary>{% liquid
-    assign var_id9k25_1981 = state_imgx81-1985_imgx81-7uhkrqd2giq.connectors
-    %}
-    {% for state_isqe61-589___data in var_id9k25_1981 %}
-  {% liquid
-    assign var_id9k25_1979 = forloop.index0
-	assign var_id9k25_1980 = "0"
-    %}
-    {% if var_id9k25_1979 > var_id9k25_1980 %}
-  <div id="id9k25" href="" class="">{% liquid
-    assign var_irgt6z_1974 = state_isqe61-589___data.background_color
-    assign state_i0vhjr-6879_i0vhjr-uop2xr4ta4 = var_irgt6z_1974
-  %}
-{% liquid
-    assign var_irgt6z_1975 = state_isqe61-589___data.color
-    assign state_i0vhjr-6879_i0vhjr-q0yr34th38p = var_irgt6z_1975
-  %}<a href="{% liquid
-    assign var_irgt6z_1976 = state_isqe61-589___data.auth_url
-    echo var_irgt6z_1976
-  %}" id="irgt6z" class="connector__card" data-style="{% liquid
-    assign var_irgt6z_1977 = "background: " | append: state_i0vhjr-6879_i0vhjr-uop2xr4ta4 | append: "; color: " | append: state_i0vhjr-6879_i0vhjr-q0yr34th38p | append: ";"
-    echo var_irgt6z_1977
-  %}" title="{% liquid
-    assign var_irgt6z_1978 = state_isqe61-589___data.description | strip_html
-    echo var_irgt6z_1978
-  %}"><div class="button-bar__item__icon">{% liquid
-    assign var_iublx3_1972 = state_isqe61-589___data.icon
-    echo var_iublx3_1972
-  %}</div><div class="connector__description">{% liquid
-    assign var_idatmu_1973 = state_isqe61-589___data.text
-    echo var_idatmu_1973
-  %}</div></a></div>{% endif %}{% endfor %}</DETAILS><div id="i3cney" class="button-bar"><a id="iacshy" class="button big-button connector__card" v-if="!loading" :key="index" :style="{ backgroundColor: connector.background, color: connector.color }" v-for="(connector, index) in connectors" v-on-click="openLogin(connector)"><div id="iiwn36"><div class="button-bar__item__icon" :style="`background: url('${connector.icon}'); background-repeat: no-repeat; background-size: contain;`"></div><div id="if4gvb" class="" v-text="connector.displayName">Name<br/></div></div><div id="isndui">This connector is about blablabla<br/></div></a></div><div id="ijflxq" class="text-centered">{% liquid
-    assign var_ijflxq_1982 = state_imgx81-1985_imgx81-7uhkrqd2giq.help
-    echo var_ijflxq_1982
-  %}</div></div><div id="i9msnk" class="text-white top-space-20" v-if="error" v-text="message" :test="message">Insert your text here</div><div id="i6akll" class="button button--tertiary text-centered" v-if="error" v-on:click="logout()">{{ api-translations[lang]["Logout"] }}</div></div></div></body>
+    {% for state_i2u9h4-2642___data in var_i6qx92_22915 %}
+  <a href="{% liquid
+    assign var_i6qx92_22916 = state_i2u9h4-2642___data.url
+    echo var_i6qx92_22916
+  %}" class="footer__item" target="{% liquid
+    assign var_i6qx92_22917 = state_i2u9h4-2642___data.target
+    echo var_i6qx92_22917
+  %}">{% liquid
+    assign var_i6qx92_22914 = state_i2u9h4-2642___data.label
+    echo var_i6qx92_22914
+  %}</a>{% endfor %}</div>{% endfor %}</FOOTER></body>
 </html>

package/templates/connectors-fr.11tydata.mjs CHANGED Viewed

@@ -16,6 +16,31 @@ export default async function (configData) {
   body: JSON.stringify({
     query: `query {
 __typename
+settingsConnection {
+  __typename
+  edges {
+    __typename
+    node {
+      __typename
+      footer_links {
+        __typename
+        title
+        columns {
+          __typename
+          label
+          url
+          target
+        }
+      }
+      lang
+    }
+  }
+}
 connectorsConnection {
   __typename
   edges {
@@ -25,16 +50,6 @@ connectorsConnection {
       subtitle
       recommended
       advanced_users
-      connectors {
-        __typename
-        background_color
-        color
-        auth_url
-        description
-        icon
-        text
-      }
       help
       lang