fix: issues

frontend/src/.gitignore

@@ -0,0 +1,3 @@
+
+*.js
+*.vue.js

frontend/src/components/ListItem.vue

@@ -27,14 +27,14 @@ export default defineComponent({
   name: "ListItem",
   props: {
     item: {
-      type: Object as PropType<PostItem>,
+      type: Object ,
       required: true,
     },
   },
   setup(props) {
     const processedContent = computed(() => {
       let content = props.item.Content.trim();
-      return nl2br(content);
+      return nl2br(content,false);
     });
 
     return {

frontend/src/main.ts

@@ -1,8 +1,25 @@
 import { createApp } from 'vue'
 import App from './App.vue'
-import router from './router'
 import './style.css'
 
+import { createRouter, createWebHistory } from 'vue-router'
+
+import ChannelMessages from './views/ChannelMessages.vue'
+import FavoritesMessages from './views/FavoritesMessages.vue'
+import Home from './views/Home.vue'
+
+const routes = [
+  { path: '/', component: Home, name: 'home' },
+  { path: '/favorites', component: FavoritesMessages, name: 'favorites' },
+  // { path: '/channels', component: Channel, name: 'channels' },
+  { path: '/channels/:channel/messages', component: ChannelMessages, name: 'channel-messages' },
+]
+
+const router = createRouter({
+  history: createWebHistory(),
+  routes,
+})
+
 createApp(App)
 .use(router)
 .mount('#app')

frontend/src/request.ts

@@ -1,38 +0,0 @@
-import axios from 'axios';
-
-axios.defaults.baseURL = '/api';
-axios.defaults.headers.post['Content-Type'] = 'application/json';
-axios.defaults.headers.put['Content-Type'] = 'application/json';
-
-export interface Pagination {
-    page: number;
-    limit: number;
-}
-
-export function channels() {
-    return axios.get('/channels')
-}
-
-export function channelInfo(id) {
-    return axios.get(`/channels/${id}`);
-}
-
-export function channelMessages(channelId, pagination: Pagination) {
-    return axios.get(`/channels/${channelId}/messages`, {
-        params: pagination,
-    });
-}
-
-export function favoriteMessages(pagination: Pagination) {
-    return axios.get('/favorites', {
-        params: pagination,
-    });
-}
-
-export function toggleFavoriteMessage(messageId) {
-    return axios.patch(`/channels/${messageId}/messages`);
-}
-
-export function deleteMessage(messageID) {
-    return axios.delete(`/messages/${messageID}`);
-}

frontend/src/router.ts

@@ -1,19 +0,0 @@
-import { createRouter, createWebHistory } from 'vue-router'
-
-import ChannelMessages from './views/ChannelMessages.vue'
-import FavoritesMessages from './views/FavoritesMessages.vue'
-import Home from './views/Home.vue'
-
-const routes = [
-  { path: '/', component: Home, name: 'home' },
-  { path: '/favorites', component: FavoritesMessages, name: 'favorites' },
-  // { path: '/channels', component: Channel, name: 'channels' },
-  { path: '/channels/:channel/messages', component: ChannelMessages, name: 'channel-messages' },
-]
-
-const router = createRouter({
-  history: createWebHistory(),
-  routes,
-})
-
-export default router

frontend/src/views/ChannelMessages.vue

@@ -6,8 +6,8 @@
 <script setup>
 import { useRoute } from "vue-router";
 import { onMounted, ref } from "vue";
-import { channelMessages, channelInfo } from "../request";
 import ListItem from "../components/ListItem.vue";
+import axios from "axios";
 
 const route = useRoute();
 
@@ -15,11 +15,11 @@ const channel = ref({});
 const items = ref([]);
 
 onMounted(() => {
-    channelInfo(route.params.channel).then((resp) => {
+    axios.get(`/channels/${route.params.channel}`).then((resp) => {
         channel.value = resp.data;
     });
 
-    channelMessages(route.params.channel).then((resp) => {
+    axios.get(`/channels/${route.params.channel}/messages`).then((resp) => {
         let data = resp.data;
         data.map((item) => {
             let media = item.Media.replace(/"asset_id":\s(\d+)/g, (match, p1, p2, p3, offset, string) => {

frontend/src/views/FavoritesMessages.vue

@@ -8,15 +8,15 @@
 <script setup>
 import { useRoute } from 'vue-router';
 import { onMounted, ref } from 'vue';
-import { favoriteMessages } from '../request';
 import ListItem from '../components/ListItem.vue';
+import axios from 'axios';
 
 const route = useRoute();
 
 const items = ref([])
 
 onMounted(() => {
-    favoriteMessages().then(resp => {
+    axios.get('/favorites').then(resp => {
         let data = resp.data
         data.map(item => {
             item.Media = JSON.parse(item.Media).filter(item => {

frontend/src/views/Home.vue

@@ -13,14 +13,14 @@
 </template>
 
 <script setup lang="ts">
-import { channels } from "../request";
 import { Channel } from "@/types";
 import { onMounted, ref } from "vue";
+import axios from "axios";
 
 const items = ref<Channel[]>([]);
 
 onMounted(() => {
-  channels().then((resp) => {
+  axios.get('/channels').then((resp) => {
     items.value = resp.data;
   });
 });

frontend/src/vite-env.d.ts

@@ -10,4 +10,4 @@ declare module '*.vue' {
 
 }
 
-declare module './types.ts';
+// Remove the relative module declaration