diff --git a/.eslintrc b/.eslintrc index c5de904..bc7d25d 100644 --- a/.eslintrc +++ b/.eslintrc @@ -1,6 +1,6 @@ { - "extends": "@folio/eslint-config-stripes", "parser": "@babel/eslint-parser", + "extends": "@folio/eslint-config-stripes", "overrides": [ { "files": [ "src/**/tests/*", "**/*.test.js", "test/**/*" ], @@ -12,5 +12,16 @@ ], "env": { "jest": true + }, + "settings": { + "import/resolver": { + "alias": { + "map": [ + ["__mock__", "./test/jest/__mock__"], + ["fixtures", "./test/jest/fixtures"], + ["helpers", "./test/jest/helpers"] + ] + } + } } } diff --git a/.github/workflows/build-npm-release.yml b/.github/workflows/build-npm-release.yml index a00f634..e86c53e 100644 --- a/.github/workflows/build-npm-release.yml +++ b/.github/workflows/build-npm-release.yml @@ -1,18 +1,15 @@ # This workflow will do a clean install of node dependencies, build the source code, -# run unit tests, and perform a SonarCloud scan ONLY on a `release`. +# run unit tests, perform a SonarCloud scan and publish NPM package ONLY on a tagged release. # For more information see: # https://help.github.com/actions/language-and-framework-guides/using-nodejs-with-github-actions # Common FOLIO configurable env: # - YARN_TEST_OPTIONS (options to pass to 'yarn test') -# - SQ_ROOT_DIR (where to scan relative to top-level directory) -# - FOLIO_NAME +# - SQ_ROOT_DIR (root SQ directory to scan relative to top-level directory) # - PUBLISH_MOD_DESCRIPTOR (boolean 'true' or 'false') # - COMPILE_TRANSLATION_FILES (boolean 'true' or 'false') - - name: buildNPM Release on: push: @@ -21,26 +18,28 @@ on: workflow_dispatch: jobs: - build-npm-release: + github-actions-ci: if : ${{ startsWith(github.ref, 'refs/tags/v') }} env: - YARN_TEST_OPTIONS: '--ci --coverage --colors' + YARN_TEST_OPTIONS: '' SQ_ROOT_DIR: './src' - PUBLISH_MOD_DESCRIPTOR: 'false' - COMPILE_TRANSLATION_FILES: 'false' + COMPILE_TRANSLATION_FILES: 'true' + PUBLISH_MOD_DESCRIPTOR: 'true' FOLIO_NPM_REGISTRY: 'https://repository.folio.org/repository/npm-folio/' FOLIO_NPM_REGISTRY_AUTH: '//repository.folio.org/repository/npm-folio/' FOLIO_MD_REGISTRY: 'https://folio-registry.dev.folio.org' NODEJS_VERSION: '18' JEST_JUNIT_OUTPUT_DIR: 'artifacts/jest-junit' JEST_COVERAGE_REPORT_DIR: 'artifacts/coverage-jest/lcov-report/' + BIGTEST_JUNIT_OUTPUT_DIR: 'artifacts/runTest' + BIGTEST_COVERAGE_REPORT_DIR: 'artifacts/coverage/lcov-report/' OKAPI_PULL: '{ "urls" : [ "https://folio-registry.dev.folio.org" ] }' SQ_LCOV_REPORT: 'artifacts/coverage-jest/lcov.info' SQ_EXCLUSIONS: '**/platform/alias-service.js,**/docs/**,**/node_modules/**,**/examples/**,**/artifacts/**,**/ci/**,Jenkinsfile,**/LICENSE,**/*.css,**/*.md,**/*.json,**/tests/**,**/stories/*.js,**/test/**,**/.stories.js,**/resources/bigtest/interactors/**,**/resources/bigtest/network/**,**/*-test.js,**/*.test.js,**/*-spec.js,**/karma.conf.js,**/jest.config.js' runs-on: ubuntu-latest steps: - - uses: actions/checkout@v2 + - uses: folio-org/checkout@v2 with: fetch-depth: 0 @@ -88,12 +87,8 @@ jobs: run: yarn lint continue-on-error: true - - name: Get number of CPU cores - id: cpu-cores - uses: SimenB/github-actions-cpu-cores@v1 - - name: Run yarn test - run: xvfb-run --server-args="-screen 0 1024x768x24" yarn test $YARN_TEST_OPTIONS --max-workers ${{ steps.cpu-cores.outputs.count }} + run: xvfb-run --server-args="-screen 0 1024x768x24" yarn test $YARN_TEST_OPTIONS - name: Run yarn formatjs-compile if : ${{ env.COMPILE_TRANSLATION_FILES == 'true' }} @@ -146,20 +141,15 @@ jobs: customHeaders: '{ "Accept": "application/json; charset=utf-8" }' data: ${{ steps.moduleDescriptor.outputs.content }} - - name: Upload event file - uses: actions/upload-artifact@v3 - with: - name: Event File - path: ${{ github.event_path }} - retention-days: 30 - - - name: Upload Jest results + - name: Publish Jest unit test results + uses: docker://ghcr.io/enricomi/publish-unit-test-result-action:v1 if: always() - uses: actions/upload-artifact@v3 with: - name: jest-test-results - path: ${{ env.JEST_JUNIT_OUTPUT_DIR }}/*.xml - retention-days: 30 + github_token: ${{ github.token }} + files: "${{ env.JEST_JUNIT_OUTPUT_DIR }}/*.xml" + check_name: Jest Unit Test Results + comment_mode: update last + comment_title: Jest Unit Test Statistics - name: Publish Jest coverage report uses: actions/upload-artifact@v2 @@ -169,6 +159,32 @@ jobs: path: ${{ env.JEST_COVERAGE_REPORT_DIR }} retention-days: 30 + - name: Publish BigTest unit test results + uses: docker://ghcr.io/enricomi/publish-unit-test-result-action:v1 + if: always() + with: + github_token: ${{ github.token }} + files: "${{ env.BIGTEST_JUNIT_OUTPUT_DIR }}/*.xml" + check_name: BigTest Unit Test Results + comment_mode: update last + comment_title: BigTest Unit Test Statistics + + - name: Publish BigTest coverage report + uses: actions/upload-artifact@v2 + if: always() + with: + name: bigtest-coverage-report + path: ${{ env.BIGTEST_COVERAGE_REPORT_DIR }} + retention-days: 30 + + - name: Publish yarn.lock + uses: actions/upload-artifact@v2 + if: failure() + with: + name: yarn.lock + path: yarn.lock + retention-days: 5 + - name: Set default branch as env variable run: echo "DEFAULT_BRANCH=${{ github.event.repository.default_branch }}" >> $GITHUB_ENV diff --git a/.github/workflows/build-npm.yml b/.github/workflows/build-npm.yml index ae235dd..8997a5e 100644 --- a/.github/workflows/build-npm.yml +++ b/.github/workflows/build-npm.yml @@ -1,13 +1,12 @@ # This workflow will do a clean install of node dependencies, build the source code, -# run unit tests, and perform a SonarCloud scan. +# run unit tests, perform a Sonarqube scan, and publish NPM artifacts from master/main. # For more information see: # https://help.github.com/actions/language-and-framework-guides/using-nodejs-with-github-actions -# Common FOLIO configurable env: +# Common FOLIO configurable environment variables to set: # - YARN_TEST_OPTIONS (options to pass to 'yarn test') -# - SQ_ROOT_DIR (where to scan relative to top-level directory) -# - FOLIO_NAME +# - SQ_ROOT_DIR (root SQ directory to scan relative to top-level directory) # - PUBLISH_MOD_DESCRIPTOR (boolean 'true' or 'false') # - COMPILE_TRANSLATION_FILES (boolean 'true' or 'false') @@ -15,25 +14,28 @@ name: buildNPM Snapshot on: [push, pull_request] + jobs: - build-npm: + github-actions-ci: env: - YARN_TEST_OPTIONS: '--ci --coverage --colors' + YARN_TEST_OPTIONS: '' SQ_ROOT_DIR: './src' - PUBLISH_MOD_DESCRIPTOR: 'false' - COMPILE_TRANSLATION_FILES: 'false' + COMPILE_TRANSLATION_FILES: 'true' + PUBLISH_MOD_DESCRIPTOR: 'true' FOLIO_NPM_REGISTRY: 'https://repository.folio.org/repository/npm-folioci/' FOLIO_NPM_REGISTRY_AUTH: '//repository.folio.org/repository/npm-folioci/' FOLIO_MD_REGISTRY: 'https://folio-registry.dev.folio.org' NODEJS_VERSION: '18' JEST_JUNIT_OUTPUT_DIR: 'artifacts/jest-junit' JEST_COVERAGE_REPORT_DIR: 'artifacts/coverage-jest/lcov-report/' + BIGTEST_JUNIT_OUTPUT_DIR: 'artifacts/runTest' + BIGTEST_COVERAGE_REPORT_DIR: 'artifacts/coverage/lcov-report/' SQ_LCOV_REPORT: 'artifacts/coverage-jest/lcov.info' SQ_EXCLUSIONS: '**/platform/alias-service.js,**/docs/**,**/node_modules/**,**/examples/**,**/artifacts/**,**/ci/**,Jenkinsfile,**/LICENSE,**/*.css,**/*.md,**/*.json,**/tests/**,**/stories/*.js,**/test/**,**/.stories.js,**/resources/bigtest/interactors/**,**/resources/bigtest/network/**,**/*-test.js,**/*.test.js,**/*-spec.js,**/karma.conf.js,**/jest.config.js' runs-on: ubuntu-latest steps: - - uses: actions/checkout@v2 + - uses: folio-org/checkout@v2 with: fetch-depth: 0 @@ -67,39 +69,30 @@ jobs: run: yarn lint continue-on-error: true - - name: Get number of CPU cores - id: cpu-cores - uses: SimenB/github-actions-cpu-cores@v1 - - name: Run yarn test - run: xvfb-run --server-args="-screen 0 1024x768x24" yarn test $YARN_TEST_OPTIONS --max-workers ${{ steps.cpu-cores.outputs.count }} + run: xvfb-run --server-args="-screen 0 1024x768x24" yarn test $YARN_TEST_OPTIONS - name: Run yarn formatjs-compile - if : ${{ env.COMPILE_TRANSLATION_FILES == 'true' }} + if: ${{ env.COMPILE_TRANSLATION_FILES == 'true' }} run: yarn formatjs-compile - - name: Generate Module descriptor + - name: Generate FOLIO module descriptor if: ${{ env.PUBLISH_MOD_DESCRIPTOR == 'true' }} run: yarn build-mod-descriptor - - name: debug mod descriptor + - name: Print FOLIO module descriptor if: ${{ env.PUBLISH_MOD_DESCRIPTOR == 'true' }} run: cat module-descriptor.json - - name: Upload event file - uses: actions/upload-artifact@v3 - with: - name: Event File - path: ${{ github.event_path }} - retention-days: 30 - - - name: Upload Jest results + - name: Publish Jest unit test results + uses: docker://ghcr.io/enricomi/publish-unit-test-result-action:v1 if: always() - uses: actions/upload-artifact@v3 with: - name: jest-test-results - path: ${{ env.JEST_JUNIT_OUTPUT_DIR }}/*.xml - retention-days: 30 + github_token: ${{ github.token }} + files: "${{ env.JEST_JUNIT_OUTPUT_DIR }}/*.xml" + check_name: Jest Unit Test Results + comment_mode: update last + comment_title: Jest Unit Test Statistics - name: Publish Jest coverage report uses: actions/upload-artifact@v2 @@ -109,6 +102,32 @@ jobs: path: ${{ env.JEST_COVERAGE_REPORT_DIR }} retention-days: 30 + - name: Publish BigTest unit test results + uses: docker://ghcr.io/enricomi/publish-unit-test-result-action:v1 + if: always() + with: + github_token: ${{ github.token }} + files: "${{ env.BIGTEST_JUNIT_OUTPUT_DIR }}/*.xml" + check_name: BigTest Unit Test Results + comment_mode: update last + comment_title: BigTest Unit Test Statistics + + - name: Publish BigTest coverage report + uses: actions/upload-artifact@v2 + if: always() + with: + name: bigtest-coverage-report + path: ${{ env.BIGTEST_COVERAGE_REPORT_DIR }} + retention-days: 30 + + - name: Publish yarn.lock + uses: actions/upload-artifact@v2 + if: failure() + with: + name: yarn.lock + path: yarn.lock + retention-days: 5 + - name: Set default branch as env variable run: echo "DEFAULT_BRANCH=${{ github.event.repository.default_branch }}" >> $GITHUB_ENV @@ -139,6 +158,7 @@ jobs: always-auth: true - name: Set _auth in .npmrc + if: ${{ github.ref == 'refs/heads/master' || github.ref == 'refs/heads/main' }} run: | npm config set @folio:registry $FOLIO_NPM_REGISTRY npm config set $FOLIO_NPM_REGISTRY_AUTH:_auth $NODE_AUTH_TOKEN @@ -146,6 +166,7 @@ jobs: NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }} - name: Exclude some CI-generated artifacts in package + if: ${{ github.ref == 'refs/heads/master' || github.ref == 'refs/heads/main' }} run: | echo "artifacts" >> .npmignore echo ".github" >> .npmignore @@ -178,19 +199,3 @@ jobs: username: ${{ secrets.FOLIO_REGISTRY_USERNAME }} password: ${{ secrets.FOLIO_REGISTRY_PASSWORD }} - # restoring "github-actions-ci" with some dummy steps - # to maybe allow PR #14 to succeed, where it is stuck - # in "Waiting for status to be reported" ATM. - github-actions-ci: - runs-on: ubuntu-latest - steps: - - uses: folio-org/checkout@v2 - with: - fetch-depth: 0 - - - name: Use Node.js - uses: actions/setup-node@v2 - with: - node-version: ${{ env.NODEJS_VERSION }} - check-latest: true - always-auth: true diff --git a/.gitignore b/.gitignore index 92ff27e..b2b1cf6 100644 --- a/.gitignore +++ b/.gitignore @@ -6,4 +6,7 @@ artifacts npm-debug.log yarn.lock package-lock.json -junit.xml \ No newline at end of file +yarn-error.log +.vscode +.idea +junit.xml diff --git a/.npmignore b/.npmignore new file mode 100644 index 0000000..e8ace87 --- /dev/null +++ b/.npmignore @@ -0,0 +1,6 @@ +.DS_Store +*.swp +*.swo +node_modules +yarn.lock + diff --git a/CHANGELOG.md b/CHANGELOG.md index 298fb2f..4b0d1c9 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -5,4 +5,4 @@ ## 1.0.0 -* New app created with stripes-cli +* New app created with stripes-cli. Updated module after created with stripes-cli. Refs UIREQMED-1. diff --git a/PULL_REQUEST_TEMPLATE.md b/PULL_REQUEST_TEMPLATE.md new file mode 100644 index 0000000..9f3470f --- /dev/null +++ b/PULL_REQUEST_TEMPLATE.md @@ -0,0 +1,90 @@ + + + + +## Purpose + + +## Approach + + +## Refs + + +## Screenshots + + + + + + +## Pre-Merge Checklist +Before merging this PR, please go through the following list and take appropriate actions. +- [ ] I've added appropriate record to the CHANGELOG.md +- Does this PR meet or exceed the expected quality standards? + - [ ] Code coverage on new code is 80% or greater + - [ ] Duplications on new code is 3% or less + - [ ] There are no major code smells or security issues +- Does this introduce breaking changes? + - [ ] If any API-related changes - okapi interfaces and permissions are reviewed/changed correspondingly + - [ ] There are no breaking changes in this PR. + +If there are breaking changes, please **STOP** and consider the following: + +- What other modules will these changes impact? +- Do JIRAs exist to update the impacted modules? + - [ ] If not, please create them + - [ ] Do they contain the appropriate level of detail? Which endpoints/schemas changed, etc. + - [ ] Do they have all they appropriate links to blocked/related issues? +- Are the JIRAs under active development? + - [ ] If not, contact the project's PO and make sure they're aware of the urgency. +- Do PRs exist for these changes? + - [ ] If so, have they been approved? + +Ideally all of the PRs involved in breaking changes would be merged in the same day to avoid breaking the folio-testing environment. Communication is paramount if that is to be achieved, especially as the number of intermodule and inter-team dependencies increase. + +While it's helpful for reviewers to help identify potential problems, ensuring that it's safe to merge is ultimately the responsibility of the PR assignee. diff --git a/icons/app.png b/icons/app.png new file mode 100644 index 0000000..41a908c Binary files /dev/null and b/icons/app.png differ diff --git a/icons/app.svg b/icons/app.svg new file mode 100644 index 0000000..d88d980 --- /dev/null +++ b/icons/app.svg @@ -0,0 +1,22 @@ + + + Icon Artboard + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/jest.config.js b/jest.config.js index 63dc069..f314d3b 100644 --- a/jest.config.js +++ b/jest.config.js @@ -8,4 +8,3 @@ module.exports = { path.join(__dirname, './test/jest/setupFiles.js'), ], }; - diff --git a/package.json b/package.json index 302c08a..9fb11aa 100644 --- a/package.json +++ b/package.json @@ -1,17 +1,22 @@ { "name": "@folio/requests-mediated", "version": "1.1.0", - "description": "requests-mediated", + "description": "Mediated requests", "main": "src/index.js", - "repository": "", + "repository": "folio-org/ui-requests-mediated", + "publishConfig": { + "registry": "https://repository.folio.org/repository/npm-folio/" + }, "license": "Apache-2.0", "scripts": { "start": "stripes serve", + "lint": "eslint .", + "lintfix": "eslint . --fix", + "test": "yarn run test:jest", + "test:jest": "jest --ci --coverage --colors", "build": "stripes build --output ./output", "build-mod-descriptor": "stripes mod descriptor --full --strict | jq '.[]' > module-descriptor.json ", - "formatjs-compile": "stripes translate compile", - "lint": "eslint .", - "test": "jest" + "formatjs-compile": "formatjs compile-folder --ast --format simple ./translations/ui-requests-mediated ./translations/ui-requests-mediated/compiled" }, "devDependencies": { "@babel/core": "^7.21.0", @@ -24,18 +29,16 @@ "@folio/eslint-config-stripes": "^7.0.0", "@folio/jest-config-stripes": "^2.0.0", "@folio/stripes": "^9.1.0", - "@folio/stripes-cli": "^2.6.0 || ^3.0.0", + "@folio/stripes-cli": "^3.0.0", "@folio/stripes-core": "^10.1.0", "core-js": "^3.6.4", "eslint": "^7.32.0", - "history": "^4.10.1", + "history": "^5.0.0", "lodash": "^4.17.21", "react": "^18.2.0", "react-dom": "^18.2.0", "react-intl": "^6.4.4", - "react-redux": "^8.0.5", "react-router-dom": "^5.2.0", - "redux": "^4.0.5", "regenerator-runtime": "^0.13.3" }, "dependencies": { @@ -54,17 +57,24 @@ "settings" ], "displayName": "ui-requests-mediated.meta.title", - "route": "/requestsmediated", + "route": "/requests-mediated", + "icons": [ + { + "name": "app", + "alt": "Mediated requests", + "title": "Mediated requests manager" + } + ], "okapiInterfaces": {}, "permissionSets": [ { "permissionName": "module.requests-mediated.enabled", - "displayName": "UI: requests-mediated module is enabled", + "displayName": "UI: Mediated requests module is enabled", "visible": true }, { "permissionName": "settings.requests-mediated.enabled", - "displayName": "Settings (requests-mediated): display list of settings pages", + "displayName": "Settings (Mediated requests): display list of settings pages", "subPermissions": [ "settings.enabled" ], diff --git a/src/components/greeting-modal/greeting-modal.css b/src/components/greeting-modal/greeting-modal.css deleted file mode 100644 index e69de29..0000000 diff --git a/src/components/greeting-modal/greeting-modal.js b/src/components/greeting-modal/greeting-modal.js deleted file mode 100644 index 0e6bf60..0000000 --- a/src/components/greeting-modal/greeting-modal.js +++ /dev/null @@ -1,29 +0,0 @@ -import { FormattedMessage } from 'react-intl'; -import React from 'react'; -import PropTypes from 'prop-types'; -import { Modal } from '@folio/stripes/components'; -import NewAppGreeting from '../new-app-greeting'; - -export default class GreetingModal extends React.Component { - static propTypes = { - open: PropTypes.bool, - onClose: PropTypes.func, - }; - - render() { - return ( - } - dismissible - closeOnBackgroundClick - > -
- -
- - ); - } -} diff --git a/src/components/greeting-modal/greeting-modal.test.js b/src/components/greeting-modal/greeting-modal.test.js deleted file mode 100644 index d74ea5a..0000000 --- a/src/components/greeting-modal/greeting-modal.test.js +++ /dev/null @@ -1,35 +0,0 @@ -import React from 'react'; -import { - render, - cleanup, -} from '@folio/jest-config-stripes/testing-library/react'; -import { FormattedMessage } from 'react-intl'; - -import '../../../test/jest/__mock__'; -import GreetingModal from './greeting-modal'; - -const label = ; - -const renderGreetingModal = () => { - return render( - - ); -}; - -describe('Greeting Modal', () => { - let page; - - beforeEach(() => { - page = renderGreetingModal(); - }); - - afterEach(cleanup); - - it('should be rendered', () => { - const { container } = page; - const content = container.querySelector('[data-test-greeting-modal]'); - expect(container).toBeVisible(); - expect(content).toBeVisible(); - expect(content.innerHtml).toEqual(label.innerHtml); - }); -}); diff --git a/src/components/greeting-modal/index.js b/src/components/greeting-modal/index.js deleted file mode 100644 index 4d8cc81..0000000 --- a/src/components/greeting-modal/index.js +++ /dev/null @@ -1 +0,0 @@ -export { default } from './greeting-modal'; diff --git a/src/components/new-app-greeting/index.js b/src/components/new-app-greeting/index.js deleted file mode 100644 index 90e7c24..0000000 --- a/src/components/new-app-greeting/index.js +++ /dev/null @@ -1 +0,0 @@ -export { default } from './new-app-greeting'; diff --git a/src/components/new-app-greeting/new-app-greeting.css b/src/components/new-app-greeting/new-app-greeting.css deleted file mode 100644 index e69de29..0000000 diff --git a/src/components/new-app-greeting/new-app-greeting.js b/src/components/new-app-greeting/new-app-greeting.js deleted file mode 100644 index 14c53b4..0000000 --- a/src/components/new-app-greeting/new-app-greeting.js +++ /dev/null @@ -1,15 +0,0 @@ -import React from 'react'; -import { FormattedMessage } from 'react-intl'; - -export default class NewAppGreeting extends React.Component { - render() { - return ( -
-

- -

- -
- ); - } -} diff --git a/src/components/new-app-greeting/new-app-greeting.test.js b/src/components/new-app-greeting/new-app-greeting.test.js deleted file mode 100644 index 2e74d70..0000000 --- a/src/components/new-app-greeting/new-app-greeting.test.js +++ /dev/null @@ -1,40 +0,0 @@ -import React from 'react'; -import { Router } from 'react-router-dom'; -import { - render, - cleanup, -} from '@folio/jest-config-stripes/testing-library/react'; -import { createMemoryHistory } from 'history'; -import { FormattedMessage } from 'react-intl'; - -import '../../../test/jest/__mock__'; -import NewAppGreeting from './new-app-greeting'; - -const label = ; - -const renderGreetingPage = () => { - const history = createMemoryHistory(); - return render( - - - - ); -}; - -describe('Greeting Page', () => { - let page; - - beforeEach(() => { - page = renderGreetingPage(); - }); - - afterEach(cleanup); - - it('should be rendered', () => { - const { container } = page; - const content = container.querySelector('[data-test-application-greeting]'); - expect(container).toBeVisible(); - expect(content).toBeVisible(); - expect(content.innerHtml).toEqual(label.innerHtml); - }); -}); diff --git a/src/index.js b/src/index.js index 5ab3eea..07d0e6f 100644 --- a/src/index.js +++ b/src/index.js @@ -1,56 +1,40 @@ -import 'core-js/stable'; -import 'regenerator-runtime/runtime'; - import React from 'react'; import PropTypes from 'prop-types'; import Switch from 'react-router-dom/Switch'; import Route from 'react-router-dom/Route'; -import Application from './routes/application'; -import ExamplePage from './routes/example-page'; -import Settings from './settings'; +import 'core-js/stable'; +import 'regenerator-runtime/runtime'; -/* - STRIPES-NEW-APP - This is the main entry point into your new app. -*/ +import MediatedRequests from './routes/MediatedRequests'; +import Settings from './settings'; class RequestsMediated extends React.Component { static propTypes = { match: PropTypes.object.isRequired, showSettings: PropTypes.bool, stripes: PropTypes.shape({ - connect: PropTypes.func + connect: PropTypes.func, }) }; - constructor(props) { - super(props); - - this.connectedExamplePage = props.stripes.connect(ExamplePage); - } - render() { const { showSettings, match: { - path - } + path, + }, } = this.props; if (showSettings) { return ; } + return ( - ); diff --git a/src/routes/MediatedRequests.js b/src/routes/MediatedRequests.js new file mode 100644 index 0000000..b68d370 --- /dev/null +++ b/src/routes/MediatedRequests.js @@ -0,0 +1,22 @@ +import React from 'react'; +import { FormattedMessage } from 'react-intl'; + +import { + Pane, + Paneset, +} from '@folio/stripes/components'; + +export default class MediatedRequests extends React.Component { + render() { + return ( + + } + /> + + ); + } +} diff --git a/src/routes/MediatedRequests.test.js b/src/routes/MediatedRequests.test.js new file mode 100644 index 0000000..9de36db --- /dev/null +++ b/src/routes/MediatedRequests.test.js @@ -0,0 +1,37 @@ +import React from 'react'; + +import { + render, + screen, + cleanup, +} from '@folio/jest-config-stripes/testing-library/react'; + +import MediatedRequests from './MediatedRequests'; + +const testIds = { + mediatedRequestsPaneSet: 'mediatedRequestsPaneSet', + mediatedRequestsPane: 'mediatedRequestsPane', +}; +const labelIds = { + paneTitle: 'ui-requests-mediated.app.index.paneTitle', +}; + +describe('MediatedRequests', () => { + beforeEach(() => { + render(); + }); + + afterEach(cleanup); + + it('should render pane set', () => { + expect(screen.getByTestId(testIds.mediatedRequestsPaneSet)).toBeInTheDocument(); + }); + + it('should render pane', () => { + expect(screen.getByTestId(testIds.mediatedRequestsPane)).toBeInTheDocument(); + }); + + it('should render pane title', () => { + expect(screen.getByText(labelIds.paneTitle)).toBeVisible(); + }); +}); diff --git a/src/routes/application.js b/src/routes/application.js deleted file mode 100644 index f3d682c..0000000 --- a/src/routes/application.js +++ /dev/null @@ -1,40 +0,0 @@ -import React from 'react'; -import PropTypes from 'prop-types'; -import { Link } from 'react-router-dom'; -import { Pane, Paneset } from '@folio/stripes/components'; -import NewAppGreeting from '../components/new-app-greeting'; - -export default class Application extends React.Component { - static propTypes = { - match: PropTypes.object.isRequired, - } - - render() { - return ( - - - -
- - - - ); - } -} diff --git a/src/routes/application.test.js b/src/routes/application.test.js deleted file mode 100644 index d7a4d45..0000000 --- a/src/routes/application.test.js +++ /dev/null @@ -1,36 +0,0 @@ -import React from 'react'; -import { Router } from 'react-router-dom'; -import { - render, - cleanup, -} from '@folio/jest-config-stripes/testing-library/react'; -import { createMemoryHistory } from 'history'; - -import '../../test/jest/__mock__'; -import Application from './application'; - -const renderApplicationPage = () => { - const history = createMemoryHistory(); - return render( - - - - ); -}; - -describe('Application Page', () => { - let page; - - beforeEach(() => { - page = renderApplicationPage(); - }); - - afterEach(cleanup); - - it('should be rendered', () => { - const { container } = page; - const content = container.querySelector('[data-test-application-examples]'); - expect(container).toBeVisible(); - expect(content).toBeVisible(); - }); -}); diff --git a/src/routes/example-page.js b/src/routes/example-page.js deleted file mode 100644 index bdf5b2d..0000000 --- a/src/routes/example-page.js +++ /dev/null @@ -1,150 +0,0 @@ -import React from 'react'; -import PropTypes from 'prop-types'; -import Link from 'react-router-dom/Link'; -import { FormattedMessage } from 'react-intl'; - -import { - Button, - Headline, - Pane, - Paneset, - Icon, -} from '@folio/stripes/components'; - -import GreetingModal from '../components/greeting-modal'; - -/* - STRIPES-NEW-APP - This page contains some simple examples to illustrate getting started - with some stripes-components and your app's own components -*/ - -export default class ExamplePage extends React.Component { - static propTypes = { - resources: PropTypes.shape({ - health: PropTypes.shape({ - hasLoaded: PropTypes.bool.isRequired, - records: PropTypes.arrayOf(PropTypes.shape({ - healthMessage: PropTypes.string.isRequired, - healthStatus: PropTypes.bool.isRequired, - instId: PropTypes.string.isRequired, - srvcId: PropTypes.string.isRequired - })).isRequired - }) - }).isRequired - } - - static manifest = Object.freeze({ - health: { - type: 'okapi', - path: '_/discovery/health', - } - }); - - constructor(props) { - super(props); - - this.toggleModal = this.toggleModal.bind(this); - this.buttonClick = this.buttonClick.bind(this); - this.onClose = this.onClose.bind(this); - this.state = { showModal: false }; - } - - toggleModal(showModal) { - this.setState({ showModal }); - } - - onClose() { - this.toggleModal(false); - } - - buttonClick() { - this.toggleModal(true); - } - - getHealthSummary() { - const { - records: healthData - } = this.props.resources.health; - - const defaultlHealthSummary = { - healthyInstances: 0, - notHealthyInstances: 0 - }; - - return healthData.reduce((healthSummary, { healthStatus }) => { - if (healthStatus) { - healthSummary.healthyInstances++; - } else { - healthSummary.notHealthyInstances++; - } - - return healthSummary; - }, defaultlHealthSummary); - } - - renderHealthSummary() { - const { - healthyInstances, - notHealthyInstances, - } = this.getHealthSummary(); - - return ( - {healthyInstances}, - notHealthyInstances: {notHealthyInstances} - }} - id="ui-requests-mediated.example-page.health-summary" - /> - ); - } - - render() { - const { health } = this.props.resources; - const healthResourceAvaliable = health && health.hasLoaded; - - return ( - - - Paneset and Panes - These columns are created with Paneset and Pane components. -
-
- home page -
- - - Button with modal -
- -
- -
- - - - {healthResourceAvaliable - ? this.renderHealthSummary() - : - } -
- More... - Please refer to the - {' '} - - Stripes Components README - - {' '} - for more components and examples. - - - ); - } -} diff --git a/src/settings/General.js b/src/settings/General.js new file mode 100644 index 0000000..6be5346 --- /dev/null +++ b/src/settings/General.js @@ -0,0 +1,24 @@ +import React from 'react'; +import PropTypes from 'prop-types'; +import { FormattedMessage } from 'react-intl'; + +import { Pane } from '@folio/stripes/components'; + +export default class General extends React.Component { + static propTypes = { + label: PropTypes.object.isRequired, + }; + + render() { + return ( + + + + ); + } +} diff --git a/src/settings/General.test.js b/src/settings/General.test.js new file mode 100644 index 0000000..02bfa64 --- /dev/null +++ b/src/settings/General.test.js @@ -0,0 +1,40 @@ +import React from 'react'; + +import { + render, + screen, + cleanup, +} from '@folio/jest-config-stripes/testing-library/react'; + +import General from './General'; + +const testIds = { + generalPane: 'generalPane', +}; +const labelIds = { + generalMessage: 'ui-requests-mediated.settings.general.message', +}; + +describe('General', () => { + const label = 'label for General'; + const props = { + label, + }; + beforeEach(() => { + render(); + }); + + afterEach(cleanup); + + it('should render pane', () => { + expect(screen.getByTestId(testIds.generalPane)).toBeInTheDocument(); + }); + + it('should render label', () => { + expect(screen.getByText(label)).toBeVisible(); + }); + + it('should render general message', () => { + expect(screen.getByText(labelIds.generalMessage)).toBeVisible(); + }); +}); diff --git a/src/settings/general-settings.js b/src/settings/general-settings.js deleted file mode 100644 index 0f306ca..0000000 --- a/src/settings/general-settings.js +++ /dev/null @@ -1,20 +0,0 @@ -import React from 'react'; -import PropTypes from 'prop-types'; -import { Pane } from '@folio/stripes/components'; -import { FormattedMessage } from 'react-intl'; - -export default class GeneralSettings extends React.Component { - static propTypes = { - label: PropTypes.object.isRequired, - }; - - render() { - return ( - -
- -
- - ); - } -} diff --git a/src/settings/general-settings.test.js b/src/settings/general-settings.test.js deleted file mode 100644 index d12eb77..0000000 --- a/src/settings/general-settings.test.js +++ /dev/null @@ -1,42 +0,0 @@ -import React from 'react'; -import { Router } from 'react-router-dom'; -import { - render, - cleanup, -} from '@folio/jest-config-stripes/testing-library/react'; -import { createMemoryHistory } from 'history'; -import { FormattedMessage } from 'react-intl'; - -import '../../test/jest/__mock__'; -import Settings from './general-settings'; - -const label = ; - -const renderSettingsPage = () => { - const history = createMemoryHistory(); - return render( - - - - ); -}; - -describe('General Settings Page', () => { - let page; - - beforeEach(() => { - page = renderSettingsPage(); - }); - - afterEach(cleanup); - - it('should be rendered', () => { - const { container } = page; - const content = container.querySelector('[data-test-application-settings-general-message]'); - expect(container).toBeVisible(); - expect(content).toBeVisible(); - expect(content.innerHtml).toEqual(label.innerHtml); - }); -}); diff --git a/src/settings/index.js b/src/settings/index.js index 2654a1c..54b0d21 100644 --- a/src/settings/index.js +++ b/src/settings/index.js @@ -1,32 +1,26 @@ import React from 'react'; import { FormattedMessage } from 'react-intl'; + import { Settings } from '@folio/stripes/smart-components'; -import GeneralSettings from './general-settings'; -import SomeFeatureSettings from './some-feature-settings'; -/* - STRIPES-NEW-APP - Your app's settings pages are defined here. - The pages "general" and "some feature" are examples. Name them however you like. -*/ +import General from './General'; -export default class RequestsMediatedSettings extends React.Component { +export default class MediatedRequestsSettings extends React.Component { pages = [ { route: 'general', label: , - component: GeneralSettings, - }, - { - route: 'somefeature', - label: , - component: SomeFeatureSettings, + component: General, }, ]; render() { return ( - + } + /> ); } } diff --git a/src/settings/some-feature-settings.js b/src/settings/some-feature-settings.js deleted file mode 100644 index a6f7baa..0000000 --- a/src/settings/some-feature-settings.js +++ /dev/null @@ -1,20 +0,0 @@ -import React from 'react'; -import PropTypes from 'prop-types'; -import { Pane } from '@folio/stripes/components'; -import { FormattedMessage } from 'react-intl'; - -export default class FeatureSettings extends React.Component { - static propTypes = { - label: PropTypes.object.isRequired, - }; - - render() { - return ( - -
- -
- - ); - } -} diff --git a/src/settings/some-feature-settings.test.js b/src/settings/some-feature-settings.test.js deleted file mode 100644 index df3a52e..0000000 --- a/src/settings/some-feature-settings.test.js +++ /dev/null @@ -1,42 +0,0 @@ -import React from 'react'; -import { Router } from 'react-router-dom'; -import { - render, - cleanup, -} from '@folio/jest-config-stripes/testing-library/react'; -import { createMemoryHistory } from 'history'; -import { FormattedMessage } from 'react-intl'; - -import '../../test/jest/__mock__'; -import SomeFeatureSettings from './some-feature-settings'; - -const label = ; - -const renderSomeFeatureSettingsPage = () => { - const history = createMemoryHistory(); - return render( - - - - ); -}; - -describe('Some Feature Settings Page', () => { - let page; - - beforeEach(() => { - page = renderSomeFeatureSettingsPage(); - }); - - afterEach(cleanup); - - it('should be rendered', () => { - const { container } = page; - const content = container.querySelector('[data-test-application-settings-feature-message]'); - expect(container).toBeVisible(); - expect(content).toBeVisible(); - expect(content.innerHtml).toEqual(label.innerHtml); - }); -}); diff --git a/test/jest/__mock__/stripesComponents.mock.js b/test/jest/__mock__/stripesComponents.mock.js index 921f0cc..67790df 100644 --- a/test/jest/__mock__/stripesComponents.mock.js +++ b/test/jest/__mock__/stripesComponents.mock.js @@ -46,16 +46,15 @@ jest.mock('@folio/stripes/components', () => ({ // is there a better way to throw it away? If we don't destructure and // instead access props.label and props.children, then we get a test // failure that the modal isn't visible. oy, dismissible. - Modal: jest.fn(({ children, label, dismissible, closeOnBackgroundClick, ...rest }) => { + Modal: jest.fn(({ children, label, dismissible, footer, ...rest }) => { return ( -

{label}

{children} + {footer}
); }), diff --git a/translations/ui-requests-mediated/en.json b/translations/ui-requests-mediated/en.json index b5720e4..faebe7d 100644 --- a/translations/ui-requests-mediated/en.json +++ b/translations/ui-requests-mediated/en.json @@ -1,12 +1,9 @@ { - "example-page.sample-request": "Sample API request", - "example-page.health-summary": "{healthyInstances} instances healthy, {notHealthyInstances} instances not healthy", - "greeting-modal.message": "Greeting Message Modal", - "meta.title": "requests-mediated", - "new-app.greeting": "Congratulations!", - "new-app.message": "Your Stripes app is running.", + "meta.title": "Mediated requests", + + "app.index.paneTitle": "Mediated requests", + + "settings.index.paneTitle": "Mediated requests", "settings.general": "General", - "settings.general.message": "These are your general app settings.", - "settings.some-feature": "Some Feature", - "settings.some-feature.message": "These are your settings for some app feature." + "settings.general.message": "These are your general app settings." }