src/App.vue

@@ -13,11 +13,7 @@
 
         </div>
         <div class="navbar-menu">
-          <div class="navbar-end">
+          <!--<router-link to="/about">About</router-link>-->
-            <div class="buttons">
-              <button class="button is-light" @click="openSearch">Search</button>
-            </div>
-          </div>
         </div>
       </div>
     </nav>
@@ -41,11 +37,6 @@
         this.$store.dispatch('isLoggedIn', loginData)
         this.$store.dispatch('startEventListening', '?action=events')
       }
-    },
-    methods: {
-      openSearch () {
-        this.$store.dispatch('openSearch')
-      }
     }
   }
 </script>

src/components/DebugModal.vue

@@ -25,7 +25,7 @@
     },
     methods: {
       close() {
-        this.$store.dispatch('closeDebug')
+        this.$emit('close')
       }
     }
   }
@@ -33,4 +33,4 @@
 
 <style scoped>
 
-</style>
+</style>

src/components/SearchPopup.vue

@@ -1,77 +0,0 @@
-<template>
-  <div :class="modalClasses">
-    <div class="modal-background"></div>
-    <div class="modal-card">
-      <header class="modal-card-head">
-        <p class="modal-card-title">Search</p>
-        <button class="delete" aria-label="close" @click="close"></button>
-      </header>
-      <div class="modal-card-body">
-        <div class="field has-addons">
-          <div class="control is-expanded">
-            <input type="text" class="input is-expanded" id="query" placeholder="Search for items" v-model="query" ref="query" @keypress.enter="search"/>
-          </div>
-          <div class="control">
-            <button :class="searchClasses" @click="search">Search</button>
-          </div>
-        </div>
-        
-        <div class="timeline--item" v-for="item in searchItems" :key="item.id">
-          <TimelineEntry :item="item" :is-main-entry="true" @debug="debug" />
-        </div>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script>
-import TimelineEntry from '../components/Entry'
-
-export default {
-  name: "SearchPopup",
-  components: {
-    TimelineEntry
-  },
-  props: ['is-open'],
-  data() {
-    return {
-      query: ''
-    }
-  },
-  mounted () {
-  },
-  watch: {
-    isOpen(val) {
-      if (val) {
-        this.$refs.query.focus()
-      }
-    }
-  },
-  computed: {
-    modalClasses() {
-      return {'modal': true, 'is-active': this.isOpen}
-    },
-    searchItems () {
-      return this.$store.state.searchItems
-    },
-    searchClasses() {
-      return {'button': true, 'is-primary': true, 'is-loading': this.loading}
-    },
-  },
-  methods: {
-    search () {
-      this.$store.dispatch('startQuery', this.query)
-    },
-    close () {
-      this.$store.dispatch('closeSearch')
-      this.query = ''
-    },
-    debug (item) {
-      this.$store.dispatch('openDebug', item)
-    }
-  }
-}
-</script>
-
-<style>
-</style>

src/components/Timeline.vue

@@ -12,19 +12,23 @@
         <button class="button" @click="nextPage" v-if="timeline.paging.after">Next Page</button>
       </div>
     </div>
+    <DebugModal :active="showDebug" :item="debugItem" @close="showDebug = false"></DebugModal>
   </div>
 </template>
 
 <script>
   import TimelineEntry from '../components/Entry'
