Retrieval components working, Guest vs Logged In working

app/Http/Controllers/PostController.php

@@ -3,7 +3,7 @@
 namespace App\Http\Controllers;
 
 use App\Post;
-use App\PostCollection;
+use App\Http\Resources\PostCollection;
 use Illuminate\Http\Request;
 
 class PostController extends Controller
@@ -29,6 +29,17 @@ class PostController extends Controller
         return view("edit_post")->withPost($post);
     }
 
+    /**
+     * Show the posts for a certain thread.
+     * 
+     * @param int $thread
+     */
+    public function show(int $thread_id) {
+        $posts = new PostCollection(Post::with("poster")->get()->where("thread_id", $thread_id));
+//dd($posts);
+        return $posts;
+    }
+
     /**
      * Store a newly created resource in storage.
      *

app/Http/Controllers/ThreadController.php

@@ -29,6 +29,15 @@ class ThreadController extends Controller
         return view("create_thread");
     }
 
+    /**
+     * Show thread view.
+     * 
+     * @param int $thread
+     */
+    public function view_thread(int $thread_id) {
+        return view("thread")->with("thread_id", $thread_id);
+    }
+
     /**
      * Show the form for editing the specified resource.
      *
@@ -65,8 +74,9 @@ class ThreadController extends Controller
      */
     public function show(int $id)
     {
-        $selected_thread = new ThreadsCollection(Thread::with("posts")->get()->where("id", $id));
+        $selected_thread = new ThreadsCollection(Thread::with("creator")->get()->where("id", $id));
-        return $selected_thread;
+//dd(Thread::with("posts")->get()->where("id", $id));
+        return Thread::with("creator")->find($id);//$selected_thread;
     }
 
     /**

app/Http/Resources/PostCollection.php

@@ -15,7 +15,7 @@ class PostCollection extends ResourceCollection
     public function toArray($request)
     {
         return [
-            'data' => $this->$collection
+            'data' => $this->collection
         ];
     }
 }

public/js/app.js

@@ -1809,10 +1809,10 @@ __webpack_require__.r(__webpack_exports__);
 
 /***/ }),
 
-/***/ "./node_modules/babel-loader/lib/index.js?!./node_modules/vue-loader/lib/index.js?!./resources/js/components/TagSelectComponent.vue?vue&type=script&lang=js&":
+/***/ "./node_modules/babel-loader/lib/index.js?!./node_modules/vue-loader/lib/index.js?!./resources/js/components/ThreadComponent.vue?vue&type=script&lang=js&":
-/*!*****************************************************************************************************************************************************************************!*\
+/*!**************************************************************************************************************************************************************************!*\
-  !*** ./node_modules/babel-loader/lib??ref--4-0!./node_modules/vue-loader/lib??vue-loader-options!./resources/js/components/TagSelectComponent.vue?vue&type=script&lang=js& ***!
+  !*** ./node_modules/babel-loader/lib??ref--4-0!./node_modules/vue-loader/lib??vue-loader-options!./resources/js/components/ThreadComponent.vue?vue&type=script&lang=js& ***!
-  \*****************************************************************************************************************************************************************************/
+  \**************************************************************************************************************************************************************************/
 /*! exports provided: default */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
@@ -1826,27 +1826,34 @@ __webpack_require__.r(__webpack_exports__);
 //
 //
 //
