From 5099a6807b121e1070fd0711f4ce73f419fef0a4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Erik=20Bj=C3=A4reholt?= <erik@bjareho.lt>
Date: Wed, 31 Aug 2022 14:01:55 +0200
Subject: [PATCH] fix: multiple fixes to event editing

---
 src/components/EventEditor.vue     |  2 +-
 src/stores/buckets.ts              | 11 +++++++----
 src/views/Bucket.vue               | 14 ++++++++++----
 src/views/Stopwatch.vue            |  2 +-
 src/visualizations/EventList.vue   |  4 +++-
 src/visualizations/VisTimeline.vue |  2 +-
 6 files changed, 23 insertions(+), 12 deletions(-)

diff --git a/src/components/EventEditor.vue b/src/components/EventEditor.vue
index 059ff41c..78473e8b 100644
--- a/src/components/EventEditor.vue
+++ b/src/components/EventEditor.vue
@@ -1,5 +1,5 @@
 <template lang="pug">
-b-modal(id="edit-modal", ref="eventEditModal", title="Edit event", centered, hide-footer)
+b-modal(v-if="event && event.id", :id="'edit-modal-' + event.id", ref="eventEditModal", title="Edit event", centered, hide-footer)
   div(v-if="!editedEvent")
     | Loading event...
 
diff --git a/src/stores/buckets.ts b/src/stores/buckets.ts
index 6943d401..5b477301 100644
--- a/src/stores/buckets.ts
+++ b/src/stores/buckets.ts
@@ -52,7 +52,7 @@ export const useBucketsStore = defineStore('buckets', {
 
         return {
           window: windowAvail,
-          browser: window && this.bucketsBrowser(hostname).length > 0,
+          browser: windowAvail && this.bucketsBrowser(hostname).length > 0,
           editor: this.bucketsEditor(hostname).length > 0,
           android: androidAvail,
           category: windowAvail || androidAvail,
@@ -94,9 +94,12 @@ export const useBucketsStore = defineStore('buckets', {
       const type = 'web.tab.current';
       return (host: string) => {
         const buckets = select_buckets(this.buckets, { host, type });
-        return buckets.length == 0
-          ? select_buckets(this.buckets, { host: 'unknown', type })
-          : buckets;
+        if (buckets.length > 0) {
+          return buckets;
+        } else {
+          console.log('fallback: ', select_buckets(this.buckets, { host: 'unknown', type }));
+          return select_buckets(this.buckets, { host: 'unknown', type });
+        }
       };
     },
 
diff --git a/src/views/Bucket.vue b/src/views/Bucket.vue
index 15e3914a..91c04dde 100644
--- a/src/views/Bucket.vue
+++ b/src/views/Bucket.vue
@@ -43,7 +43,6 @@ export default {
     return {
       bucketsStore: useBucketsStore(),
 
-      bucket_with_events: { events: [] },
       events: [],
       eventcount: '?',
       daterange: null,
@@ -52,7 +51,14 @@ export default {
   },
   computed: {
     bucket() {
-      return this.bucketsStore.getBucket(this.id) || {};
+      return this.bucketsStore.getBucket(this.id) || { id: this.id };
+    },
+    bucket_with_events() {
+      console.log(this.bucket);
+      return {
+        ...this.bucket,
+        events: this.events,
+      };
     },
   },
   watch: {
@@ -66,12 +72,12 @@ export default {
   },
   methods: {
     getEvents: async function (bucket_id) {
-      this.bucket_with_events = await this.bucketsStore.getBucketWithEvents({
+      const bucket = await this.bucketsStore.getBucketWithEvents({
         id: bucket_id,
         start: this.daterange[0].format(),
         end: this.daterange[1].format(),
       });
-      this.events = this.bucket_with_events.events;
+      this.events = bucket.events;
     },
     getEventCount: async function (bucket_id) {
       this.eventcount = (await getClient().countEvents(bucket_id)).data;
diff --git a/src/views/Stopwatch.vue b/src/views/Stopwatch.vue
index 973f27d1..ef1e4faf 100644
--- a/src/views/Stopwatch.vue
+++ b/src/views/Stopwatch.vue
@@ -5,7 +5,7 @@ div
     | Using bucket: {{bucket_id}}
 
   b-alert(show)
-    | This is an early experiment, an important missing feature is the ability to set start/end times manually.
+    | This is an early experiment. Data entered here is not shown in the Activity view, yet.
 
   b-input-group(size="lg")
     b-input(v-model="label" placeholder="What are you working on?")
diff --git a/src/visualizations/EventList.vue b/src/visualizations/EventList.vue
index 6b03071f..3f31b278 100644
--- a/src/visualizations/EventList.vue
+++ b/src/visualizations/EventList.vue
@@ -150,7 +150,9 @@ export default {
   methods: {
     editEvent: function (event) {
       this.editableEvent = event;
-      this.$bvModal.show('edit-modal');
+      this.$nextTick(() => {
+        this.$bvModal.show('edit-modal-' + event.id);
+      });
     },
     expandList: function () {
       this.isListExpanded = !this.isListExpanded;
diff --git a/src/visualizations/VisTimeline.vue b/src/visualizations/VisTimeline.vue
index 185baf67..8fbbdbcd 100644
--- a/src/visualizations/VisTimeline.vue
+++ b/src/visualizations/VisTimeline.vue
@@ -158,7 +158,7 @@ export default {
   },
   methods: {
     openEditor: function () {
-      this.$bvModal.show('edit-modal');
+      this.$bvModal.show('edit-modal-' + this.editingEvent.id);
     },
     onSelect: async function (properties) {
       if (properties.items.length == 0) {