initial commit

Author: SalvadorDalia

.dev/localhost.cert

@@ -0,0 +1,29 @@
+-----BEGIN CERTIFICATE-----
+MIIFCzCCAvOgAwIBAgIUfLvXiw1GaycV+Ya/jmJ54EqjEb0wDQYJKoZIhvcNAQEL
+BQAwFDESMBAGA1UEAwwJMTI3LjAuMC4xMCAXDTI0MDIxNTEyMDMxM1oYDzIwNTEw
+NzAyMTIwMzEzWjAUMRIwEAYDVQQDDAkxMjcuMC4wLjEwggIiMA0GCSqGSIb3DQEB
+AQUAA4ICDwAwggIKAoICAQDDdhdcQr1JGffkrBK7zDukb79YkD5Hg1FWWgByztdv
+dc0jvEnGLqkgaL8NYlmZqh5NRZ7ncp/A3C01wxGMAL1jhjcX56wt0hQRdszGdi0J
+XN8Ixqa2JLcNn20D4152HPgB7F/JlTPviW4Bws67sUs3JT0wrdjtx77rg4tPCL/S
+qP6N21EHXokVnwQHkFh/MUx1+agHDZL6U9iB0MKVErL/q2HLibQfjkJs5Y6kzdQQ
+WwVwbZul8XzEi9lU90hnBqT4wvDxYYzKZD+o4965B0ThhDbuYN8J4VCLE1mOLlhC
+bpKfMdwA3Un881MgWQXImGseAu1vYN7a8P3xy1LsLdjb6Du86/fQ8SL3YfH+wlw6
+5eQ2J3KYheQgpwlpmIvjLNFqc72ymCIjcWWfW7gT81XmdfhlKObo8HQdrp1uMrSN
+78xRLu9kRmL1iqHgqTF8kn3jUAGPr5EoUyzf8z8cX2Px0B7y8x/o845+CySHenZv
+AMkxA7N46c4M7o8kwHHm79dQO0Ep6dyiCTTII+DWe5BpbNlq1ddWynk5Rc2KQrvT
+oBV0cLpjvXQAlWB9YzqG6J4tvnfO3RjgUNgxfSDF2XW2Wi1mtnsk8m4NDGgOjLz0
+lVrPaeEXMDWiofpuMMW02MIYGTTYSFvO/TPO06tjVxq2jDshoUNS9faRhSxuOCEP
+CQIDAQABo1MwUTAdBgNVHQ4EFgQU7UYziQNqS7MqiGXjxN5KDKz784UwHwYDVR0j
+BBgwFoAU7UYziQNqS7MqiGXjxN5KDKz784UwDwYDVR0TAQH/BAUwAwEB/zANBgkq
+hkiG9w0BAQsFAAOCAgEAgZGo35kJFFEYS1iBHeLuo/7grrA2wcjR4e2eONKq21QU
+FJfbp+CpWkvMjq0SBq174KgfNpGrKD5KnfpBJoVD/9s43XGSCDzitZeW2mQtQ3uD
+nMYWGNE2rceZWmdDOKhhKMeDRdfososIdtFxBYW6nS9Znx2IwAvlDeOobmwgmUzb
+C2Y0S3lUnwQ2E7WStIN7zm43aFVRgigIm71sSWKpQoCfoy63ETG4m2q7uu/Ldw3y
+vGF2KA//ThrjWljqNu3xIRaSFWYhKJ6/Y78NNsg5vIoiI+Wk4PigY8Z3UQWdGjmW
+9tZG7SAN2b4s6Zan2fbF3R4q6H3x3N3ZsjKVlBroyaOLN4WFABIHbU81ggFxIsFO
+6RXHfNGDuPuYTrtlogvJ47nI4C5WeUFDWFcZQQ7BrS9ewZcLI5fOvejjlFqvSl87
+Y1StpTgVUEFL08bdjyFtAw7miJeofyT8bO1m/0Hg+snBtvBCCAJxflSVuySLp5Bi
+EtFxi53J+kezvRm64Y9ub61NGatXUAuPr7Z0P58ES6MgpoYgzUGeybV97MpDsRQb
+ze3fzqL5rE3Upb2asgINWjAXDM2Qhr8aY0OVKJQ1P4c+yyddlb3vzNfw0G5W0bsJ
+na+/Pfz1M60k1OxsWUGXWOPIEi29VeERDzSwhC4zShPAKYIlqrUpMunHoAGlGvM=
+-----END CERTIFICATE-----