+//
+//
 /* harmony default export */ __webpack_exports__["default"] = ({
   data: function data() {
     return {
-      tags: [],
+      threads: [],
-      tag: {
+      thread: {
         id: '',
-        tag_text: ''
+        thread_title: '',
+        creator: {
+          name: ''
         }
+      },
+      thread_id: '',
+      edit: false
     };
   },
   created: function created() {
-    this.fetchTags();
+    this.fetchThreads();
   },
   methods: {
-    fetchTags: function fetchTags() {
+    fetchThreads: function fetchThreads() {
       var _this = this;
 
-      fetch("api/tags").then(function (res) {
+      fetch("api/threads").then(function (res) {
         return res.json();
       }).then(function (res) {
-        _this.tags = res.data;
+        _this.threads = res.data;
       });
     }
   }
@@ -1854,10 +1861,10 @@ __webpack_require__.r(__webpack_exports__);
 
 /***/ }),
 
-/***/ "./node_modules/babel-loader/lib/index.js?!./node_modules/vue-loader/lib/index.js?!./resources/js/components/ThreadComponent.vue?vue&type=script&lang=js&":
+/***/ "./node_modules/babel-loader/lib/index.js?!./node_modules/vue-loader/lib/index.js?!./resources/js/components/ThreadViewComponent.vue?vue&type=script&lang=js&":
-/*!**************************************************************************************************************************************************************************!*\
+/*!******************************************************************************************************************************************************************************!*\
-  !*** ./node_modules/babel-loader/lib??ref--4-0!./node_modules/vue-loader/lib??vue-loader-options!./resources/js/components/ThreadComponent.vue?vue&type=script&lang=js& ***!
+  !*** ./node_modules/babel-loader/lib??ref--4-0!./node_modules/vue-loader/lib??vue-loader-options!./resources/js/components/ThreadViewComponent.vue?vue&type=script&lang=js& ***!
-  \**************************************************************************************************************************************************************************/
+  \******************************************************************************************************************************************************************************/
 /*! exports provided: default */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
@@ -1873,33 +1880,50 @@ __webpack_require__.r(__webpack_exports__);
 //
 //
 //
+//
 /* harmony default export */ __webpack_exports__["default"] = ({
+  props: ['thread_id'],
   data: function data() {
     return {
-      threads: [],
-      thread: {
       id: '',
       thread_title: '',
       creator: {
         name: ''
-        }
       },
-      thread_id: '',
+      posts: [],
-      edit: false
+      post: {
+        id: '',
+        content: '',
+        poster: {
+          name: ''
+        }
+      }
     };
   },
   created: function created() {
-    this.fetchThreads();
+    this.fetchThread();
   },
   methods: {
-    fetchThreads: function fetchThreads() {
+    fetchThread: function fetchThread() {
       var _this = this;
 
-      fetch("api/threads").then(function (res) {
+      fetch("../api/thread/" + this.thread_id).then(function (res) {
         return res.json();
       }).then(function (res) {
-        _this.threads = res.data;
+        _this.id = res.id;
+        _this.thread_title = res.thread_title;
+        _this.creator = res.creator;
+      }).catch(function (err) {
+        return console.log(err);
+      });
+      fetch("../api/post/thread/" + this.thread_id).then(function (res) {
+        return res.json();
+      }).then(function (res) {
+        _this.posts = res.data;
+      }).catch(function (err) {
+        return console.log(err);
       });
+      ;
     }
   }
 });
@@ -37004,10 +37028,10 @@ render._withStripped = true
 
 /***/ }),
 
-/***/ "./node_modules/vue-loader/lib/loaders/templateLoader.js?!./node_modules/vue-loader/lib/index.js?!./resources/js/components/TagSelectComponent.vue?vue&type=template&id=6b77d292&":
+/***/ "./node_modules/vue-loader/lib/loaders/templateLoader.js?!./node_modules/vue-loader/lib/index.js?!./resources/js/components/ThreadComponent.vue?vue&type=template&id=fb8db610&":
-/*!*********************************************************************************************************************************************************************************************************************!*\
+/*!******************************************************************************************************************************************************************************************************************!*\
-  !*** ./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib??vue-loader-options!./resources/js/components/TagSelectComponent.vue?vue&type=template&id=6b77d292& ***!
+  !*** ./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib??vue-loader-options!./resources/js/components/ThreadComponent.vue?vue&type=template&id=fb8db610& ***!
-  \*********************************************************************************************************************************************************************************************************************/
+  \******************************************************************************************************************************************************************************************************************/
 /*! exports provided: render, staticRenderFns */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
@@ -37021,12 +37045,20 @@ var render = function() {
   var _c = _vm._self._c || _h
   return _c(
     "div",
-    _vm._l(_vm.tags, function(tag) {
+    [
-      return _c("div", { key: tag.id, staticClass: "card card-body" }, [
+      _c("h2", [_vm._v("Browse Threads")]),
-        _c("p", [_vm._v(_vm._s(tag.tag_text))])
+      _vm._v(" "),
+      _vm._l(_vm.threads, function(thread) {
+        return _c("div", { key: thread.id, staticClass: "card card-body" }, [
+          _c("p", [_vm._v(_vm._s(thread.creator.name))]),
+          _vm._v(" "),
+          _c("a", { attrs: { href: "./test/" + thread.id } }, [
+            _c("h3", [_vm._v(_vm._s(thread.thread_title))])
           ])
-    }),
+        ])
-    0
+      })
+    ],
+    2
   )
 }
 var staticRenderFns = []
@@ -37036,10 +37068,10 @@ render._withStripped = true
 
 /***/ }),
 
-/***/ "./node_modules/vue-loader/lib/loaders/templateLoader.js?!./node_modules/vue-loader/lib/index.js?!./resources/js/components/ThreadComponent.vue?vue&type=template&id=fb8db610&":
+/***/ "./node_modules/vue-loader/lib/loaders/templateLoader.js?!./node_modules/vue-loader/lib/index.js?!./resources/js/components/ThreadViewComponent.vue?vue&type=template&id=14c8b65a&":
-/*!******************************************************************************************************************************************************************************************************************!*\
+/*!**********************************************************************************************************************************************************************************************************************!*\
-  !*** ./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib??vue-loader-options!./resources/js/components/ThreadComponent.vue?vue&type=template&id=fb8db610& ***!
+  !*** ./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib??vue-loader-options!./resources/js/components/ThreadViewComponent.vue?vue&type=template&id=14c8b65a& ***!
-  \******************************************************************************************************************************************************************************************************************/
+  \**********************************************************************************************************************************************************************************************************************/
 /*! exports provided: render, staticRenderFns */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
@@ -37054,15 +37086,15 @@ var render = function() {
   return _c(
     "div",
     [
-      _c("h2", [_vm._v("Browse Threads")]),
+      _c("h2", [_vm._v(_vm._s(_vm.thread_title))]),
       _vm._v(" "),
-      _vm._l(_vm.threads, function(thread) {
+      _c("h3", [_vm._v("By " + _vm._s(_vm.creator.name))]),
-        return _c("div", { key: thread.id, staticClass: "card card-body" }, [
-          _c("p", [_vm._v(_vm._s(thread.creator.name))]),
       _vm._v(" "),
-          _c("a", { attrs: { href: "./test/" + thread.id } }, [
+      _vm._l(_vm.posts, function(post) {
-            _c("h3", [_vm._v(_vm._s(thread.thread_title))])
+        return _c("div", { key: post.id, staticClass: "card card-body" }, [
-          ])
+          _c("p", [_vm._v(_vm._s(post.poster.name))]),
+          _vm._v(" "),
+          _c("p", [_vm._v(_vm._s(post.content))])
         ])
       })
     ],
@@ -49238,8 +49270,9 @@ window.Vue = __webpack_require__(/*! vue */ "./node_modules/vue/dist/vue.common.
 // files.keys().map(key => Vue.component(key.split('/').pop().split('.')[0], files(key).default));
 
 Vue.component('thread-component', __webpack_require__(/*! ./components/ThreadComponent.vue */ "./resources/js/components/ThreadComponent.vue").default);
-Vue.component('tag_selector', __webpack_require__(/*! ./components/TagSelectComponent.vue */ "./resources/js/components/TagSelectComponent.vue").default);
+Vue.component('thread-view', __webpack_require__(/*! ./components/ThreadViewComponent.vue */ "./resources/js/components/ThreadViewComponent.vue").default);
-Vue.component('thread-create-form', __webpack_require__(/*! ./components/CreateThreadComponent.vue */ "./resources/js/components/CreateThreadComponent.vue").default);
+Vue.component('thread-create', __webpack_require__(/*! ./components/CreateThreadComponent.vue */ "./resources/js/components/CreateThreadComponent.vue").default); //Vue.component('tag_selector', require('./components/TagSelectComponent.vue').default);
+
 /**
  * Next, we will create a fresh Vue application instance and attach it to
  * the page. Then, you may begin adding components to this application
@@ -49379,17 +49412,17 @@ __webpack_require__.r(__webpack_exports__);
 
 /***/ }),
 
-/***/ "./resources/js/components/TagSelectComponent.vue":
+/***/ "./resources/js/components/ThreadComponent.vue":
-/*!********************************************************!*\
+/*!*****************************************************!*\
-  !*** ./resources/js/components/TagSelectComponent.vue ***!
+  !*** ./resources/js/components/ThreadComponent.vue ***!
-  \********************************************************/
+  \*****************************************************/
 /*! exports provided: default */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
 __webpack_require__.r(__webpack_exports__);
-/* harmony import */ var _TagSelectComponent_vue_vue_type_template_id_6b77d292___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./TagSelectComponent.vue?vue&type=template&id=6b77d292& */ "./resources/js/components/TagSelectComponent.vue?vue&type=template&id=6b77d292&");
+/* harmony import */ var _ThreadComponent_vue_vue_type_template_id_fb8db610___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./ThreadComponent.vue?vue&type=template&id=fb8db610& */ "./resources/js/components/ThreadComponent.vue?vue&type=template&id=fb8db610&");
-/* harmony import */ var _TagSelectComponent_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./TagSelectComponent.vue?vue&type=script&lang=js& */ "./resources/js/components/TagSelectComponent.vue?vue&type=script&lang=js&");
+/* harmony import */ var _ThreadComponent_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./ThreadComponent.vue?vue&type=script&lang=js& */ "./resources/js/components/ThreadComponent.vue?vue&type=script&lang=js&");
 /* empty/unused harmony star reexport *//* harmony import */ var _node_modules_vue_loader_lib_runtime_componentNormalizer_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js */ "./node_modules/vue-loader/lib/runtime/componentNormalizer.js");
 
 
@@ -49399,9 +49432,9 @@ __webpack_require__.r(__webpack_exports__);
 /* normalize component */
 
 var component = Object(_node_modules_vue_loader_lib_runtime_componentNormalizer_js__WEBPACK_IMPORTED_MODULE_2__["default"])(
-  _TagSelectComponent_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_1__["default"],
+  _ThreadComponent_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_1__["default"],
-  _TagSelectComponent_vue_vue_type_template_id_6b77d292___WEBPACK_IMPORTED_MODULE_0__["render"],
+  _ThreadComponent_vue_vue_type_template_id_fb8db610___WEBPACK_IMPORTED_MODULE_0__["render"],
-  _TagSelectComponent_vue_vue_type_template_id_6b77d292___WEBPACK_IMPORTED_MODULE_0__["staticRenderFns"],
+  _ThreadComponent_vue_vue_type_template_id_fb8db610___WEBPACK_IMPORTED_MODULE_0__["staticRenderFns"],
   false,
   null,
   null,
@@ -49411,54 +49444,54 @@ var component = Object(_node_modules_vue_loader_lib_runtime_componentNormalizer_
 
 /* hot reload */
 if (false) { var api; }
-component.options.__file = "resources/js/components/TagSelectComponent.vue"
+component.options.__file = "resources/js/components/ThreadComponent.vue"
 /* harmony default export */ __webpack_exports__["default"] = (component.exports);
 
 /***/ }),
 
-/***/ "./resources/js/components/TagSelectComponent.vue?vue&type=script&lang=js&":
+/***/ "./resources/js/components/ThreadComponent.vue?vue&type=script&lang=js&":
-/*!*********************************************************************************!*\
+/*!******************************************************************************!*\
-  !*** ./resources/js/components/TagSelectComponent.vue?vue&type=script&lang=js& ***!
+  !*** ./resources/js/components/ThreadComponent.vue?vue&type=script&lang=js& ***!
-  \*********************************************************************************/
+  \******************************************************************************/
 /*! exports provided: default */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
 __webpack_require__.r(__webpack_exports__);
-/* harmony import */ var _node_modules_babel_loader_lib_index_js_ref_4_0_node_modules_vue_loader_lib_index_js_vue_loader_options_TagSelectComponent_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! -!../../../node_modules/babel-loader/lib??ref--4-0!../../../node_modules/vue-loader/lib??vue-loader-options!./TagSelectComponent.vue?vue&type=script&lang=js& */ "./node_modules/babel-loader/lib/index.js?!./node_modules/vue-loader/lib/index.js?!./resources/js/components/TagSelectComponent.vue?vue&type=script&lang=js&");
+/* harmony import */ var _node_modules_babel_loader_lib_index_js_ref_4_0_node_modules_vue_loader_lib_index_js_vue_loader_options_ThreadComponent_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! -!../../../node_modules/babel-loader/lib??ref--4-0!../../../node_modules/vue-loader/lib??vue-loader-options!./ThreadComponent.vue?vue&type=script&lang=js& */ "./node_modules/babel-loader/lib/index.js?!./node_modules/vue-loader/lib/index.js?!./resources/js/components/ThreadComponent.vue?vue&type=script&lang=js&");
-/* empty/unused harmony star reexport */ /* harmony default export */ __webpack_exports__["default"] = (_node_modules_babel_loader_lib_index_js_ref_4_0_node_modules_vue_loader_lib_index_js_vue_loader_options_TagSelectComponent_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__["default"]); 
+/* empty/unused harmony star reexport */ /* harmony default export */ __webpack_exports__["default"] = (_node_modules_babel_loader_lib_index_js_ref_4_0_node_modules_vue_loader_lib_index_js_vue_loader_options_ThreadComponent_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__["default"]); 
 
 /***/ }),
 
-/***/ "./resources/js/components/TagSelectComponent.vue?vue&type=template&id=6b77d292&":
+/***/ "./resources/js/components/ThreadComponent.vue?vue&type=template&id=fb8db610&":
-/*!***************************************************************************************!*\
+/*!************************************************************************************!*\
-  !*** ./resources/js/components/TagSelectComponent.vue?vue&type=template&id=6b77d292& ***!
+  !*** ./resources/js/components/ThreadComponent.vue?vue&type=template&id=fb8db610& ***!
-  \***************************************************************************************/
+  \************************************************************************************/
 /*! exports provided: render, staticRenderFns */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
 __webpack_require__.r(__webpack_exports__);
-/* harmony import */ var _node_modules_vue_loader_lib_loaders_templateLoader_js_vue_loader_options_node_modules_vue_loader_lib_index_js_vue_loader_options_TagSelectComponent_vue_vue_type_template_id_6b77d292___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! -!../../../node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!../../../node_modules/vue-loader/lib??vue-loader-options!./TagSelectComponent.vue?vue&type=template&id=6b77d292& */ "./node_modules/vue-loader/lib/loaders/templateLoader.js?!./node_modules/vue-loader/lib/index.js?!./resources/js/components/TagSelectComponent.vue?vue&type=template&id=6b77d292&");
+/* harmony import */ var _node_modules_vue_loader_lib_loaders_templateLoader_js_vue_loader_options_node_modules_vue_loader_lib_index_js_vue_loader_options_ThreadComponent_vue_vue_type_template_id_fb8db610___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! -!../../../node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!../../../node_modules/vue-loader/lib??vue-loader-options!./ThreadComponent.vue?vue&type=template&id=fb8db610& */ "./node_modules/vue-loader/lib/loaders/templateLoader.js?!./node_modules/vue-loader/lib/index.js?!./resources/js/components/ThreadComponent.vue?vue&type=template&id=fb8db610&");
-/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "render", function() { return _node_modules_vue_loader_lib_loaders_templateLoader_js_vue_loader_options_node_modules_vue_loader_lib_index_js_vue_loader_options_TagSelectComponent_vue_vue_type_template_id_6b77d292___WEBPACK_IMPORTED_MODULE_0__["render"]; });
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "render", function() { return _node_modules_vue_loader_lib_loaders_templateLoader_js_vue_loader_options_node_modules_vue_loader_lib_index_js_vue_loader_options_ThreadComponent_vue_vue_type_template_id_fb8db610___WEBPACK_IMPORTED_MODULE_0__["render"]; });
 
