Merge pull request #143 from adobecom/main

Update stage branch

.browserslistrc

@@ -0,0 +1,5 @@
+last 1 chrome version
+last 1 firefox version
+last 1 edge version
+safari >= 14
+ios_saf >= 14

.eslintrc-code-compatibility.js

@@ -0,0 +1,19 @@
+module.exports = {
+  root: true,
+  extends: ['plugin:compat/recommended', 'plugin:ecmalist/recommended'],
+  settings: { es: { aggressive: true } },
+  env: { browser: true, mocha: true },
+  parser: '@babel/eslint-parser',
+  parserOptions: {
+    allowImportExportEverywhere: true,
+    sourceType: 'module',
+    requireConfigFile: false,
+  },
+  plugins: [
+      "eslint-plugin-import",
+  ],
+  ignorePatterns: [
+    '/libs/deps/*',
+    '/tools/loc/*',
+  ],
+};

.eslintrc.js

@@ -1,6 +1,7 @@
 module.exports = {
   root: true,
-  extends: 'airbnb-base',
+  extends: ['airbnb-base', 'plugin:react-hooks/recommended', 'plugin:compat/recommended', 'plugin:ecmalist/recommended'],
+  settings: { es: { aggressive: true } },
   env: { browser: true, mocha: true },
   parser: '@babel/eslint-parser',
   parserOptions: {
@@ -9,25 +10,45 @@ module.exports = {
     requireConfigFile: false,
   },
   rules: {
-    // allow reassigning param
-    'no-param-reassign': [2, { props: false }],
-    'linebreak-style': ['error', 'unix'],
+    'chai-friendly/no-unused-expressions': 2,
     'import/extensions': ['error', { js: 'always' }],
+    'import/no-cycle': 0,
+    'linebreak-style': ['error', 'unix'],
+    'no-await-in-loop': 0,
+    'no-param-reassign': [2, { props: false }],
+    'no-restricted-syntax': [
+      '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.',
+      },
+    ],
+    'no-return-assign': ['error', 'except-parens'],
+    'no-unused-expressions': 0,
     'object-curly-newline': ['error', {
       ObjectExpression: { multiline: true, minProperties: 6 },
       ObjectPattern: { multiline: true, minProperties: 6 },
       ImportDeclaration: { multiline: true, minProperties: 6 },
-      ExportDeclaration: 'never',
+      ExportDeclaration: { multiline: true, minProperties: 6 },
     }],
-    'no-unused-expressions': 0,
-    'chai-friendly/no-unused-expressions': 2,
   },
   overrides: [
     {
       files: ['test/**/*.js'],
-      rules: { 'no-console': 'off' },
+      rules: { 'no-console': 0 },
     },
   ],
+  ignorePatterns: [
+    '/tools/loc/*',
+  ],
   plugins: [
     'chai-friendly',
   ],

.github/workflows/code-compatibility.yaml

@@ -0,0 +1,23 @@
+name: Check code compatibility with Milo supported browsers
+
+on:
+  push:
+    branches:
+      - main
+  pull_request:
+
+jobs:
+  check:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v3
+
+      - name: Check for unsupported functions
+        run: |
+          # Install eslint and its plugins
+          npm install
+
+          # Check for unsupported functions in the code
+          npx eslint --no-eslintrc -c .eslintrc-code-compatibility.js .

.github/workflows/run-lint.yml

@@ -0,0 +1,27 @@
+name: Lint
+on:
+  pull_request:
+    types: [opened, synchronize, reopened]
+    paths:
+      - '**.js'
+
+jobs:
+  run-lint:
+    name: Running eslint
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v2
+
+      - uses: actions/setup-node@v2
+        with:
+          node-version: 18
+
+      - name: Install dependencies
+        run: npm install
+
+      - name: Run eslint on changed files
+        uses: tj-actions/eslint-changed-files@v20
+        with:
+          config_path: ".eslintrc.js"
+          # ignore_path: "/path/to/.eslintignore"
+          # extra_args: "--max-warnings=0"

.github/workflows/run-tests.yaml

@@ -12,7 +12,7 @@ jobs:
     runs-on: ubuntu-latest
     strategy:
       matrix:
-        node-version: [14.x]
+        node-version: [18.x]
     steps:
     - name: Checkout repository
       uses: actions/checkout@v2

CODEOWNERS

@@ -0,0 +1,14 @@
+# BACOM CODEOWNERS
+# When you create a new block or tool please establish ownership in this file.
+# See https://docs.github.com/en/repositories/managing-your-repositorys-settings-and-features/customizing-your-repository/about-code-owners
+
+
+# BACOM Core
+* @brandon32 @JasonHowellSlavin @meganthecoder
+
+# BACOM Blocks - last matching pattern takes precedence
+/blocks/chat-cta @JasonHowellSlavin
+/blocks/comparison @brandon32
+/blocks/event-speakers @meganthecoder
+/blocks/faas-decode @meganthecoder
+/blocks/tree-view @meganthecoder

blocks/faas-decode/faas-decode.js

@@ -6,6 +6,7 @@ export default async function init(el) {
   const resp = await fetch(url);
 
   if (!resp?.ok) {
+    // eslint-disable-next-line no-console
     console.log(`Error fetching data from url: ${url}`);
     return;
   }

blocks/form/form.css

@@ -0,0 +1,114 @@
+main .form {
+  background-color: #3E3E3E;
+  padding-top: 34px;
+  min-height: 218px;
+}
+
+main .form > div {
+  margin-left: 35%;
+}
+
+main .form h2 {
+  color: white;
+  margin-bottom: 15px;
+  margin-top: unset;
+}
+
+main .form.hide h2 {
+  display: none;
+}
+
+main .section .content.hide {
+  display: none;
+}
+
+main .form input {
+  border: 1px solid rgb(193 193 195);
+  padding: 11px;
+  border-radius: 10px;
+  width: 50%;
+  max-width: 50rem;
+  box-sizing: border-box;
+}
+
+main .form p {
+  font-size: var(--type-heading-l-size);
+  line-height: var(--type-heading-l-lh);
+  margin-top: unset;
+}
+
+main form .form-text-field-wrapper p {
+  font-size: 18px;
+  color: white;
+  margin: 0;
+}
+
+.form-container .default-content-wrapper.hide,
+main form.hide {
+  display: none;
+}
+
+main .form .trial-sign-up-message {
+  color: white;
+  max-width: 55%;
+}
+
+.form-container .default-content-wrapper p {
+  font-size: 18px;
+}
+
+main .form label.form-label {
+  position: relative;
+}
+
+main .form label.form-label.alert::after {
+  content: "";
+  position: absolute;
+  right: 12px;
+  width: 20px;
+  height: 20px;
+  margin-top: 14px;
+  margin-bottom: 7px;
+  background: url("/img/ui/Alert.svg") no-repeat;
+}
+
+main .form .button {
+  font-size: 24px;
+}
+
+main .form .highlight {
+  border-color: #E34850;
+}
+
+main .form .form-submit-wrapper  {
+  width: 50%;
+  text-align: end;
+}
+
+main .form .form-submit-wrapper .button.primary {
+  font-family: var(--body-font-family);
+  text-decoration: none;
+  border: 2px solid #C8C8C8;
+  padding: 6px 16px 9px;
+  font-size: 17px;
+  font-weight: 600;
+  cursor: pointer;
+  color: #C8C8C8;
+  background-color: #3E3E3E;
+  margin-top: 30px;
+  border-radius: 30px;
+}
+
+@media screen and (max-width: 768px) {
+  main .form > div {
+    margin-left: 15%;
+  }
+
+  main .form input {
+    width: 85%;
+  }
+
+  main .form .form-submit-wrapper  {
+    width: 85%;
+  }
+}