.dev/localhost.key

@@ -0,0 +1,52 @@
+-----BEGIN PRIVATE KEY-----
+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
+0C66dFZAOvWn1oIUWWms2ytx0rg7sA==
+-----END PRIVATE KEY-----

.editorconfig

@@ -0,0 +1,9 @@
+root = true
+
+[*]
+end_of_line = lf
+
+[*.{js,jsx,mdx,ts,json,mjs,css}]
+charset = utf-8
+indent_style = space
+indent_size = 2

.eslintignore

@@ -0,0 +1,4 @@
+node_modules
+dist
+.eslintrc.cjs
+esbuild.config.js

.eslintrc.cjs

@@ -0,0 +1,40 @@
+module.exports = {
+  root: true,
+  env: {
+    browser: true,
+    es6: true,
+  },
+  extends: ['eslint:recommended', 'prettier'],
+  parserOptions: {
+    sourceType: 'module',
+    ecmaVersion: 2020,
+  },
+  rules: {
+    'no-unused-vars': ['warn', { argsIgnorePattern: '^_' }],
+    'linebreak-style': 0,
+
+    /* This rule will warn when it encounters a reference to an identifier that has not yet been declared. */
+    'no-use-before-define': [
+      'error',
+      {
+        variables: false,
+      },
+    ],
+
+    /* Enforce require() on the top-level module scope */
+    'global-require': 0,
+
+    'max-len': [
+      'error',
+      {
+        code: 120,
+      },
+    ],
+
+    'guard-for-in': 0,
+    'no-underscore-dangle': 0,
+    'import/prefer-default-export': 0,
+    'import/no-anonymous-default-export': 0,
+    'import/no-extraneous-dependencies': 0,
+  },
+};

.gitignore

@@ -0,0 +1,2 @@
+node_modules
+dist

.prettierrc

@@ -0,0 +1,7 @@
+{
+  "endOfLine": "lf",
+  "semi": true,
+  "singleQuote": true,
+  "tabWidth": 2,
+  "trailingComma": "all"
+}

.vscode/settings.json

@@ -0,0 +1,6 @@
+{
+    "[css][scss][javascript][typescript][javascriptreact][typescriptreact][json][mdx][html]": {
+        "editor.formatOnSave": true,
+        "editor.defaultFormatter": "esbenp.prettier-vscode"
+    },
+}

README.md

@@ -0,0 +1,56 @@
+[[_TOC_]]
+
+# Custom Links Plugin
+
+## Quick start
+
+1. `yarn` - to install dependencies
+2. `yarn start` - to start development mode - rebuild on file modifications
+3. update your `plugin-manifest.json` file to contain the production URL and other plugin information
+4. `yarn build` - to build plugins
+
+## Dev environment
+
+Dev environment is configured to use:
+
+* `prettier` - best used with automatic format on save in IDE
+* `eslint` - it is built into both `start` and `build` commands
+
+## Output
+
+The plugins are built into a single `dist/index.js` file. The manifest is copied to `dist/plugin-manifest.json` file.
+
+## Deployment
+
+<!-- TO DO -->
+
+## Loading the plugin
+
+**Warning:** While developing, you can use  `https://localhost:3053/plugin-manifest.json` address to load the plugin manifest. Make sure your browser trusts the local certificate on the latter, to be able to use it e.g. with `https://editor.flotiq.com`
+
+### URL
+
+**Hint**: You can use localhost url from development mode `https://localhost:3053/index.js`
+
+1. Open Flotiq editor
+2. Open Chrome Dev console
+3. Execute the following script
+   ```javascript
+   FlotiqPlugins.loadPlugin('plugin-id', '<URL TO COMPILED JS>')
+   ```
+4. Navigate to the view that is modified by the plugin
+
+### Directly
+
+1. Open Flotiq editor
+2. Open Chrome Dev console
+3. Paste the content of `dist/index.js` 
+4. Navigate to the view that is modified by the plugin
+
+### Deployment
+
+**Hint**: You can use localhost url from development mode `https://localhost:3053/plugin-manifest.json`
+
+1. Open Flotiq editor
+2. Add a new plugin and paste the URL to the hosted `plugin-manifest.json` file
+3. Navigate to the view that is modified by the plugin

