feat: 🎸 addDataFromRemoteApi

.eslintignore

@@ -0,0 +1 @@
+build/**

.eslintrc.js

@@ -0,0 +1,62 @@
+module.exports = {
+  env: {
+    browser: true,
+    es2020: true,
+    'jest/globals': true,
+  },
+  extends: ['airbnb-base', 'plugin:jest/recommended', 'plugin:prettier/recommended'],
+  settings: {
+    'import/resolver': {
+      node: {
+        extensions: ['.js', '.ts'],
+      },
+    },
+  },
+  parser: '@typescript-eslint/parser',
+  parserOptions: {
+    ecmaVersion: 11,
+    sourceType: 'module',
+  },
+  plugins: ['jest', 'prettier'],
+  rules: {
+    'prettier/prettier': 'error',
+    // do not require ext. when importing file
+    'import/extensions': [
+      'error',
+      'ignorePackages',
+      {
+        ts: 'never',
+      },
+    ],
+
+    // avoid having warnings when we import types and they are detected as unused imports
+    'no-unused-vars': 'off',
+    '@typescript-eslint/no-unused-vars': ['error'],
+
+    // <temporarily allowed until fixed>
+    'no-param-reassign': ['warn'],
+    'global-require': ['warn'],
+
+    // -- OVERRIDES by choice --
+    // allow ForOfStatement
+    'no-restricted-syntax': [
+      // override aribnb config here to allow for (const ... of ...) https://github.com/airbnb/javascript/blob/64b965efe0355c8290996ff5a675cd8fb30bf843/packages/eslint-config-airbnb-base/rules/style.js#L334-L352
+      'error',
+      {
+        selector: 'ForInStatement',
+        message:
+          'for..in loops iterate over the entire prototype chain, which is virtually never what you want. Use Object.{keys,values,entries}, and iterate over the resulting array.',
+      },
+      {
+        selector: 'LabeledStatement',
+        message: 'Labels are a form of GOTO; using them makes code confusing and hard to maintain and understand.',
+      },
+      {
+        selector: 'WithStatement',
+        message: '`with` is disallowed in strict mode because it makes code impossible to predict and optimize.',
+      },
+    ],
+    // allow console logs
+    'no-console': ['off'],
+  },
+};

.gitignore

@@ -102,3 +102,5 @@ dist
 
 # TernJS port file
 .tern-port
+
+.DS_store

.prettierrc

@@ -0,0 +1,6 @@
+{
+  "semi": true,
+  "trailingComma": "all",
+  "singleQuote": true,
+  "printWidth": 120
+}

hooks/addDataFromRemoteApi.js

@@ -0,0 +1,39 @@
+const fetch = require('node-fetch');
+
+/**
+ * How to Use:
+ * 1. Add this hook into your hooks.js.
+ * 2. The data returned on the mutable data object will now be available on all hooks,
+ *    in your Layout.svelte, your RouteName.svelte, and the all({data}) and data({data})
+ *    functions for each route.
+ * 3. In this example it means that in each of these locations you can access data.companies
+ *    and have access to the all of the SP500 company data.
+ *
+ * Notes:
+ * *  It is important to note that this data is available in ALL routes and hooks, so naming is important. Also be careful of naming conflicts.
+ * *  If you only need to hit an API for a single route, you may want to do this in your route's data function. The same code should work.
+ */
+
+const hooks = [
+  {
+    hook: 'bootstrap',
+    name: 'addDataFromRemoteApi',
+    description: `
+        Fetch data from a remote API using node-fetch and add it to the "data" object available 
+        in hooks and in each route\'s all({data}) and data({data}) functions.    
+        
+        In this example we're fetching data on the SP500 companies, doing a small amount of 
+        transformation, and adding it to the data object. 
+      `,
+    priority: 50,
+    run: async ({ data }) => {
+      const companyData = await fetch(
+        'https://opendata.arcgis.com/datasets/a4d813c396934fc09d0b801a0c491852_0.geojson',
+      ).then((res) => res.json());
+      const companies = Object.values(companyData.features).map((entry) => entry.properties);
+
+      return { data: { ...data, companies } };
+    },
+  },
+];
+module.exports = hooks;