-/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "staticRenderFns", function() { return _node_modules_vue_loader_lib_loaders_templateLoader_js_vue_loader_options_node_modules_vue_loader_lib_index_js_vue_loader_options_TagSelectComponent_vue_vue_type_template_id_6b77d292___WEBPACK_IMPORTED_MODULE_0__["staticRenderFns"]; });
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "staticRenderFns", function() { return _node_modules_vue_loader_lib_loaders_templateLoader_js_vue_loader_options_node_modules_vue_loader_lib_index_js_vue_loader_options_ThreadComponent_vue_vue_type_template_id_fb8db610___WEBPACK_IMPORTED_MODULE_0__["staticRenderFns"]; });
 
 
 
 /***/ }),
 
-/***/ "./resources/js/components/ThreadComponent.vue":
+/***/ "./resources/js/components/ThreadViewComponent.vue":
-/*!*****************************************************!*\
+/*!*********************************************************!*\
-  !*** ./resources/js/components/ThreadComponent.vue ***!
+  !*** ./resources/js/components/ThreadViewComponent.vue ***!
-  \*****************************************************/
+  \*********************************************************/
 /*! exports provided: default */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
 __webpack_require__.r(__webpack_exports__);
-/* harmony import */ var _ThreadComponent_vue_vue_type_template_id_fb8db610___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./ThreadComponent.vue?vue&type=template&id=fb8db610& */ "./resources/js/components/ThreadComponent.vue?vue&type=template&id=fb8db610&");
+/* harmony import */ var _ThreadViewComponent_vue_vue_type_template_id_14c8b65a___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./ThreadViewComponent.vue?vue&type=template&id=14c8b65a& */ "./resources/js/components/ThreadViewComponent.vue?vue&type=template&id=14c8b65a&");
-/* harmony import */ var _ThreadComponent_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./ThreadComponent.vue?vue&type=script&lang=js& */ "./resources/js/components/ThreadComponent.vue?vue&type=script&lang=js&");
+/* harmony import */ var _ThreadViewComponent_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./ThreadViewComponent.vue?vue&type=script&lang=js& */ "./resources/js/components/ThreadViewComponent.vue?vue&type=script&lang=js&");
 /* empty/unused harmony star reexport *//* harmony import */ var _node_modules_vue_loader_lib_runtime_componentNormalizer_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js */ "./node_modules/vue-loader/lib/runtime/componentNormalizer.js");
 
 
