feat(notifications): dispatch notify events from window by default

Fixes #663
CleverCloud · Dec 16, 2022 · fcda35c · fcda35c
1 parent 312a688
commit fcda35c
Show file tree

Hide file tree

Showing 8 changed files with 49 additions and 51 deletions.
diff --git a/src/components/cc-email-list/cc-email-list.smart.js b/src/components/cc-email-list/cc-email-list.smart.js
@@ -62,7 +62,7 @@ defineSmartComponent({
 
       api.sendConfirmationEmail(address)
         .then(() => {
-          notify(component, {
+          notify({
             intent: 'info',
             title: i18n('cc-email-list.primary.action.resend-confirmation-email.success.title'),
             message: i18n('cc-email-list.primary.action.resend-confirmation-email.success.message', { address }),
@@ -74,7 +74,7 @@ defineSmartComponent({
         })
         .catch((error) => {
           console.error(error);
-          notifyError(component, i18n('cc-email-list.primary.action.resend-confirmation-email.error', { address }));
+          notifyError(i18n('cc-email-list.primary.action.resend-confirmation-email.error', { address }));
         })
         .finally(() => {
           updateComponent('emails', (emails) => {
@@ -94,7 +94,7 @@ defineSmartComponent({
 
       api.addSecondaryEmailAddress(address)
         .then(() => {
-          notify(component, {
+          notify({
             intent: 'info',
             title: i18n('cc-email-list.secondary.action.add.success.title'),
             message: i18n('cc-email-list.secondary.action.add.success.message', { address }),
@@ -126,7 +126,7 @@ defineSmartComponent({
           }
           else {
             console.error(error);
-            notifyError(component, i18n('cc-email-list.secondary.action.add.error', { address }));
+            notifyError(i18n('cc-email-list.secondary.action.add.error', { address }));
             updateComponent('addEmailForm', (addEmailForm) => {
               addEmailForm.state = 'idle';
             });
@@ -143,15 +143,15 @@ defineSmartComponent({
 
       api.deleteSecondaryEmailAddress(address)
         .then(() => {
-          notifySuccess(component, i18n('cc-email-list.secondary.action.delete.success', { address }));
+          notifySuccess(i18n('cc-email-list.secondary.action.delete.success', { address }));
 
           updateComponent('emails', (emails) => {
             emails.value.secondaryAddresses = emails.value.secondaryAddresses.filter((a) => a.address !== address);
           });
         })
         .catch((error) => {
           console.error(error);
-          notifyError(component, i18n('cc-email-list.secondary.action.delete.error', { address }));
+          notifyError(i18n('cc-email-list.secondary.action.delete.error', { address }));
           updateSecondary(address, (secondaryAddressState) => {
             secondaryAddressState.state = 'idle';
           });
@@ -166,7 +166,7 @@ defineSmartComponent({
 
       api.markSecondaryEmailAddressAsPrimary(address)
         .then(() => {
-          notifySuccess(component, i18n('cc-email-list.secondary.action.mark-as-primary.success', { address }));
+          notifySuccess(i18n('cc-email-list.secondary.action.mark-as-primary.success', { address }));
 
           const primaryAddress = component.emails.value.primaryAddress.address;
 
@@ -180,7 +180,7 @@ defineSmartComponent({
         })
         .catch((error) => {
           console.error(error);
-          notifyError(component, i18n('cc-email-list.secondary.action.mark-as-primary.error', { address }));
+          notifyError(i18n('cc-email-list.secondary.action.mark-as-primary.error', { address }));
           updateSecondary(address, (secondaryAddressState) => {
             secondaryAddressState.state = 'idle';
           });

diff --git a/src/components/cc-env-var-form/cc-env-var-form.smart-config-provider.js b/src/components/cc-env-var-form/cc-env-var-form.smart-config-provider.js
@@ -61,9 +61,9 @@ defineSmartComponentWithObservables({
         updateConfiguration({ apiConfig, realAddonId, variables })
           .then(() => {
             component.variables = variables;
-            notifySuccess(component, i18n('cc-env-var-form.update.success'));
+            notifySuccess(i18n('cc-env-var-form.update.success'));
           })
-          .catch(() => notifyError(component, i18n('cc-env-var-form.update.error')))
+          .catch(() => notifyError(i18n('cc-env-var-form.update.error')))
           .finally(() => {
             component.saving = false;
           });

diff --git a/src/components/cc-env-var-form/cc-env-var-form.smart-exposed-config.js b/src/components/cc-env-var-form/cc-env-var-form.smart-exposed-config.js
@@ -47,9 +47,9 @@ defineSmartComponentWithObservables({
         updateExposedConfig({ apiConfig, ownerId, appId, variables })
           .then(() => {
             component.variables = variables;
-            notifySuccess(component, i18n('cc-env-var-form.update.success'));
+            notifySuccess(i18n('cc-env-var-form.update.success'));
           })
-          .catch(() => notifyError(component, i18n('cc-env-var-form.update.error')))
+          .catch(() => notifyError(i18n('cc-env-var-form.update.error')))
           .finally(() => {
             component.saving = false;
           });

diff --git a/src/components/cc-grafana-info/cc-grafana-info.smart.js b/src/components/cc-grafana-info/cc-grafana-info.smart.js
@@ -56,8 +56,8 @@ defineSmartComponentWithObservables({
         component.waiting = 'resetting';
 
         doResetGrafanaOrganisation({ apiConfig, ownerId })
-          .then(() => notifySuccess(component, i18n('cc-grafana-info.reset.success')))
-          .catch(() => notifyError(component, i18n('cc-grafana-info.reset.error')))
+          .then(() => notifySuccess(i18n('cc-grafana-info.reset.success')))
+          .catch(() => notifyError(i18n('cc-grafana-info.reset.error')))
           .finally(() => {
             component.waiting = false;
           });
@@ -72,9 +72,9 @@ defineSmartComponentWithObservables({
           .then(() => {
             component.status = 'disabled';
             component.link = null;
-            notifySuccess(component, i18n('cc-grafana-info.disable.success'));
+            notifySuccess(i18n('cc-grafana-info.disable.success'));
           })
-          .catch(() => notifyError(component, i18n('cc-grafana-info.disable.error')))
+          .catch(() => notifyError(i18n('cc-grafana-info.disable.error')))
           .finally(() => {
             component.waiting = false;
           });
@@ -88,9 +88,9 @@ defineSmartComponentWithObservables({
         enableGrafanaOrganisation({ apiConfig, ownerId })
           .then(() => {
             grafana_lp.push((signal) => fetchGrafanaOrganisation({ apiConfig, signal, ownerId, grafanaBaseLink }));
-            notifySuccess(component, i18n('cc-grafana-info.enable.success'));
+            notifySuccess(i18n('cc-grafana-info.enable.success'));
           })
-          .catch(() => notifyError(component, i18n('cc-grafana-info.enable.error')))
+          .catch(() => notifyError(i18n('cc-grafana-info.enable.error')))
           .finally(() => {
             component.waiting = false;
           });

diff --git a/src/components/cc-orga-member-list/cc-orga-member-list.smart.js b/src/components/cc-orga-member-list/cc-orga-member-list.smart.js
@@ -69,19 +69,19 @@ defineSmartComponent({
 
       postNewMember({ apiConfig, ownerId, email, role })
         .then(() => {
-          notifySuccess(component, i18n('cc-orga-member-list.invite.submit.success', { userEmail: email }));
+          notifySuccess(i18n('cc-orga-member-list.invite.submit.success', { userEmail: email }));
           updateComponent('inviteMemberForm', CcOrgaMemberList.INIT_INVITE_FORM_STATE);
         })
         .catch((error) => {
           console.error(error);
           if (error.id === UNAUTHORISED_ADMIN_ADDITION) {
-            notifyError(component, i18n('cc-orga-member-list.error.unauthorised.text'), i18n('cc-orga-member-list.error.unauthorised.heading'));
+            notifyError(i18n('cc-orga-member-list.error.unauthorised.text'), i18n('cc-orga-member-list.error.unauthorised.heading'));
           }
           else if (error.message === RATE_LIMIT_EXCEEDED) {
-            notifyError(component, i18n('cc-orga-member-list.invite.submit.error-rate-limit.message'), i18n('cc-orga-member-list.invite.submit.error-rate-limit.title'));
+            notifyError(i18n('cc-orga-member-list.invite.submit.error-rate-limit.message'), i18n('cc-orga-member-list.invite.submit.error-rate-limit.title'));
           }
           else {
-            notifyError(component, i18n('cc-orga-member-list.invite.submit.error', { userEmail: email }));
+            notifyError(i18n('cc-orga-member-list.invite.submit.error', { userEmail: email }));
           }
 
           updateComponent('inviteMemberForm', (inviteMemberForm) => {
@@ -97,7 +97,7 @@ defineSmartComponent({
        * We need to check if a Manager tries to edit an Admin and throw an error if that's the case.
        */
       if (isManagerEditingAdmin(role)) {
-        notifyError(component, i18n('cc-orga-member-list.error.unauthorised.text'), i18n('cc-orga-member-list.error.unauthorised.heading'));
+        notifyError(i18n('cc-orga-member-list.error.unauthorised.text'), i18n('cc-orga-member-list.error.unauthorised.heading'));
         return;
       }
 
@@ -107,7 +107,7 @@ defineSmartComponent({
 
       editMember({ apiConfig, ownerId, id, newRole, name, email, isCurrentUser })
         .then(() => {
-          notifySuccess(component, i18n('cc-orga-member-list.edit.success', { memberIdentity: name ?? email }));
+          notifySuccess(i18n('cc-orga-member-list.edit.success', { memberIdentity: name ?? email }));
           updateMember(id, (member) => {
             member.state = 'loaded';
             member.role = newRole;
@@ -120,13 +120,13 @@ defineSmartComponent({
         .catch((error) => {
           console.error(error);
           if (error.id === UNAUTHORISED_ADMIN_ADDITION || error.id === UNAUTHORISED_ADMIN_DELETION) {
-            notifyError(component, i18n('cc-orga-member-list.error.unauthorised.text'), i18n('cc-orga-member-list.error.unauthorised.heading'));
+            notifyError(i18n('cc-orga-member-list.error.unauthorised.text'), i18n('cc-orga-member-list.error.unauthorised.heading'));
           }
           else if (error.id === MEMBER_NOT_FOUND) {
-            notifyError(component, i18n('cc-orga-member-list.error-member-not-found.text'), i18n('cc-orga-member-list.error-member-not-found.heading'));
+            notifyError(i18n('cc-orga-member-list.error-member-not-found.text'), i18n('cc-orga-member-list.error-member-not-found.heading'));
           }
           else {
-            notifyError(component, i18n('cc-orga-member-list.edit.error', { memberIdentity: name ?? email }));
+            notifyError(i18n('cc-orga-member-list.edit.error', { memberIdentity: name ?? email }));
           }
 
           updateMember(id, (member) => {
@@ -142,21 +142,21 @@ defineSmartComponent({
 
       deleteMember({ apiConfig, ownerId, id })
         .then(() => {
-          notifySuccess(component, i18n('cc-orga-member-list.delete.success', { memberIdentity: name ?? email }));
+          notifySuccess(i18n('cc-orga-member-list.delete.success', { memberIdentity: name ?? email }));
           updateComponent('members', (members) => {
             members.value = members.value.filter((member) => member.id !== id);
           });
         })
         .catch((error) => {
           console.error(error);
           if (error.id === UNAUTHORISED_ADMIN_DELETION) {
-            notifyError(component, i18n('cc-orga-member-list.error.unauthorised.text'), i18n('cc-orga-member-list.error.unauthorised.heading'));
+            notifyError(i18n('cc-orga-member-list.error.unauthorised.text'), i18n('cc-orga-member-list.error.unauthorised.heading'));
           }
           else if (error.id === MEMBER_NOT_FOUND) {
-            notifyError(component, i18n('cc-orga-member-list.error-member-not-found.text'), i18n('cc-orga-member-list.error-member-not-found.heading'));
+            notifyError(i18n('cc-orga-member-list.error-member-not-found.text'), i18n('cc-orga-member-list.error-member-not-found.heading'));
           }
           else {
-            notifyError(component, i18n('cc-orga-member-list.delete.error', { memberIdentity: name ?? email }));
+            notifyError(i18n('cc-orga-member-list.delete.error', { memberIdentity: name ?? email }));
           }
 
           updateMember(id, (member) => {
@@ -176,14 +176,14 @@ defineSmartComponent({
 
       deleteMember({ apiConfig, ownerId, id })
         .then(() => {
-          notifySuccess(component, i18n('cc-orga-member-list.leave.success'));
+          notifySuccess(i18n('cc-orga-member-list.leave.success'));
           updateAuthorisations();
           updateComponent('members', { state: 'error' });
           window.dispatchEvent(new Event('orga-member-leave-success'));
         })
         .catch((error) => {
           console.error(error);
-          notifyError(component, i18n('cc-orga-member-list.leave.error'));
+          notifyError(i18n('cc-orga-member-list.leave.error'));
           updateMember(id, (member) => {
             member.state = 'loaded';
           });

diff --git a/src/components/cc-ssh-key-list/cc-ssh-key-list.smart.js b/src/components/cc-ssh-key-list/cc-ssh-key-list.smart.js
@@ -53,13 +53,13 @@ defineSmartComponent({
         .then(() => {
           // re-fetching keys because we need fingerprint info sent from API to properly display newly created keys
           refreshList().then(() => {
-            notifySuccess(component, i18n('cc-ssh-key-list.success.add', { name }));
+            notifySuccess(i18n('cc-ssh-key-list.success.add', { name }));
             updateComponent('createSshKeyForm', CcSshKeyList.CREATE_FORM_INIT_STATE);
           });
         })
         .catch((error) => {
           console.error(error);
-          notifyError(component, error, i18n('cc-ssh-key-list.error.add', { name }));
+          notifyError(error, i18n('cc-ssh-key-list.error.add', { name }));
           updateComponent('createSshKeyForm', (createSshKeyForm) => {
             createSshKeyForm.state = 'idle';
           });
@@ -75,11 +75,11 @@ defineSmartComponent({
       deleteKey({ apiConfig, key: { name } })
         .then(() => {
           // refreshing both personal and GitHub keys because we don't know if we should add the deleting key back to the GitHub list
-          refreshList().then(() => notifySuccess(component, i18n('cc-ssh-key-list.success.delete', { name })));
+          refreshList().then(() => notifySuccess(i18n('cc-ssh-key-list.success.delete', { name })));
         })
         .catch((error) => {
           console.error(error);
-          notifyError(component, error, i18n('cc-ssh-key-list.error.delete', { name }));
+          notifyError(error, i18n('cc-ssh-key-list.error.delete', { name }));
           updateComponent('keyData', (keyData) => {
             const key = keyData.personalKeys.find((key) => key.name === name);
             key.state = 'idle';
@@ -95,15 +95,15 @@ defineSmartComponent({
 
       importKey({ apiConfig, key: { name, key } })
         .then(() => {
-          notifySuccess(component, i18n('cc-ssh-key-list.success.import', { name }));
+          notifySuccess(i18n('cc-ssh-key-list.success.import', { name }));
           updateComponent('keyData', (keyData) => {
             keyData.personalKeys.push({ state: 'idle', name, fingerprint });
             keyData.githubKeys = keyData.githubKeys.filter((k) => k.name !== name);
           });
         })
         .catch((error) => {
           console.error(error);
-          notifyError(component, error, i18n('cc-ssh-key-list.error.import', { name }));
+          notifyError(error, i18n('cc-ssh-key-list.error.import', { name }));
           updateComponent('keyData', (keyData) => {
             const key = keyData.githubKeys.find((key) => key.name === name);
             key.state = 'idle';

diff --git a/src/components/cc-tcp-redirection-form/cc-tcp-redirection-form.smart.js b/src/components/cc-tcp-redirection-form/cc-tcp-redirection-form.smart.js
@@ -33,15 +33,15 @@ defineSmartComponent({
       });
       createTcpRedirection({ apiConfig, ownerId, appId, namespace })
         .then(({ port }) => {
-          notifySuccess(component, i18n('cc-tcp-redirection-form.create.success', { namespace }));
+          notifySuccess(i18n('cc-tcp-redirection-form.create.success', { namespace }));
           updateRedirection(namespace, (redirection) => {
             redirection.state = 'loaded';
             redirection.sourcePort = port;
           });
         })
         .catch((error) => {
           console.error(error);
-          notifyError(component, i18n('cc-tcp-redirection-form.create.error', { namespace }));
+          notifyError(i18n('cc-tcp-redirection-form.create.error', { namespace }));
           updateRedirection(namespace, (redirection) => {
             redirection.state = 'loaded';
           });
@@ -54,15 +54,15 @@ defineSmartComponent({
       });
       deleteTcpRedirection({ apiConfig, ownerId, appId, sourcePort, namespace })
         .then(() => {
-          notifySuccess(component, i18n('cc-tcp-redirection-form.delete.success', { namespace }));
+          notifySuccess(i18n('cc-tcp-redirection-form.delete.success', { namespace }));
           updateRedirection(namespace, (redirection) => {
             redirection.state = 'loaded';
             redirection.sourcePort = null;
           });
         })
         .catch((error) => {
           console.error(error);
-          notifyError(component, i18n('cc-tcp-redirection-form.delete.error', { namespace }));
+          notifyError(i18n('cc-tcp-redirection-form.delete.error', { namespace }));
           updateRedirection(namespace, (redirection) => {
             redirection.state = 'loaded';
           });

diff --git a/src/lib/notifications.js b/src/lib/notifications.js
@@ -5,36 +5,34 @@ import { dispatchCustomEvent } from './events.js';
  */
 
 /**
- * @param {EventTarget} target
  * @param {Notification} notification
+ * @param {Window|Node} target
  * @return {CustomEvent} the <code>cc:notify</code> event that has been dispatched.
  */
-export function notify (target, notification) {
+export function notify (notification, target = window) {
   return dispatchCustomEvent(target, 'cc:notify', notification);
 }
 
 /**
- * @param {EventTarget} target
  * @param {string} message
  * @param {string?} title
  * @return {CustomEvent} the <code>cc:notify</code> event that has been dispatched.
  */
-export function notifyError (target, message, title) {
-  return notify(target, {
+export function notifyError (message, title) {
+  return notify({
     message,
     title,
     intent: 'danger',
   });
 }
 
 /**
- * @param {EventTarget} target
  * @param {string} message
  * @param {string?} title
  * @return {CustomEvent} the <code>cc:notify</code> event that has been dispatched.
  */
-export function notifySuccess (target, message, title) {
-  return notify(target, {
+export function notifySuccess (message, title) {
+  return notify({
     message,
     title,
     intent: 'success',