[docs] Send feedback directly to a dedicated slack channel

docs/next.config.js

@@ -153,6 +153,7 @@ module.exports = withDocsInfra({
     GITHUB_AUTH: process.env.GITHUB_AUTH,
     LIB_VERSION: pkg.version,
     FEEDBACK_URL: process.env.FEEDBACK_URL,
+    SLACK_FEEDBACKS_TOKEN: process.env.SLACK_FEEDBACKS_TOKEN,
     SOURCE_CODE_ROOT_URL: 'https://github.com/mui/material-ui/blob/master', // #default-branch-switch
     SOURCE_CODE_REPO: 'https://github.com/mui/material-ui',
     BUILD_ONLY_ENGLISH_LOCALE: buildOnlyEnglishLocale,

docs/src/modules/components/AppLayoutDocsFooter.js

@@ -108,6 +108,72 @@ async function postFeedback(data) {
   }
 }
 
+async function postFeedbackOnSlack(data) {
+  const { rating, comment } = data;
+
+  if (!comment || comment.length < 10) {
+    return;
+  }
+
+  /**
+   Not used because I ignore how to encode that with:
+      'content-type': 'application/x-www-form-urlencoded'
+
+   const complexSlackMessage = {
+     blocks: [
+       {
+         type: 'header',
+         text: {
+           type: 'plain_text',
+           text: `New comment ${rating > 0 ? '👍' : '👎'}`,
+           emoji: true,
+         },
+       },
+       {
+         type: 'section',
+         text: {
+           type: 'plain_text',
+           text: comment,
+           emoji: true,
+         },
+       },
+       {
+         type: 'section',
+         text: {
+           type: 'mrkdwn',
+           text: `v: ${version}, lang: ${language}`,
+         },
+         accessory: {
+           type: 'button',
+           text: {
+             type: 'plain_text',
+             text: 'Go to the page',
+             emoji: true,
+           },
+           url: window.location.host,
+         },
+       },
+     ],
+   };
+  */
+
+  const simpleSlackMessage = [
+    `New comment ${rating > 0 ? '👍' : '👎'}`,
+    `>${comment.split('\n').join('\n>')}`,
+    `sent from ${window.location.href}`,
+  ].join('\n\n');
+
+  try {
+    await fetch(`https://hooks.slack.com/services/${process.env.SLACK_FEEDBACKS_TOKEN}`, {
+      method: 'POST',
+      headers: { 'content-type': 'application/x-www-form-urlencoded' },
+      body: JSON.stringify({ text: simpleSlackMessage }),
+    });
+  } catch (error) {
+    console.error(error);
+  }
+}
+
 async function getUserFeedback(id) {
   const env = location.hostname === 'mui.com' ? 'prod' : 'dev';
   const URL = `${process.env.FEEDBACK_URL}/${env}/feedback/${id}`;
@@ -135,6 +201,7 @@ async function submitFeedback(page, rating, comment, language) {
     language,
   };
 
+  await postFeedbackOnSlack(data);
   const result = await postFeedback(data);
   if (result) {
     document.cookie = `feedbackId=${result.id};path=/;max-age=31536000`;