diff --git a/pwa/package-lock.json b/pwa/package-lock.json index 3ba00ff1..bd50a869 100644 --- a/pwa/package-lock.json +++ b/pwa/package-lock.json @@ -8,7 +8,7 @@ "name": "product-website-template", "version": "1.0.0", "dependencies": { - "@conduction/components": "2.2.8", + "@conduction/components": "2.2.12", "@conduction/theme": "1.0.45", "@fortawesome/fontawesome-svg-core": "^6.1.1", "@fortawesome/free-solid-svg-icons": "^6.4.0", @@ -1997,9 +1997,9 @@ } }, "node_modules/@conduction/components": { - "version": "2.2.8", - "resolved": "https://registry.npmjs.org/@conduction/components/-/components-2.2.8.tgz", - "integrity": "sha512-eaCLSm2giu+kCNlC6+H+gqZkehIeIFxOVGz/MYfhHBTP+lRulV1C258jQXpK8DjxXY65XHKruNVYrgi2ZEyYpA==", + "version": "2.2.12", + "resolved": "https://registry.npmjs.org/@conduction/components/-/components-2.2.12.tgz", + "integrity": "sha512-s8a/tHBV/HuMt8UIhikHU5uk6gsNKPF5ff8EOBtyPcXc/8V1sPyxruDulSMF/2vRpE5hygXLlaElUAW63sxDug==", "dependencies": { "@fortawesome/fontawesome-svg-core": "^6.2.0", "@fortawesome/free-solid-svg-icons": "^6.2.0", @@ -3668,7 +3668,8 @@ }, "node_modules/@popperjs/core": { "version": "2.11.8", - "license": "MIT", + "resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.8.tgz", + "integrity": "sha512-P1st0aksCrn9sGZhp8GMYwBnQsbvAWsZAX44oXNNvLHGqAOcoVxmjZiohstwQ7SqKnbR47akdNi+uleWD8+g6A==", "funding": { "type": "opencollective", "url": "https://opencollective.com/popperjs" @@ -5677,7 +5678,8 @@ }, "node_modules/classnames": { "version": "2.3.2", - "license": "MIT" + "resolved": "https://registry.npmjs.org/classnames/-/classnames-2.3.2.tgz", + "integrity": "sha512-CSbhY4cFEJRe6/GQzIk5qXZ4Jeg5pcsP7b5peFSDpffpe1cqjASH/n9UTjBwOp6XpMSTwQ8Za2K5V02ueA7Tmw==" }, "node_modules/clean-stack": { "version": "2.2.0", @@ -13601,8 +13603,9 @@ } }, "node_modules/react-datepicker": { - "version": "4.18.0", - "license": "MIT", + "version": "4.20.0", + "resolved": "https://registry.npmjs.org/react-datepicker/-/react-datepicker-4.20.0.tgz", + "integrity": "sha512-I29yHN9SabUDSy7Xq3P8+E8E+D2vyeuYAYYWWjeMisGGtsatltV4CSHodyA7W9z0BuGycc/bhSClDbizx4gZHA==", "dependencies": { "@popperjs/core": "^2.11.8", "classnames": "^2.2.6", @@ -13781,7 +13784,8 @@ }, "node_modules/react-onclickoutside": { "version": "6.13.0", - "license": "MIT", + "resolved": "https://registry.npmjs.org/react-onclickoutside/-/react-onclickoutside-6.13.0.tgz", + "integrity": "sha512-ty8So6tcUpIb+ZE+1HAhbLROvAIJYyJe/1vRrrcmW+jLsaM+/powDRqxzo6hSh9CuRZGSL1Q8mvcF5WRD93a0A==", "funding": { "type": "individual", "url": "https://github.com/Pomax/react-onclickoutside/blob/master/FUNDING.md" @@ -13803,7 +13807,8 @@ }, "node_modules/react-popper": { "version": "2.3.0", - "license": "MIT", + "resolved": "https://registry.npmjs.org/react-popper/-/react-popper-2.3.0.tgz", + "integrity": "sha512-e1hj8lL3uM+sgSR4Lxzn5h1GxBlpa4CQz0XLF8kx4MDrDRWY0Ena4c97PUeSX9i5W3UAfDP0z0FXCTQkoXUl3Q==", "dependencies": { "react-fast-compare": "^3.0.1", "warning": "^4.0.2" @@ -13903,7 +13908,8 @@ }, "node_modules/react-tabs": { "version": "6.0.2", - "license": "MIT", + "resolved": "https://registry.npmjs.org/react-tabs/-/react-tabs-6.0.2.tgz", + "integrity": "sha512-aQXTKolnM28k3KguGDBSAbJvcowOQr23A+CUJdzJtOSDOtTwzEaJA+1U4KwhNL9+Obe+jFS7geuvA7ICQPXOnQ==", "dependencies": { "clsx": "^2.0.0", "prop-types": "^15.5.0" @@ -13914,14 +13920,16 @@ }, "node_modules/react-tabs/node_modules/clsx": { "version": "2.0.0", - "license": "MIT", + "resolved": "https://registry.npmjs.org/clsx/-/clsx-2.0.0.tgz", + "integrity": "sha512-rQ1+kcj+ttHG0MKVGBUXwayCCF1oh39BF5COIpRzuCEv8Mwjv0XucrI2ExNTOn9IlLifGClWQcU9BrZORvtw6Q==", "engines": { "node": ">=6" } }, "node_modules/react-tooltip": { - "version": "5.21.4", - "license": "MIT", + "version": "5.21.5", + "resolved": "https://registry.npmjs.org/react-tooltip/-/react-tooltip-5.21.5.tgz", + "integrity": "sha512-ey70qf6pBGi4U6xpyNlZAHobAhlo2dfxmImR2Bzd/DbLTsAYWz3TEaK+RMFuUZMq6hSPRbUHQSkP2rHBq4uFVg==", "dependencies": { "@floating-ui/dom": "^1.0.0", "classnames": "^2.3.0" @@ -16069,7 +16077,8 @@ }, "node_modules/warning": { "version": "4.0.3", - "license": "MIT", + "resolved": "https://registry.npmjs.org/warning/-/warning-4.0.3.tgz", + "integrity": "sha512-rpJyN222KWIvHJ/F53XSZv0Zl/accqHR8et1kpaMTD/fLCRxtV8iX8czMzY7sVZupTI3zcUTg8eycS2kNF9l6w==", "dependencies": { "loose-envify": "^1.0.0" } diff --git a/pwa/package.json b/pwa/package.json index 59acb0d4..0027a658 100644 --- a/pwa/package.json +++ b/pwa/package.json @@ -24,7 +24,7 @@ "prepare": "cd .. && husky install" }, "dependencies": { - "@conduction/components": "2.2.8", + "@conduction/components": "2.2.12", "@conduction/theme": "1.0.45", "@fortawesome/fontawesome-svg-core": "^6.1.1", "@fortawesome/free-solid-svg-icons": "^6.4.0", diff --git a/pwa/src/data/content.ts b/pwa/src/data/content.ts deleted file mode 100644 index 279cf246..00000000 --- a/pwa/src/data/content.ts +++ /dev/null @@ -1,8 +0,0 @@ -export const README = - '

Common Gateway

Introducing the Common Gateway - a cutting-edge, advanced technology platform designed to enhance data interaction and exchange for local governments. The Common Gateway is a critical tool for the seamless provision of data to Common Ground services, ensuring smooth, efficient, and secure data transactions.

At its core, the Common Gateway is a plugin-based system, allowing for flexible and customizable operations. It is capable of handling multiple plugins, each with its own unique set of functionalities, encapsulated in the form of installation.json files. The platform comes with a robust Installation Service that can read these installation.json files, understand the plugin\'s requirements, and create basic schema\'s accordingly.

But the Common Gateway is more than just a tool for data exchange. It\'s a comprehensive solution designed to handle a multitude of request types and generate appropriate responses. Whether it\'s an HTTP GET, PUT, POST, or a user downloading a file, the Gateway is equipped to handle it all. It identifies the endpoint, processes the request, and generates an appropriate response, ensuring that any incoming request can be accurately interpreted and handled.

Moreover, the Gateway follows an API-first approach, developing APIs that are consistent and reusable. It also follows the principles of Role-Based Access Control (RBAC), granting permissions to users and applications based on their roles. This ensures a secure and controlled environment for data exchange.

This is a transformative approach to data management, enabling governments to maintain control over their own data while allowing for efficient communication with Common Ground services. It\'s not just about data exchange, but also about creating an ecosystem where information is democratized, access is broadened, and operations are streamlined.

The Common Gateway is built with the future in mind, designed to adapt and grow with the needs of local governments and the communities they serve. It brings the power of data exchange to your fingertips, providing a platform that is as intuitive as it is powerful.

Embrace the future of data exchange with Common Gateway. It\'s time to revolutionize the way your local government handles data, enhancing efficiency, security, and adaptability. With the Common Gateway, you\'re not just preparing for the future, you\'re shaping it.

Documentation

Since documentation for a technical application like the common gateway can be a bit overwhelming, we decided to spread it out in different levels of technical difficulty

  1. (Non-technical) Aimed at product owners and interested parties with no to little technical background: The product page.
  2. (A bit technical) Aimed at architects and engineers: The read the docs page.
  3. (Technical) Aimed at developers want to build plugins or use the gateway as backend: Readme files in the codebase.
  4. (Very technical) Aimed people who want to improve and extend the code base: In code documentations.

If you don\'t like to read documentation online there is also a complete manual available in pdf.

CoreBundle Codacy Badge

This repository holds the common-gateway Core Bundle code base. For more information about the Common Gateway project, please visit the Common Gateway Documentation.

License

This project is released under the EUPL licence program.

'; - -export const ArchitectureContent = - '

Architecture

WarningThis file is maintained at the Conduction Google Drive. Please make any suggestions of alterations there.

Main Process

The Common Gateway is designed to handle a multitude of request types. Upon receiving a request, the Gateway commences a series of steps to handle the request and provide an appropriate response. The main process is as follows:

  1. Receipt of Request: The Gateway can receive a wide range of request types. These include:HTTP GET, PUT, POST, etc., containing a JSON, XML, or SOAP objectA browser GET request (HTML)A user posting a formA user downloading a file
  2. Endpoint Identification: Once the Gateway receives a request, the first task is to identify the endpoint. The endpoint is a primary determinant of how the request will be processed. Endpoints are mapped to specific functions or services in the Gateway, and the identified endpoint dictates the necessary operations to be performed.
  3. Response Generation: After the request has been processed according to the rules of the identified endpoint, the Gateway generates an appropriate response. This could be a JSON or XML response for API requests, an HTML page for browser requests, or the requested file for download requests.

This main process forms the backbone of the Common Gateway\'s operation. It ensures that any incoming request can be accurately interpreted and handled, and that an appropriate response can be generated and returned to the user.

The use of endpoints allows the Gateway to be highly flexible and adaptable, capable of handling a wide variety of requests and responses, making it an ideal solution for various use cases.

Main request components

  1. Endpoint
  2. Source
  3. Datalayer
  4. Request Service
  5. Events

Two codebases to rule them all

As part of our ongoing efforts to improve and streamline our development process, we\'re transitioning from a single codebase setup to a library-based one. This shift involves migrating code from the existing repository at ConductionNL/commonground-gateway to a new repository at CommonGateway/CoreBundle.

This transition is not just about moving code; it\'s about enhancing the quality of our codebase. We\'re taking this opportunity to clean up both our code and documentation and to increase the coverage of our unit tests. However, this is a significant undertaking, and we\'re not finished yet. As of now, Entities, Controllers, and some workflows, including unit testing, are still located in the old repository. We expect the migration to be completed by summer 2023.

An integral part of this transition is the decoupling of client-specific code from the core codebase. This code will now reside in separate plugin repositories. This separation of concerns ensures a cleaner, more maintainable codebase, and allows for more customizable client implementations.

Please bear with us during this period of transition. We\'re confident that these changes will result in a more robust and efficient gateway, and we appreciate your understanding and patience during this time.

Design Decisions

API First

An API-first approach means that for any given development project, your APIs are treated as "first-class citizens." An API-first approach involves developing APIs that are consistent and reusable, which can be accomplished by using an API description language to establish a contract for how the API is supposed to behave. The specification we use is the OpenAPI Specification. You can view the latest version of this specification (3.0.1) on GitHub.

Documentation

We host technical documentation on Read the Doc\'s and general user information on GitHub pages, to make the documentation compatible with GitHub we document in markdown (instead of reStructuredText). Documentation is part of the project and contained within the /docs folder.

Common Ground

All applications are developed following the Common Ground standards on how a data exchange system should be: modular and open-source. More information on Common Ground can be found here

'; - -export const endpointContent = - '

Endpoints

WarningThis file is maintained at the Conduction Google Drive. Please make any suggestions or alterations there.

Endpoints are locations (with addresses) where applications can send and receive messages. The generally consist of a domain and path part together forming an URL. For example in case of thedemo.commongateway.nl/api/pets url, the /api/pets would be the path and and demo.commongateway.nl/ the domain.

The common gateway uses endpoint to allow applications to access it, it splits al endpoints into two categories wich are separated by their first path part.

/admin for endpoints that are part of the gateways internal workings/api for user created endpoints

Index

  1. Defining an endpoint

Defining an endpoint

The Common Gateway stores,imports and exports endpoints as JSON mapping objects. Bellow you can find an example endpoint object

Endpoint objects MUST follow the bellow specifications

PropertyRequiredUsageAllowed Value
titleYesUser friendly single sentence describing of the endpoint used for identificationstring, max 255 characters
descriptionNoUser friendly multi line description of the endpoint used for explaining purpose and workings of the mappingstring, max 2555 characters
$idNoUsed during the import of endpoint to see if a endpoint is already presentstring, max 255 characters
$schemaYesTells the common gatway that this object is a endpointAlways: \'https://docs.commongateway.nl/schemas/Endpoint.schema.json\'
versionnoUsed during the import of endpoint to see if endpoint should be overwritten (updated)A valid semantic version number
pathRegexnoThe regex used by the Gateway to find the endpoint. For the above example, that would be ^pets, but the regex could also allow for variable parts like ^pets/?([a-z0-9-]+)?$. The pathRegex MUST be unique within a Gateway installation
pathnoAn array of the items in the path that are separated by / in the endpoint. For the above example that would be [‘pets’,’id’]. Path parts MUST exist of letters and numbers.
pathPartsnoAn array containing the parts of the path for setting variables for later processes to use later on. Based on their index in the path array and the variable’s name that should be created. For the above example, that would be [‘1’=>’id’]
methodsnoDetermins the HTTP methods suported by this endpointAn array of the methods that are allowed on this path, for example [‘GET’,’PUT’,’POST’,’PATCH’,’DELETE’]. An endpoint must have at least one method
sourcenoTurns the endpoint into a proxy for a differend APIONE external source that is proxied by the endpoint (see Proxy)
schemasnoAny schemas provided by the endpoint (see schema’s)Array of schema\'s
throwsnoAny events thrown by the endpoint (see event-driven)Array of events thrown when the endpoint is called

Handling incoming traffic

Once an endpoint is called by an external application calls an endpoint(or user, a browser is also an application), the endpoint will handle the following actions in the following order.

request.svg

As you can see can see there are three basic alternatives

  1. An endpoint is linked to a source (becoming a proxy for that source)
  2. An endpoint is linked to one or more schema\'s
  3. An endpoint is not linked to sources or schema\'s

Note

  • When a proxy (source) is set on an endpoint the schema fase wil be skipped
  • Events are always thrown (in all three cases)
  • If an endpoint is not linked to a source, schema\'s AND dosn\'t contain event it wil always return an error

Proxy

An endpoint MAY be a proxy for another (external) source. In this case, the endpoint will forward all traffic to the external source (and attach authorization if required by that source). It will also pass along:any headers, query parameters, body, and methods (e.g., GET)sent to the endpoint. Keep in mind that it will only do so if the method used is activeated on the endpoint (in practice, it is quite common not to expose delete through an endpoint)

Suppose the endpoint path contains an endpoint parameter in the path regex e.g. example. In that case, it will also forward that message to that specific endpoint on the external source. So gateway.com/api/petstore/pets would be forwarded to petstore.com/pets.

request_proxy.svg

Keep in mind that a proxy does not transform or translate data, it simply forwards the received request to a source and then returns the response of that source. If you require more functionality (e.g. datatransformation or translations) you should setup a schema.

Schema\'s

If an endpoint connects is connected to one or more schemas, it will try to handle the traffic based on the requested service.

Note

  • If an endpoint is hooked to schema(‘s) it will automatically create an API and appropriate Redoc based on its settings. See API for more information on the API.
  • It is possible to hook an endpoint to multiple schemas. When hooked to multiple schemas, the endpoint can still handle POST requests, BUT a POST request must include a valid _self.scheme.id or _self. scheme.ref that refersto the appropriate schema so that the endpoint understands what schema you are trying to create.
  • If an endpoint is hooked to more than one entity, it will render search results from all linked entities based on supplied queries.

GET

request_get.svg

POST

request_post.svg

PUT

Put request are handled roughly the same as an POST request, with one exception.

  1. On a PUT request an exisiting object wil be entirely replaced by the new object. Values that where present in the original object but are not present in the new object wil be DELETED.

request_put.svg

PATCH

Put request are handled roughly the same as an PUT request, with two exception.

  1. On a PATCH request an exisiting object wil be updated by the new object. Values that where present in the original object but are not present in the new object wil be KEPT.
  2. Validity will of the request will be determend afther merging the original and new object. e.g. a required value dosn\'t need to be pressent in an patch request if it was already present in the original object. Assuming that the orignal object already had al required values (or else it could note have been created) a patch requests only required value should be it\'s id (excpetion being that the object definition could have been changed afther the original object was created)

request_patch.svg

DELETE

request_delete.svg

Throwing Events

As a final step the endpoint will ALWAYS fire any events that are defined under throws. You can read more about events under events.

request_throws.svg

When the endpoint throws events, it generates a response in the call cache. After handling all the throws ,are handled it will return the response to the user. The response starts as a 200 OK “your request has been processed”, but may be altered by any action that subscribed to a thrown event may alter it.

Note

  • Any action can subscribe to an event thrown by an endpoint, but common examples are proxy en request actions. These fulfill the same functionality as the direct proxy or event link but allow additional configuration, such as mapping.
  • It recomended to ALWAYS fire event asynchronysly

Serialization

Return an error

The endpoint will return an error if no proxy, entities, or throws are defined.

Security

Endpoints MAY be secured by assigning them to user groups. This is done on the basis of methods.

'; diff --git a/pwa/src/data/detail.ts b/pwa/src/data/detail.ts deleted file mode 100644 index e06c6f3c..00000000 --- a/pwa/src/data/detail.ts +++ /dev/null @@ -1,278 +0,0 @@ -export const TEMP_OBJECTS = [ - { - id: "92620d6e-7112-4853-9f9d-a10859ea7e3d", - name: "Voorbereiding en plaatsing schakelkast glasvezelnetwerk", - reference: "775323", - subject: "Voorbereiding en plaatsing schakelkast glasvezelnetwerk", - resume: - "Een bewoner van de gemeente Barendrecht was het niet eens met de plaatsing van de schakelkast voor het glasvezelnetwerk. De bewoner heeft hierover een klacht ingediend. Alle documentatie over zowel de voorbereiding en de plaatsing van de schakelkast als de behandeling van de klacht is opgevraagd.", - termOverrun: "nee", - receiptDate: new Date("2023-04-14T11:29:09+00:00"), - decisionDate: new Date("2023-06-08T11:29:09+00:00"), - decision: "Deels openbaar gemaakt", - "Theme's": "Hoofdthema: Ruimte en infrastructuur", - "attachment information request": { - name: "Woo-verzoek-geanonimiseerd-1.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2022/08/Woo-verzoek-geanonimiseerd-1.pdf", - }, - "attachment inventory list": { - name: "Inventarisatielijst.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2022/08/Inventarisatielijst.pdf", - }, - "attachment decision": { - name: "Woo-besluit-geanonimiseerd-1.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2022/08/Woo-besluit-geanonimiseerd-1.pdf", - }, - attachments: [ - { - name: "Whatsappberichten-bewoner-en-gemeente-2022-en-2023-geanonimiseerd.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2023/06Whathsappberichten-bewoner-en-gemeente-2022-en-2023-geanonimiseerd.pdf", - }, - { - name: "Whatsappberichten-bewoner-en-gemeente-2023-geanonimiseerd.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2023/06/Whathsappberichten-bewoner-en-gemeente-2023-geanonimiseerd.pdf", - }, - - { - name: "Vergunningstekening-Barendrecht-Nieuwland-Vergunning-Overzicht-TOTAAL-geanonimiseerd.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2023/06Vergunningstekening-Barendrecht-Nieuwland-Vergunning-Overzicht-TOTAAL-geanonimiseerd.pdf", - }, - { - name: "Uitvoeringstekening-verplaatsen-kast-04-2023-geanonimiseerd.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2023/06Uitvoeringstekening-verplaatsen-kast-04-2023-geanonimiseerd.pdf", - }, - { - name: "Tekening-Brd-AHY-DP-Areas-Brd-AHY-DP007-2vd2-geanonimiseerd.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2023/06Tekening-Brd-AHY-DP-Areas-Brd-AHY-DP007-2vd2-geanonimiseerd.pdf", - }, - { - name: "Tekening-Brd-AHY-DP-Areas-Brd-AHY-DP007-1vd2-geanonimiseerd.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2023/06Tekening-Brd-AHY-DP-Areas-Brd-AHY-DP007-1vd2-geanonimiseerd.pdf", - }, - { - name: "Ondertekend-contract-KPN-NEM-SOK-Glasvezel-Barendrecht-geanonimiseerd.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2023/06Ondertekend-contract-KPN-NEM-SOK-Glasvezel-Barendrecht-geanonimiseerd.pdf", - }, - { - name: "Offerte-Verplaatsen-OAP-AHW-11-01-2023-geanonimiseerd.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2023/06Offerte-Verplaatsen-OAP-AHW-11-01-2023-geanonimiseerd.pdf", - }, - { - name: "OAP-Tekening-Barendrecht-Nieuwland.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2023/06OAP-Tekening-Barendrecht-Nieuwland.pdf", - }, - { - name: "Notulen-gespreksverslag-klacht-08-02-2023-geanonimiseerd.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2023/06Notulen-gespreksverslag-klacht-08-02-2023-geanonimiseerd.pdf", - }, - { - name: "Moor-379451-tekening-10-geanonimiseerd.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2023/06Moor-379451-tekening-10-geanonimiseerd.pdf", - }, - { - name: "Memo-Klachtenbehandeling-klacht-plaatsing-OAP-kast-24-04-2023-geanonimiseerd.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2023/06Memo-Klachtenbehandeling-klacht-plaatsing-OAP-kast-24-04-2023-geanonimiseerd.pdf", - }, - { - name: "Mail-VWT-kast-06-04-2023-geanonimiseerd.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2023/06Mail-VWT-kast-06-04-2023-geanonimiseerd.pdf", - }, - { - name: "Mail-van-VWT-Kast-compleet-17-03-2023-geanonimiseerd.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2023/06Mail-van-VWT-Kast-compleet-17-03-2023-geanonimiseerd.pdf", - }, - { - name: "Mail-van-KPN-verplaatsing-mogelijk-07-04-2023-geanonimiseerd.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2023/06Mail-van-KPN-verplaatsing-mogelijk-07-04-2023-geanonimiseerd.pdf", - }, - { - name: "Mail-van-KPN-kosten-verplaatsen-Kast-03-03-2023-geanonimiseerd.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2023/06Mail-van-KPN-kosten-verplaatsen-Kast-03-03-2023-geanonimiseerd.pdf", - }, - { - name: "Mail-van-bewoner-reactie-klacht-30-01-2023-geanonimiseerd.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2023/06Mail-van-bewoner-reactie-klacht-30-01-2023-geanonimiseerd.pdf", - }, - { - name: "Mail-KPN-Procedure-verplaatsing-kast-07-03-2023-geanonimiseerd.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2023/06Mail-KPN-Procedure-verplaatsing-kast-07-03-2023-geanonimiseerd.pdf", - }, - { - name: "Mail-intern-verzoek-klacht-oppakken-25-10-2022-geanonimiseerd.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2023/06Mail-intern-verzoek-klacht-oppakken-25-10-2022-geanonimiseerd.pdf", - }, - { - name: "Mail-intern-Schakelkast-KPN-21-04-2023-geanonimiseerd.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2023/06Mail-intern-Schakelkast-KPN-21-04-2023-geanonimiseerd.pdf", - }, - { - name: "Mail-intern-oppakken-klacht-637384-info-–-24-03-2023-geanonimiseerd.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2023/06Mail-intern-oppakken-klacht-637384-info-%E2%80%93-24-03-2023-geanonimiseerd.pdf", - }, - { - name: "Mail-intern-Klacht-bespreken-17-03-2023-geanonimiseerd.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2023/06Mail-intern-Klacht-bespreken-17-03-2023-geanonimiseerd.pdf", - }, - { - name: "Mail-intern-klacht-637384-aanvulling-info-–-23-03-2023-geanonimiseerd.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2023/06Mail-intern-klacht-637384-aanvulling-info-%E2%80%93-23-03-2023-geanonimiseerd.pdf", - }, - { - name: "Mail-intern-Dringend-verzoek-locatie-kast-–-14-02-2023-geanonimiseerd.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2023/06Mail-intern-%E2%80%93-Dringend-verzoek-locatie-kast-%E2%80%93-14-02-2023-geanonimiseerd.pdf", - }, - { - name: "Mail-bewoner-Schakelkast-KPN-–-19-04-2023-geanonimiseerd.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2023/06Mail-bewoner-Schakelkast-KPN-%E2%80%93-19-04-2023-geanonimiseerd.pdf", - }, - { - name: "Mail-bewoner-reactie-gespreksverslag-V2-24-04-2023-geanonimiseerd.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2023/06Mail-bewoner-reactie-gespreksverslag-V2-24-04-2023-geanonimiseerd.pdf", - }, - { - name: "Mail-bewoner-klacht-637384-gespreksnotitie-14-02-2023-geanonimiseerd.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2023/06Mail-bewoner-klacht-637384-gespreksnotitie-14-02-2023-geanonimiseerd.pdf", - }, - { - name: "Mail-bewoner-kast-andere-locatie-–-10-04-2023-geanonimiseerd.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2023/06Mail-bewoner-kast-andere-locatie-%E2%80%93-10-04-2023-geanonimiseerd.pdf", - }, - { - name: "Mail-bewoner-info-klachtencoordinator-14-02-2023-geanonimiseerd.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2023/06Mail-bewoner-info-klachtencoordinator-14-02-2023-geanonimiseerd.pdf", - }, - { - name: "Mail-bewoner-indiening-WOO-verzoek-–-14-04-2023-geanonimiseerd.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2023/06Mail-bewoner-indiening-WOO-verzoek-%E2%80%93-14-04-2023-geanonimiseerd.pdf", - }, - { - name: "Mail-aan-KPN-Voorstel-locatie-–-06-04-2023-geanonimiseerd.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2023/06Mail-aan-KPN-Voorstel-locatie-%E2%80%93-06-04-2023-geanonimiseerd.pdf", - }, - { - name: "Mail-aan-KPN-akkoord-verplaatsing-OAP-kast-19-04-2023-geanonimiseerd.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2023/06Mail-aan-KPN-akkoord-verplaatsing-OAP-kast-19-04-2023-geanonimiseerd.pdf", - }, - { - name: "Mail-aan-bewoner-Klacht-schakelkast-16-02-2023-geanonimiseerd.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2023/06Mail-aan-bewoner-Klacht-schakelkast-16-02-2023-geanonimiseerd.pdf", - }, - { - name: "Mail-aan-bewoner-gespreksverslag-klacht-V2-21-04-2023-geanonimiseerd.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2023/06Mail-aan-bewoner-gespreksverslag-klacht-V2-21-04-2023-geanonimiseerd.pdf", - }, - { - name: "Mail-aan-bewoner-Contactgegevens-wethouder-24-04-2023-geanonimiseerd.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2023/06Mail-aan-bewoner-Contactgegevens-wethouder-24-04-2023-geanonimiseerd.pdf", - }, - { - name: "Mail-intern-Klachten-kast-on-hold-09-02-2023-geanonimiseerd.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2023/06Mail-intern-Klachten-kast-on-hold-09-02-2023-geanonimiseerd.pdf", - }, - { - name: "Luchtfoto-voorstel-verplaatsen-kast-04-2023.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2023/06Luchtfoto-voorstel-verplaatsen-kast-04-2023.pdf", - }, - { - name: "Klacht-zaaksysteem-23-10-2022-geanonimiseerd.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2023/06Klacht-zaaksysteem-23-10-2022-geanonimiseerd.pdf", - }, - { - name: "Instemmingsbesluit_392417-05-09-2022-geanonimiseerd.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2023/06Instemmingsbesluit_392417-05-09-2022-geanonimiseerd.pdf", - }, - { - name: "Foto-nieuwe-locatie-kast.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2023/06Foto-nieuwe-locatie-kast.pdf", - }, - { - name: "Foto-2-nieuwe-locatie-kast-geanonimiseerd.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2023/06Foto-2-nieuwe-locatie-kast-geanonimiseerd.pdf", - }, - { - name: "Extra-info-klacht-04-2023-geanonimiseerd.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2023/06Extra-info-klacht-04-2023-geanonimiseerd.pdf", - }, - { - name: "Brief-aan-bewoner-Formele-verklaring-wethouder-18-04-2023-geanonimiseerd.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2023/06Brief-aan-bewoner-Formele-verklaring-wethouder-18-04-2023-geanonimiseerd.pdf", - }, - { - name: "Brief-bewoner-Conclusie-onderzoek-klacht-04-05-2023-geanonimiseerd.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2023/06Brief-bewoner-Conclusie-onderzoek-klacht-04-05-2023-geanonimiseerd.pdf", - }, - { - name: "Bewoner-klacht-gemeente-23-10-2022-geanonimiseerd.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2023/06Bewoner-klacht-gemeente-23-10-2022-geanonimiseerd.pdf", - }, - { - name: "Bewoner-aanvullende-klacht-gemeente-glasvezel-–-29-01-2023-geanonimiseerd.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2023/06Bewoner-aanvullende-klacht-gemeente-glasvezel-%E2%80%93-29-01-2023-geanonimiseerd.pdf", - }, - { - name: "Besluit-Glasvezel-11-mei-2021-geanonimiseerd.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2023/06Besluit-Glasvezel-11-mei-2021-geanonimiseerd.pdf", - }, - { - name: "Mail-intern-vergunningtraject-MOOR-19-04-2023-geanonimiseerd", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2023/06/Mail-intern-vergunningtraject-MOOR-19-04-2023-geanonimiseerd.pdf", - }, - ], - }, - { - id: "142ea10e-7660-49dc-9eef-d49e87874d44", - name: "Aantal WMO-vragen ingediend in 2020, 2021 en 2022", - reference: "719709", - subject: "Aantal WMO-vragen ingediend in 2020, 2021 en 2022", - resume: - "Opgevraagd is het aantal WMO-aanvragen in de jaren 2020, 2021 en 2022. Hierbij is ook opgevraagd wanneer de WMO-aanvragen zijn ingediend, of de WMO-aanvragen zijn toe- of afgewezen en wat de reden was van de eventuele afwijzing. Het Woo-verzoek was echter niet via de juiste (elektronische) kanaal ingediend. Het Woo-verzoek wordt daarom niet behandeld.", - termOverrun: "Ja", - receiptDate: new Date("2023-02-14T11:29:09+00:00"), - decisionDate: new Date("2023-05-16T11:29:09+00:00"), - decision: "Niet openbaar gemaakt", - "Theme's": "Hoofdthema: Sociale zekerheid", - "attachment information request": { - name: "WOO-verzoek-geanonimiseerd.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2022/08/WOO-verzoek-geanonimiseerd.pdf", - }, - "attachment decision": { - name: "Woo-besluit-Barendrecht-geanonimiseerd.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2022/08/Woo-besluit-Barendrecht-geanonimiseerd.pdf", - }, - }, - { - id: "cc2a2f12-7ef0-4563-8338-ae7a1979178e", - name: "Exploitatievergunningen Diggels Barendrecht B.V., Ristorante Papi en Café De Uitspanning B.V.", - reference: "733982", - subject: "Exploitatievergunningen Diggels Barendrecht B.V., Ristorante Papi en Café De Uitspanning B.V.", - resume: - "De exploitatievergunningen van Diggels Barendrecht B.V., Ristorante Papi en Café De Uitspanning B.V. zijn opgevraagd en worden gedeeltelijk openbaar gemaakt.", - termOverrun: "Nee", - receiptDate: new Date("2023-02-22T11:29:09+00:00"), - decisionDate: new Date("2023-04-11T11:29:09+00:00"), - decision: " Deels openbaar gemaakt", - "Theme's": "Hoofdthema: Openbare orde en veiligheid", - "attachment information request": { - name: "Woo-verzoek-geanonimiseerd.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2022/08/Woo-verzoek-geanonimiseerd.pdf", - }, - "attachment decision": { - name: "Woo-besluit-geanonimiseerd.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2022/08/Woo-besluit-geanonimiseerd.pdf", - }, - attachments: [ - { - name: "04Exploitatievergunning-Uitspanning-geanonimiseerd.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2023/06Whathsappberichten-bewoner-en-gemeente-2022-en-2023-geanonimiseerd.pdf", - }, - { - name: "04Exploitatievergunning-PaPi-geanonimiseerd.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2023/04Exploitatievergunning-PaPi-geanonimiseerd.pdf", - }, - { - name: "04Exploitatievergunning-Diggels-geanonimiseerd.pdf", - href: "https://openpub.barendrecht.nl/wp-content/uploads/2023/04Exploitatievergunning-Diggels-geanonimiseerd.pdf", - }, - ], - }, -]; diff --git a/pwa/src/templates/jumbotronTemplate/JumbotronTemplate.tsx b/pwa/src/templates/jumbotronTemplate/JumbotronTemplate.tsx index 35aed429..cbdc2aa5 100644 --- a/pwa/src/templates/jumbotronTemplate/JumbotronTemplate.tsx +++ b/pwa/src/templates/jumbotronTemplate/JumbotronTemplate.tsx @@ -1,14 +1,19 @@ import * as React from "react"; import * as styles from "./JumbotronTemplate.module.css"; import { Heading2, Paragraph, Page, PageContent } from "@utrecht/component-library-react/dist/css-module"; -import { CardWrapper } from "@conduction/components/lib/components/card"; +import { CardWrapper } from "@conduction/components"; import { useTranslation } from "react-i18next"; export const JumbotronTemplate: React.FC = () => { const { t } = useTranslation(); return ( -
+
diff --git a/pwa/src/templates/landing/LandingTemplate.tsx b/pwa/src/templates/landing/LandingTemplate.tsx index 1fce0d00..f7b88b9f 100644 --- a/pwa/src/templates/landing/LandingTemplate.tsx +++ b/pwa/src/templates/landing/LandingTemplate.tsx @@ -10,14 +10,58 @@ import Skeleton from "react-loading-skeleton"; import { QueryClient } from "react-query"; import { Pagination } from "@conduction/components"; import { usePaginationContext } from "../../context/pagination"; +import { useTranslation } from "react-i18next"; export const LandingTemplate: React.FC = () => { const { currentPage, setCurrentPage } = usePaginationContext(); const { filters } = useFiltersContext(); + const { t, i18n } = useTranslation(); const queryClient = new QueryClient(); const getItems = useOpenWoo(queryClient).getAll(filters, currentPage); + React.useEffect(() => { + if (!getItems.data?.results.length) return; + + //Updates aria-label of previous and next pagination buttons to translatable aria-labels + document + .querySelectorAll('[class*="Pagination-module--previous"]')[0] + ?.children[0].setAttribute("aria-label", `${t("Previous page")}`); + document + .querySelectorAll('[class*="Pagination-module--next"]')[0] + ?.children[0].setAttribute("aria-label", `${t("Next page")}`); + + //Adds tabindex of -1 to all disabled and unused pagination buttons + document.querySelectorAll('[class*="Pagination-module--disabled"]')[0]?.children[0].setAttribute("tabindex", "-1"); + document.querySelectorAll('[class*="Pagination-module--disabled"]')[0]?.setAttribute("tabindex", "-1"); + document + .querySelectorAll('[class*="Pagination-module--previous"]')[0] + ?.children[0].children[0].setAttribute("tabindex", "-1"); + document + .querySelectorAll('[class*="Pagination-module--next"]')[0] + ?.children[0].children[0].setAttribute("tabindex", "-1"); + + //Updates aria-label of all page pagination buttons to translatable aria-labels + let pageNumbers = Array.from(document.querySelectorAll('[class*="Pagination-module--container"]')[0].children); + var removeStr = ["Pagination-module--previous", "Pagination-module--next"]; + pageNumbers = pageNumbers.filter(function (val) { + var found = false; + for (var i = 0; i < removeStr.length; i++) { + var str = removeStr[i]; + if (val.className.indexOf(str) > -1) { + return false; + } + } + return true; + }); + pageNumbers.map((value: any) => { + const label = value.children[0].ariaLabel; + const lastSpaceIndex = label.lastIndexOf(" "); + const pageNumber = label.substring(lastSpaceIndex + 1); + value.children[0].setAttribute("aria-label", `${t("Page")} ${pageNumber}`); + }); + }, [getItems.isSuccess, i18n.language]); + return ( <> @@ -25,7 +69,7 @@ export const LandingTemplate: React.FC = () => { - {getItems.data?.results?.length === 0 && !getItems.isLoading && Geen Woo verzoeken gevonden.} + {getItems.data?.results?.length === 0 && !getItems.isLoading && {t("No results found")}.} {getItems.data?.results && getItems.data?.results?.length > 0 && (
diff --git a/pwa/src/templates/templateParts/cardsResultsTemplate/CardsResultsTemplate.tsx b/pwa/src/templates/templateParts/cardsResultsTemplate/CardsResultsTemplate.tsx index 860c9388..f5bd4828 100644 --- a/pwa/src/templates/templateParts/cardsResultsTemplate/CardsResultsTemplate.tsx +++ b/pwa/src/templates/templateParts/cardsResultsTemplate/CardsResultsTemplate.tsx @@ -4,7 +4,7 @@ import { Heading2, Paragraph } from "@utrecht/component-library-react/dist/css-m import { translateDate } from "../../../services/dateFormat"; import { useTranslation } from "react-i18next"; import { navigate } from "gatsby"; -import { CardHeader, CardHeaderDate, CardHeaderTitle, CardWrapper } from "@conduction/components/lib/components/card"; +import { CardHeader, CardHeaderDate, CardHeaderTitle, CardWrapper } from "@conduction/components"; interface CardsResultsTemplateProps { requests: any[]; diff --git a/pwa/src/templates/templateParts/filters/FiltersTemplate.tsx b/pwa/src/templates/templateParts/filters/FiltersTemplate.tsx index e293e023..a8c28030 100644 --- a/pwa/src/templates/templateParts/filters/FiltersTemplate.tsx +++ b/pwa/src/templates/templateParts/filters/FiltersTemplate.tsx @@ -55,6 +55,7 @@ export const FiltersTemplate: React.FC = ({ isLoading }) = name="title" placeholder={`${t("Search")}..`} defaultValue={filters._search} + aria-label={t("Search")} {...{ register, errors }} /> = ({ isLoading }) = placeholder={t("Year")} isClearable {...{ register, errors, control }} + ariaLabel={t("Select year")} /> = ({ isLoading }) = defaultValue={TEMP_PUBLICATION_TYPES.find((option) => option.value === filters.Categorie)} isClearable {...{ register, errors, control }} + ariaLabel={t("Select category")} /> - diff --git a/pwa/src/templates/templateParts/footer/FooterTemplate.tsx b/pwa/src/templates/templateParts/footer/FooterTemplate.tsx index be32926f..3dd44467 100644 --- a/pwa/src/templates/templateParts/footer/FooterTemplate.tsx +++ b/pwa/src/templates/templateParts/footer/FooterTemplate.tsx @@ -72,6 +72,7 @@ const DynamicSection: React.FC<{ content: TDynamicContentItem }> = ({ content }) onClick={() => navigate(item.link ?? "")} tabIndex={0} aria-label={`${t(item.label)}, ${t(item.value)}`} + role="button" > {item.value} @@ -87,6 +88,7 @@ const DynamicSection: React.FC<{ content: TDynamicContentItem }> = ({ content }) const Logo: React.FC = () => { if (process.env.GATSBY_FOOTER_LOGO_URL === "false") return <>; + const { t } = useTranslation(); return (
@@ -96,7 +98,9 @@ const Logo: React.FC = () => { process.env.GATSBY_FOOTER_LOGO_HREF ? open(process.env.GATSBY_FOOTER_LOGO_HREF) : navigate("/") } src={process.env.GATSBY_FOOTER_LOGO_URL} - alt={"Footer-logo"} + alt={t("Footer-logo")} + aria-label={`${t("Footer-logo")}, ${t("Can open a new window")}`} + tabIndex={0} />
); diff --git a/pwa/src/templates/wooItemDetailTemplate/WOOItemDetailTemplate.tsx b/pwa/src/templates/wooItemDetailTemplate/WOOItemDetailTemplate.tsx index e711889b..6bd3577e 100644 --- a/pwa/src/templates/wooItemDetailTemplate/WOOItemDetailTemplate.tsx +++ b/pwa/src/templates/wooItemDetailTemplate/WOOItemDetailTemplate.tsx @@ -99,7 +99,7 @@ export const WOOItemDetailTemplate: React.FC = ({ wo {getItems.data.Ontvangstdatum && ( - {t("Received date")} + {t("Registration date")} {translateDate(i18n.language, getItems.data.Ontvangstdatum) ?? "-"} diff --git a/pwa/src/translations/en.ts b/pwa/src/translations/en.ts index ec630d85..9906df61 100644 --- a/pwa/src/translations/en.ts +++ b/pwa/src/translations/en.ts @@ -12,6 +12,7 @@ export const en = { Decision: "Decision", Subject: "Subject", Address: "Address", + Page: "Page", "N/A": "N/A", "Details page": "Details page", "Back to homepage": "Back to homepage", @@ -21,7 +22,7 @@ export const en = { "Inventory list": "Inventory list", "Exceeding the term": "Exceeding the term", "Publication date": "Publication date", - "Received date": "Received date", + "Registration date": "Registration date", "Decision date": "Decision date", "Cards view": "Cards view", "Table view": "Table view", @@ -41,4 +42,10 @@ export const en = { "Skip to footer content": "Skip to footer content", "Phone number": "Phone number", "Email address": "Email address", + "Select year": "Select year", + "Select category": "Select category", + "Previous page": "Previous page", + "Next page": "Next page", + "Can open a new window": "Can open a new window", + "No results found": "No results found", }; diff --git a/pwa/src/translations/nl.ts b/pwa/src/translations/nl.ts index 3180f27e..b77bc432 100644 --- a/pwa/src/translations/nl.ts +++ b/pwa/src/translations/nl.ts @@ -12,6 +12,7 @@ export const nl = { Decision: "Besluit", Subject: "Onderwerp", Address: "Adres", + Page: "Pagina", "N/A": "N.v.t", "Details page": "Detailpagina", "Back to homepage": "Terug naar home", @@ -21,7 +22,7 @@ export const nl = { "Inventory list": "Inventarisatielijst", "Exceeding the term": "Termijnoverschrijding", "Publication date": "Publicatiedatum", - "Received date": "Ontvangstdatum", + "Registration date": "Registratiedatum", "Decision date": "Besluitdatum", "Cards view": "Tegelweergave", "Table view": "Tabelweergave", @@ -41,4 +42,10 @@ export const nl = { "Skip to footer content": "Ga naar de voettekst", "Phone number": "Telefoonnummer", "Email address": "E-mailadres", + "Select year": "Selecteer jaar", + "Select category": "Selecteer categorie", + "Previous page": "Vorige pagina", + "Next page": "Volgende pagina", + "Can open a new window": "Kan een nieuw venster openen", + "No results found": "Geen resultaten gevonden", };