Merge branch 'frontend/refactor' into develop

Author: Luca1313

frontend/src/components/CarouselComponent.vue

@@ -1,7 +1,7 @@
 <template>
   <Carousel v-bind="settings" :breakpoints="breakpoints">
     <Slide v-for="election in elections" :key="String(election.id)">
-      <ElectionCard :election="election"/>
+      <ElectionCard :election="election" :time="time"/>
     </Slide>
     <template #pagination="{ pagesCount, currentPage, setCurrentPage }">
       <div class="pagination">
@@ -28,7 +28,8 @@ import 'vue3-carousel/dist/carousel.css'
 import type {Voting} from "@/stores/voting";
 
 defineProps<{
-  elections: Voting[]
+  elections: Voting[],
+  time: number,
 }>()
 
 const settings = {

frontend/src/components/ElectionCardComponent.vue

@@ -25,22 +25,12 @@ import type {Voting} from "@/stores/voting";
 import {ref} from "vue";
 import {formatDate, formatTime, getStatus} from "@/commons/utils";
 
-defineProps<{
-  election: Voting
+const props = defineProps<{
+  election: Voting,
+  time: number,
 }>()
 
-const now = ref(new Date().getTime());
-
-function scheduleUpdateNow() {
-  setTimeout(updateNow, 1000);
-}
-
-function updateNow() {
-  now.value = new Date().getTime();
-  scheduleUpdateNow();
-}
-
-scheduleUpdateNow();
+const now = ref(props.time);
 
 function isOpen(election: Voting): boolean {
   return getStatus(election, now.value) === 'open';

frontend/src/components/ElectionComponent.vue

@@ -43,25 +43,15 @@ import type {Voting} from "@/stores/voting";
 import {capitalizeFirstLetter, formatDate, formatTime, getStatus} from "@/commons/utils";
 import {ref} from "vue";
 
-const now = ref(new Date().getTime());
-
-function scheduleUpdateNow() {
-  setTimeout(updateNow, 1000);
-}
-
-function updateNow() {
-  now.value = new Date().getTime();
-  scheduleUpdateNow();
-}
-
-scheduleUpdateNow();
-
 function isOpen(election: Voting): boolean {
   return getStatus(election, now.value) === 'open';
 }
-defineProps<{
-  election: Voting
+const props = defineProps<{
+  election: Voting,
+  time: number,
 }>()
+
+const now = ref(props.time);
 </script>
 
 <style scoped>

frontend/src/views/DashboardView.vue

@@ -4,7 +4,8 @@
   <div v-for="qualifier in qualifiers" :class="`elections col-10 center mx-auto election election-${qualifier} bg-light`" :key="`div-${qualifier}`">
     <h2><a :href="`/elections?qualifier=${qualifier}`" class="election-link">{{ capitalizeFirstLetter(qualifier) }} Elections</a></h2>
     <hr v-if="getData(qualifier).length > 0"/>
-    <Carousel :elections="sortElectionsByDate(getData(qualifier))"/>
+    <Carousel :elections="sortElectionsByDate(getData(qualifier))"
+              :time="now"/>
   </div>
 </template>
 

frontend/src/views/ElectionsView.vue

@@ -147,7 +147,8 @@ function resetPage() {
   <div class="container-sm col-10 col-md-8 text-center">
     <div v-if="displayedElections.length > 0">
       <div v-for="election in displayedElections" :key="String(election.id)" class="row election">
-        <ElectionComponent :election="election"/>
+        <ElectionComponent :election="election"
+                            :time="now"/>
       </div>
       <div class="pagination-buttons" v-if="totalPages>2">
         <button @click="prevPage" class="btn btn-primary" :disabled="currentPage === 1">&lt;</button>