Prevent conference names from containing special characters

CruGlobal · Oct 23, 2024 · 48a5ca2 · 48a5ca2
1 parent d54edba
commit 48a5ca2
Show file tree

Hide file tree

Showing 4 changed files with 52 additions and 14 deletions.
diff --git a/app/scripts/controllers/eventDashboard.js b/app/scripts/controllers/eventDashboard.js
@@ -41,10 +41,6 @@ angular
             templateUrl: createEventModalTemplate,
           })
           .result.then(function (conferenceName) {
-            if (!conferenceName) {
-              return;
-            }
-
             ConfCache.create(conferenceName).then(function (conference) {
               $location.path('/eventDetails/' + conference.id);
             });

diff --git a/app/scripts/controllers/eventDetails.js b/app/scripts/controllers/eventDetails.js
@@ -263,6 +263,11 @@ angular
         if (_.isEmpty($scope.conference.name)) {
           validationErrors.push('Please enter an event name.');
         }
+        if (/[&"]/.test($scope.conference.name)) {
+          validationErrors.push(
+            'Please remove double quotes (") and ampersands (&) from the event name.',
+          );
+        }
 
         if (_.isEmpty($scope.conference.abbreviation)) {
           validationErrors.push('Please enter an event abbreviation.');

diff --git a/app/views/modals/createEvent.html b/app/views/modals/createEvent.html
@@ -2,25 +2,46 @@
   <button type="button" class="close" ng-click="$dismiss()">&times;</button>
   <h3 translate>Create Event</h3>
 </div>
-<div class="modal-body">
+<div class="modal-body" ng-form="form">
   <p>
     <translate>First things, first.</translate><br />
     <translate>Let's give this event a name:</translate>
   </p>
-  <input
-    type="text"
-    class="form-control"
-    placeholder="Example: Fall Retreat 2017"
-    ng-model="name"
-    ng-enter="$close(name)"
-    auto-focus
-  />
+  <div class="form-group">
+    <input
+      type="text"
+      class="form-control"
+      placeholder="Example: Fall Retreat 2017"
+      name="name"
+      ng-model="name"
+      ng-required="true"
+      ng-pattern='/^[^&"]+$/'
+      ng-enter="$close(name)"
+      auto-focus
+    />
+  </div>
+  <div
+    class="alert alert-danger"
+    ng-if="form.name.$invalid && form.name.$touched"
+  >
+    <p ng-if="form.name.$error.required" translate>
+      Please choose an event name.
+    </p>
+    <p ng-if="form.name.$error.pattern" translate>
+      Please choose an event name without quotes (") or ampersands (&).
+    </p>
+  </div>
 </div>
 <div class="modal-footer">
   <button ng-click="$dismiss()" class="btn btn-default" translate>
     Cancel
   </button>
-  <button ng-click="$close(name)" class="btn btn-primary" translate>
+  <button
+    ng-disabled="form.$invalid"
+    ng-click="$close(name)"
+    class="btn btn-primary"
+    translate
+  >
     Create
   </button>
 </div>
diff --git a/test/spec/controllers/eventDetails.spec.js b/test/spec/controllers/eventDetails.spec.js
@@ -279,6 +279,22 @@ describe('Controller: eventDetails', function () {
         'Please enter which Event Type',
       );
     });
+
+    it('saveEvent() should validate the Event Name', () => {
+      scope.conference.name = 'Men & Women Conference';
+      scope.saveEvent();
+
+      expect(scope.notify.message.toString()).toContain(
+        'Please remove double quotes (") and ampersands (&) from the event name.',
+      );
+
+      scope.conference.name = '"Cru" Conference';
+      scope.saveEvent();
+
+      expect(scope.notify.message.toString()).toContain(
+        'Please remove double quotes (") and ampersands (&) from the event name.',
+      );
+    });
   });
 
   describe('Conference (Cru event) without ministry hosting', function () {