From 7b749f1623212411717de9567581b53b61c46aa3 Mon Sep 17 00:00:00 2001
From: Matthew Holloway <matthew@staff.ietf.org>
Date: Wed, 6 Nov 2024 08:42:54 +0000
Subject: [PATCH] fix: Agenda mobile goto now (#8160)
* fix: agenda mobile goto now
* fix: manually close the dropdown
---
client/agenda/AgendaMobileBar.vue | 16 +++++++++++++---
1 file changed, 13 insertions(+), 3 deletions(-)
diff --git a/client/agenda/AgendaMobileBar.vue b/client/agenda/AgendaMobileBar.vue
index 78af96e25..63611e21c 100644
--- a/client/agenda/AgendaMobileBar.vue
+++ b/client/agenda/AgendaMobileBar.vue
@@ -3,11 +3,13 @@
n-dropdown(
:options='jumpToDayOptions'
size='huge'
+ :show='isDropdownOpenRef'
:show-arrow='true'
trigger='click'
@select='jumpToDay'
+ @clickoutside='handleCloseDropdown'
)
- button
+ button(@click='handleOpenDropdown')
i.bi.bi-arrow-down-circle
button(@click='agendaStore.$patch({ filterShown: true })')
i.bi.bi-funnel
@@ -28,7 +30,7 @@
</template>
<script setup>
-import { computed, h } from 'vue'
+import { computed, h, ref } from 'vue'
import {
NBadge,
NDropdown,
@@ -61,7 +63,8 @@ function optionToLink(opts){
{
class: 'dropdown-link',
'data-testid': 'mobile-link',
- href: `#${key}`
+ href: `#${key}`,
+ onClick: () => jumpToDay(key)
},
[
h(
@@ -77,6 +80,12 @@ function optionToLink(opts){
}
}
+const isDropdownOpenRef = ref(false)
+
+const handleOpenDropdown = () => isDropdownOpenRef.value = true
+
+const handleCloseDropdown = () => isDropdownOpenRef.value = false
+
const jumpToDayOptions = computed(() => {
const days = []
if (agendaStore.isMeetingLive) {
@@ -124,6 +133,7 @@ function jumpToDay (dayId) {
} else {
document.getElementById(dayId)?.scrollIntoView(true)
}
+ isDropdownOpenRef.value = false
}
function downloadIcs (key) {