From 4c8d1c96dab841fd61a3e7429a08bcbbd3eb63aa Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Andr=C3=A9=20Fincato?= <work@andrefincato.info>
Date: Wed, 7 Jul 2021 16:34:23 +0200
Subject: [PATCH 1/6] Clean up

---
 "Icon\r" | 0
 1 file changed, 0 insertions(+), 0 deletions(-)
 delete mode 100644 "Icon\r"

diff --git "a/Icon\r" "b/Icon\r"
deleted file mode 100644
index e69de29..0000000

From 9da6f2b001c1024fea04c394d81631d896b196ce Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=D9=83=D8=A7=D8=B1=D9=84=20=D9=85=D8=A8=D8=A7=D8=B1=D9=83?=
 <bonjour@mouabrak.eu>
Date: Wed, 7 Jul 2021 16:53:17 +0200
Subject: [PATCH 2/6] updte-message, ddelete message

---
 front/src/App.vue        | 16 ++++++++--------
 front/src/store/index.js | 17 +++++++++++------
 2 files changed, 19 insertions(+), 14 deletions(-)

diff --git a/front/src/App.vue b/front/src/App.vue
index 276656f..6d83b2b 100644
--- a/front/src/App.vue
+++ b/front/src/App.vue
@@ -102,18 +102,18 @@ export default {
       switch (event.type) {
       
         case 'message':
-          switch (event.message.subject) {
-            case 'content':
-              this.$store.commit('addMessage', event.message)
-              break
-            case 'rules':
-              this.$store.commit('addRule', event.message)
-              break
+          if (event.message.subject == 'rules') {
+            this.$store.commit('addRule', event.message)
+          } else {
+            this.$store.commit('addMessage', event.message)
           }
           break
           
         case 'delete_message':
-          this.$store.commit('deleteMessage', event.message_id)
+          this.$store.commit('deleteMessage', {
+            subject: event.topic, 
+            mid: event.message_id
+          })
           break
           
         case 'update_message':
diff --git a/front/src/store/index.js b/front/src/store/index.js
index d8e4050..0226700 100644
--- a/front/src/store/index.js
+++ b/front/src/store/index.js
@@ -115,10 +115,13 @@ export default createStore({
         }
       }
     },
-    deleteMessage: (state, mid) => {
-      const message = state.contents.find(m => m.id == mid)
-      if (message) {
-        state.contents.splice(state.contents.indexOf(message), 1)
+    deleteMessage: (state, { mid, subject }) => {
+      const topic = state.topics.find(t => t.title == subject)
+      if (topic) {
+        const message = topic.messages.find(m => m.id == mid)
+        if (message) {
+          topic.messages.splice(topic.messages.indexOf(message), 1)
+        }
       }
     },
     addReaction: (state, { mid, reaction }) => {
@@ -145,13 +148,15 @@ export default createStore({
     addRule: (state, rule) => {
       if (toCSS(rule) !== null) {
         // state.rules.push(toCSS(rule, state.currentStream))
-        
         // vue will not update if i use rules.push(rule)
         state.rules = [...state.rules,...[toCSS(rule, state.currentStream)]]
       }
     },
     editMessage: (state, { mid, content }) => {
-      const message = state.contents.find(m => m.id == mid)
+      const message = state.topics
+        .map(t => t.messages)
+        .flat()
+        .find(m => m.id == mid)
       const rule = state.rules.find(r => r.id == mid)
       if (message) {
         message.content = content

From 78dce918eb490f337f444f2bc41d481ca7fd9cde Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=D9=83=D8=A7=D8=B1=D9=84=20=D9=85=D8=A8=D8=A7=D8=B1=D9=83?=
 <bonjour@mouabrak.eu>
Date: Wed, 7 Jul 2021 16:59:01 +0200
Subject: [PATCH 3/6] aadd/remoove reaction

---
 front/src/store/index.js | 10 ++++++++--
 1 file changed, 8 insertions(+), 2 deletions(-)

diff --git a/front/src/store/index.js b/front/src/store/index.js
index 0226700..528bc3a 100644
--- a/front/src/store/index.js
+++ b/front/src/store/index.js
@@ -125,13 +125,19 @@ export default createStore({
       }
     },
     addReaction: (state, { mid, reaction }) => {
-      const message = state.contents.find(m => m.id == mid)
+      const message = state.topics
+        .map(t => t.messages)
+        .flat()
+        .find(m => m.id == mid)
       if (message) {
         message.reactions.push(reaction)
       }
     },
     removeReaction: (state, { mid, reaction }) => {
-      const message = state.contents.find(m => m.id == mid)
+      const message = state.topics
+        .map(t => t.messages)
+        .flat()
+        .find(m => m.id == mid)
       if (message) {
         message.reactions.splice(message.reactions.indexOf(reaction), 1)
       }

From 514fe12f796ff21545da6db8b4b0622b92c4b0bf Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Andr=C3=A9=20Fincato?= <work@andrefincato.info>
Date: Wed, 7 Jul 2021 17:26:24 +0200
Subject: [PATCH 4/6] ahem remove .env

---
 front/.env       | 3 ---
 front/.gitignore | 1 +
 2 files changed, 1 insertion(+), 3 deletions(-)
 delete mode 100644 front/.env

diff --git a/front/.env b/front/.env
deleted file mode 100644
index 4a179f9..0000000
--- a/front/.env
+++ /dev/null
@@ -1,3 +0,0 @@
-VUE_APP_ZULIP_email=pub-bot@chat.hackersanddesigners.nl
-VUE_APP_ZULIP_key=m1MDxscGcPQx2RvIfgG4DiSHE1nurxms
-VUE_APP_ZULIP_site=https://chat.hackersanddesigners.nl
diff --git a/front/.gitignore b/front/.gitignore
index 1723e7b..563fe27 100644
--- a/front/.gitignore
+++ b/front/.gitignore
@@ -6,6 +6,7 @@ node_modules
 # local env files
 .env.local
 .env.*.local
+.env
 
 # Log files
 npm-debug.log*

From 268623ad2af85f13db2d65c1b7cc12dd2b3ac8c7 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=D9=83=D8=A7=D8=B1=D9=84=20=D9=85=D8=A8=D8=A7=D8=B1=D9=83?=
 <bonjour@mouabrak.eu>
Date: Wed, 7 Jul 2021 17:44:30 +0200
Subject: [PATCH 5/6] topic adding / removing / updating nnowin real-time

---
 front/src/App.vue        | 18 ++++++++++++++----
 front/src/store/index.js | 15 +++++++++++++--
 2 files changed, 27 insertions(+), 6 deletions(-)

diff --git a/front/src/App.vue b/front/src/App.vue
index 6d83b2b..081c3b7 100644
--- a/front/src/App.vue
+++ b/front/src/App.vue
@@ -117,10 +117,20 @@ export default {
           break
           
         case 'update_message':
-          this.$store.commit('editMessage', {
-            mid: event.message_id,
-            content: event.rendered_content
-          })
+          if (
+            event.message_ids.length > 1 &&
+            event.orig_subject
+          ){
+            this.$store.commit('updateTopic', { 
+              orig_subject: event.orig_subject,
+              subject: event.subject
+            })
+          } else {
+            this.$store.commit('editMessage', {
+              mid: event.message_id,
+              content: event.rendered_content
+            })
+          }
           break
           
         case 'reaction':
diff --git a/front/src/store/index.js b/front/src/store/index.js
index 528bc3a..91582e1 100644
--- a/front/src/store/index.js
+++ b/front/src/store/index.js
@@ -184,10 +184,17 @@ export default createStore({
           id: mid, content: content,
         }, state.currentStream)]]
         state.rules = newRules
-
       }
     },
 
+    updateTopic: (state, { orig_subject, subject }) => {
+      const topic = state.topics.find(t => t.title == orig_subject)
+      if (topic) {
+        topic.title = subject
+        topic.messages.forEach(m => m.subject = subject)
+      }
+    }
+
   },
 
   actions: {
@@ -195,7 +202,11 @@ export default createStore({
 
   getters: {
     rules: state => state.rules,
-    sortedTopics: state => [...state.topics].sort((a, b) => a.title.localeCompare(b.title))
+    sortedTopics: state => (
+      [...state.topics]
+      .sort((a, b) => a.title.localeCompare(b.title))
+      .filter(t => t.messages.length > 0) 
+    )
   }
 
 })

From 2a58a7b52325fb223dbbf837e827721b1064efb5 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=D9=83=D8=A7=D8=B1=D9=84=20=D9=85=D8=A8=D8=A7=D8=B1=D9=83?=
 <bonjour@mouabrak.eu>
Date: Wed, 7 Jul 2021 18:56:26 +0200
Subject: [PATCH 6/6] some styling, topics/chapters are collapsed by default

---
 front/src/App.vue                        |  9 +----
 front/src/components/Content/Chapter.vue | 50 ++++++++++++++++++++++++
 front/src/components/Content/index.vue   | 31 ++++++---------
 front/src/components/Rules/index.vue     |  2 +-
 front/src/components/Streams/Stream.vue  |  8 +++-
 front/src/components/Streams/index.vue   |  3 +-
 6 files changed, 72 insertions(+), 31 deletions(-)
 create mode 100644 front/src/components/Content/Chapter.vue

diff --git a/front/src/App.vue b/front/src/App.vue
index 081c3b7..bd50c6c 100644
--- a/front/src/App.vue
+++ b/front/src/App.vue
@@ -209,14 +209,7 @@ section p {
   margin-bottom: 0;
   margin-top: 0;
 }
-section .title {
-  display: none;
-  font-weight: bold;
-  position: sticky;
-  top: 1em;
-}
-
 @media print {
-  .title { display: none; } 
+  /* .title { display: none; }  */
 }
 </style>
diff --git a/front/src/components/Content/Chapter.vue b/front/src/components/Content/Chapter.vue
new file mode 100644
index 0000000..99d3906
--- /dev/null
+++ b/front/src/components/Content/Chapter.vue
@@ -0,0 +1,50 @@
+<template>
+  <div :class="[ 'body', topic.title ]">    
+    <h3
+      @click="desiresContent = !desiresContent"
+      class="header"
+    >
+      <span class="expandToggle">{{ desiresContent ? '▼ ' : '► '}}</span>
+      <span>{{ topic.title }}</span>
+    </h3> 
+    <div v-if="desiresContent">
+      <span
+        v-for="message in topic.messages"
+        :key="message.id"
+      >
+      <Message
+        :message="message"
+      />
+      <span>&nbsp;</span>
+      </span>
+    </div>
+  </div>
+</template>
+
+<script>
+import Message from './Message'
+
+export default {
+  name: 'Chapter',
+  components: { 
+    Message,
+  },
+  data() {
+    return {
+      desiresContent: false,
+    }
+  },
+  props: [
+    'topic',
+  ],
+}
+</script>
+
+<style scoped>
+.header {
+  cursor: pointer;
+}
+@media print {
+  .title { display: none; } 
+}
+</style>
\ No newline at end of file
diff --git a/front/src/components/Content/index.vue b/front/src/components/Content/index.vue
index 6a01929..cfce587 100644
--- a/front/src/components/Content/index.vue
+++ b/front/src/components/Content/index.vue
@@ -1,36 +1,30 @@
 <template>
   <section :class="[ 'content', currentStream ]">
-    <div 
+    <h1 class="title">{{ currentStream }}</h1>
+    <Chapter 
       v-for="topic in sortedTopics"
       :key="topic.title"
-      :class="[ 'body', topic.title ]"
-    >
-      <h1>{{ topic.title }}</h1>
-      <span
-        v-for="message in topic.messages"
-        :key="message.id"
-      >
-      <Message
-        :message="message"
-      />
-      <span>&nbsp;</span>
-      </span>
-    </div>
+      :topic="topic"
+    />    
   </section>   
 </template>
 
 <script>
 import { mapGetters, mapState } from 'vuex'
-import Message from './Message'
+import Chapter from './Chapter.vue'
 
 export default {
   name: 'Content',
   components: { 
-    Message,
+    Chapter,
+  },
+  data() {
+    return {
+      desiresContent: false,
+    }
   },
   computed: {
     ...mapState([
-      'rules',
       'currentStream'
     ]),
     ...mapGetters([
@@ -47,7 +41,4 @@ export default {
   max-width: 700px;
   background: unset;
 }
-@media print {
-  .title { display: none; } 
-}
 </style>
\ No newline at end of file
diff --git a/front/src/components/Rules/index.vue b/front/src/components/Rules/index.vue
index e059ef0..1a5ef73 100644
--- a/front/src/components/Rules/index.vue
+++ b/front/src/components/Rules/index.vue
@@ -1,6 +1,6 @@
 <template>
   <section class="rules">
-    <p class="title">{{ $.type.name }}</p>
+    <!-- <p class="title">{{ $.type.name }}</p> -->
     <Rule
       v-for="rule in rules"
       :key="rule.id"
diff --git a/front/src/components/Streams/Stream.vue b/front/src/components/Streams/Stream.vue
index 31b5e37..1f21d96 100644
--- a/front/src/components/Streams/Stream.vue
+++ b/front/src/components/Streams/Stream.vue
@@ -1,5 +1,5 @@
 <template>
-  <div>
+  <div :class="{ selected: selected }">
     <p class="name">
       <router-link :to="stream.name">
         {{ stream.name }}
@@ -16,15 +16,21 @@ export default {
     'stream'
   ],
   computed: {
+    selected() { return this.$store.state.currentStream == this.stream.name }
   },
 }
 </script>
 
 <style scoped>
 div {
+  padding: 0.5em;
+}
+div .selected {
+  background: rgb(247, 146, 247);
 }
 div p {
   margin: 0;
 }
 
+
 </style>
\ No newline at end of file
diff --git a/front/src/components/Streams/index.vue b/front/src/components/Streams/index.vue
index 2a806a5..e74b438 100644
--- a/front/src/components/Streams/index.vue
+++ b/front/src/components/Streams/index.vue
@@ -1,6 +1,6 @@
 <template>
   <section class="streams">
-    <p class="title">{{ $.type.name }}</p>
+    <!-- <p class="title">{{ $.type.name }}</p> -->
     <Stream
       v-for="stream in streams"
       :key="stream.id"
@@ -29,6 +29,7 @@ export default {
 <style scoped>
 .streams {
   min-width: 10em;
+  padding: 0;
 }
 @media print {
   .streams { display: none; }