[#6951]apps/BudgetingProposalList/Modal: adding end session link and …

…modal
liqd · Jan 26, 2023 · 847fd76 · 847fd76
1 parent dc836c6
commit 847fd76
Show file tree

Hide file tree

Showing 2 changed files with 36 additions and 3 deletions.
diff --git a/meinberlin/apps/budgeting/assets/BudgetingProposalList.jsx b/meinberlin/apps/budgeting/assets/BudgetingProposalList.jsx
@@ -5,6 +5,7 @@ import { Pagination } from './Pagination'
 import { CountDown } from '../../contrib/assets/CountDown'
 import { ControlBar } from './ControlBar'
 import { useLocation, useSearchParams } from 'react-router-dom'
+import Modal from 'adhocracy4/adhocracy4/static/Modal'
 
 export const BudgetingProposalList = (props) => {
   const [data, setData] = useState([])
@@ -15,7 +16,22 @@ export const BudgetingProposalList = (props) => {
     const countText = django.ngettext('you have 1 vote left.', 'you have %s votes left.', votes)
     return django.interpolate(countText, [votes])
   }
-  const noResults = django.gettext('Nothing to show')
+
+  const translations = {
+    noResults: django.gettext('Nothing to show'),
+    ready: django.gettext('Are you ready?'),
+    endSession: django.gettext('End session'),
+    modalDescription: django.gettext('To save your votes you do not need to do anything else. End the session to enter a new code. If you want to change the votes you have already cast, you can re-enter your code as long as the voting phase is running. '),
+    modalBodyQuestion: django.gettext('Do you want to end the session?'),
+    modalCancel: django.gettext('Cancel')
+  }
+
+  const modalPartials = {
+    title: translations.endSession,
+    description: translations.modalDescription,
+    abort: translations.modalCancel
+  }
+
   const scrolledRef = useRef(false)
 
   const fetchProposals = () => {
@@ -98,6 +114,23 @@ export const BudgetingProposalList = (props) => {
                 inactiveClass="btn btn--full btn--light u-spacer-bottom btn--huge"
                 counter={meta?.token_info.num_votes_left}
               />
+              <div className="u-spacer-bottom u-align-center">
+                <span>{translations.ready} </span>
+                <a
+                  className="btn--link"
+                  href="something"
+                  data-bs-toggle="modal"
+                  data-bs-target="#end-session_modal"
+                >
+                  {translations.endSession}
+                </a>
+              </div>
+              <Modal
+                name="end-session_modal"
+                abort={translations.modalCancel}
+                action={translations.endSession}
+                partials={modalPartials}
+              />
             </div>
           </div>
         </div>}
@@ -110,7 +143,7 @@ export const BudgetingProposalList = (props) => {
           <div className="offset-lg-2 col-lg-8">
             {Object.keys(data).length > 0
               ? renderList(data)
-              : noResults}
+              : translations.noResults}
           </div>
         </div>
       </div>

diff --git a/meinberlin/templates/a4dashboard/includes/progress.html b/meinberlin/templates/a4dashboard/includes/progress.html
@@ -44,7 +44,7 @@ <h1>{% translate 'Unpublish' %}</h1>
                 {% blocktranslate count counter=project.unpublished_modules.count %}One module has not been added to the project.{% plural %}{{ counter }} modules have not been added to the project.{% endblocktranslate %}
                 </p>
                 {% endif %}
-                <div class="u-spacer-bottom">
+                <div class="modal-footer">
                     <form action="{% url 'a4dashboard:project-publish' project_slug=project.slug %}" method="post" data-ignore-submit="true" class="u-inline">
                         {% csrf_token %}
                         <input type="hidden" name="referrer" value="{{ request.path }}" />