+  import DebugModal from '../components/DebugModal'
 
   export default {
     name: "Timeline",
     props: ['className', 'channel', 'timeline'],
-    components: {TimelineEntry},
+    components: {TimelineEntry, DebugModal},
 
     data() {
       return {
+        showDebug: false,
+        debugItem: null,
         state: 'new'
       }
     },
@@ -39,7 +43,8 @@
 
     methods: {
       debug(item) {
-        this.$store.dispatch('openDebug', item)
+        this.debugItem = item
+        this.showDebug = true
       },
       nextPage() {
         if (this.timeline.paging.after) {
@@ -99,4 +104,4 @@
     justify-content: end;
     padding: 12px;
   }
-</style>
+</style>

src/store.js

@@ -12,17 +12,13 @@ export default new Vuex.Store({
       channels: [],
       timeline: {items: [], paging: {}},
       channel: {},
+      debug: false,
       logged_in: false,
       micropubEndpoint: '',
       microsubEndpoint: '/microsub',
       channelCreatorIsOpen: false,
-      searchPopupIsOpen: false,
-      searchItems: [],
       eventSource: null,
-      globalTimeline: {items: [{name: 'Testing the global timeline'}]},
+      globalTimeline: {items: [{name: 'Testing the global timeline'}]}
-      debug: false,
-      debugItem: {},
-      debugVisible: false
     };
     let loginData = JSON.parse(window.localStorage.getItem('login_data'))
     if (loginData) {
@@ -62,10 +58,6 @@ export default new Vuex.Store({
     setChannelCreatorState(state, open) {
       state.channelCreatorIsOpen = open
     },
-    setSearchPopupState(state, open) {
-      state.searchPopupIsOpen = open
-      state.searchItems = []
-    },
     newEndpoints(state, endpoints) {
       state.micropubEndpoint = endpoints.micropubEndpoint
       state.microsubEndpoint = endpoints.microsubEndpoint
@@ -146,16 +138,6 @@ export default new Vuex.Store({
         let msg = JSON.parse(evt.data)
         state.channels = _.remove(state.channels, it => it.uid === msg.uid)
       })
-    },
-    newSearchResults(state, items) {
-      state.searchItems = items
-    },
-    openDebugPopup(state, item) {
-      state.debugItem = item
-      state.debugVisible = true
-    },
-    closeDebugPopup(state) {
-      state.debugVisible = false
     }
   },
 
@@ -254,23 +236,6 @@ export default new Vuex.Store({
     closeChannelCreator({commit}) {
       commit('setChannelCreatorState', false)
     },
-    openSearch({commit}) {
-      commit('setSearchPopupState', true)
-    },
-    closeSearch({commit}) {
-      commit('setSearchPopupState', false)
-    },
-    startQuery({commit}, query) {
-      fetch(this.state.microsubEndpoint + '?action=search&channel=global&query='+query, {
-        headers: {
-          'Authorization': 'Bearer ' + this.state.access_token
-        },
-        method: 'POST'
-      }).then(response => response.json())
-        .then(response => {
-          commit('newSearchResults', response.items)
-        })
-    },
     createChannel(x, name) {
       let url = this.state.microsubEndpoint + '?action=channels&name=' + encodeURIComponent(name)
       return fetch(url, {
@@ -304,12 +269,6 @@ export default new Vuex.Store({
     },
     startEventListening({commit}, url) {
       commit('createEventSource', url)
-    },
+    }
-    openDebug({commit}, item) {
-      return commit('openDebugPopup', item)
-    },
-    closeDebug({commit}) {
-      return commit('closeDebugPopup')
-    },
   }
 })

src/views/Home.vue

@@ -33,9 +33,6 @@
 
     <channel-creator :is-open="this.$store.state.channelCreatorIsOpen"></channel-creator>
     <feed-follower :is-open="feedFollowerIsOpen" @close="closeFeedFollower" :initial-channel="channel" :initial-query="feedFollowerQuery"></feed-follower>
-    <search-popup :is-open="searchPopupIsOpen"></search-popup>
-    <DebugModal :active="this.$store.state.debugVisible"
-                :item="this.$store.state.debugItem"></DebugModal>
   </div>
 </template>
 
@@ -47,8 +44,6 @@
   import FeedFollower from "../components/FeedFollower"
   import NewPost from "../components/NewPost"
   import ShortTimeline from "../components/ShortTimeline";
-  import SearchPopup from "../components/SearchPopup";
-  import DebugModal from "../components/DebugModal";
 
   export default {
     name: 'home',
@@ -59,9 +54,7 @@
       Channel,
       ChannelCreator,
       NewPost,
-      ShortTimeline,
+      ShortTimeline
-      SearchPopup,
-      DebugModal
     },
 
     data() {
@@ -85,9 +78,6 @@
           'channels-open': this.channelsVisible,
           'channels': true
         }
-      },
-      searchPopupIsOpen () {
-        return this.$store.state.searchPopupIsOpen
       }
     },