@@ -49468,9 +49501,9 @@ __webpack_require__.r(__webpack_exports__);
 /* normalize component */
 
 var component = Object(_node_modules_vue_loader_lib_runtime_componentNormalizer_js__WEBPACK_IMPORTED_MODULE_2__["default"])(
-  _ThreadComponent_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_1__["default"],
+  _ThreadViewComponent_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_1__["default"],
-  _ThreadComponent_vue_vue_type_template_id_fb8db610___WEBPACK_IMPORTED_MODULE_0__["render"],
+  _ThreadViewComponent_vue_vue_type_template_id_14c8b65a___WEBPACK_IMPORTED_MODULE_0__["render"],
-  _ThreadComponent_vue_vue_type_template_id_fb8db610___WEBPACK_IMPORTED_MODULE_0__["staticRenderFns"],
+  _ThreadViewComponent_vue_vue_type_template_id_14c8b65a___WEBPACK_IMPORTED_MODULE_0__["staticRenderFns"],
   false,
   null,
   null,
@@ -49480,38 +49513,38 @@ var component = Object(_node_modules_vue_loader_lib_runtime_componentNormalizer_
 
 /* hot reload */
 if (false) { var api; }
-component.options.__file = "resources/js/components/ThreadComponent.vue"
+component.options.__file = "resources/js/components/ThreadViewComponent.vue"
 /* harmony default export */ __webpack_exports__["default"] = (component.exports);
 
 /***/ }),
 
