From a9aeca527bcb39559bb1782a357710b4e47c6da5 Mon Sep 17 00:00:00 2001 From: Amritha Raj Herle Date: Fri, 24 May 2024 17:23:55 +0200 Subject: [PATCH] feat: auto deploy storybook to github pages --- .github/workflows/deploy.yml | 23 +++++++++++++ README.md | 16 +++++---- package.json | 6 ++-- src/Search.jsx | 33 ++++++------------- .../{globalContants.ts => globalContants.js} | 24 +++++++++++--- 5 files changed, 65 insertions(+), 37 deletions(-) create mode 100644 .github/workflows/deploy.yml rename src/constants/{globalContants.ts => globalContants.js} (99%) diff --git a/.github/workflows/deploy.yml b/.github/workflows/deploy.yml new file mode 100644 index 0000000..0766196 --- /dev/null +++ b/.github/workflows/deploy.yml @@ -0,0 +1,23 @@ +on: + push: + branches: + - "master" + +permissions: + contents: read + pages: write + id-token: write + +jobs: + deploy: + environment: + name: github-pages + url: ${{ steps.build-publish.outputs.page_url }} + runs-on: ubuntu-latest + steps: + - id: build-publish + uses: bitovi/github-actions-storybook-to-github-pages@v1.0.3 + with: + path: storybook-static + install_command: yarn install + build_command: yarn build-storybook diff --git a/README.md b/README.md index b5dc0aa..c551cbb 100644 --- a/README.md +++ b/README.md @@ -1,10 +1,12 @@ -# EDC - device catalog search +# Maximo Asset Monitor - Device library search -### Note +## Note -- Add a new file in the [`/src/devices/`](/src/devices/) folder with the version number. You can generate the export file using [_export_devices_csv.py_](https://github.ibm.com/omnio/omnio_server/blob/master/omnio_db/management/commands/export_devices_csv.py) management command. +- Add or update a file in the [`/src/devices/`](src/devices/) folder with the specific version number. You can generate the export file using [_export_devices_csv.py_](https://github.ibm.com/omnio/omnio_server/blob/master/omnio_db/management/commands/export_devices_csv.py) management command. +- Add a link to the newly added file in [`src/constants/globalContants.js`](src/constants/globalContants.js#L5) +- Push the code changes to github. This repositary auto deploys the storybook changes into [`https://ibm-watson-iot.github.io/maximo-asset-monitor-device-library-search`](https://ibm-watson-iot.github.io/maximo-asset-monitor-device-library-search/) -### Prerequisites +## Prerequisites - [Node.js](https://nodejs.org/en/download/) - the required version is specified in the [`.nvmrc`](/.nvmrc) - If you're on macOS or using WSL on Windows, we recommend using [`nvm`](https://github.com/nvm-sh/nvm) as your version manager for Node. @@ -13,14 +15,14 @@ You'll also need a code editor to make changes. There are many to choose from but we suggest to use [VSCode](https://code.visualstudio.com/). -### Install dependencies +## Install dependencies ```bash # install the dependencies yarn install ``` -### Build and start the development server +## Build and start the development server ```bash # run the server @@ -29,7 +31,7 @@ yarn start Open [http://localhost:3000](http://localhost:3000) with your browser to see the result. -### Adding a dependency +## Adding a dependency ```bash # To add dependencies to the project diff --git a/package.json b/package.json index 9b21a87..5aae8fe 100644 --- a/package.json +++ b/package.json @@ -1,8 +1,8 @@ { - "name": "edc-device-catalog-search", + "name": "edc-device-library-search", "version": "9.0.0", "private": true, - "homepage": "https://github.ibm.com/omnio/edgeconfig-device-search.git", + "homepage": "https://github.com/ibm-watson-iot/maximo-asset-monitor-device-library-search.git", "scripts": { "start": "react-scripts start", "build": "react-scripts build", @@ -66,4 +66,4 @@ "typescript": "^5.4.5", "web-vitals": "^3.5.2" } -} +} \ No newline at end of file diff --git a/src/Search.jsx b/src/Search.jsx index 7332097..1d5fa0a 100644 --- a/src/Search.jsx +++ b/src/Search.jsx @@ -2,24 +2,16 @@ import { StatefulTable, Tag, Link, Dropdown } from "carbon-addons-iot-react"; import Papa from "papaparse"; import { useMemo, useEffect, useState } from "react"; -import csvFile9_0_X from "./devices/9.0.x.csv"; -import csvFile8_11_X from "./devices/8.11.x.csv"; import "carbon-addons-iot-react/css/carbon-addons-iot-react.css"; -import { MANUFACTURER, VERSIONS } from "./constants/globalContants"; +import { + MANUFACTURER, + PROTOCOLS_TAG_COLOR, + SLACK_CONTACT_LINK, + VERSIONS, +} from "./constants/globalContants"; import ManufacturerCell from "./components/ManufacturerCell"; -const SLACK_CONTACT_LINK = "https://ibm-ai-apps.slack.com/archives/CA60S5T88"; - -const PROTOCOLS_TAG_COLOR = { - modbus: "green", - "ethernet-ip": "teal", - "S7 PLC": "blue", - bacnet: "magenta", - MTConnect: "purple", - "json-over-http": "cool-grey", -}; - const renderProtocolTags = ({ value }) => { if (value) { const outputArray = [...new Set(value.split(" | "))]; @@ -91,19 +83,14 @@ const columns = [ }, ]; -const versionFileMap = { - "9.0.x": csvFile9_0_X, - "8.11.x": csvFile8_11_X, -}; - export default function Search() { const [devices, setDevicesData] = useState([]); const [isLoading, setIsLoading] = useState(true); - const [version, setVersion] = useState(VERSIONS["9.0.x"]); + const [version, setVersion] = useState(Object.keys(VERSIONS)[0]); useEffect(() => { async function fetchData() { - await Papa.parse(versionFileMap[version], { + await Papa.parse(VERSIONS[version], { download: true, header: true, skipEmptyLines: true, @@ -147,7 +134,7 @@ export default function Search() { { setVersion(selectedItem); }} - items={Object.values(VERSIONS)} + items={Object.keys(VERSIONS)} initialSelectedItem={version} /> ), diff --git a/src/constants/globalContants.ts b/src/constants/globalContants.js similarity index 99% rename from src/constants/globalContants.ts rename to src/constants/globalContants.js index 07ae410..79f0944 100644 --- a/src/constants/globalContants.ts +++ b/src/constants/globalContants.js @@ -1,9 +1,25 @@ -export const VERSIONS: Record = { - "9.0.x": "9.0.x", - "8.11.x": "8.11.x", +import csvFile9_0_X from "../devices/9.0.x.csv"; +import csvFile8_11_X from "../devices/8.11.x.csv"; + +export const VERSIONS = { + // Add new file and versions here. + "9.0.x": csvFile9_0_X, + "8.11.x": csvFile8_11_X, +}; + +export const SLACK_CONTACT_LINK = + "https://ibm-ai-apps.slack.com/archives/CA60S5T88"; + +export const PROTOCOLS_TAG_COLOR = { + modbus: "green", + "ethernet-ip": "teal", + "S7 PLC": "blue", + bacnet: "magenta", + MTConnect: "purple", + "json-over-http": "cool-grey", }; -export const MANUFACTURER: Manufacturer[] = [ +export const MANUFACTURER = [ { name: "Endress Hauser", id: "8220c6b2-7eb6-47ac-b0ca-2f2347a0db1f",