Skip to content

Commit

Permalink
fix(procedures): gdpr fix wording & api call with mock
Browse files Browse the repository at this point in the history
ref: MANAGER-15368

Signed-off-by: Omar ALKABOUSS MOUSSANA <[email protected]>
  • Loading branch information
Omar ALKABOUSS MOUSSANA committed Oct 28, 2024
1 parent 98fb4e6 commit 63dde5e
Show file tree
Hide file tree
Showing 6 changed files with 97 additions and 65 deletions.
56 changes: 40 additions & 16 deletions packages/manager/apps/procedures/src/data/api/rgdp/rgdpApi.ts
Original file line number Diff line number Diff line change
@@ -1,47 +1,71 @@
import { v6 } from '@ovh-ux/manager-core-api';
import axios from 'axios';
import { FileWithError } from '@/components/FileInput/FileInputContainer';
import { GDPRFormValues } from '@/types/gdpr.type';
import { GDPRValues } from '@/types/gdpr.type';

export type UploadLink = {
link: string;
method: string;
headers: any;
};

export type GetUploadDocumentsLinks = {
numberOfDocuments: number;
formData: Omit<
GDPRFormValues,
'idDocumentFront' | 'idDocumentBack' | 'otherDocuments'
>;
type TicketUploadInfo = {
ticketId: string;
uploadLinks: UploadLink[];
};

export type UploadDocuments = {
fileLinks: UploadLink[];
files: FileWithError[];
};

export const getUploadDocumentsLinks = ({
formData,
numberOfDocuments,
}: GetUploadDocumentsLinks): Promise<UploadLink[]> => {
const s3AxiosInstance = axios.create({});

export const getUploadDocumentsLinks = (
data: GDPRValues,
): Promise<UploadLink[]> => {
// TODO: remove the mock in the ticket MANAGER-15473
// return v6.post<TicketUploadInfo>('/me/procedure/GDPR', data).then(({ data }) => data.uploadLinks);
return new Promise((res) => {
setTimeout(() => {
res([]);
console.log('value', numberOfDocuments, formData);
console.log('value', data);
}, 500);
});
};

export const uploadDocuments = (documents: UploadDocuments): Promise<void> =>
new Promise((res) => {
const uploadDocument: (
link: UploadLink,
file: FileWithError,
) => Promise<void> = (link, file) => {
// TODO: remove the mock in the ticket MANAGER-15473
// return s3AxiosInstance.put(link.link, file, {
// headers: {
// ...link.headers,
// },
// });
return new Promise((res) => {
setTimeout(() => {
res();
}, 500);
});
};

export const finalize = (): Promise<void> =>
new Promise((res) => {
export const uploadDocuments = ({
fileLinks,
files,
}: UploadDocuments): Promise<void[]> => {
return Promise.all(
fileLinks.map((link, index) => uploadDocument(link, files[index])),
);
};

export const finalize = (): Promise<void> => {
// TODO: remove the mock in the ticket MANAGER-15473
// return v6.post('/me/procedure/GDPR/finalize').then(({ data }) => data);
return new Promise((res) => {
setTimeout(() => {
res();
}, 500);
});
};
Original file line number Diff line number Diff line change
Expand Up @@ -2,11 +2,11 @@ import { useMutation } from '@tanstack/react-query';
import {
UploadLink,
getUploadDocumentsLinks,
GetUploadDocumentsLinks,
UploadDocuments,
uploadDocuments,
finalize,
} from '@/data/api/rgdp/rgdpApi';
import { GDPRValues } from '@/types/gdpr.type';

export const useRGDPSendForm = ({
onSuccess,
Expand All @@ -16,8 +16,7 @@ export const useRGDPSendForm = ({
onError: () => void;
}) =>
useMutation({
mutationFn: (data: GetUploadDocumentsLinks) =>
getUploadDocumentsLinks(data),
mutationFn: (data: GDPRValues) => getUploadDocumentsLinks(data),
onSuccess: (links) => {
onSuccess?.(links);
},
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -89,10 +89,16 @@ export const RGDPForm: FunctionComponent = () => {

const onSubmitForm = () => {
const data = watch();
const files = extractFiles(data);
const filesCount = files.length;

sendForm({ formData: data, numberOfDocuments: filesCount });
const { email, category, description, nichandle, firstName, name } = data;
sendForm({
email,
category,
description,
nichandle,
firstName,
name,
numberOfDocuments: extractFiles(data).length,
});
};

const email = watch('email');
Expand All @@ -118,8 +124,8 @@ export const RGDPForm: FunctionComponent = () => {
/>

<TextField
label={t('rgdp_form_field_label_surname')}
name="surname"
label={t('rgdp_form_field_label_name')}
name="name"
required={t('rgdp_form_validation_message_required')}
pattern={{
value: TextInputRegex,
Expand Down Expand Up @@ -150,10 +156,10 @@ export const RGDPForm: FunctionComponent = () => {
/>

<TextField
label={`${t('rgdp_form_field_label_nic')} (${t(
label={`${t('rgdp_form_field_label_nichandle')} (${t(
'rgdp_form_field_optional',
)})`}
name="nicHandle"
name="nichandle"
pattern={{
value: TextInputRegex,
message: t('rgdp_form_validation_message_invalid_format'),
Expand All @@ -166,31 +172,31 @@ export const RGDPForm: FunctionComponent = () => {
level={ODS_THEME_TYPOGRAPHY_LEVEL.heading}
color={ODS_THEME_COLOR_INTENT.primary}
>
{t('rgdp_form_field_label_subject')}
{t('rgdp_form_field_label_category')}
</OsdsText>

<SelectField
name="messageSubject"
name="category"
required={t('rgdp_form_validation_message_required')}
control={control}
placeholder={t('rgdp_form_field_placeholder_subject')}
placeholder={t('rgdp_form_field_placeholder_category')}
options={GDPRSubjectValues.map((value) => ({
value,
label: t(`rgdp_form_subject_${value}`),
label: t(`rgdp_form_category_${value}`),
}))}
/>

<OsdsText
level={ODS_THEME_TYPOGRAPHY_LEVEL.heading}
color={ODS_THEME_COLOR_INTENT.primary}
>
{t('rgdp_form_field_label_subject_detail')}
{t('rgdp_form_field_label_category_detail')}
</OsdsText>
</div>

<TextAreaField
label={t('rgdp_form_field_label_request_description')}
name="requestDescription"
name="description"
required={t('rgdp_form_validation_message_required')}
control={control}
pattern={{
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -62,14 +62,14 @@ describe('RGDPForm', () => {
expect(
getByText('rgdp_form_field_label_firstname :'),
).toBeInTheDocument();
expect(getByText('rgdp_form_field_label_surname :')).toBeInTheDocument();
expect(getByText('rgdp_form_field_label_name :')).toBeInTheDocument();
expect(getByText('rgdp_form_field_label_email :')).toBeInTheDocument();
expect(
getByText('rgdp_form_field_label_confirm_email :'),
).toBeInTheDocument();
expect(getByText('rgdp_form_field_label_subject')).toBeInTheDocument();
expect(getByText('rgdp_form_field_label_category')).toBeInTheDocument();
expect(
getByText('rgdp_form_field_label_subject_detail'),
getByText('rgdp_form_field_label_category_detail'),
).toBeInTheDocument();
expect(
getByText('rgdp_form_field_label_request_description :'),
Expand All @@ -92,10 +92,10 @@ describe('RGDPForm', () => {
it('Should show errors on multiple required fields when blurred with empty values', async () => {
const { queryAllByText } = renderForm();

const surnameInput = getOsdsElementByFormName<OsdsInput>('surname');
const surnameInput = getOsdsElementByFormName<OsdsInput>('name');
const firstNameInput = getOsdsElementByFormName<OsdsInput>('firstName');
const requestDescriptionText = getOsdsElementByFormName<OsdsTextArea>(
'requestDescription',
'description',
);

await act(async () => {
Expand All @@ -119,9 +119,9 @@ describe('RGDPForm', () => {
it('Should show pattern validation errors on multiple fields when invalid characters are entered', async () => {
const { queryAllByText } = renderForm();

const surnameInput = getOsdsElementByFormName<OsdsInput>('surname');
const surnameInput = getOsdsElementByFormName<OsdsInput>('name');
const firstNameInput = getOsdsElementByFormName<OsdsInput>('firstName');
const nicInput = getOsdsElementByFormName<OsdsInput>('nicHandle');
const nicInput = getOsdsElementByFormName<OsdsInput>('nichandle');

await act(async () => {
surnameInput.value = '<';
Expand Down Expand Up @@ -192,16 +192,16 @@ describe('RGDPForm', () => {
it('Should display confirm modal when the form is valid', async () => {
const { getByText } = renderForm();

const surnameInput = getOsdsElementByFormName<OsdsInput>('surname');
const surnameInput = getOsdsElementByFormName<OsdsInput>('name');
const firstNameInput = getOsdsElementByFormName<OsdsInput>('firstName');
const requestDescriptionText = getOsdsElementByFormName<OsdsTextArea>(
'requestDescription',
'description',
);
const emailInput = getOsdsElementByFormName<OsdsInput>('email');
const confirmEmailInput = getOsdsElementByFormName<OsdsInput>(
'confirmEmail',
);
const objectSelect = getOsdsElementByFormName<OsdsSelect>('messageSubject');
const objectSelect = getOsdsElementByFormName<OsdsSelect>('category');

const submitBtn = getByText('rgdp_form_submit');

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -10,24 +10,24 @@
"rgdp_form_field_optional": "facultatif",
"rgdp_form_validation_message_email_match": "Les adresses e-mails entrées ne correspondent pas.",
"rgdp_form_field_label_firstname": "Prénom",
"rgdp_form_field_label_surname": "Nom",
"rgdp_form_field_label_name": "Nom",
"rgdp_form_field_label_email": "Votre e-mail de contact",
"rgdp_form_field_helper_email": "Cet e-mail de contact sera utilisé par OVH pour répondre à votre demande.",
"rgdp_form_field_label_confirm_email": "Confirmation de votre e-mail de contact",
"rgdp_form_field_label_nic": "Votre NIC",
"rgdp_form_field_label_subject": "Objet du message",
"rgdp_form_field_label_subject_detail": "sur un traitement de données géré par OVH",
"rgdp_form_field_label_nichandle": "Votre NIC",
"rgdp_form_field_label_category": "Objet du message",
"rgdp_form_field_label_category_detail": "sur un traitement de données géré par OVH",
"rgdp_form_field_label_request_description": "Veuillez préciser votre demande d'exercice de droit",
"rgdp_form_field_placeholder_subject": "Choisissez dans la liste",
"rgdp_form_subject_opposition_right": "Droit d'opposition",
"rgdp_form_subject_rectification_right": "Droit de rectification",
"rgdp_form_subject_access_right": "Droit d'accès",
"rgdp_form_field_placeholder_category": "Choisissez dans la liste",
"rgdp_form_category_opposition_right": "Droit d'opposition",
"rgdp_form_category_rectification_right": "Droit de rectification",
"rgdp_form_category_access_right": "Droit d'accès",

"rgdp_form_subject_erasure_right": "Droit d'effacement",
"rgdp_form_subject_limitation_right": "Droit à la limitation",
"rgdp_form_subject_portability_right": "Droit à la portabilité",
"rgdp_form_subject_payment_method_remove": "Supprimer un moyen de paiement",
"rgdp_form_subject_other_request": "Autre demande au DPO",
"rgdp_form_category_erasure_right": "Droit d'effacement",
"rgdp_form_category_limitation_right": "Droit à la limitation",
"rgdp_form_category_portability_right": "Droit à la portabilité",
"rgdp_form_category_payment_method_remove": "Supprimer un moyen de paiement",
"rgdp_form_category_other_request": "Autre demande au DPO",
"rgdp_legal_information": "Les données collectées ci-dessus sont nécessaires au traitement de votre demande. Elles seront conservées pour une durée de 5 ans. Dans l'hypothèse où une copie de votre pièce d'identité viendrait à vous être demandé, celle-ci sera conservée pour une durée maximale de 15 jours.",
"rgdp_legal_information_policy": "Pour en savoir plus, sur le traitement de vos données personnelles et connaître vos droits, vous pouvez consulter notre <a style='color:#2563eb; font-weight: 700;' href='{{legalPolicyLink}}' target='_blank'>Politique d'utilisation de données à caractère personnel OVHcloud.</a>",
"rgdp_form_upload_documents_title": "Déposez vos documents",
Expand All @@ -44,12 +44,12 @@

"rgpd_confirm_modal_yes": "Oui",
"rgpd_confirm_modal_no": "Non",
"rgpd_confirm_modal_title": "Envoyer mes documents",
"rgpd_confirm_modal_title": "Soumettre ma demande",
"rgpd_confirm_modal_description_insure": "Veuillez vous assurer que tous vos documents sont corrects et lisibles avant envoi. En cas de documents non valides, cette procédure sera annulée et vous devrez en effectuer une nouvelle.",
"rgpd_confirm_modal_description_confirm": "Confirmez-vous avoir ajouté l'ensemble des éléments nécessaires ?",

"rgpd_confirm_success_modal_title": "Merci, nous avons bien reçu tous vos documents !",
"rgpd_confirm_success_modal_description": "Ils vont être soumis à notre équipe pour validation. Notre équipe support vous répond dans les 72 heures ! Vous serez notifié de leur validation par email, ou vous serez contacté si nous avons besoin de plus d'informations.",
"rgpd_confirm_success_modal_title": "Votre demande d'exercice de droit a bien été envoyée. ",
"rgpd_confirm_success_modal_description": "Elle sera prise en compte dès que possible par notre équipe support.",
"rgpd_confirm_success_modal_back_home": "Retour à la page d'accueil",

"rgdp_form_error_message_submit": "Vos documents n'ont pas été correctement envoyés. Veuillez relancer l'envoi de vos documents."
Expand Down
15 changes: 9 additions & 6 deletions packages/manager/apps/procedures/src/types/gdpr.type.ts
Original file line number Diff line number Diff line change
@@ -1,14 +1,17 @@
import { FileWithError } from '@/components/FileInput/FileInputContainer';

export type GDPRFormValues = {
export type GDPRValues = {
firstName: string;
surname: string;
phone: string;
name: string;
email: string;
nichandle?: string;
category: string;
description: string;
numberOfDocuments: number;
};

export type GDPRFormValues = Omit<GDPRValues, 'numberOfDocuments'> & {
confirmEmail: string;
nicHandle?: string;
messageSubject: string;
requestDescription: string;
idDocumentFront: FileWithError[];
idDocumentBack: FileWithError[];
otherDocuments: FileWithError[];
Expand Down

0 comments on commit 63dde5e

Please sign in to comment.