-/***/ "./resources/js/components/ThreadComponent.vue?vue&type=script&lang=js&":
+/***/ "./resources/js/components/ThreadViewComponent.vue?vue&type=script&lang=js&":
-/*!******************************************************************************!*\
+/*!**********************************************************************************!*\
-  !*** ./resources/js/components/ThreadComponent.vue?vue&type=script&lang=js& ***!
+  !*** ./resources/js/components/ThreadViewComponent.vue?vue&type=script&lang=js& ***!
-  \******************************************************************************/
+  \**********************************************************************************/
 /*! exports provided: default */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
 __webpack_require__.r(__webpack_exports__);
-/* harmony import */ var _node_modules_babel_loader_lib_index_js_ref_4_0_node_modules_vue_loader_lib_index_js_vue_loader_options_ThreadComponent_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! -!../../../node_modules/babel-loader/lib??ref--4-0!../../../node_modules/vue-loader/lib??vue-loader-options!./ThreadComponent.vue?vue&type=script&lang=js& */ "./node_modules/babel-loader/lib/index.js?!./node_modules/vue-loader/lib/index.js?!./resources/js/components/ThreadComponent.vue?vue&type=script&lang=js&");
+/* harmony import */ var _node_modules_babel_loader_lib_index_js_ref_4_0_node_modules_vue_loader_lib_index_js_vue_loader_options_ThreadViewComponent_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! -!../../../node_modules/babel-loader/lib??ref--4-0!../../../node_modules/vue-loader/lib??vue-loader-options!./ThreadViewComponent.vue?vue&type=script&lang=js& */ "./node_modules/babel-loader/lib/index.js?!./node_modules/vue-loader/lib/index.js?!./resources/js/components/ThreadViewComponent.vue?vue&type=script&lang=js&");
-/* empty/unused harmony star reexport */ /* harmony default export */ __webpack_exports__["default"] = (_node_modules_babel_loader_lib_index_js_ref_4_0_node_modules_vue_loader_lib_index_js_vue_loader_options_ThreadComponent_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__["default"]); 
+/* empty/unused harmony star reexport */ /* harmony default export */ __webpack_exports__["default"] = (_node_modules_babel_loader_lib_index_js_ref_4_0_node_modules_vue_loader_lib_index_js_vue_loader_options_ThreadViewComponent_vue_vue_type_script_lang_js___WEBPACK_IMPORTED_MODULE_0__["default"]); 
 
 /***/ }),
 
