diff --git a/README.md b/README.md index bddc5ff6d2..540b4c1023 100644 --- a/README.md +++ b/README.md @@ -6,6 +6,15 @@ To launch the app type `npm install` then `npm start` . If you are a developer and you want to update / enhance components used from the gridsuite commons-ui library click [here](https://github.com/gridsuite/commons-ui) and follow instructions. +This app uses @powsybl/network-viewer library which released in the npmjs packages. + +If you are a developer and you want to update both source code of this project +and the library, enoying HMR and lint throught those packages, +You will need to : +* Define the env variable POWSYBL_NETWORK_VIEWER_PATH with your local path +* launch the app with `npm run start:dev` + +Modified code in the library will be instantly took in your app without further commands. [![code style: prettier](https://img.shields.io/badge/code_style-prettier-ff69b4.svg?style=flat-square)](https://github.com/prettier/prettier) diff --git a/package-lock.json b/package-lock.json index 2d1772cac2..9da9087063 100644 --- a/package-lock.json +++ b/package-lock.json @@ -98,6 +98,7 @@ "jest-environment-jsdom": "^29.7.0", "license-checker": "^25.0.1", "prettier": "^3.5.3", + "prettier-plugin-glsl": "^0.2.1", "prettier-plugin-properties": "^0.3.0", "svgo": "^3.3.2", "ts-node": "^10.9.2", @@ -2268,6 +2269,43 @@ "dev": true, "license": "MIT" }, + "node_modules/@chevrotain/cst-dts-gen": { + "version": "10.5.0", + "resolved": "https://registry.npmjs.org/@chevrotain/cst-dts-gen/-/cst-dts-gen-10.5.0.tgz", + "integrity": "sha512-lhmC/FyqQ2o7pGK4Om+hzuDrm9rhFYIJ/AXoQBeongmn870Xeb0L6oGEiuR8nohFNL5sMaQEJWCxr1oIVIVXrw==", + "dev": true, + "license": "Apache-2.0", + "dependencies": { + "@chevrotain/gast": "10.5.0", + "@chevrotain/types": "10.5.0", + "lodash": "4.17.21" + } + }, + "node_modules/@chevrotain/gast": { + "version": "10.5.0", + "resolved": "https://registry.npmjs.org/@chevrotain/gast/-/gast-10.5.0.tgz", + "integrity": "sha512-pXdMJ9XeDAbgOWKuD1Fldz4ieCs6+nLNmyVhe2gZVqoO7v8HXuHYs5OV2EzUtbuai37TlOAQHrTDvxMnvMJz3A==", + "dev": true, + "license": "Apache-2.0", + "dependencies": { + "@chevrotain/types": "10.5.0", + "lodash": "4.17.21" + } + }, + "node_modules/@chevrotain/types": { + "version": "10.5.0", + "resolved": "https://registry.npmjs.org/@chevrotain/types/-/types-10.5.0.tgz", + "integrity": "sha512-f1MAia0x/pAVPWH/T73BJVyO2XU5tI4/iE7cnxb7tqdNTNhQI3Uq3XkqcoteTmD4t1aM0LbHCJOhgIDn07kl2A==", + "dev": true, + "license": "Apache-2.0" + }, + "node_modules/@chevrotain/utils": { + "version": "10.5.0", + "resolved": "https://registry.npmjs.org/@chevrotain/utils/-/utils-10.5.0.tgz", + "integrity": "sha512-hBzuU5+JjB2cqNZyszkDHZgOSrUUT8V3dhgRl8Q9Gp6dAj/H5+KILGjbhDpc3Iy9qmqlm/akuOI2ut9VUtzJxQ==", + "dev": true, + "license": "Apache-2.0" + }, "node_modules/@choojs/findup": { "version": "0.2.1", "resolved": "https://registry.npmjs.org/@choojs/findup/-/findup-0.2.1.tgz", @@ -5053,6 +5091,18 @@ "react": "^17.0.0 || ^18.0.0 || ^19.0.0" } }, + "node_modules/@netflix/nerror": { + "version": "1.1.3", + "resolved": "https://registry.npmjs.org/@netflix/nerror/-/nerror-1.1.3.tgz", + "integrity": "sha512-b+MGNyP9/LXkapreJzNUzcvuzZslj/RGgdVVJ16P2wSlYatfLycPObImqVJSmNAdyeShvNeM/pl3sVZsObFueg==", + "dev": true, + "license": "MIT", + "dependencies": { + "assert-plus": "^1.0.0", + "extsprintf": "^1.4.0", + "lodash": "^4.17.15" + } + }, "node_modules/@nicolo-ribaudo/eslint-scope-5-internals": { "version": "5.1.1-v1", "resolved": "https://registry.npmjs.org/@nicolo-ribaudo/eslint-scope-5-internals/-/eslint-scope-5-internals-5.1.1-v1.tgz", @@ -8130,6 +8180,16 @@ "dev": true, "license": "MIT" }, + "node_modules/assert-plus": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz", + "integrity": "sha512-NfJ4UzBCcQGLDlQq7nHxH+tv3kyZ0hHQqF5BO6J7tNJeP5do1llPr8dZ8zHonfhAu0PHAdMkSo+8o0wxg9lZWw==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=0.8" + } + }, "node_modules/assign-symbols": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/assign-symbols/-/assign-symbols-1.0.0.tgz", @@ -8802,6 +8862,21 @@ "integrity": "sha512-0BJa8f4t141BYKQyn9NSQt1PguFQXMXwZiA5shfoaBYHAb2fFk2RAX+tiWMoQU+Agtzt3mdt0JtuyshAXqZ+Vw==", "license": "ISC" }, + "node_modules/chevrotain": { + "version": "10.5.0", + "resolved": "https://registry.npmjs.org/chevrotain/-/chevrotain-10.5.0.tgz", + "integrity": "sha512-Pkv5rBY3+CsHOYfV5g/Vs5JY9WTHHDEKOlohI2XeygaZhUeqhAlldZ8Hz9cRmxu709bvS08YzxHdTPHhffc13A==", + "dev": true, + "license": "Apache-2.0", + "dependencies": { + "@chevrotain/cst-dts-gen": "10.5.0", + "@chevrotain/gast": "10.5.0", + "@chevrotain/types": "10.5.0", + "@chevrotain/utils": "10.5.0", + "lodash": "4.17.21", + "regexp-to-ast": "0.5.0" + } + }, "node_modules/chrome-trace-event": { "version": "1.0.4", "resolved": "https://registry.npmjs.org/chrome-trace-event/-/chrome-trace-event-1.0.4.tgz", @@ -11943,6 +12018,16 @@ "node": ">=0.10.0" } }, + "node_modules/extsprintf": { + "version": "1.4.1", + "resolved": "https://registry.npmjs.org/extsprintf/-/extsprintf-1.4.1.tgz", + "integrity": "sha512-Wrk35e8ydCKDj/ArClo1VrPVmN8zph5V4AtHwIuHhvMXsKf73UT3BOD+azBIW+3wOJ4FhEH7zyaJCFvChjYvMA==", + "dev": true, + "engines": [ + "node >=0.6.0" + ], + "license": "MIT" + }, "node_modules/falafel": { "version": "2.2.5", "resolved": "https://registry.npmjs.org/falafel/-/falafel-2.2.5.tgz", @@ -16812,6 +16897,21 @@ "node": ">=6.0.0" } }, + "node_modules/prettier-plugin-glsl": { + "version": "0.2.2", + "resolved": "https://registry.npmjs.org/prettier-plugin-glsl/-/prettier-plugin-glsl-0.2.2.tgz", + "integrity": "sha512-VD4A59LtF6Eyw7FS46tOh6ZhVbIrdk3ikEPiFkyOAr8RgnuiL2Ad5EnuDqxYYzBqEPO3xDfhejieF3Q/AL5+7A==", + "dev": true, + "license": "MIT", + "dependencies": { + "@netflix/nerror": "^1.1.3", + "chevrotain": "^10.5.0", + "lodash": "^4.17.21" + }, + "peerDependencies": { + "prettier": "^3.0.0" + } + }, "node_modules/prettier-plugin-properties": { "version": "0.3.0", "resolved": "https://registry.npmjs.org/prettier-plugin-properties/-/prettier-plugin-properties-0.3.0.tgz", @@ -17616,6 +17716,13 @@ "@babel/runtime": "^7.8.4" } }, + "node_modules/regexp-to-ast": { + "version": "0.5.0", + "resolved": "https://registry.npmjs.org/regexp-to-ast/-/regexp-to-ast-0.5.0.tgz", + "integrity": "sha512-tlbJqcMHnPKI9zSrystikWKwHkBqu2a/Sgw01h3zFjvYrMxEDYHzzoMZnUrbIfpTFEsoRnnviOXNCzFiSc54Qw==", + "dev": true, + "license": "MIT" + }, "node_modules/regexp.prototype.flags": { "version": "1.5.4", "resolved": "https://registry.npmjs.org/regexp.prototype.flags/-/regexp.prototype.flags-1.5.4.tgz", diff --git a/package.json b/package.json index 1bf6fcddb6..7d69a089be 100644 --- a/package.json +++ b/package.json @@ -65,6 +65,7 @@ }, "scripts": { "start": "vite", + "start:dev": "POWSYBL_NETWORK_VIEWER_PATH=/home/bouzolssyl/Projects/Powsybl/powsybl-network-viewer vite --config vite.config_dev.ts", "start:open": "vite --open", "build": "tsc && vite build", "serve": "vite preview", @@ -119,6 +120,7 @@ "jest-environment-jsdom": "^29.7.0", "license-checker": "^25.0.1", "prettier": "^3.5.3", + "prettier-plugin-glsl": "^0.2.1", "prettier-plugin-properties": "^0.3.0", "svgo": "^3.3.2", "ts-node": "^10.9.2", diff --git a/prettier.config.js b/prettier.config.js index 08117372bd..b13eabffd1 100644 --- a/prettier.config.js +++ b/prettier.config.js @@ -19,12 +19,17 @@ const config = { printWidth: 120, singleQuote: true, keySeparator: '=', // format of separator in .properties - plugins: ['prettier-plugin-properties'], + plugins: ['prettier-plugin-properties', 'prettier-plugin-glsl'], overrides: [ { files: ['.env', '.env.*'], options: { parser: 'dot-properties' }, }, + { + // .frag files are recognized as JavaScript files by default + files: ['*.frag'], + options: { parser: 'glsl-parser' }, + }, { files: ['.github/**/*'], options: { tabWidth: 2 }, diff --git a/vite.config_dev.ts b/vite.config_dev.ts new file mode 100644 index 0000000000..fe5adf25c2 --- /dev/null +++ b/vite.config_dev.ts @@ -0,0 +1,49 @@ +/** + * Copyright (c) 2024, RTE (http://www.rte-france.com) + * This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this + * file, You can obtain one at http://mozilla.org/MPL/2.0/. + */ + +import { defineConfig, loadEnv, mergeConfig } from 'vite'; +import defaultConfig from './vite.config.ts'; +import react from '@vitejs/plugin-react'; +// @ts-expect-error See https://github.com/gxmari007/vite-plugin-eslint/issues/79 +import eslint from 'vite-plugin-eslint'; +import svgr from 'vite-plugin-svgr'; +import tsconfigPaths from 'vite-tsconfig-paths'; +import * as path from 'node:path'; + +export default defineConfig((configEnv) => { + // Load env file based on `mode` in the current working directory. + // Set the third parameter to '' to load all env regardless of the + // `VITE_` prefix. + const env = loadEnv(configEnv.mode, process.cwd(), ''); + const baseConfig = defaultConfig(configEnv); + baseConfig.plugins = []; // remove existing plugins + return mergeConfig(baseConfig, { + plugins: [ + react(), + eslint({ + failOnWarning: true, + lintOnStart: false, + }), + svgr(), // works on every import with the pattern "**/*.svg?react" + tsconfigPaths(), // to resolve absolute path via tsconfig cf https://stackoverflow.com/a/68250175/5092999 + ], + resolve: { + alias: { + // Use source files from the workspace package during demo dev for HMR + '@powsybl/network-map-layers': path.resolve(env.POWSYBL_NETWORK_VIEWER_PATH, 'packages/network-map-layers/src'), + // Also allow importing the library src directly from the demo if needed + '@powsybl/network-viewer': path.resolve(env.POWSYBL_NETWORK_VIEWER_PATH, 'src'), + }, + // Ensure symlinks from the outside dependency don't confuse module resolution + preserveSymlinks: true, + }, + optimizeDeps: { + // Do not prebundle the outside dependency package; we want it treated as source for HMR + exclude: ['@powsybl/network-map-layers', '@powsybl/network-viewer'], + }, + }); +});