From a8793b21c655fb63b5920b270600373a477b6dad Mon Sep 17 00:00:00 2001 From: Lebret Audrey Date: Wed, 21 Dec 2022 14:43:24 +0100 Subject: [PATCH] feat(ressources): branchement strapi pour l'envoi de la demande --- .env.example | 1 + .github/workflows/preproduction.yml | 2 + .github/workflows/production.yml | 1 + .github/workflows/review.yml | 1 + apollo-client.js | 31 +++++++ package.json | 3 + src/assets/sass/components.scss | 9 ++ src/pages/ressources.js | 36 +++++++- src/utils/constants.util.js | 1 + yarn.lock | 133 +++++++++++++++++++++++++++- 10 files changed, 213 insertions(+), 5 deletions(-) create mode 100644 apollo-client.js create mode 100644 src/utils/constants.util.js diff --git a/.env.example b/.env.example index ff2d3a3..802e07a 100644 --- a/.env.example +++ b/.env.example @@ -1 +1,2 @@ INSTAGRAM_TOKEN="instagramtoken" +NEXT_PUBLIC_API_URL=https://backoffice-1000jours-preprod.dev.fabrique.social.gouv.fr \ No newline at end of file diff --git a/.github/workflows/preproduction.yml b/.github/workflows/preproduction.yml index eabd727..1deb085 100644 --- a/.github/workflows/preproduction.yml +++ b/.github/workflows/preproduction.yml @@ -22,6 +22,8 @@ jobs: environment: preprod imagePackage: app token: ${{ secrets.GITHUB_TOKEN }} + dockerbuildargs: | + NEXT_PUBLIC_API_URL=https://backoffice-1000jours-preprod.dev.fabrique.social.gouv.fr deploy: name: Deploy application diff --git a/.github/workflows/production.yml b/.github/workflows/production.yml index 66557f2..31d3c15 100644 --- a/.github/workflows/production.yml +++ b/.github/workflows/production.yml @@ -22,6 +22,7 @@ jobs: token: ${{ secrets.GITHUB_TOKEN }} dockerbuildargs: | NEXT_PUBLIC_INSTAGRAM_TOKEN=instagram_token_prod + NEXT_PUBLIC_API_URL=https://backoffice-les1000jours.fabrique.social.gouv.fr deploy: name: Deploy application diff --git a/.github/workflows/review.yml b/.github/workflows/review.yml index fa1fc73..d4eda31 100644 --- a/.github/workflows/review.yml +++ b/.github/workflows/review.yml @@ -24,6 +24,7 @@ jobs: token: ${{ secrets.GITHUB_TOKEN }} dockerbuildargs: | NEXT_PUBLIC_INSTAGRAM_TOKEN=instagram_token_dev + NEXT_PUBLIC_API_URL=https://backoffice-1000jours-preprod.dev.fabrique.social.gouv.fr deploy: name: Deploy review branch diff --git a/apollo-client.js b/apollo-client.js new file mode 100644 index 0000000..a7ca15a --- /dev/null +++ b/apollo-client.js @@ -0,0 +1,31 @@ +import { ApolloClient, gql, InMemoryCache, HttpLink } from "@apollo/client" +import fetch from "cross-fetch" +import { API_URL } from "./src/utils/constants.util" + +export const client = new ApolloClient({ + cache: new InMemoryCache(), + headers: { "content-type": "application/json" }, + link: new HttpLink({ uri: `${API_URL}/graphql?nocache`, fetch }), +}) + +export const EPDS_CONTACT_INFORMATION = gql` + mutation ( + $email: String + $telephone: String + $prenom: String + $nombreEnfants: Int + $naissanceDernierEnfant: String + $moyen: String + $horaires: String + ) { + epdsContact( + email: $email + telephone: $telephone + prenom: $prenom + nombre_enfants: $nombreEnfants + naissance_dernier_enfant: $naissanceDernierEnfant + moyen: $moyen + horaires: $horaires + ) + } +` diff --git a/package.json b/package.json index 98feb37..363afc8 100644 --- a/package.json +++ b/package.json @@ -6,11 +6,14 @@ "private": true, "repository": "", "dependencies": { + "@apollo/client": "^3.7.3", "@dataesr/react-dsfr": "^2.9.2", "@gouvfr/dsfr": "^1.8.5", "@socialgouv/matomo-next": "^1.2.2", "axios": "^1.0.0", "bootstrap": "^4.6.1", + "cross-fetch": "^3.1.5", + "graphql": "^16.6.0", "js-yaml-loader": "^1.2.2", "leaflet": "^1.7.1", "next": "^10.0.9", diff --git a/src/assets/sass/components.scss b/src/assets/sass/components.scss index eddc623..6175e1b 100644 --- a/src/assets/sass/components.scss +++ b/src/assets/sass/components.scss @@ -90,4 +90,13 @@ input:focus { flex-grow: 1; margin-inline: 10px; } + + .resources-button { + margin-inline: 10px; + } + + .resources-sending-contact { + color: var(--text-mention-grey); + font-size: .75rem; + } } \ No newline at end of file diff --git a/src/pages/ressources.js b/src/pages/ressources.js index 71d4d35..70b400a 100644 --- a/src/pages/ressources.js +++ b/src/pages/ressources.js @@ -1,8 +1,10 @@ import { Accordion, AccordionItem, Col, Row } from "@dataesr/react-dsfr"; -import { useRouter } from "next/router"; import React, { useEffect, useState } from "react"; import { page } from "../../config-yml/modules/ressources.yml"; import { Layout } from "../components/Layout"; +import { useMutation } from "@apollo/client"; +import { client, EPDS_CONTACT_INFORMATION } from "../../apollo-client"; +import { Spinner } from "react-bootstrap"; const ressources = page; @@ -65,6 +67,9 @@ export default function Ressources() { const [isEmailValid, setEmailValid] = useState(false); const [isPhoneNumberValid, setPhoneNumberValid] = useState(false); + const [isLoading, setLoading] = useState(false) + const [sendingMessage, setSendingMessage] = useState(""); + const [emailValue, setEmailValue] = useState(""); const [phoneNumberValue, setPhoneNumberValue] = useState(""); @@ -81,9 +86,30 @@ export default function Ressources() { setEnabledButton(isEmailValid || isPhoneNumberValid) }, [isEmailValid, isPhoneNumberValid]) - const sendEmailOnClick = () => { - console.log(emailValue) - console.log(phoneNumberValue) + const [sendEmailContactQuery] = useMutation(EPDS_CONTACT_INFORMATION, { + client: client, + onCompleted: (data) => { + setSendingMessage("La demande a été envoyée") + setLoading(false) + }, + onError: (err) => { + console.error(err) + setSendingMessage("Erreur lors de l'envoi") + setLoading(false) + }, + }) + + const sendEmailOnClick = async () => { + setSendingMessage("") + setLoading(true) + + await sendEmailContactQuery({ + variables: { + prenom: "", + email: emailValue, + telephone: phoneNumberValue, + }, + }) } return ( @@ -126,7 +152,9 @@ export default function Ressources() { onClick={sendEmailOnClick} disabled={!isEnabledButton}> {ressources.epdsContact.button} + {isLoading && } + {sendingMessage} ) } diff --git a/src/utils/constants.util.js b/src/utils/constants.util.js new file mode 100644 index 0000000..af5b866 --- /dev/null +++ b/src/utils/constants.util.js @@ -0,0 +1 @@ +export const API_URL = process.env.NEXT_PUBLIC_API_URL \ No newline at end of file diff --git a/yarn.lock b/yarn.lock index 89159bf..1021578 100644 --- a/yarn.lock +++ b/yarn.lock @@ -10,6 +10,25 @@ "@jridgewell/gen-mapping" "^0.1.0" "@jridgewell/trace-mapping" "^0.3.9" +"@apollo/client@^3.7.3": + version "3.7.3" + resolved "https://registry.yarnpkg.com/@apollo/client/-/client-3.7.3.tgz#ab3fe31046e74bc1a3762363a185ba5bcfffc58b" + integrity sha512-nzZ6d6a4flLpm3pZOGpuAUxLlp9heob7QcCkyIqZlCLvciUibgufRfYTwfkWCc4NaGHGSZyodzvfr79H6oUwGQ== + dependencies: + "@graphql-typed-document-node/core" "^3.1.1" + "@wry/context" "^0.7.0" + "@wry/equality" "^0.5.0" + "@wry/trie" "^0.3.0" + graphql-tag "^2.12.6" + hoist-non-react-statics "^3.3.2" + optimism "^0.16.1" + prop-types "^15.7.2" + response-iterator "^0.2.6" + symbol-observable "^4.0.0" + ts-invariant "^0.10.3" + tslib "^2.3.0" + zen-observable-ts "^1.2.5" + "@babel/code-frame@7.12.11": version "7.12.11" resolved "https://registry.yarnpkg.com/@babel/code-frame/-/code-frame-7.12.11.tgz#f4ad435aa263db935b8f10f2c552d23fb716a63f" @@ -388,6 +407,11 @@ resolved "https://registry.yarnpkg.com/@gouvfr/dsfr/-/dsfr-1.8.5.tgz#e99d095e99debcce0c41db18989637290d588b78" integrity sha512-29L+THvWmYJXztPa0Os5TS9yD2WQbrH7VnCKxkyUXQZQ+6lsGebtz0GdCnLexOWDfCn1y53Mh7+/ihxI/z0Vjw== +"@graphql-typed-document-node/core@^3.1.1": + version "3.1.1" + resolved "https://registry.yarnpkg.com/@graphql-typed-document-node/core/-/core-3.1.1.tgz#076d78ce99822258cf813ecc1e7fa460fa74d052" + integrity sha512-NQ17ii0rK1b34VZonlmT2QMJFI70m0TRwbknO/ihlbatXyaktDhN/98vBiUU6kNBPljqGqyIrl2T4nY2RpFANg== + "@hapi/accept@5.0.2": version "5.0.2" resolved "https://registry.yarnpkg.com/@hapi/accept/-/accept-5.0.2.tgz#ab7043b037e68b722f93f376afb05e85c0699523" @@ -1012,6 +1036,27 @@ "@typescript-eslint/types" "5.4.0" eslint-visitor-keys "^3.0.0" +"@wry/context@^0.7.0": + version "0.7.0" + resolved "https://registry.yarnpkg.com/@wry/context/-/context-0.7.0.tgz#be88e22c0ddf62aeb0ae9f95c3d90932c619a5c8" + integrity sha512-LcDAiYWRtwAoSOArfk7cuYvFXytxfVrdX7yxoUmK7pPITLk5jYh2F8knCwS7LjgYL8u1eidPlKKV6Ikqq0ODqQ== + dependencies: + tslib "^2.3.0" + +"@wry/equality@^0.5.0": + version "0.5.3" + resolved "https://registry.yarnpkg.com/@wry/equality/-/equality-0.5.3.tgz#fafebc69561aa2d40340da89fa7dc4b1f6fb7831" + integrity sha512-avR+UXdSrsF2v8vIqIgmeTY0UR91UT+IyablCyKe/uk22uOJ8fusKZnH9JH9e1/EtLeNJBtagNmL3eJdnOV53g== + dependencies: + tslib "^2.3.0" + +"@wry/trie@^0.3.0": + version "0.3.2" + resolved "https://registry.yarnpkg.com/@wry/trie/-/trie-0.3.2.tgz#a06f235dc184bd26396ba456711f69f8c35097e6" + integrity sha512-yRTyhWSls2OY/pYLfwff867r8ekooZ4UI+/gxot5Wj8EFwSf2rG+n+Mo/6LoLQm1TKA4GRj2+LCpbfS937dClQ== + dependencies: + tslib "^2.3.0" + abab@^2.0.3, abab@^2.0.5: version "2.0.6" resolved "https://registry.yarnpkg.com/abab/-/abab-2.0.6.tgz#41b80f2c871d19686216b82309231cfd3cb3d291" @@ -1781,6 +1826,13 @@ create-hmac@^1.1.0, create-hmac@^1.1.4, create-hmac@^1.1.7: safe-buffer "^5.0.1" sha.js "^2.4.8" +cross-fetch@^3.1.5: + version "3.1.5" + resolved "https://registry.yarnpkg.com/cross-fetch/-/cross-fetch-3.1.5.tgz#e1389f44d9e7ba767907f7af8454787952ab534f" + integrity sha512-lvb1SBsI0Z7GDwmuid+mU3kWVBwTVUbe7S0H52yaaAdQOXq2YktTCZdlAcNKFzE6QtRz0snpw9bNiPeOIkkQvw== + dependencies: + node-fetch "2.6.7" + cross-spawn@^7.0.2, cross-spawn@^7.0.3: version "7.0.3" resolved "https://registry.yarnpkg.com/cross-spawn/-/cross-spawn-7.0.3.tgz#f73a85b9d5d41d045551c177e2882d4ac85728a6" @@ -2843,6 +2895,18 @@ graceful-fs@^4.1.2, graceful-fs@^4.2.9: resolved "https://registry.yarnpkg.com/graceful-fs/-/graceful-fs-4.2.10.tgz#147d3a006da4ca3ce14728c7aefc287c367d7a6c" integrity sha512-9ByhssR2fPVsNZj478qUUbKfmL0+t5BDVyjShtyZZLiK7ZDAArFFfopyOTj0M05wE2tJPisA4iTnnXl2YoPvOA== +graphql-tag@^2.12.6: + version "2.12.6" + resolved "https://registry.yarnpkg.com/graphql-tag/-/graphql-tag-2.12.6.tgz#d441a569c1d2537ef10ca3d1633b48725329b5f1" + integrity sha512-FdSNcu2QQcWnM2VNvSCCDCVS5PpPqpzgFT8+GXzqJuoDd0CBncxCY278u4mhRO7tMgo2JjgJA5aZ+nWSQ/Z+xg== + dependencies: + tslib "^2.1.0" + +graphql@^16.6.0: + version "16.6.0" + resolved "https://registry.yarnpkg.com/graphql/-/graphql-16.6.0.tgz#c2dcffa4649db149f6282af726c8c83f1c7c5fdb" + integrity sha512-KPIBPDlW7NxrbT/eh4qPXz5FiFdL5UbaA0XUNz2Rp3Z3hqBSkbj0GVjwFDztsWVauZUWsbKHgMg++sk8UX0bkw== + has-bigints@^1.0.1: version "1.0.1" resolved "https://registry.yarnpkg.com/has-bigints/-/has-bigints-1.0.1.tgz#64fe6acb020673e3b78db035a5af69aa9d07b113" @@ -2928,7 +2992,7 @@ hmac-drbg@^1.0.1: minimalistic-assert "^1.0.0" minimalistic-crypto-utils "^1.0.1" -hoist-non-react-statics@^3.0.0: +hoist-non-react-statics@^3.0.0, hoist-non-react-statics@^3.3.2: version "3.3.2" resolved "https://registry.yarnpkg.com/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz#ece0acaf71d62c2969c2ec59feff42a4b1a85b45" integrity sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw== @@ -4187,6 +4251,13 @@ node-fetch@2.6.1: resolved "https://registry.yarnpkg.com/node-fetch/-/node-fetch-2.6.1.tgz#045bd323631f76ed2e2b55573394416b639a0052" integrity sha512-V4aYg89jEoVRxRb2fJdAg8FHvI7cEyYdVAh94HH0UIK8oJxUfkjlDQN9RbMx+bEjP7+ggMiFRprSti032Oipxw== +node-fetch@2.6.7: + version "2.6.7" + resolved "https://registry.yarnpkg.com/node-fetch/-/node-fetch-2.6.7.tgz#24de9fba827e3b4ae44dc8b20256a379160052ad" + integrity sha512-ZjMPFEfVx5j+y2yF35Kzx5sF7kDzxuDj6ziH4FFbOp87zKDZNx8yExJIb05OGF4Nlt9IHFIMBkRl41VdvcNdbQ== + dependencies: + whatwg-url "^5.0.0" + node-html-parser@1.4.9: version "1.4.9" resolved "https://registry.yarnpkg.com/node-html-parser/-/node-html-parser-1.4.9.tgz#3c8f6cac46479fae5800725edb532e9ae8fd816c" @@ -4337,6 +4408,14 @@ onetime@^5.1.2: dependencies: mimic-fn "^2.1.0" +optimism@^0.16.1: + version "0.16.2" + resolved "https://registry.yarnpkg.com/optimism/-/optimism-0.16.2.tgz#519b0c78b3b30954baed0defe5143de7776bf081" + integrity sha512-zWNbgWj+3vLEjZNIh/okkY2EUfX+vB9TJopzIZwT1xxaMqC5hRLLraePod4c5n4He08xuXNH+zhKFFCu390wiQ== + dependencies: + "@wry/context" "^0.7.0" + "@wry/trie" "^0.3.0" + optionator@^0.8.1: version "0.8.3" resolved "https://registry.yarnpkg.com/optionator/-/optionator-0.8.3.tgz#84fa1d036fe9d3c7e21d99884b601167ec8fb495" @@ -5049,6 +5128,11 @@ resolve@^2.0.0-next.3: is-core-module "^2.2.0" path-parse "^1.0.6" +response-iterator@^0.2.6: + version "0.2.6" + resolved "https://registry.yarnpkg.com/response-iterator/-/response-iterator-0.2.6.tgz#249005fb14d2e4eeb478a3f735a28fd8b4c9f3da" + integrity sha512-pVzEEzrsg23Sh053rmDUvLSkGXluZio0qu8VT6ukrYuvtjVfCbDZH9d6PGXb8HZfzdNZt8feXv/jvUzlhRgLnw== + reusify@^1.0.4: version "1.0.4" resolved "https://registry.yarnpkg.com/reusify/-/reusify-1.0.4.tgz#90da382b1e126efc02146e90845a88db12925d76" @@ -5490,6 +5574,11 @@ supports-hyperlinks@^2.0.0: has-flag "^4.0.0" supports-color "^7.0.0" +symbol-observable@^4.0.0: + version "4.0.0" + resolved "https://registry.yarnpkg.com/symbol-observable/-/symbol-observable-4.0.0.tgz#5b425f192279e87f2f9b937ac8540d1984b39205" + integrity sha512-b19dMThMV4HVFynSAM1++gBHAbk2Tc/osgLIBZMKsyqh34jb2e8Os7T6ZW/Bt3pJFdBTd2JwAnAAEQV7rSNvcQ== + symbol-tree@^3.2.4: version "3.2.4" resolved "https://registry.yarnpkg.com/symbol-tree/-/symbol-tree-3.2.4.tgz#430637d248ba77e078883951fb9aa0eed7c63fa2" @@ -5584,6 +5673,18 @@ tr46@^2.1.0: dependencies: punycode "^2.1.1" +tr46@~0.0.3: + version "0.0.3" + resolved "https://registry.yarnpkg.com/tr46/-/tr46-0.0.3.tgz#8184fd347dac9cdc185992f3a6622e14b9d9ab6a" + integrity sha512-N3WMsuqV66lT30CrXNbEjx4GEwlow3v6rr4mCcv6prnfwhS01rkgyFdjPNBYd9br7LpXV1+Emh01fHnq2Gdgrw== + +ts-invariant@^0.10.3: + version "0.10.3" + resolved "https://registry.yarnpkg.com/ts-invariant/-/ts-invariant-0.10.3.tgz#3e048ff96e91459ffca01304dbc7f61c1f642f6c" + integrity sha512-uivwYcQaxAucv1CzRp2n/QdYPo4ILf9VXgH19zEIjFx2EJufV16P0JtJVpYHy89DItG6Kwj2oIUjrcK5au+4tQ== + dependencies: + tslib "^2.1.0" + ts-pnp@^1.1.6: version "1.2.0" resolved "https://registry.yarnpkg.com/ts-pnp/-/ts-pnp-1.2.0.tgz#a500ad084b0798f1c3071af391e65912c86bca92" @@ -5609,6 +5710,11 @@ tslib@^2.0.0: resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.3.1.tgz#e8a335add5ceae51aa261d32a490158ef042ef01" integrity sha512-77EbyPPpMz+FRFRuAFlWMtmgUWGe9UOG2Z25NqCwiIjRhOf5iKGuzSe5P2w1laq+FkRy4p+PCuVkJSGkzTEKVw== +tslib@^2.1.0, tslib@^2.3.0: + version "2.4.1" + resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.4.1.tgz#0d0bfbaac2880b91e22df0768e55be9753a5b17e" + integrity sha512-tGyy4dAjRIEwI7BzsB0lynWgOpfqjUdq91XXAlIWD2OwKBH7oCl/GZG/HT4BOHrTlPMOASlMQ7veyTqpmRcrNA== + tsutils@^3.21.0: version "3.21.0" resolved "https://registry.yarnpkg.com/tsutils/-/tsutils-3.21.0.tgz#b48717d394cea6c1e096983eed58e9d61715b623" @@ -5835,6 +5941,11 @@ watchpack@2.1.1: glob-to-regexp "^0.4.1" graceful-fs "^4.1.2" +webidl-conversions@^3.0.0: + version "3.0.1" + resolved "https://registry.yarnpkg.com/webidl-conversions/-/webidl-conversions-3.0.1.tgz#24534275e2a7bc6be7bc86611cc16ae0a5654871" + integrity sha512-2JAn3z8AR6rjK8Sm8orRC0h/bcl/DqL7tRPdGZ4I1CjdF+EaMLmYxBHyXuKL849eucPFhvBoxMsflfOb8kxaeQ== + webidl-conversions@^4.0.2: version "4.0.2" resolved "https://registry.yarnpkg.com/webidl-conversions/-/webidl-conversions-4.0.2.tgz#a855980b1f0b6b359ba1d5d9fb39ae941faa63ad" @@ -5862,6 +5973,14 @@ whatwg-mimetype@^2.3.0: resolved "https://registry.yarnpkg.com/whatwg-mimetype/-/whatwg-mimetype-2.3.0.tgz#3d4b1e0312d2079879f826aff18dbeeca5960fbf" integrity sha512-M4yMwr6mAnQz76TbJm914+gPpB/nCwvZbJU28cUD6dR004SAxDLOOSUaB1JDRqLtaOV/vi0IC5lEAGFgrjGv/g== +whatwg-url@^5.0.0: + version "5.0.0" + resolved "https://registry.yarnpkg.com/whatwg-url/-/whatwg-url-5.0.0.tgz#966454e8765462e37644d3626f6742ce8b70965d" + integrity sha512-saE57nupxk6v3HY35+jzBwYa0rKSy0XR8JSxZPwgLr7ys0IBzhGviA1/TUGJLmSVqs8pb9AnvICXEuOHLprYTw== + dependencies: + tr46 "~0.0.3" + webidl-conversions "^3.0.0" + whatwg-url@^7.0.0: version "7.1.0" resolved "https://registry.yarnpkg.com/whatwg-url/-/whatwg-url-7.1.0.tgz#c2c492f1eca612988efd3d2266be1b9fc6170d06" @@ -5991,3 +6110,15 @@ yocto-queue@^0.1.0: version "0.1.0" resolved "https://registry.yarnpkg.com/yocto-queue/-/yocto-queue-0.1.0.tgz#0294eb3dee05028d31ee1a5fa2c556a6aaf10a1b" integrity sha512-rVksvsnNCdJ/ohGc6xgPwyN8eheCxsiLM8mxuE/t/mOVqJewPuO1miLpTHQiRgTKCLexL4MeAFVagts7HmNZ2Q== + +zen-observable-ts@^1.2.5: + version "1.2.5" + resolved "https://registry.yarnpkg.com/zen-observable-ts/-/zen-observable-ts-1.2.5.tgz#6c6d9ea3d3a842812c6e9519209365a122ba8b58" + integrity sha512-QZWQekv6iB72Naeake9hS1KxHlotfRpe+WGNbNx5/ta+R3DNjVO2bswf63gXlWDcs+EMd7XY8HfVQyP1X6T4Zg== + dependencies: + zen-observable "0.8.15" + +zen-observable@0.8.15: + version "0.8.15" + resolved "https://registry.yarnpkg.com/zen-observable/-/zen-observable-0.8.15.tgz#96415c512d8e3ffd920afd3889604e30b9eaac15" + integrity sha512-PQ2PC7R9rslx84ndNBZB/Dkv8V8fZEpk83RLgXtYd0fwUgEjseMn1Dgajh2x6S8QbZAFa9p2qVCEuYZNgve0dQ==