chore: updates and fixes

.github/CODEOWNERS

@@ -5,7 +5,8 @@
 # the repo. Unless a later match takes precedence,
 # @global-owner1 and @global-owner2 will be requested for
 # review when someone opens a pull request.
-*       @lob/growth-and-core-experience
+* @lob/growth-and-core-experience
+* @lob/self-serve-growth
 
 # Order is important; the last matching pattern takes the most
 # precedence. When someone opens a pull request that only

.github/workflows/codeql.yml

@@ -9,7 +9,7 @@
 # the `language` matrix defined below to confirm you have the correct set of
 # supported CodeQL languages.
 #
-name: 'CodeQL'
+name: '🕵️ CodeQL'
 
 on:
   push:
@@ -32,7 +32,7 @@ jobs:
     strategy:
       fail-fast: false
       matrix:
-        language: ['javascript']
+        language: ['javascript', 'typescript']
         # CodeQL supports [ 'cpp', 'csharp', 'go', 'java', 'javascript', 'python', 'ruby' ]
         # Learn more about CodeQL language support at https://aka.ms/codeql-docs/language-support
 

.github/workflows/lint-test.yml

@@ -1,4 +1,4 @@
-name: Lint and Test
+name: 🧪 Lint and Test
 
 on:
   push:
@@ -22,7 +22,7 @@ jobs:
         uses: './.github/actions/install-node-and-npm'
 
       - name: Install dependencies
-        run: npm ci --legacy-peer-deps
+        run: npm ci
 
       - name: Run lint
         run: npm run format-check

.github/workflows/typescript-type-check.yml

@@ -0,0 +1,42 @@
+name: 🟦 Typescript Type Check
+
+on:
+  push:
+    branches:
+      - '**'
+    tags-ignore:
+      - 'staging/**'
+      - 'production/**'
+
+jobs:
+  check:
+    name: Type Check
+
+    # Running on Lob's GitHub runners
+    runs-on:
+      group: Ephemeral
+      labels: [self-hosted, linux, x64, lob-runner, heavy-duty, ephemeral]
+
+    steps:
+      # Checks-out your repository under $GITHUB_WORKSPACE, so your job can access it
+      - name: Checkout repository
+        uses: actions/checkout@v4
+
+      # Setup node with the set node version
+      - name: Setup Node
+        uses: actions/setup-node@v4
+        with:
+          node-version-file: '.node-version'
+          cache: 'npm'
+
+      - name: configure npm
+        run: |
+          npm set @lob:registry https://registry.npmjs.org/
+          npm set "//registry.npmjs.org/:_authToken=${{ secrets.NPM_TOKEN }}"
+
+      - name: Install dependencies
+        run: npm ci --legacy-peer-deps
+
+      - name: Run type check
+        run: npm run type-check
+        timeout-minutes: 10

src/components/ColorPicker/__tests__/ColorPicker.spec.ts

