From dbbb94117c2d6266cfc45a091b4b87012024f788 Mon Sep 17 00:00:00 2001
From: Raphael Kabo <raphaelkabo@hey.com>
Date: Mon, 9 Oct 2023 17:24:09 +0100
Subject: [PATCH 1/2] Fix event token param bug

---
 views/event.handlebars      |  4 +++-
 views/eventgroup.handlebars | 19 +++++++++++--------
 2 files changed, 14 insertions(+), 9 deletions(-)

diff --git a/views/event.handlebars b/views/event.handlebars
index ae6674a..f4f1a2e 100755
--- a/views/event.handlebars
+++ b/views/event.handlebars
@@ -423,9 +423,9 @@ window.eventData = {{{ json jsonData }}};
     $(this).closest(".comment").find(".replyContainer").slideToggle();
   })
   $(document).ready(function() {
-
     // Save the editing token from the URL, if it is valid
     const eventID = $('#eventName').attr('data-event-id');
+    const url = new URL(window.location.href);
     const urlParams = new URLSearchParams(window.location.search);
     if (urlParams.has('e')) {
       $.ajax({
@@ -463,6 +463,8 @@ window.eventData = {{{ json jsonData }}};
 
     if (urlParams.has('show_edit')) {
       $('#editModal').modal('show');
+      url.searchParams.delete('show_edit'); 
+      history.replaceState(history.state, '', url.href);
     }
 
     // From https://davidwalsh.name/javascript-download
diff --git a/views/eventgroup.handlebars b/views/eventgroup.handlebars
index 0643ed6..1d3975a 100755
--- a/views/eventgroup.handlebars
+++ b/views/eventgroup.handlebars
@@ -229,29 +229,30 @@ window.groupData = {{{ json jsonData }}};
 <script>
   $(document).ready(function() {
     // Save the editing token from the URL, if it is valid
-    const eventID = $('#eventName').attr('data-event-id');
+    const eventGroupID = window.groupData.id;
+    const url = new URL(window.location.href);
     const urlParams = new URLSearchParams(window.location.search);
     if (urlParams.has('e')) {
       $.ajax({
         type: "POST",
-        url: `/verifytoken/group/${eventID}`,
+        url: `/verifytoken/group/${eventGroupID}`,
         data: { editToken: urlParams.get('e') },
         success: function(response, status, xhr) {
           if (xhr.status === 200) {
-            addStoredToken(eventID, urlParams.get('e'));
+            addStoredToken(eventGroupID, urlParams.get('e'));
           }
         },
         error: function(response, status, xhr) {
           // The editing token is wrong - remove it
-          removeStoredToken(eventID);
+          removeStoredToken(eventGroupID);
           window.location = window.location.pathname;
         }
       });
-    } else if (getStoredToken(eventID)) {
-      const editToken = getStoredToken(eventID);
+    } else if (getStoredToken(eventGroupID)) {
+      const editToken = getStoredToken(eventGroupID);
       $.ajax({
         type: "POST",
-        url: `/verifytoken/group/${eventID}`,
+        url: `/verifytoken/group/${eventGroupID}`,
         data: { editToken },
         success: function(response, status, xhr) {
           if (xhr.status === 200) {
@@ -260,13 +261,15 @@ window.groupData = {{{ json jsonData }}};
         },
         error: function(response, status, xhr) {
           // The editing token is wrong - remove it
-          removeStoredToken(eventID);
+          removeStoredToken(eventGroupID);
         }
       });
     }
 
     if (urlParams.has('show_edit')) {
       $('#editModal').modal('show');
+      url.searchParams.delete('show_edit'); 
+      history.replaceState(history.state, '', url.href);
     }
 
     new ClipboardJS('#copyEventLink');

From 7fe1f42d56edb98875399b1da5e9b7e972209a0d Mon Sep 17 00:00:00 2001
From: Raphael Kabo <raphaelkabo@hey.com>
Date: Mon, 9 Oct 2023 19:22:39 +0100
Subject: [PATCH 2/2] Add known group linker to event form

---
 public/css/style.css                     |  41 +++++++++++
 public/images/seigaiha-single.png        | Bin 0 -> 3463 bytes
 public/js/modules/event-edit.js          |   7 ++
 public/js/modules/group-linker.js        |  85 +++++++++++++++++++++++
 src/routes/group.ts                      |  60 ++++++++++++++++
 views/newevent.handlebars                |  13 +++-
 views/partials/editeventmodal.handlebars |  12 +++-
 views/partials/eventForm.handlebars      |  36 ++++++++--
 8 files changed, 243 insertions(+), 11 deletions(-)
 create mode 100644 public/images/seigaiha-single.png
 create mode 100644 public/js/modules/group-linker.js

diff --git a/public/css/style.css b/public/css/style.css
index 8e6322e..04d6e97 100755
--- a/public/css/style.css
+++ b/public/css/style.css
@@ -405,3 +405,44 @@ article.static-page header {
     margin-bottom: 1rem;
     border-bottom: 1px solid #e0e0e0;
 }
+
+.card--group-preview {
+    display: grid;
+    grid-template-columns: 60px 1fr;
+    overflow: hidden;
+    gap: 1rem;
+
+    transition: background-color 0.15s;
+}
+
+.card--group-preview:hover {
+    background-color: #f5f5f5;
+}
+
+.card--group-preview img {
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+}
+
+.card--group-preview__text {
+    text-decoration: none;
+    color: #1b1b1b;
+    overflow: hidden;
+    padding-right: 1rem;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+}
+
+.card--group-preview__text strong,
+.card--group-preview__text p {
+    overflow: hidden;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+    margin: 0;
+}
+
+.card--group-preview:hover {
+    text-decoration: none;
+}
diff --git a/public/images/seigaiha-single.png b/public/images/seigaiha-single.png
new file mode 100644
index 0000000000000000000000000000000000000000..e963ad631542adb7b517c71a9f4dc44f26a9fd16
GIT binary patch
literal 3463
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
MwRNHtZ}Q#uAJ#5py#N3J

literal 0
HcmV?d00001

diff --git a/public/js/modules/event-edit.js b/public/js/modules/event-edit.js
index 65d9889..0a295cb 100644
--- a/public/js/modules/event-edit.js
+++ b/public/js/modules/event-edit.js
@@ -47,6 +47,13 @@ function editEventForm() {
                 this.data.timezone = event.target.value;
             });
             this.data.timezone = this.select2.val();
+
+            // Set checkboxes
+            this.data.eventGroupCheckbox = window.eventData.eventGroupID !== "";
+            this.data.interactionCheckbox = window.eventData.usersCanComment;
+            this.data.joinCheckbox = window.eventData.usersCanAttend;
+            this.data.maxAttendeesCheckbox =
+                window.eventData.maxAttendees !== null;
         },
         async submitForm() {
             this.submitting = true;
diff --git a/public/js/modules/group-linker.js b/public/js/modules/group-linker.js
new file mode 100644
index 0000000..ca5e159
--- /dev/null
+++ b/public/js/modules/group-linker.js
@@ -0,0 +1,85 @@
+function eventGroupLinker() {
+    return {
+        data: {
+            eventGroupID: "",
+            eventGroupEditToken: "",
+            groups: [],
+        },
+        async init() {
+            this.$watch("data.eventGroupID", () => {
+                this.$dispatch(
+                    "event-group-id-changed",
+                    this.data.eventGroupID,
+                );
+            });
+            this.$watch("data.eventGroupEditToken", () => {
+                this.$dispatch(
+                    "event-group-edit-token-changed",
+                    this.data.eventGroupEditToken,
+                );
+            });
+            if (window.eventData && window.eventData.eventGroupID !== "") {
+                this.data.eventGroupID = window.eventData.eventGroupID;
+            }
+            if (window.eventData && window.eventGroupEditToken !== "") {
+                this.data.eventGroupEditToken =
+                    window.eventData.eventGroupEditToken;
+            }
+            try {
+                const editTokens = JSON.parse(
+                    localStorage.getItem("editTokens"),
+                );
+                if (!editTokens) {
+                    return;
+                }
+                const response = await fetch("/known/groups", {
+                    method: "POST",
+                    body: JSON.stringify(editTokens),
+                    headers: {
+                        "Content-Type": "application/json",
+                    },
+                });
+                if (!response.ok) {
+                    return;
+                }
+                const json = await (await response).json();
+                this.data.groups = json;
+            } catch (e) {
+                return false;
+            }
+        },
+        selectGroup(e) {
+            const group = this.data.groups.find(
+                (group) => group.id === e.target.value,
+            );
+            if (!group) {
+                this.data.eventGroupID = "";
+                this.data.eventGroupEditToken = "";
+                return;
+            }
+            this.data.eventGroupID = group.id;
+            this.data.eventGroupEditToken = group.editToken;
+        },
+        showGroupPreview() {
+            return (
+                this.data.eventGroupID !== "" &&
+                this.data.groups.some(
+                    (group) =>
+                        group.id === this.data.eventGroupID &&
+                        group.editToken === this.data.eventGroupEditToken,
+                )
+            );
+        },
+        groupPreview() {
+            if (!this.showGroupPreview()) {
+                return {};
+            }
+            return this.data.groups.find(
+                (group) => group.id === this.data.eventGroupID,
+            );
+        },
+        resetGroupSelector() {
+            this.$refs.eventGroupSelect.value = "";
+        },
+    };
+}
diff --git a/src/routes/group.ts b/src/routes/group.ts
index 2801248..40dcccb 100644
--- a/src/routes/group.ts
+++ b/src/routes/group.ts
@@ -7,6 +7,8 @@ import Jimp from "jimp";
 import { addToLog } from "../helpers.js";
 import EventGroup from "../models/EventGroup.js";
 import { sendEmailFromTemplate } from "../lib/email.js";
+import { marked } from "marked";
+import { renderPlain } from "../util/markdown.js";
 
 const config = getConfig();
 
@@ -237,4 +239,62 @@ router.put(
     },
 );
 
+// Accepts a JSON object of event/group IDs mapped to edit tokens.
+// Returns an object of basic group data for each of the IDs
+// which are valid groups and have an edit token which matches.
+router.post("/known/groups", async (req: Request, res: Response) => {
+    const known = req.body;
+    if (!known) {
+        return res.status(400).json({
+            errors: [
+                {
+                    message: "No known IDs were provided.",
+                },
+            ],
+        });
+    }
+
+    try {
+        const knownIDs = Object.keys(known);
+        const groups = await EventGroup.find({
+            id: { $in: knownIDs },
+        });
+        const knownGroups = groups.filter((group) => {
+            return group.editToken === known[group.id];
+        });
+        const groupData = knownGroups.map((group) => {
+            return {
+                id: group.id,
+                name: group.name,
+                description: marked
+                    .parse(group.description, {
+                        renderer: renderPlain(),
+                    })
+                    .split(" ")
+                    .splice(0, 40)
+                    .join(" ")
+                    .trim(),
+                image: group.image,
+                editToken: group.editToken,
+                url: `/group/${group.id}`,
+            };
+        });
+        return res.status(200).json(groupData);
+    } catch (err) {
+        console.error(err);
+        addToLog(
+            "getKnownGroups",
+            "error",
+            "Attempt to get known groups failed with error: " + err,
+        );
+        return res.status(500).json({
+            errors: [
+                {
+                    message: err,
+                },
+            ],
+        });
+    }
+});
+
 export default router;
diff --git a/views/newevent.handlebars b/views/newevent.handlebars
index a3b35b3..d8d2f28 100755
--- a/views/newevent.handlebars
+++ b/views/newevent.handlebars
@@ -19,7 +19,15 @@
 
 <div id="newEventFormContainer">
   <h4 class="mb-2">Create an event</h4>
-  <form id="newEventForm" enctype="multipart/form-data" x-data="newEventForm()" x-init="init()" @submit.prevent="submitForm">
+  <form
+    id="newEventForm"
+    enctype="multipart/form-data"
+    x-data="newEventForm()"
+    x-init="init()"
+    @submit.prevent="submitForm"
+    @event-group-id-changed="data.eventGroupID = $event.detail"
+    @event-group-edit-token-changed="data.eventGroupEditToken = $event.detail"
+  >
     {{>eventForm}}
     <div class="form-group row">
       <div class="col-sm-12 pt-3 pb-3 text-center">
@@ -55,4 +63,5 @@
 </article>
 
 <script src="/js/generate-timezones.js"></script>
-<script src="/js/modules/new.js"></script>
\ No newline at end of file
+<script src="/js/modules/new.js"></script>
+<script src="/js/modules/group-linker.js"></script>
\ No newline at end of file
diff --git a/views/partials/editeventmodal.handlebars b/views/partials/editeventmodal.handlebars
index a36cd98..a9fe626 100644
--- a/views/partials/editeventmodal.handlebars
+++ b/views/partials/editeventmodal.handlebars
@@ -8,8 +8,15 @@
         </button>
       </div>
       <div class="modal-body">
-        <form id="editEventForm" enctype="multipart/form-data" x-data="editEventForm()" x-init="init()"
-          @submit.prevent="submitForm">
+        <form
+          id="editEventForm"
+          enctype="multipart/form-data"
+          x-data="editEventForm()"
+          x-init="init()"
+          @submit.prevent="submitForm"
+          @event-group-id-changed="data.eventGroupID = $event.detail"
+          @event-group-edit-token-changed="data.eventGroupEditToken = $event.detail"
+        >
 
             {{> eventForm }}
 
@@ -47,3 +54,4 @@
 
 <script type="text/javascript" src="/js/generate-timezones.js"></script>
 <script type="text/javascript" src="/js/modules/event-edit.js"></script>
+<script src="/js/modules/group-linker.js"></script>
diff --git a/views/partials/eventForm.handlebars b/views/partials/eventForm.handlebars
index 93d679d..49c0f86 100755
--- a/views/partials/eventForm.handlebars
+++ b/views/partials/eventForm.handlebars
@@ -80,18 +80,40 @@
       <div class="card-header">
         <strong>Link this event to an event group</strong>
       </div>
-      <div class="card-body">
+      <div class="card-body" x-data="eventGroupLinker()">
+        <div class="form-group-label" x-show="data.groups.length > 0">
+          <label>Choose a group you've edited before</label>
+        </div>
+        <div class="form-group" x-show="data.groups.length > 0">
+          <select x-ref="eventGroupSelect" id="eventGroupSelect" name="eventGroupSelect" class="form-control" x-on:change="selectGroup">
+            <option value="">Choose a group</option>
+            <template x-for="group in data.groups">
+              <option :value="group.id" x-text="group.name"></option>
+            </template> 
+          </select>
+        </div>
+        <a class="card shadow-sm card--group-preview mb-3" x-show="showGroupPreview()" x-bind:href="groupPreview().url" target="_blank">
+          <img :src="'/events/' + groupPreview().image" x-show="groupPreview().image"/>
+          <img src="/images/seigaiha-single.png" x-show="!groupPreview().image"/>
+          <div class="card--group-preview__text">
+            <strong x-text="groupPreview().name"></strong>
+            <p x-text="groupPreview().description"></p>
+          </div>
+        </a>
+        <div class="alert alert-info text-center" role="alert" x-show="data.groups.length > 0">
+          <i class="fas fa-info-circle"></i> You can also enter the group ID and secret editing code manually.
+        </div>
         <div class="form-group">
-          <label for="eventGroupID" class="col-12">Event group ID</label>
-          <div class="form-group col-12">
-            <input type="text" class="form-control" id="eventGroupID" name="eventGroupID" placeholder="" x-model="data.eventGroupID" >
+          <label for="eventGroupID">Event group ID</label>
+          <div class="form-group">
+            <input type="text" class="form-control" id="eventGroupID" name="eventGroupID" x-model="data.eventGroupID" x-on:input="resetGroupSelector">
             <small class="form-text">You can find this short string of characters in the event group's link, in your confirmation email, or on the event group's page.</small>
           </div>
         </div>
         <div class="form-group">
-          <label for="eventGroupEditToken" class="col-12">Event group secret editing code</label>
-          <div class="form-group col-12">
-            <input type="text" class="form-control" id="eventGroupEditToken" name="eventGroupEditToken" placeholder="" x-model="data.eventGroupEditToken" >
+          <label for="eventGroupEditToken">Event group secret editing code</label>
+          <div class="form-group">
+            <input type="text" class="form-control" id="eventGroupEditToken" name="eventGroupEditToken" x-model="data.eventGroupEditToken" x-on:input="resetGroupSelector">
             <small class="form-text">You can find this long string of characters in the confirmation email you received when you created the event group.</small>
           </div>
         </div>