Feature/eslint

.env.example

@@ -1,9 +1,9 @@
-VITE_APP_API_LOCATION=http://localhost:5000/
-VITE_APP_ALGOLIA_KEY=
-VITE_APP_ALGOLIA_ID=
-VITE_APP_PENNSIEVE_API_LOCATION=https://api.pennsieve.io
-VITE_APP_ALGOLIA_INDEX=k-core_dev_published_time_desc
-VITE_APP_BL_SERVER_URL=
-VITE_APP_NL_LINK_PREFIX=
-VITE_APP_ROOT_URL=
-VITE_FLATMAPAPI_LOCATION=https://mapcore-demo.org/curation/flatmap/
+VITE_API_LOCATION=http://localhost:5000/
+VITE_ALGOLIA_KEY=
+VITE_ALGOLIA_ID=
+VITE_PENNSIEVE_API_LOCATION=https://api.pennsieve.io
+VITE_ALGOLIA_INDEX=k-core_dev_published_time_desc
+VITE_BL_SERVER_URL=
+VITE_NL_LINK_PREFIX=
+VITE_ROOT_URL=
+VITE_FLATMAPAPI_LOCATION=https://mapcore-demo.org/curation/flatmap/

.github/workflows/ci.yml

@@ -0,0 +1,30 @@
+name: CI
+
+on:
+  pull_request:
+    branches: [main]
+
+  workflow_dispatch:
+
+jobs:
+  ci:
+    name: CI
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v7
+
+      - name: Set up Node.js
+        uses: actions/setup-node@v7
+        with:
+          node-version: '24.20.0'
+          cache: npm
+
+      - name: Install dependencies
+        run: npm ci
+
+      - name: Check code formatting
+        run: npm run format:check
+
+      - name: Check code linting
+        run: npm run lint

.github/workflows/cross-platform-test.yml

@@ -2,9 +2,9 @@ name: Cross-Platform Compatibility Test
 
 on:
   push:
-    branches: [ main ]
+    branches: [main]
   pull_request:
-    branches: [ main ]
+    branches: [main]
 
   # Allows you to run this workflow manually from the Actions tab
   workflow_dispatch:

.github/workflows/deploy-docs.yml

@@ -3,7 +3,7 @@ name: Deploy Docs to Pages
 on:
   # Runs on pushes targeting the `docs` branch and `main` branch.
   push:
-    branches: ["docs", "main"]
+    branches: ['docs', 'main']
 
   # Allows you to run this workflow manually from the Actions tab
   workflow_dispatch:

.gitignore

@@ -46,6 +46,7 @@ cypress.env.json
 
 # Generated files
 **/components.d.ts
+**/auto-imports.d.ts
 
 # OS files
 .DS_Store

.postcssrc.json

@@ -1,6 +1,6 @@
 {
-    "map": true,
-    "plugins": {
-        "autoprefixer": {}
-    }
-}
+  "map": true,
+  "plugins": {
+    "autoprefixer": {}
+  }
+}

.prettierrc

@@ -0,0 +1,14 @@
+{
+  "semi": true,
+  "singleQuote": true,
+  "tabWidth": 2,
+  "useTabs": false,
+  "printWidth": 100,
+  "trailingComma": "all",
+  "bracketSpacing": true,
+  "arrowParens": "always",
+  "endOfLine": "lf",
+  "vueIndentScriptAndStyle": false,
+  "singleAttributePerLine": false,
+  "htmlWhitespaceSensitivity": "ignore"
+}

CHANGELOG.md

@@ -407,7 +407,7 @@ Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
 
 ### Merged
 
-- computed props - activeTabs  [`#112`](https://github.com/alan-wu/map-sidebar/pull/112)
+- computed props - activeTabs [`#112`](https://github.com/alan-wu/map-sidebar/pull/112)
 - Fix connectivity graph render on data change [`#111`](https://github.com/alan-wu/map-sidebar/pull/111)
 - Add feature Id to clipboard for connectivity [`#110`](https://github.com/alan-wu/map-sidebar/pull/110)
 - Fix sidebar active tab border UI [`#106`](https://github.com/alan-wu/map-sidebar/pull/106)

README.md

@@ -38,18 +38,14 @@ npm run build-bundle
 Import the component and the style from the package.
 
 ```javascript
-import { SideBar } from "@abi-software/map-side-bar";
-import "@abi-software/map-side-bar/dist/style.css";
+import { SideBar } from '@abi-software/map-side-bar';
+import '@abi-software/map-side-bar/dist/style.css';
 ```
 
 The code in template should looks like this
 
 ```html
-<SideBar
-  :envVars="envVars"
-  :visible="sideBarVisibility"
-  @actionClick="actionClick"
-/>
+<SideBar :envVars="envVars" :visible="sideBarVisibility" @actionClick="actionClick" />
 ```
 
 envVars contains environment variables like so:
@@ -66,6 +62,7 @@ envVars contains environment variables like so:
 actionClick event is called when an action button has been clicked on.
 
 ## Sidebar Data formats
+
 ### Algolia
 
 Data retrieved from Algolia can be found here:
@@ -113,13 +110,16 @@ TITLE = 'title'
 Note: All are optional except for ‘name’
 
 ### Sidebar input processing
+
 Sidebar input processing can be viewed here:
 https://github.com/ABI-Software/map-sidebar/blob/3310b165489b10901f50a21e5689ef046251dbd9/src/components/SidebarContent.vue#L318
 
 It is used to keep the code from attempting to access an object property that does not exist
 
 ### Context card data format
+
 All fields are strings:
+
 ```
 {
   "description": required ,
@@ -152,15 +152,14 @@ All fields are strings:
 An example context card file can be viewed here:
 https://drive.google.com/file/d/15NVRBny7WGltpMSRbsgMglXo0xOC3-Q9/view?usp=sharing
 
-
 ## API Documentation
 
 The API documentation is developed with `vitepress` and `vuese`. Documentation pages are in the `docs` folder.
 
 ### To run in local development mode
+
 ```bash
 npm run docs:watch
 ```
 
 This will start the documentation server with `vitepress` on port `:5173` and watch the components' changes.
-

cypress.config.js

@@ -1,21 +1,20 @@
-import { defineConfig } from "cypress";
+import { defineConfig } from 'cypress';
 
 export default defineConfig({
   defaultCommandTimeout: 10000,
-  reporter: "junit",
   experimentalMemoryManagement: true,
   numTestsKeptInMemory: 0,
-  reporter: "cypress-multi-reporters",
+  reporter: 'cypress-multi-reporters',
   reporterOptions: {
-    configFile: "reporter-config.json",
+    configFile: 'reporter-config.json',
   },
   component: {
     viewportWidth: 1440,
     viewportHeight: 900,
-    specPattern: "cypress/component/*.cy.js",
+    specPattern: 'cypress/component/*.cy.js',
     devServer: {
-      framework: "vue",
-      bundler: "vite",
+      framework: 'vue',
+      bundler: 'vite',
     },
   },
   video: true,