common/api-helpers.js

@@ -0,0 +1,26 @@
+let cachedCtds = null;
+
+export const getContentTypes = async (client, toast, t) => {
+  if (cachedCtds) return cachedCtds;
+
+  cachedCtds = client
+    .getContentTypes({
+      limit: 1000,
+      page: 1,
+      order_by: 'label',
+      order_direction: 'asc',
+    })
+    .then(({ body, status }) => {
+      if (status < 200 || status >= 300) {
+        throw new Error();
+      }
+
+      return body.data || [];
+    })
+    .catch(() => {
+      toast.error(t('ContentTypesErrors'));
+      return [];
+    });
+
+  return cachedCtds;
+};

common/plugin-element-cache.js

@@ -0,0 +1,36 @@
+const appRoots = {};
+
+export const onElementRemoved = (element, callback) => {
+  new MutationObserver(function () {
+    if (!document.contains(element)) {
+      callback();
+      this.disconnect();
+    }
+  }).observe(element.parentElement, { childList: true });
+};
+
+export const addElementToCache = (element, key, data = {}) => {
+  appRoots[key] = {
+    element,
+    data,
+  };
+
+  element.addEventListener(
+    'flotiq.attached',
+    () => onElementRemoved(element, () => delete appRoots[key]),
+    true,
+  );
+};
+
+export const getCachedElement = (key) => {
+  return appRoots[key];
+};
+
+export const registerFn = (pluginInfo, callback) => {
+  if (window.FlotiqPlugins?.add) {
+    window.FlotiqPlugins.add(pluginInfo, callback);
+    return;
+  }
+  if (!window.initFlotiqPlugins) window.initFlotiqPlugins = [];
+  window.initFlotiqPlugins.push({ pluginInfo, callback });
+};

common/plugin-helpers.js

@@ -0,0 +1,55 @@
+const appRoots = {};
+
+export const onElementRemoved = (element, callback) => {
+  new MutationObserver(function () {
+    if (!document.contains(element)) {
+      callback();
+      this.disconnect();
+    }
+  }).observe(element.parentElement, { childList: true });
+};
+
+export const addElementToCache = (element, root, key) => {
+  appRoots[key] = {
+    element,
+    root,
+  };
+
+  element.addEventListener(
+    'flotiq.attached',
+    () => onElementRemoved(element, () => delete appRoots[key]),
+    true,
+  );
+};
+
+export const removeRoot = (key) => {
+  delete appRoots[key];
+};
+
+export const getCachedElement = (key) => {
+  return appRoots[key];
+};
+
+export const registerFn = (pluginInfo, callback) => {
+  if (window.FlotiqPlugins?.add) {
+    window.FlotiqPlugins.add(pluginInfo, callback);
+    return;
+  }
+  if (!window.initFlotiqPlugins) window.initFlotiqPlugins = [];
+  window.initFlotiqPlugins.push({ pluginInfo, callback });
+};
+
+/**
+ * Read key value deep inside object
+ * @param {string} key
+ * @param {object} object
+ * @returns {*} example: read 'object[0].key' from 'object: [{key: value}]
+ */
+export const deepReadKeyValue = (key, object) => {
+  return key
+    .split(/[[.\]]/)
+    .filter((kp) => !!kp)
+    .reduce((nestedOptions, keyPart) => {
+      return nestedOptions?.[keyPart];
+    }, object);
+};