-/***/ "./resources/js/components/ThreadComponent.vue?vue&type=template&id=fb8db610&":
+/***/ "./resources/js/components/ThreadViewComponent.vue?vue&type=template&id=14c8b65a&":
-/*!************************************************************************************!*\
+/*!****************************************************************************************!*\
-  !*** ./resources/js/components/ThreadComponent.vue?vue&type=template&id=fb8db610& ***!
+  !*** ./resources/js/components/ThreadViewComponent.vue?vue&type=template&id=14c8b65a& ***!
-  \************************************************************************************/
+  \****************************************************************************************/
 /*! exports provided: render, staticRenderFns */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
 __webpack_require__.r(__webpack_exports__);
-/* harmony import */ var _node_modules_vue_loader_lib_loaders_templateLoader_js_vue_loader_options_node_modules_vue_loader_lib_index_js_vue_loader_options_ThreadComponent_vue_vue_type_template_id_fb8db610___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! -!../../../node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!../../../node_modules/vue-loader/lib??vue-loader-options!./ThreadComponent.vue?vue&type=template&id=fb8db610& */ "./node_modules/vue-loader/lib/loaders/templateLoader.js?!./node_modules/vue-loader/lib/index.js?!./resources/js/components/ThreadComponent.vue?vue&type=template&id=fb8db610&");
+/* harmony import */ var _node_modules_vue_loader_lib_loaders_templateLoader_js_vue_loader_options_node_modules_vue_loader_lib_index_js_vue_loader_options_ThreadViewComponent_vue_vue_type_template_id_14c8b65a___WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! -!../../../node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!../../../node_modules/vue-loader/lib??vue-loader-options!./ThreadViewComponent.vue?vue&type=template&id=14c8b65a& */ "./node_modules/vue-loader/lib/loaders/templateLoader.js?!./node_modules/vue-loader/lib/index.js?!./resources/js/components/ThreadViewComponent.vue?vue&type=template&id=14c8b65a&");
-/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "render", function() { return _node_modules_vue_loader_lib_loaders_templateLoader_js_vue_loader_options_node_modules_vue_loader_lib_index_js_vue_loader_options_ThreadComponent_vue_vue_type_template_id_fb8db610___WEBPACK_IMPORTED_MODULE_0__["render"]; });
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "render", function() { return _node_modules_vue_loader_lib_loaders_templateLoader_js_vue_loader_options_node_modules_vue_loader_lib_index_js_vue_loader_options_ThreadViewComponent_vue_vue_type_template_id_14c8b65a___WEBPACK_IMPORTED_MODULE_0__["render"]; });
 
