diff --git a/.env b/.env index ee0db5e87..4ab712660 100644 --- a/.env +++ b/.env @@ -1,14 +1,14 @@ -REACT_APP_ORIGIN= -REACT_APP_API_URI= -REACT_APP_CMS_URI= -REACT_APP_APPLICATION_NAME=$npm_package_name -REACT_APP_ELIGIBLE_CITIES=helsinki,helsingfors -REACT_APP_OIDC_AUTHORITY= -REACT_APP_OIDC_CLIENT_ID="https://api.hel.fi/auth/kukkuu-ui" -REACT_APP_OIDC_SCOPE="openid profile https://api.hel.fi/auth/kukkuu" -REACT_APP_VERSION=$npm_package_version -REACT_APP_FEATURE_FLAG_SHOW_CORONAVIRUS_INFO=false -REACT_APP_ADMIN_TICKET_VALIDATION_URL=https://kukkuu-admin-ui.test.hel.ninja/check-ticket-validity +VITE_ORIGIN= +VITE_API_URI= +VITE_CMS_URI= +VITE_APPLICATION_NAME=$npm_package_name +VITE_ELIGIBLE_CITIES=helsinki,helsingfors +VITE_OIDC_AUTHORITY= +VITE_OIDC_CLIENT_ID="https://api.hel.fi/auth/kukkuu-ui" +VITE_OIDC_SCOPE="openid profile https://api.hel.fi/auth/kukkuu" +VITE_VERSION=$npm_package_version +VITE_FEATURE_FLAG_SHOW_CORONAVIRUS_INFO=false +VITE_ADMIN_TICKET_VALIDATION_URL=https://kukkuu-admin-ui.test.hel.ninja/check-ticket-validity BROWSER_TESTS_ENV_URL=http://localhost:3000 BROWSER_TESTS_USER_NAME= BROWSER_TESTS_USER_PASSWORD= diff --git a/.env.development b/.env.development index b73fa823f..513039103 100644 --- a/.env.development +++ b/.env.development @@ -1,4 +1,4 @@ -REACT_APP_ORIGIN=http://localhost:3000 -REACT_APP_API_URI=https://kukkuu.api.test.hel.ninja/graphql -REACT_APP_OIDC_AUTHORITY=https://tunnistamo.test.kuva.hel.ninja -REACT_APP_CMS_URI=https://kukkuu.hkih.stage.geniem.io/graphql +VITE_ORIGIN=http://localhost:3000 +VITE_API_URI=https://kukkuu.api.test.hel.ninja/graphql +VITE_OIDC_AUTHORITY=https://tunnistamo.test.kuva.hel.ninja +VITE_CMS_URI=https://kukkuu.hkih.stage.geniem.io/graphql diff --git a/.env.test b/.env.test index 9f41e7b9c..4fd33894c 100644 --- a/.env.test +++ b/.env.test @@ -1,3 +1,3 @@ -REACT_APP_ORIGIN= -REACT_APP_CMS_URI=https://kukkuu.hkih.stage.geniem.io/graphql -REACT_APP_OIDC_AUTHORITY="https://tunnistamo.test.kuva.hel.ninja" +VITE_ORIGIN= +VITE_CMS_URI=https://kukkuu.hkih.stage.geniem.io/graphql +VITE_OIDC_AUTHORITY="https://tunnistamo.test.kuva.hel.ninja" diff --git a/.eslintrc.json b/.eslintrc.json index b46f5edc7..580000a74 100644 --- a/.eslintrc.json +++ b/.eslintrc.json @@ -1,11 +1,11 @@ { "extends": [ "react-app", - "plugin:@typescript-eslint/recommended", "plugin:import/errors", "plugin:import/warnings", "plugin:import/typescript", - "plugin:prettier/recommended" + "plugin:prettier/recommended", + "plugin:testcafe/recommended" ], "rules": { "@typescript-eslint/brace-style": [ @@ -13,14 +13,7 @@ "1tbs", { "allowSingleLine": true } ], - "@typescript-eslint/explicit-function-return-type": "off", - "@typescript-eslint/explicit-module-boundary-types": "off", - "@typescript-eslint/func-call-spacing": ["error"], - "@typescript-eslint/member-ordering": ["warn"], - "@typescript-eslint/no-require-imports": ["error"], - "@typescript-eslint/no-redeclare": "off", "no-use-before-define": "off", - "@typescript-eslint/no-use-before-define": ["error"], "react/no-unused-prop-types": ["warn", { "skipShapeProps": true }], "array-bracket-spacing": ["warn", "never"], "import/order": [ @@ -51,6 +44,7 @@ ], "globals": { "React": true, - "JSX": true + "JSX": true, + "vi": true } } diff --git a/.prettierrc.json b/.prettierrc.json index 56e788863..6445a98ef 100644 --- a/.prettierrc.json +++ b/.prettierrc.json @@ -4,4 +4,4 @@ "trailingComma": "es5", "semi": true, "singleQuote": true -} \ No newline at end of file +} diff --git a/.release-please-manifest.json b/.release-please-manifest.json index a780111df..77566c0c3 100644 --- a/.release-please-manifest.json +++ b/.release-please-manifest.json @@ -1,3 +1,3 @@ { ".": "1.14.1" -} \ No newline at end of file +} diff --git a/.testcaferc.json b/.testcaferc.json index 18fa07bd8..1bece91b2 100644 --- a/.testcaferc.json +++ b/.testcaferc.json @@ -7,4 +7,4 @@ "module": "@testing-library/dom/dist/@testing-library/dom.umd.js" } ] -} \ No newline at end of file +} diff --git a/.vscode/launch.json b/.vscode/launch.json index 6c98944c9..7a8c1e596 100644 --- a/.vscode/launch.json +++ b/.vscode/launch.json @@ -1,33 +1,28 @@ { - "version": "0.2.0", - "configurations": [ - { - "name": "Debug Tests", - "type": "node", - "request": "launch", - "runtimeExecutable": "${workspaceRoot}/node_modules/.bin/react-scripts", - "args": [ - "test", - "--runInBand", - "--no-cache", - "--watchAll=false" - ], - "cwd": "${workspaceRoot}", - "protocol": "inspector", - "console": "integratedTerminal", - "internalConsoleOptions": "neverOpen", - "env": { "CI": "true" }, - "disableOptimisticBPs": true - }, - { - "name": "Chrome", - "type": "chrome", - "request": "launch", - "url": "http://localhost:3000", - "webRoot": "${workspaceFolder}/src", - "sourceMapPathOverrides": { - "webpack:///src/*": "${webRoot}/*" - } + "version": "0.2.0", + "configurations": [ + { + "name": "Debug Tests", + "type": "node", + "request": "launch", + "runtimeExecutable": "${workspaceRoot}/node_modules/.bin/react-scripts", + "args": ["test", "--runInBand", "--no-cache", "--watchAll=false"], + "cwd": "${workspaceRoot}", + "protocol": "inspector", + "console": "integratedTerminal", + "internalConsoleOptions": "neverOpen", + "env": { "CI": "true" }, + "disableOptimisticBPs": true + }, + { + "name": "Chrome", + "type": "chrome", + "request": "launch", + "url": "http://localhost:3000", + "webRoot": "${workspaceFolder}/src", + "sourceMapPathOverrides": { + "webpack:///src/*": "${webRoot}/*" } - ] -} \ No newline at end of file + } + ] +} diff --git a/CHANGELOG.md b/CHANGELOG.md index abce7cd34..034933523 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -401,22 +401,19 @@ See https://github.com/City-of-Helsinki/kukkuu-ui/milestone/6?closed=1 ## [1.14.1](https://github.com/City-of-Helsinki/kukkuu-ui/compare/kukkuu-ui-v1.14.0...kukkuu-ui-v1.14.1) (2023-08-31) - ### Bug Fixes -* **dockerfile:** Add REACT_APP_ADMIN_TICKET_VALIDATION_URL argument ([7642b17](https://github.com/City-of-Helsinki/kukkuu-ui/commit/7642b17eeae2226df085b29774b26b32789a65e4)) +- **dockerfile:** Add VITE_ADMIN_TICKET_VALIDATION_URL argument ([7642b17](https://github.com/City-of-Helsinki/kukkuu-ui/commit/7642b17eeae2226df085b29774b26b32789a65e4)) ## [1.14.0](https://github.com/City-of-Helsinki/kukkuu-ui/compare/kukkuu-ui-v1.13.1...kukkuu-ui-v1.14.0) (2023-08-31) - ### Features -* **logos:** Add Tiedemuseo Liekki & update Hotelli- ja ravintolamuseo ([4d4bfee](https://github.com/City-of-Helsinki/kukkuu-ui/commit/4d4bfeea410419598b14643d7e13445df79484d2)) - +- **logos:** Add Tiedemuseo Liekki & update Hotelli- ja ravintolamuseo ([4d4bfee](https://github.com/City-of-Helsinki/kukkuu-ui/commit/4d4bfeea410419598b14643d7e13445df79484d2)) ### Bug Fixes -* Dockerfile base on ubi image DEVOPS-560 ([#486](https://github.com/City-of-Helsinki/kukkuu-ui/issues/486)) ([d9b119b](https://github.com/City-of-Helsinki/kukkuu-ui/commit/d9b119be6ef8a64c18aeed3a2b593222de11fbea)) +- Dockerfile base on ubi image DEVOPS-560 ([#486](https://github.com/City-of-Helsinki/kukkuu-ui/issues/486)) ([d9b119b](https://github.com/City-of-Helsinki/kukkuu-ui/commit/d9b119be6ef8a64c18aeed3a2b593222de11fbea)) ## 0.1.2 (February 6th, 2020) diff --git a/Dockerfile b/Dockerfile index b7c99e8a7..20ed47872 100644 --- a/Dockerfile +++ b/Dockerfile @@ -50,16 +50,16 @@ CMD ["yarn", "start"] FROM appbase as staticbuilder # =================================== -ARG REACT_APP_ORIGIN -ARG REACT_APP_ADMIN_TICKET_VALIDATION_URL -ARG REACT_APP_API_URI -ARG REACT_APP_CMS_URI -ARG REACT_APP_OIDC_AUTHORITY -ARG REACT_APP_ENVIRONMENT -ARG REACT_APP_OIDC_CLIENT_ID -ARG REACT_APP_OIDC_SCOPE -ARG REACT_APP_FEATURE_FLAG_SHOW_CORONAVIRUS_INFO -ARG REACT_APP_SENTRY_DSN +ARG VITE_ORIGIN +ARG VITE_ADMIN_TICKET_VALIDATION_URL +ARG VITE_API_URI +ARG VITE_CMS_URI +ARG VITE_OIDC_AUTHORITY +ARG VITE_ENVIRONMENT +ARG VITE_OIDC_CLIENT_ID +ARG VITE_OIDC_SCOPE +ARG VITE_FEATURE_FLAG_SHOW_CORONAVIRUS_INFO +ARG VITE_SENTRY_DSN COPY . /app RUN yarn build diff --git a/README.md b/README.md index c16761d0c..4f9f4e0be 100644 --- a/README.md +++ b/README.md @@ -53,7 +53,7 @@ For isolated developing environment, you can use our Docker instructions. ### .env variables -Change REACT_APP_ELIGIBLE_CITIES if you wish to use the project in another city or municipality. +Change VITE_ELIGIBLE_CITIES if you wish to use the project in another city or municipality. ## Available Scripts @@ -62,25 +62,33 @@ In the project directory, you can run: ### `yarn start` Runs the app in the development mode.
+Aliases: `vite dev`, `vite serve`.
Open [http://localhost:3000](http://localhost:3000) to view it in the browser. The page will reload if you make edits.
You will also see any lint errors in the console. -### `yarn test` - -Launches the test runner in the interactive watch mode.
-See the section about [running tests](https://facebook.github.io/create-react-app/docs/running-tests) for more information. +See more from [CLI guide](https://vitejs.dev/guide/cli.html#vite). -### `yarn run build` +### `yarn build` -Builds the app for production to the `build` folder.
+Builds the app for production.
It correctly bundles React in production mode and optimizes the build for the best performance. The build is minified and the filenames include the hashes.
Your app is ready to be deployed! -See the section about [deployment](https://facebook.github.io/create-react-app/docs/deployment) for more information. +See the section about [building for production](https://vitejs.dev/guide/build.html) and [CLI guide](https://vitejs.dev/guide/cli.html#vite-build) for more information. + +### `yarn serve` + +Locally preview the production build. Do not use this as a production server as it's not designed for it. +See more from [CLI guide](https://vitejs.dev/guide/cli.html#vite-preview). + +### `yarn test` + +Launches the test runner in the interactive watch mode.
+See the section about [Getting started](https://vitest.dev/guide/) for more information. ### `yarn update-translations` @@ -164,12 +172,12 @@ Clone the repository (https://github.com/City-of-Helsinki/kukkuu). Follow the in ### Headless CMS -A headless CMS system is used to produce some dynamic pages. The Headless CMS server endpoint is set with `REACT_APP_CMS_URI` environment variable. +A headless CMS system is used to produce some dynamic pages. The Headless CMS server endpoint is set with `VITE_CMS_URI` environment variable. The default server that is used is the test / staging server: ``` -REACT_APP_CMS_URI="https://kukkuu.hkih.stage.geniem.io/graphql" +VITE_CMS_URI="https://kukkuu.hkih.stage.geniem.io/graphql" ``` ### kukkuu-ui @@ -221,6 +229,6 @@ Redux internal state can be visualized with [Redux-devtools](https://github.com/ ## Learn More -You can learn more in the [Create React App documentation](https://facebook.github.io/create-react-app/docs/getting-started). +You can learn more in the [Vite documentation](https://vitejs.dev/guide/). To learn React, check out the [React documentation](https://reactjs.org/). diff --git a/azure-pipelines-review.yml b/azure-pipelines-review.yml index 4d4c1f03c..e9ecc81d5 100644 --- a/azure-pipelines-review.yml +++ b/azure-pipelines-review.yml @@ -8,27 +8,27 @@ trigger: none # Pull request (PR) triggers cause a pipeline to run whenever a pull request is -# opened with one of the specified target branches, or when updates are made to +# opened with one of the specified target branches, or when updates are made to # such a pull request. # -# GitHub creates a new ref when a pull request is created. The ref points to a -# merge commit, which is the merged code between the source and target branches +# GitHub creates a new ref when a pull request is created. The ref points to a +# merge commit, which is the merged code between the source and target branches # of the pull request. # -# Opt out of pull request validation +# Opt out of pull request validation pr: # PR target branch branches: include: - - master + - master paths: exclude: - - '*release-please*' - - '**/*.md' - - '.github/' - - 'azure-pipelines-release.yml' - - 'azure-pipelines-test.yml' - - 'docker-compose*' + - '*release-please*' + - '**/*.md' + - '.github/' + - 'azure-pipelines-release.yml' + - 'azure-pipelines-test.yml' + - 'docker-compose*' # By default, use self-hosted agents pool: Default @@ -51,8 +51,8 @@ extends: # Does not contain all buildArguments, the rest located in harrastukset-pipelines/harrastukset-variables-development.yml and harrastukset-variables-common.yml # The values here will override the values defined in the harrastukset-pipelines repository buildArgs: - REACT_APP_CMS_URI: 'https://kukkuu.hkih.stage.geniem.io/graphql' - REACT_APP_API_URI: 'https://kukkuu-local.api.dev.hel.ninja/graphql' - REACT_APP_ADMIN_TICKET_VALIDATION_URL: 'https://kukkuu-admin.test.hel.ninja/check-ticket-validity' - REACT_APP_FEATURE_FLAG_SHOW_CORONAVIRUS_INFO: false + VITE_CMS_URI: 'https://kukkuu.hkih.stage.geniem.io/graphql' + VITE_API_URI: 'https://kukkuu-local.api.dev.hel.ninja/graphql' + VITE_ADMIN_TICKET_VALIDATION_URL: 'https://kukkuu-admin.test.hel.ninja/check-ticket-validity' + VITE_FEATURE_FLAG_SHOW_CORONAVIRUS_INFO: false # configMap: # pod environment variables diff --git a/azure-pipelines-test.yml b/azure-pipelines-test.yml index 0ac905f6e..22f11713e 100644 --- a/azure-pipelines-test.yml +++ b/azure-pipelines-test.yml @@ -7,9 +7,9 @@ trigger: - master paths: exclude: - - '*release-please*' - - '**/*.md' - - '.github/' + - '*release-please*' + - '**/*.md' + - '.github/' # Pull request (PR) triggers cause a pipeline to run whenever a pull request is # opened with one of the specified target branches, or when updates are made to diff --git a/browser-tests/api/login.ts b/browser-tests/api/login.ts index 1d78902df..8855d24d0 100644 --- a/browser-tests/api/login.ts +++ b/browser-tests/api/login.ts @@ -8,10 +8,10 @@ export const loginPage = { }; export const login = async (t: TestController) => { - const username = testUsername(), password = testUserPassword(); + const username = testUsername(), + password = testUserPassword(); - await t - .click(loginPage.loginButton) + await t.click(loginPage.loginButton); await t .typeText(loginPage.username, username) diff --git a/browser-tests/api/userTunnistamo.ts b/browser-tests/api/userTunnistamo.ts index 68ccb5f84..433ec7d28 100644 --- a/browser-tests/api/userTunnistamo.ts +++ b/browser-tests/api/userTunnistamo.ts @@ -7,7 +7,10 @@ export const user = { username: `${testUsername()}`, password: `${testUserPassword()}`, selectByUsername: Selector('tr').withText(`${testUsername()}`), - selectByEmail: Selector('.field-email').withText(`${testUsername()}`).sibling('.field-username').child('a'), + selectByEmail: Selector('.field-email') + .withText(`${testUsername()}`) + .sibling('.field-username') + .child('a'), // user change staffStatus: screen.getByLabelText(/Ylläpitäjä|Staff status/i), staffStatusCheckbox: Selector('#id_is_staff'), @@ -33,18 +36,15 @@ export const tunnistamoUserAccesses = async (t: TestController) => { await t.navigateTo(routeUser()); - await t.click(user.selectByEmail); // these needs to be checked - if (! await user.staffStatusCheckbox.checked) { - await t.click(user.staffStatus) + if (!(await user.staffStatusCheckbox.checked)) { + await t.click(user.staffStatus); } - if (! await user.superUserStatusCheckbox.checked) { - await t.click(user.superUserStatus) + if (!(await user.superUserStatusCheckbox.checked)) { + await t.click(user.superUserStatus); } - await t - .click(user.chooseAllPermissions) - .click(user.saveButton); + await t.click(user.chooseAllPermissions).click(user.saveButton); }; diff --git a/browser-tests/apiAccessFeature.ts b/browser-tests/apiAccessFeature.ts index b52f1659b..fef818f27 100644 --- a/browser-tests/apiAccessFeature.ts +++ b/browser-tests/apiAccessFeature.ts @@ -1,15 +1,10 @@ import { login } from './utils/login'; import { tunnistamoUserAccesses } from './api/userTunnistamo'; -import { - route, -} from './pages/godchildrenProfilePage'; - -fixture`Api access feature` - .page(route()) - .beforeEach(async (t) => { - await login(t); - }); +import { route } from './pages/godchildrenProfilePage'; +fixture`Api access feature`.page(route()).beforeEach(async (t) => { + await login(t); +}); test('Ensure tunnistamo user has accesses', async (t) => { await tunnistamoUserAccesses(t); diff --git a/browser-tests/eventGroupsFeature.ts b/browser-tests/eventGroupsFeature.ts index abc8a1ea7..f2a33dbfc 100644 --- a/browser-tests/eventGroupsFeature.ts +++ b/browser-tests/eventGroupsFeature.ts @@ -26,7 +26,5 @@ test('As a user I can use event groups to find events', async (t) => { await t.click(eventGroupPage.selectEventButtons.nth(0)); // Expect its name to be a hardcoded value - await t - .expect(eventPage.title.textContent) - .contains('Test event'); + await t.expect(eventPage.title.textContent).contains('Test event'); }); diff --git a/browser-tests/pages/githubLogin.ts b/browser-tests/pages/githubLogin.ts index a94af0350..81b612f95 100644 --- a/browser-tests/pages/githubLogin.ts +++ b/browser-tests/pages/githubLogin.ts @@ -1,7 +1,6 @@ import { screen } from '@testing-library/testcafe'; -export const githubLogin = -{ +export const githubLogin = { loginLink: screen.getByText('GitHub'), username: screen.getByLabelText('Username or email address'), password: screen.getByLabelText('Password'), diff --git a/browser-tests/pages/register.ts b/browser-tests/pages/register.ts index 6e4a193fb..e63156dd9 100644 --- a/browser-tests/pages/register.ts +++ b/browser-tests/pages/register.ts @@ -34,5 +34,7 @@ export const registrationForm = { }; export const registrationDone = { - continueButton: screen.getByRole('button', { name: 'Oma kummilapsiprofiili' }), -} \ No newline at end of file + continueButton: screen.getByRole('button', { + name: 'Oma kummilapsiprofiili', + }), +}; diff --git a/browser-tests/utils/login.ts b/browser-tests/utils/login.ts index e353fc9e3..8e09d3e92 100644 --- a/browser-tests/utils/login.ts +++ b/browser-tests/utils/login.ts @@ -18,7 +18,7 @@ const givePermission = async (t: TestController) => { export const login = async (t: TestController) => { // @ts-ignore - const developmentMode = t.testRun.opts.developmentMode + const developmentMode = t.testRun.opts.developmentMode; // development mode, use github login if (developmentMode) { diff --git a/browser-tests/utils/register.ts b/browser-tests/utils/register.ts index 88aa3e912..b0509cb75 100644 --- a/browser-tests/utils/register.ts +++ b/browser-tests/utils/register.ts @@ -1,4 +1,8 @@ -import { registerForm, registrationForm, registrationDone } from '../pages/register'; +import { + registerForm, + registrationForm, + registrationDone, +} from '../pages/register'; import getDropdownOption from './getDropdownOption'; // Firstime sign up requires registration @@ -14,14 +18,14 @@ export const register = async (t: TestController) => { firstName: 'Hertta', lastName: 'Citron', relationship: 'Vanhempi', - } + }; const guardian = { phoneNumber: '0000000000', language: 'suomi', - } + }; if (await registerForm.section.exists) { - console.log("Register user") + console.log('Register user'); await t .typeText(registerForm.birthDayDayInput, registerChild.birthDate.day) @@ -43,7 +47,10 @@ export const register = async (t: TestController) => { .click(registrationForm.agreeCheckbox) .click(registrationForm.languagesSpokenAtHomeCombobox) .click(getDropdownOption(guardian.language)) - .typeText(registrationForm.guardianPhoneNumberInput, guardian.phoneNumber) + .typeText( + registrationForm.guardianPhoneNumberInput, + guardian.phoneNumber + ) .click(registrationForm.submitButton); await t.wait(2500); // 2.5s @@ -53,4 +60,4 @@ export const register = async (t: TestController) => { await t.wait(2500); // 2.5s } } -}; \ No newline at end of file +}; diff --git a/browser-tests/utils/settings.ts b/browser-tests/utils/settings.ts index 687bc6c89..3edc25b44 100644 --- a/browser-tests/utils/settings.ts +++ b/browser-tests/utils/settings.ts @@ -17,7 +17,7 @@ const getApiBaseUrl = () => { // API url might ppoint to graphql, remvoe var re = /\/graphql$/; - return url.replace(re, ""); + return url.replace(re, ''); }; export const testUsername = (): string => diff --git a/public/index.html b/index.html similarity index 51% rename from public/index.html rename to index.html index 1200abb75..0578691a0 100644 --- a/public/index.html +++ b/index.html @@ -1,35 +1,50 @@ - + Kulttuurin kummilapset - + - + - + - - - + + + +
+ diff --git a/package.json b/package.json index 1d1930f27..a454abb35 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,7 @@ { "name": "kukkuu-ui", "version": "1.14.1", + "private": true, "license": "MIT", "contributors": [ "Bernt Andreas Drange", @@ -9,26 +10,22 @@ "Kimmo Virtanen", "Tuomas Haapala" ], - "private": true, - "engines": { - "node": ">=16.0.0" - }, "scripts": { - "build": "cross-env SASS_PATH=$(cd ./src/assets && pwd) react-scripts --openssl-legacy-provider build", - "start": "cross-env SASS_PATH=$(cd ./src/assets && pwd) react-scripts --openssl-legacy-provider start", - "test": "cross-env SASS_PATH=$(cd ./src/assets && pwd) TZ=UTC react-scripts --openssl-legacy-provider test --transformIgnorePatterns \"node_modules/(?!(react-helsinki-headless-cms|react-helsinki-headless-cms/apollo))/\"", - "test:debug": "cross-env SASS_PATH=$(cd ./src/assets && pwd) react-scripts --openssl-legacy-provider --inspect-brk test --runInBand --no-cache", + "build": "tsc & vite build", + "format:code": "eslint --ext js,ts,tsx src --fix", + "format:scss": "prettier --config .prettierrc.json --write src/**/*.scss", "generate:graphql": "apollo client:codegen --target=typescript --no-addTypename --outputFlat src/domain/api/generatedTypes --excludes=src/domain/headlessCms/**", "lint": "eslint --ext js,ts,tsx src", - "format:scss": "prettier --config .prettierrc.json --write src/**/*.scss", - "format:code": "eslint --ext js,ts,tsx src --fix", - "update-translations": "fetch-translations 1b5qAamjhmSNiME3matBINaeyz8TvoRWVB6wU5HvKy4g -l en,fi,sv -o src/common/translation/i18n", + "serve": "vite preview", + "start": "vite", + "test": "TZ=Europe/Helsinki vitest run", + "test:coverage": "TZ=Europe/Helsinki vitest run --coverage", + "test:watch": "TZ=Europe/Helsinki vitest", "test:browser": "testcafe \"chrome --window-size='1920,1080'\" browser-tests/ --live --dev --lang=fi-FI", + "test:browser:ci": "testcafe \"chrome:headless --disable-gpu --window-size='1920,1080'\" --lang=fi-FI --screenshots path=report takeOnFails=true --video report browser-tests/", "test:browser:wsl2win": "testcafe 'path:`/mnt/c/Program Files/Google/Chrome/Application/chrome.exe`' browser-tests/ --live --dev --lang=fi-FI", - "test:browser:ci": "testcafe \"chrome:headless --disable-gpu --window-size='1920,1080'\" --lang=fi-FI --screenshots path=report takeOnFails=true --video report browser-tests/" - }, - "eslintConfig": { - "extends": "react-app" + "typecheck": "vitest typecheck", + "update-translations": "fetch-translations 1b5qAamjhmSNiME3matBINaeyz8TvoRWVB6wU5HvKy4g -l en,fi,sv -o src/common/translation/i18n" }, "browserslist": { "production": [ @@ -42,6 +39,27 @@ "last 1 safari version" ] }, + "eslintConfig": { + "extends": "react-app" + }, + "jest": { + "collectCoverageFrom": [ + "src/**/*.{ts,tsx}", + "!/node_modules/", + "!src/index.tsx", + "!src/domain/api/generatedTypes", + "!public/mockServiceWorker.js", + "!src/setupTests.ts" + ] + }, + "resolutions": { + "ansi-regex": "^5.0.1", + "eslint": "^8.0.0", + "graphql": "^16.0.0", + "immer": "^9.0.0", + "nth-check": ">=2.0.1", + "set-value": ">=4.0.1" + }, "dependencies": { "@apollo/client": "^3.7.16", "@faker-js/faker": "^8.1.0", @@ -49,9 +67,9 @@ "@jonkoops/matomo-tracker-react": "^0.7.0", "@reduxjs/toolkit": "^1.9.5", "@sentry/browser": "^7.69.0", + "@testing-library/jest-dom": "^6.1.3", "@testing-library/react": "^14.0.0", "@testing-library/testcafe": "^5.0.0", - "@types/jest": "^29.5.5", "@types/lodash": "^4.14.198", "@types/node": "^20.6.2", "@types/react": "^18.2.21", @@ -61,21 +79,32 @@ "@types/react-router-dom": "^5.3.3", "@types/react-transition-group": "^4.4.6", "@types/validator": "^13.11.1", + "@vitejs/plugin-react": "^4.0.4", + "@vitejs/plugin-react-swc": "^3.4.0", + "@vitest/coverage-v8": "^0.34.6", "axios": "^1.5.0", "browserslist": "^4.21.10", "classnames": "^2.3.2", + "codecov": "^3.8.3", "copy-to-clipboard": "^3.3.3", "cross-env": "^7.0.3", "css-what": "^6.1.0", "date-fns": "^2.30.0", + "dotenv": "^16.3.1", + "eslint": "^8.50.0", "eslint-config-prettier": "^9.0.0", + "eslint-config-react-app": "^7.0.1", + "eslint-plugin-import": "^2.28.1", "eslint-plugin-prettier": "^5.0.0", + "eslint-plugin-testcafe": "^0.2.1", "formik": "^2.4.5", - "hds-design-tokens": "^2.17.0", + "hds-core": "^2.17.0", + "hds-react": "^2.17.0", "helsinki-utils": "City-of-Helsinki/helsinki-utils-js.git#0.1.0", "html-react-parser": "^4.2.2", "i18next": "^23.5.1", "i18next-browser-languagedetector": "^7.1.0", + "jsdom": "^22.1.0", "lodash": "^4.17.21", "moment": "^2.29.4", "msw": "^1.3.1", @@ -92,42 +121,24 @@ "react-redux": "^8.1.2", "react-router": "^6.16.0", "react-router-dom": "^6.16.0", - "react-scripts": "^5.0.1", "react-toastify": "^9.1.3", "react-transition-group": "^4.4.5", "redux": "^4.2.1", "redux-oidc": "^4.0.0-beta1", "redux-persist": "^6.0.0", "sass": "^1.67.0", + "testcafe": "^3.3.0", "typescript": "^5.2.2", "validator": "^13.11.0", + "vite": "^4.4.9", + "vite-plugin-eslint": "^1.8.1", + "vite-plugin-svgr": "^4.0.0", + "vite-tsconfig-paths": "^4.2.1", + "vitest": "^0.34.4", "yup": "^1.2.0" }, - "resolutions": { - "graphql": "^16.0.0", - "eslint": "^8.0.0", - "immer": "^9.0.0", - "set-value": ">=4.0.1", - "nth-check": ">=2.0.1", - "ansi-regex": "^5.0.1" - }, - "devDependencies": { - "@testing-library/jest-dom": "^6.1.3", - "codecov": "^3.8.3", - "dotenv": "^16.3.1", - "hds-react": "^2.17.0", - "jest-fetch-mock": "^3.0.3", - "testcafe": "^3.3.0" - }, - "jest": { - "collectCoverageFrom": [ - "src/**/*.{ts,tsx}", - "!/node_modules/", - "!src/index.tsx", - "!src/domain/api/generatedTypes", - "!public/mockServiceWorker.js", - "!src/setupTests.ts" - ] + "engines": { + "node": ">=18.0.0" }, "msw": { "workerDirectory": "public" diff --git a/public/silent_renew.html b/public/silent_renew.html index 5a744d007..a1c83f747 100644 --- a/public/silent_renew.html +++ b/public/silent_renew.html @@ -1,17 +1,14 @@ - + + - - - - - - - - - \ No newline at end of file + + + + + diff --git a/release-please-config.json b/release-please-config.json index 8431409fd..54d9ce3f6 100644 --- a/release-please-config.json +++ b/release-please-config.json @@ -7,7 +7,5 @@ "package-name": "kukkuu-ui" } }, - "plugins": [ - "sentence-case" - ] -} \ No newline at end of file + "plugins": ["sentence-case"] +} diff --git a/src/assets/styles/fonts.scss b/src/assets/styles/fonts.scss index 468461332..07d30a67f 100644 --- a/src/assets/styles/fonts.scss +++ b/src/assets/styles/fonts.scss @@ -82,9 +82,20 @@ text-rendering: optimizeLegibility; } -$hel-grotesk: 'HelsinkiGrotesk', Arial, -apple-system, BlinkMacSystemFont, - 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', - 'Droid Sans', 'Helvetica Neue', sans-serif; +$hel-grotesk: + 'HelsinkiGrotesk', + Arial, + -apple-system, + BlinkMacSystemFont, + 'Segoe UI', + 'Roboto', + 'Oxygen', + 'Ubuntu', + 'Cantarell', + 'Fira Sans', + 'Droid Sans', + 'Helvetica Neue', + sans-serif; // Helsinki Brand Variables // Do not use these variables directly. diff --git a/src/assets/styles/main.scss b/src/assets/styles/main.scss index d5f1c1de3..ac085bf24 100644 --- a/src/assets/styles/main.scss +++ b/src/assets/styles/main.scss @@ -1,5 +1,5 @@ -@import 'styles/fonts'; -@import 'styles/variables'; +@import '~styles/fonts'; +@import '~styles/variables'; // Override globally all text to use Helsinki font. diff --git a/src/assets/styles/mixins.scss b/src/assets/styles/mixins.scss index 7f2d23df8..3d42ab16d 100644 --- a/src/assets/styles/mixins.scss +++ b/src/assets/styles/mixins.scss @@ -1,5 +1,5 @@ -@import 'styles/variables'; -@import 'styles/layout'; +@import '~styles/variables'; +@import '~styles/layout'; // Helsinki logo @mixin helsinki-logo($lang: 'fi') { diff --git a/src/common/AriaLive/__tests__/AriaLive.test.js b/src/common/AriaLive/__tests__/AriaLive.test.tsx similarity index 90% rename from src/common/AriaLive/__tests__/AriaLive.test.js rename to src/common/AriaLive/__tests__/AriaLive.test.tsx index da4b3eda5..c6200ed1b 100644 --- a/src/common/AriaLive/__tests__/AriaLive.test.js +++ b/src/common/AriaLive/__tests__/AriaLive.test.tsx @@ -2,7 +2,7 @@ import { render, screen, fireEvent } from '../../test/testingLibraryUtils'; import useAriaLive from '../useAriaLive'; import AriaLiveProvider from '../AriaLiveProvider'; -const TestUpdater = ({ message }) => { +const TestUpdater = ({ message }: any) => { const { sendMessage } = useAriaLive(); return ( @@ -30,7 +30,7 @@ describe('AriaLive', () => { >
`); @@ -43,7 +43,7 @@ describe('AriaLive', () => { >
message
diff --git a/src/common/components/alert/alertModal.module.scss b/src/common/components/alert/alertModal.module.scss index 830ee92dd..3e255722b 100644 --- a/src/common/components/alert/alertModal.module.scss +++ b/src/common/components/alert/alertModal.module.scss @@ -1,4 +1,4 @@ -@import 'styles/variables'; +@import '~styles/variables'; .modal { text-align: center; diff --git a/src/common/components/button/__tests__/__snapshots__/Button.test.tsx.snap b/src/common/components/button/__tests__/__snapshots__/Button.test.tsx.snap index 79a425e15..8cc7a2b7e 100644 --- a/src/common/components/button/__tests__/__snapshots__/Button.test.tsx.snap +++ b/src/common/components/button/__tests__/__snapshots__/Button.test.tsx.snap @@ -1,4 +1,4 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP +// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html exports[`renders snapshot correctly 1`] = `
diff --git a/src/common/components/button/buttonOverrides.module.scss b/src/common/components/button/buttonOverrides.module.scss index d4095f82c..44385566d 100644 --- a/src/common/components/button/buttonOverrides.module.scss +++ b/src/common/components/button/buttonOverrides.module.scss @@ -1,4 +1,4 @@ -@import 'styles/variables'; +@import '~styles/variables'; .button { --color: var(--color-black); diff --git a/src/common/components/card/__tests__/Card.test.tsx b/src/common/components/card/__tests__/Card.test.tsx index 4ba829cb4..884139503 100644 --- a/src/common/components/card/__tests__/Card.test.tsx +++ b/src/common/components/card/__tests__/Card.test.tsx @@ -3,7 +3,7 @@ import Card from '../Card'; it('renders snapshot correctly', () => { const { container } = render( - + foo ); diff --git a/src/common/components/card/__tests__/__snapshots__/Card.test.tsx.snap b/src/common/components/card/__tests__/__snapshots__/Card.test.tsx.snap index 2b4cf34fa..f1c5463e8 100644 --- a/src/common/components/card/__tests__/__snapshots__/Card.test.tsx.snap +++ b/src/common/components/card/__tests__/__snapshots__/Card.test.tsx.snap @@ -1,32 +1,32 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP +// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html exports[`renders snapshot correctly 1`] = `

foo