@@ -26,7 +26,7 @@ const renderComponent = (options: RenderOptions = {}) =>
 
 describe('ColorPicker', () => {
   it('should render correctly', async () => {
-    const { baseElement, getByTestId } = renderComponent({
+    const { getByTestId } = renderComponent({
       props: initialProps
     });
 

src/components/Dropdown/Dropdown.vue

@@ -135,14 +135,10 @@
 import { ChevronDown } from '@/components/Icons';
 import DropdownItemGroup from './DropdownItemGroup';
 import DropdownItem from './DropdownItem';
-import { findLastIndex, shallowEquals } from '@/utils';
+import { shallowEquals } from '@/utils';
 import LobLabel from '../Label/Label.vue';
 import ConfirmChangeModal from './ConfirmChangeModal';
 
-if (!Array.prototype.findLastIndex) {
-  Array.prototype.findLastIndex = findLastIndex; //eslint-disable-line
-}
-
 const Keys = {
   Backspace: 'Backspace',
   Clear: 'Clear',

src/components/Dropdown/__tests__/DropdownItem.spec.js

@@ -74,7 +74,7 @@ describe('DropdownItem', () => {
     expect(emittedEvents).toHaveProperty('click');
 
     // eslint-disable-next-line no-unused-vars
-    const [event, index] = emittedEvents.click[0];
+    const [_, index] = emittedEvents.click[0];
     expect(index).toEqual(0);
   });
 
@@ -90,7 +90,7 @@ describe('DropdownItem', () => {
     expect(emittedEvents).toHaveProperty('mouseenter');
 
     // eslint-disable-next-line no-unused-vars
-    const [event, index] = emittedEvents.mouseenter[0];
+    const [_, index] = emittedEvents.mouseenter[0];
     expect(index).toEqual(0);
   });
 });

src/components/Dropdown/__tests__/DropdownItemGroup.spec.js

@@ -55,7 +55,7 @@ describe('DropdownItemGroup', () => {
     expect(emittedEvents).toHaveProperty('click');
 
     // eslint-disable-next-line no-unused-vars
-    const [event, index] = emittedEvents.click[0];
+    const [_, index] = emittedEvents.click[0];
     expect(index).toEqual(0);
   });
 
@@ -71,7 +71,7 @@ describe('DropdownItemGroup', () => {
     expect(emittedEvents).toHaveProperty('mouseenter');
 
     // eslint-disable-next-line no-unused-vars
-    const [event, index] = emittedEvents.mouseenter[0];
+    const [_, index] = emittedEvents.mouseenter[0];
     expect(index).toEqual(0);
   });
 });

src/components/ImageFileUpload/__tests__/ImageFileUpload.spec.ts

@@ -24,7 +24,7 @@ const renderComponent = (options: RenderOptions = {}) =>
 
 describe('ImageFileUpload', () => {
   it('should render correctly', async () => {
-    const { baseElement, getByTestId } = renderComponent({
+    const { getByTestId } = renderComponent({
       props: initialProps
     });
 
@@ -135,7 +135,7 @@ describe('ImageFileUpload', () => {
   });
 
   it('should display an error when the file size exceeds the maxFileSize prop', async () => {
-    const { baseElement, getByRole, container, emitted } = renderComponent({
+    const { getByRole, container, emitted } = renderComponent({
       props: { ...initialProps, maxFileSize: 1 }
     });
 

src/components/TextInput/__tests__/TextInput.spec.ts

@@ -187,7 +187,7 @@ describe('Text input', () => {
     };
 
     it('the label is correctly associated with the input when the tooltip is trailing', async () => {
-      const { getByLabelText, getByTestId } = render(TextInput, {
+      const { getByLabelText } = render(TextInput, {
         ...DEFAULT_RENDER_OPTIONS,
         props: propsTooltip
       });
@@ -198,7 +198,7 @@ describe('Text input', () => {
     });
 
     it('the label is correctly associated with the input when the tooltip is leading', () => {
-      const { getByLabelText, getByTestId } = render(TextInput, {
+      const { getByLabelText } = render(TextInput, {
         ...DEFAULT_RENDER_OPTIONS,
         props: propsTooltipLeading
       });

src/utils/array.js

@@ -1,36 +1,3 @@
-/**
- * A function to execute on each value in the array until the function returns true, indicating that the satisfying element was found.A function to execute on each value in the array until the function returns true, indicating that the satisfying element was found.
- *
- * @callback callbackFn
- * @param {Object} element The current element being processed in the array.
- * @param {number} index The index of the current element being processed in the array. (optional)
- * @param {Object[]} array The array findLastIndex() was called upon.
- */
-
-/**
- * Returns the index of the last element in the array where predicate is true, and -1
- * otherwise.
- * @param {callbackFn} predicate findLastIndex calls predicate once for each element of the array, in descending
- * order, until it finds one where predicate returns true. If such an element is found,
- * findLastIndex immediately returns that element index. Otherwise, findLastIndex returns -1.
- * @param {Object[]} thisArg Value to use as this when executing callbackFn. (optional)
- * @return {number} The index
- */
-export function findLastIndex(predicate, thisArg) {
-  // The callback must be a function.
-  if (typeof predicate !== 'function') {
-    throw new TypeError();
-  }
-
-  let l = this.length;
-  while (l--) {
-    if (predicate(this[l], l, thisArg)) {
-      return l;
-    }
-  }
-  return -1;
-}
-
 /**
  * A function that 'filters' a base array by the secondary array and returns the different elements in the base array
  * @param {Array} baseArray The base array