-/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "staticRenderFns", function() { return _node_modules_vue_loader_lib_loaders_templateLoader_js_vue_loader_options_node_modules_vue_loader_lib_index_js_vue_loader_options_ThreadComponent_vue_vue_type_template_id_fb8db610___WEBPACK_IMPORTED_MODULE_0__["staticRenderFns"]; });
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "staticRenderFns", function() { return _node_modules_vue_loader_lib_loaders_templateLoader_js_vue_loader_options_node_modules_vue_loader_lib_index_js_vue_loader_options_ThreadViewComponent_vue_vue_type_template_id_14c8b65a___WEBPACK_IMPORTED_MODULE_0__["staticRenderFns"]; });
 
 
 

resources/js/app.js

@@ -21,8 +21,9 @@ window.Vue = require('vue');
 // files.keys().map(key => Vue.component(key.split('/').pop().split('.')[0], files(key).default));
 
 Vue.component('thread-component', require('./components/ThreadComponent.vue').default);
-Vue.component('tag_selector', require('./components/TagSelectComponent.vue').default);
+Vue.component('thread-view', require('./components/ThreadViewComponent.vue').default);
-Vue.component('thread-create-form', require('./components/CreateThreadComponent.vue').default);
+Vue.component('thread-create', require('./components/CreateThreadComponent.vue').default);
+//Vue.component('tag_selector', require('./components/TagSelectComponent.vue').default);
 
 /**
  * Next, we will create a fresh Vue application instance and attach it to

resources/js/components/ThreadViewComponent.vue

@@ -0,0 +1,58 @@
+<template>
+<div>
+    <h2>{{ thread_title }}</h2>
+    <h3>By {{ creator.name }}</h3>
+    <div class="card card-body" v-for="post in posts" v-bind:key="post.id">
+        <p>{{ post.poster.name }}</p>
+        <p>{{ post.content }}</p>
+    </div>
+</div>
+</template>
+
+<script>
+export default {
+    props: ['thread_id'],
+
+    data() {
+        return {
+            id: '',
+            thread_title: '',
+            creator: {
+                name: ''
+            },
+            posts: [],
+            post: {
+                id: '',
+                content: '',
+                poster: {
+                    name: ''
+                }
+            }
+        }
+    },
+
+    created() {
+        this.fetchThread();
+    },
+
+    methods: {
+        fetchThread() {
+            fetch("../api/thread/" + this.thread_id)
+            .then(res => res.json())
+            .then(res => {
+                this.id = res.id;
+                this.thread_title = res.thread_title;
+                this.creator = res.creator;
+            })
+            .catch(err => console.log(err));
+
+            fetch("../api/post/thread/" + this.thread_id)
+            .then(res => res.json())
+            .then(res => {
+                this.posts = res.data;
+            })
+            .catch(err => console.log(err));;
+        }
+    }
+}
+</script>

resources/views/create_thread.blade.php

@@ -0,0 +1,9 @@
+@extends('layouts.app')
+
+@section('content') 
+<div class="app">
+    <div class="container">
+        <create-thread-form user_id="<?php  ?>">
+    </div>
+</div>
+@endsection

resources/views/home.blade.php

@@ -14,7 +14,7 @@
                         </div>
                     @endif
 
-                    You are logged in!
+                    <button onclick="event.preventDefault();document.getElementById('logout-form').submit();" class="btn btn-primary">Logout</button>
                 </div>
             </div>
         </div>

resources/views/layouts/app.blade.php

@@ -39,6 +39,9 @@
                     <!-- Right Side Of Navbar -->
                     <ul class="navbar-nav ml-auto">
                         <!-- Authentication Links -->
+                        <li class="nav-item">
+                            <a class="nav-link" href="{{ route('threads') }}">{{ __('Threads') }}</a>
+                        </li>
                         @guest
                             <li class="nav-item">
                                 <a class="nav-link" href="{{ route('login') }}">{{ __('Login') }}</a>
@@ -55,12 +58,14 @@
                                 </a>
 
                                 <div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdown">
+                                    <a class="dropdown-item" href="{{ route('home') }}">
+                                        {{ __('Dashboard') }}
+                                    </a>
                                     <a class="dropdown-item" href="{{ route('logout') }}"
                                        onclick="event.preventDefault();
                                                      document.getElementById('logout-form').submit();">
                                         {{ __('Logout') }}
                                     </a>
-
                                     <form id="logout-form" action="{{ route('logout') }}" method="POST" style="display: none;">
                                         @csrf
                                     </form>

resources/views/thread.blade.php

@@ -0,0 +1,9 @@
+@extends('layouts.app')
+
+@section('content') 
+<div class="app">
+    <div class="container">
+        <thread-view thread_id="<?php echo $thread_id; ?>">
+    </div>
+</div>
+@endsection

routes/api.php

@@ -35,6 +35,8 @@ Route::post($thread_prefix  . '/destroy/{thread}', 'ThreadController@destroy');
  * Post routes
  */
 $post_prefix = "post";
+//Gets
+Route::get($post_prefix . '/thread/{thread_id}', 'PostController@show');
 
 //Posts
 Route::post($post_prefix . '/update/{post}', 'PostController@update');

routes/web.php

@@ -12,17 +12,15 @@
 */
 
 Route::get('/', function () {
-    return view('welcome');
+    return redirect('/home');
 });
 
 Auth::routes();
 
 Route::get('/home', 'HomeController@index')->name('home');
 
-Route::get('/test', function() {
+Route::get('/threads', function() {
-    return view("dashboard");
+    return view("threads");
-});
+})->name('threads');
 
-Route::get('/test/{id}', function() {
+Route::get('/test/{thread_id}', "ThreadController@view_thread");
-    return view("thread");
-});