Add allow notification option to comment forms

Author: ruibaby

packages/comment-widget/src/base-form.ts

@@ -237,7 +237,14 @@ export class BaseForm extends LitElement {
               </button> `
               : ''
           }
+          
           <div class="form-actions justify-end flex gap-2 flex-wrap items-center">
+
+            <div class="flex items-center gap-2">
+              <input id="allowNotification" name="allowNotification" type="checkbox" checked />
+              <label for="allowNotification" class="text-xs select-none text-text-3 hover:text-text-1 transition-all">${msg('Allow notification')}</label>
+            </div>
+
             ${
               this.showCaptcha && this.captcha
                 ? html`
@@ -292,6 +299,7 @@ export class BaseForm extends LitElement {
       detail: {
         ...data,
         content,
+        allowNotification: data.allowNotification === 'on',
       },
     });
     this.dispatchEvent(event);

packages/comment-widget/src/comment-form.ts

@@ -81,13 +81,13 @@ export class CommentForm extends LitElement {
 
     const data = e.detail;
 
-    const { displayName, email, website, content } = data || {};
+    const { displayName, email, website, content, allowNotification } =
+      data || {};
 
     const commentRequest: CommentRequest = {
       raw: content,
       content: content,
-      // TODO: support user input
-      allowNotification: true,
+      allowNotification: allowNotification,
       subjectRef: {
         group: this.group,
         kind: this.kind,

packages/comment-widget/src/reply-form.ts

@@ -86,13 +86,13 @@ export class ReplyForm extends LitElement {
 
     const data = e.detail;
 
-    const { displayName, email, website, content } = data || {};
+    const { displayName, email, website, content, allowNotification } =
+      data || {};
 
     const replyRequest: ReplyRequest = {
       raw: content,
       content: content,
-      // TODO: support user input
-      allowNotification: true,
+      allowNotification: allowNotification,
     };
 
     if (this.quoteReply) {