LCAcollect is a web platform for collecting documentation for LCA (Life Cycle Assessment). LCAcollect has been developed by Arkitema and COWI and given to the Danish Building Industry to be used widely in the industry.
This the frontend app for the LCAcollect Tool. It is written in Typescript and React.
Copy the .env.example
to .env
and populate the values.
To start the dev server
npm run dev
To run unit tests
npm run test
To run interactive Cypress tests
npm run e2e:open
NOTE: before running the e2e tests the following env vars need to be set:
CYPRESS_AAD_TENANT_ID=
CYPRESS_AAD_CLIENT_ID=
CYPRESS_AAD_APP_CLIENT_SECRET=
CYPRESS_TEST_USER_EMAIL=
CYPRESS_TEST_USER_PASSWORD=
To generate GraphQL hooks
npm run codegen
You can use npm link
to set up live reloading of the other @lcacollect
packages.
- Clone the package that you wish to enable live reload on.
- In the terminal, go the root folder of the cloned repo and write
npm link
in the terminal - Go back to this repo's root folder and write
npm link @lcacollect/{PACKAGE}
to link the package.
Example of a oneliner for linking the project
package (executed from lcacollect/frontend/
):
npm link ../shared-project-frontend && npm link @lcacollect/project
- When you make changes to the package, that you wish to see in this app, simply run
npm run build
in the package and the changes will available here. - To enable hot reloading for a linked project, go to vite.config.ts and remove the comment
//
for the linked project you want to enable hot reloading for (NB! Only 1 project at a time). Then open a new terminal in the directory of the linked project and runnpm run build:watch
, to see changes live locally.
Example where the project
package is enabled for hot reloading:
optimizeDeps: {
exclude: [
// '@lcacollect/assembly',
// '@lcacollect/documentation',
'@lcacollect/project',
// '@lcacollect/core',
// '@lcacollect/components',
// '@lcacollect/e2e-testing',
],
...
}
cypress/ # Contains E2E tests
e2e/ # The tests themselves
fixtures/ # Mock data
support/ # Helper functions
src/ # Contains the source code
app/ # Contains the App component
assets/ # Contains assets, such as images
components/ # React components
myComponent/ # Each component has its own folder
index.ts # Export of what is public
myComponent.tsx # The component
myComponent.spec.tsx # Unit test file
dataAccess/ # Apollo Client folder
generated.ts # Autogenerated file from Apollo with React Hooks for data fetching
schema.graphql # File for writing GraphQL queries
pages/ # Page components
routes/ # Routing for the app
Further documentation for LCAcollect can be found here
Unless otherwise described, the code in this repository is licensed under the Apache-2.0 License. Please note that some modules, extensions or code herein might be otherwise licensed. This is indicated either in the root of the containing folder under a different license file, or in the respective file's header. If you have any questions, don't hesitate to get in touch with us via email.