diff --git a/.eslintrc.json b/.eslintrc.json index b0d42baf..558f1506 100644 --- a/.eslintrc.json +++ b/.eslintrc.json @@ -17,7 +17,9 @@ ], "parser": "@typescript-eslint/parser", "parserOptions": { - "ecmaFeatures": { "jsx": true }, + "ecmaFeatures": { + "jsx": true + }, "ecmaVersion": "latest", "sourceType": "module" }, @@ -33,17 +35,32 @@ "react-hooks/rules-of-hooks": "error", "react-hooks/exhaustive-deps": "error", "react/boolean-prop-naming": "warn", - "prettier/prettier": "error", + "prettier/prettier": "warn", "@tanstack/query/exhaustive-deps": "error", "@typescript-eslint/no-unused-vars": "error", "@typescript-eslint/ban-ts-comment": [ "error", - { "ts-ignore": { "descriptionFormat": "^ because .+$" } } + { + "ts-ignore": { + "descriptionFormat": "^ because .+$" + } + } + ], + "camelcase": [ + "error", + { + "ignoreImports": true + } ], - "camelcase": ["error", { "ignoreImports": true }], "max-depth": "warn", "max-lines": "warn", - "max-lines-per-function": ["warn", { "max": 60, "skipBlankLines": true }], + "max-lines-per-function": [ + "warn", + { + "max": 60, + "skipBlankLines": true + } + ], "no-console": "warn", "no-duplicate-imports": "error", "no-self-compare": "error", @@ -51,8 +68,17 @@ "prefer-const": "error", "sort-imports": [ "error", - { "ignoreCase": true, "ignoreDeclarationSort": true } + { + "ignoreCase": true, + "ignoreDeclarationSort": true + } ], - "spaced-comment": ["warn", "always", { "markers": ["/"] }] + "spaced-comment": [ + "warn", + "always", + { + "markers": ["/"] + } + ] } } diff --git a/.github/workflows/on-tag.yaml b/.github/workflows/on-tag.yaml index 51e01fd6..d82aac3d 100644 --- a/.github/workflows/on-tag.yaml +++ b/.github/workflows/on-tag.yaml @@ -29,4 +29,4 @@ jobs: needs: [set-tag-ref] uses: ./.github/workflows/publish.yaml with: - IMAGE_TAG: ${{ needs.set-tag-ref.outputs.tag-ref }} \ No newline at end of file + IMAGE_TAG: ${{ needs.set-tag-ref.outputs.tag-ref }} diff --git a/.github/workflows/publish.yaml b/.github/workflows/publish.yaml index 43e2f9ee..9de9497d 100644 --- a/.github/workflows/publish.yaml +++ b/.github/workflows/publish.yaml @@ -22,4 +22,3 @@ jobs: - name: Publish Container Image run: IMAGE_TAG=${{inputs.IMAGE_TAG}} docker compose push - diff --git a/.github/workflows/tests.yaml b/.github/workflows/tests.yaml index e6b1b34e..bdf318e0 100644 --- a/.github/workflows/tests.yaml +++ b/.github/workflows/tests.yaml @@ -1,4 +1,4 @@ -name: "CI" +name: 'CI' on: push: @@ -27,4 +27,4 @@ jobs: yarn test yarn build env: - CI: false \ No newline at end of file + CI: false diff --git a/.prettierrc.js b/.prettierrc.js index 57aed2bf..a0a06fd5 100644 --- a/.prettierrc.js +++ b/.prettierrc.js @@ -1,8 +1,8 @@ // default config module.exports = { - trailingComma: 'es5', + trailingComma: 'all', tabWidth: 2, - semi: false, + semi: true, singleQuote: true, endOfLine: 'auto', -} \ No newline at end of file +}; diff --git a/README.md b/README.md index 323abeb7..008181d6 100644 --- a/README.md +++ b/README.md @@ -1,20 +1,25 @@ # PEPM-UI + User Interface for **Parameter Estimation from Process Models**. ## :zap: Getting started + Clone the repository. Make sure you have [Node](https://nodejs.org/en/) and [yarn](https://yarnpkg.com/) installed. In the root folder of the application, run available scripts: ### Install dependencies Install third-party packages for local development. + ```sh yarn install ``` ### Run locally + > **Note:** To run successfully, local overrides of `.env` must be defined, for instance in `.env.local`, or [see what other .env files can be used.](https://create-react-app.dev/docs/adding-custom-environment-variables/#what-other-env-files-can-be-used) This will by default run the application in your standard web browser at `localhost:3000`. + ```sh yarn start ``` @@ -24,6 +29,7 @@ yarn start > **Note:** This step requires a `.env.development.local` file, with local overrides of `.env` for your local environment. Build and run docker image for local development. + ```sh docker compose -f compose-dev.yaml up --build ``` @@ -31,9 +37,11 @@ docker compose -f compose-dev.yaml up --build ### Husky pre-commit We use [husky](https://typicode.github.io/husky/#/) to automatically run tests, linting and formatting on commits, but you can also use the command below to run pre-commit manually. + ```sh yarn pre-commit ``` ## Authentication -Authentication is implemented with [Microsoft Oauth2 for React](https://learn.microsoft.com/en-us/azure/active-directory/develop/single-page-app-tutorial-01-register-app) \ No newline at end of file + +Authentication is implemented with [Microsoft Oauth2 for React](https://learn.microsoft.com/en-us/azure/active-directory/develop/single-page-app-tutorial-01-register-app) diff --git a/package.json b/package.json index 02047e8f..cc30b246 100644 --- a/package.json +++ b/package.json @@ -10,6 +10,7 @@ "@equinor/eds-icons": "^0.19.1", "@equinor/eds-tokens": "^0.9.0", "@tanstack/react-query": "^4.32.6", + "@tanstack/react-query-devtools": "^4.36.1", "@tanstack/react-table": "^8.9.1", "@testing-library/jest-dom": "^5.14.1", "@testing-library/react": "^13.0.0", @@ -20,6 +21,7 @@ "@types/react-dom": "^18.0.0", "axios": "^1.5.0", "openapi-fetch": "^0.7.2", + "openapi-typescript-codegen": "^0.25.0", "react": "^18.2.0", "react-dom": "^18.2.0", "react-router-dom": "^6.8.0", @@ -35,6 +37,7 @@ "test:ts": "tsc --noEmit", "eject": "react-scripts eject", "lint": "eslint --fix --ext .ts,.tsx .", + "prettier:fix": "prettier . --write", "prepare": "husky install", "pre-commit": "yarn test --watchAll=false && yarn lint-staged", "generate-schema:radix": "npx openapi-typescript https://api-pepm-dev.radix.equinor.com/swagger/v1/swagger.yaml -o src/models/schema.d.ts" @@ -67,4 +70,4 @@ "openapi-typescript": "^6.3.9", "prettier": "^2.8.2" } -} +} \ No newline at end of file diff --git a/public/index.html b/public/index.html index 171bf0d7..1bafa9c6 100644 --- a/public/index.html +++ b/public/index.html @@ -2,13 +2,19 @@ - + - + PEPM diff --git a/radixconfig.yaml b/radixconfig.yaml index d7358957..b1f19dce 100644 --- a/radixconfig.yaml +++ b/radixconfig.yaml @@ -18,11 +18,11 @@ spec: - name: http port: 3000 variables: - REACT_APP_AAD_TENANT_ID: "" - REACT_APP_AAD_CLIENT_ID: "" - REACT_APP_AAD_REDIRECT_URI: "" - REACT_APP_BACKEND_URL: "" - REACT_APP_BACKEND_API_SCOPE: "" + REACT_APP_AAD_TENANT_ID: '' + REACT_APP_AAD_CLIENT_ID: '' + REACT_APP_AAD_REDIRECT_URI: '' + REACT_APP_BACKEND_URL: '' + REACT_APP_BACKEND_API_SCOPE: '' environmentConfig: - environment: dev - environment: test @@ -42,30 +42,30 @@ spec: - environment: dev imageTagName: latest variables: - ASPNETCORE_ENVIRONMENT: "Development" + ASPNETCORE_ENVIRONMENT: 'Development' - environment: test imageTagName: latest variables: - ASPNETCORE_ENVIRONMENT: "Test" + ASPNETCORE_ENVIRONMENT: 'Test' - environment: prod imageTagName: latest variables: - ASPNETCORE_ENVIRONMENT: "Production" + ASPNETCORE_ENVIRONMENT: 'Production' jobs: - name: pepm-nrresqml image: ghcr.io/equinor/pepm-worker-api/pepm-nrresqml:latest schedulerPort: 8090 resources: requests: - memory: "2048Mi" - cpu: "1000m" + memory: '2048Mi' + cpu: '1000m' limits: - memory: "4096Mi" - cpu: "2000m" + memory: '4096Mi' + cpu: '2000m' payload: path: /app/args variables: - MODELS_PATH: "/mnt/azure-storage/models" + MODELS_PATH: '/mnt/azure-storage/models' environmentConfig: - environment: dev volumeMounts: @@ -86,15 +86,15 @@ spec: schedulerPort: 8090 resources: requests: - memory: "4096Mi" - cpu: "1000m" + memory: '4096Mi' + cpu: '1000m' limits: - memory: "8192Mi" - cpu: "2000m" + memory: '8192Mi' + cpu: '2000m' payload: path: /app/args variables: - MODELS_PATH: "/mnt/azure-storage/models" + MODELS_PATH: '/mnt/azure-storage/models' environmentConfig: - environment: dev volumeMounts: @@ -113,4 +113,4 @@ spec: privateImageHubs: ghcr.io: username: hakoneriksson - email: hake@equinor.com \ No newline at end of file + email: hake@equinor.com diff --git a/src/App.styled.tsx b/src/App.styled.tsx index fc9d37ba..1be2fe45 100644 --- a/src/App.styled.tsx +++ b/src/App.styled.tsx @@ -1,7 +1,7 @@ -import styled from 'styled-components' +import styled from 'styled-components'; const StyledOutletWrapper = styled.section` height: calc(100% - 128px); overflow: scroll; -` -export { StyledOutletWrapper as OutletWrapper } +`; +export { StyledOutletWrapper as OutletWrapper }; diff --git a/src/App.test.tsx b/src/App.test.tsx index 1e96f51c..a0d135cb 100644 --- a/src/App.test.tsx +++ b/src/App.test.tsx @@ -1,6 +1,6 @@ -import { render } from '@testing-library/react' -import { App } from './App' +import { render } from '@testing-library/react'; +import { App } from './App'; test('renders without crashing', () => { - render() -}) + render(); +}); diff --git a/src/App.tsx b/src/App.tsx index c7153fbe..966b588e 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -1,31 +1,25 @@ import { AuthenticatedTemplate, UnauthenticatedTemplate, - useMsal, -} from '@azure/msal-react' -import { Outlet } from 'react-router-dom' -import * as Styled from './App.styled' -import AppBar from './features/AppBar/AppBar' -import { Footer } from './features/Footer/Footer' -import { NoAccess } from './pages/NoAccess/NoAccess' + useMsalAuthentication, +} from '@azure/msal-react'; +import { InteractionType } from '@azure/msal-browser'; +import { Layout } from './pages/Layout'; +import { OpenAPI } from './api/generated'; +import { apiConfig } from './auth/authConfig'; export function App() { - const { instance } = useMsal() + useMsalAuthentication(InteractionType.Redirect); + OpenAPI.BASE = apiConfig.baseUrl; return ( <> - - - - -