feat: Implement event publish-unpublish confirm pop-up

app/components/modals/publish-unpublish-modal.js

@@ -0,0 +1,11 @@
+import classic from 'ember-classic-decorator';
+import { action } from '@ember/object';
+import ModalBase from 'open-event-frontend/components/modals/modal-base';
+
+@classic
+export default class PublishUnpublishModal extends ModalBase {
+  @action
+  toggleView() {
+    this.set('isOpen', false);
+  }
+}

app/controllers/events/view.js

@@ -3,8 +3,14 @@ import { isEmpty } from '@ember/utils';
 import { action } from '@ember/object';
 
 export default class extends Controller {
+  @action
+  openConfirmModal() {
+    this.set('isPublishUnpublishModalOpen', true);
+  }
+
   @action
   togglePublishState() {
+    this.set('isPublishUnpublishModalOpen', false);
     if (isEmpty(this.model.locationName)) {
       this.notify.error(this.l10n.t('Your event must have a location before it can be published.'),
         {

app/templates/components/modals/publish-unpublish-modal.hbs

@@ -0,0 +1,28 @@
+<i class="black close icon"></i>
+<div class="header">
+  {{t 'Are you sure?'}}
+</div>
+<div class="content">
+  {{#if (eq this.state 'published')}}
+    <p>{{t 'This will unpublish your event. It will not be accessible to the public on the Internet anymore if you continue. The data of the event will still be available on your dashboard, but tickets, call for speakers or any other features will no longer be available online. Do you want to unpublish your event now?'}}</p>
+  {{else}}
+    <p>{{t 'This will publish the event and the event will be visible on the Internet. Please confirm you want to publish your event.'}}</p>
+  {{/if}}
+</div>
+<div class="actions">
+	{{#if (eq this.state 'published')}}
+		<button type="button" class="ui red button" {{action this.togglePublishState}}>
+			{{t 'Yes, Unpublish it'}}
+		</button>
+		<button type="button" class="ui button" {{action 'toggleView'}}>
+			{{t 'Cancel'}}
+		</button>
+	{{else}}
+		<button type="button" class="ui green button" {{action this.togglePublishState}}>
+			{{t 'Yes'}}
+		</button>
+		<button type="button" class="ui button" {{action 'toggleView'}}>
+			{{t 'Cancel, Do Not Publish it Now'}}
+		</button>
+	{{/if}}
+</div>

app/templates/events/view.hbs

@@ -34,7 +34,7 @@
             {{/if}}
           </a>
 
-            <button class="ui button labeled icon small" {{action 'togglePublishState'}}>
+            <button class="ui button labeled icon small" {{action 'openConfirmModal'}}>
               {{#if (eq this.model.state 'published')}}
                 <i class="ban icon"></i>
                 {{t 'Unpublish'}}
@@ -90,3 +90,4 @@
   {{!-- the edit page will be rendered without any of the above tabs --}}
   {{outlet}}
 {{/if}}
+<Modals::PublishUnpublishModal @isOpen={{this.isPublishUnpublishModalOpen}} @state={{this.model.state}} @togglePublishState={{action 'togglePublishState'}} />