Add new feed url

src/reader/add.rs

@@ -6,12 +6,28 @@ use crate::{
     models::feed::new_feed::NewFeed, schema::feed,
 };
 
+use super::feeds;
+
 pub async fn add(new_feed: web::Json<NewFeedSchema>) -> HttpResponse {
     let mut connection = establish_connection();
     let title: String = new_feed.title.clone();
     let url: String = new_feed.url.clone();
     let user_id: i32 = new_feed.user_id;
 
+    let result = feeds::get_feed(&url).await;
+    match result {
+        Ok(channel) => {
+            log::info!("valid channel");
+            if channel.items.is_empty() {
+                return HttpResponse::ServiceUnavailable().await.unwrap();
+            }
+        }
+        Err(e) => {
+            log::error!("{:?}", e);
+            return HttpResponse::NotFound().await.unwrap();
+        }
+    }
+
     let new_feed = NewFeed::new(title, url, user_id);
 
     let insert_result = diesel::insert_into(feed::table)

src/reader/sync.rs

@@ -19,7 +19,8 @@ use scraper::{Html, Selector};
 
 fn create_feed_item(item: Item, feed: &Feed, connection: &mut PgConnection) {
     let item_title = item.title.clone().unwrap();
-    let frag = Html::parse_fragment(&item.content.clone().unwrap());
+    log::info!("Create feed item: {}", item_title);
+    let frag = Html::parse_fragment(&item.content.clone().unwrap_or_default());
     let mut content = "".to_string();
     let frag_clone = frag.clone();
     frag.tree.into_iter().for_each(|node| {
@@ -41,13 +42,19 @@ fn create_feed_item(item: Item, feed: &Feed, connection: &mut PgConnection) {
         .filter(title.eq(&item_title))
         .load(connection)
         .unwrap();
-    // todo;
+
     if existing_item.is_empty() {
         log::info!("{:?}", item.pub_date());
         let mut time: NaiveDateTime = Local::now().naive_local();
         if item.pub_date().is_some() {
             let format_string = "%a, %d %b %Y %H:%M:%S %z";
-            time = NaiveDateTime::parse_from_str(item.pub_date().unwrap(), format_string).unwrap();
+            time = match NaiveDateTime::parse_from_str(item.pub_date().unwrap(), format_string) {
+                Ok(date) => date,
+                Err(err) => {
+                    log::error!("could not unwrap pub date: {}", err);
+                    time
+                }
+            };
         }
         let new_feed_item = NewFeedItem::new(
             feed.id,

vue/src/components/RssFeeds.vue

@@ -2,11 +2,13 @@
 import { ref, unref, onMounted, nextTick } from 'vue';
 import axios from 'axios';
 import { Readability } from '@mozilla/readability';
+import Modal from './modal/AddUrl.vue';
 
 const showMessage = ref(false)
 const feeds = ref([]);
 const message = ref('')
-const buttonText = 'Sync'
+const showModal = ref(false)
+
 async function getReadable(feed, index) {
   try {
     const response = await axios.post("feeds/read", {
@@ -65,7 +67,9 @@ const fetchData = async () => {
         'user-token': localStorage.getItem("user-token")
       }
     });
-    feeds.value = response.data.feeds[0].items;
+    response.data.feeds.forEach(feed => {
+      feeds.value.push(...feed.items);
+    });
     await nextTick();
     setupIntersectionObserver();
   } catch (error) {
@@ -153,18 +157,28 @@ onMounted(() => {
     <div class="wrapper">
       <nav>
         <p @click="sync">Sync</p>
+        <!-- <p @click="updateShow(true)">Add RSS</p> -->
+        <p @click="showModal = true">Add RSS</p>
         <!-- <RouterLink to="/">Home</RouterLink> -->
         <!-- <RouterLink to="/about">About</RouterLink> -->
         <!-- <RouterLink to="/feeds">Feeds</RouterLink> -->
       </nav>
     </div>
   </header>
+  <Teleport to="body">
+    <!-- use the modal component, pass in the prop -->
+    <modal :show="showModal" @close="showModal = false">
+      <template #header>
+        <h3>Add RSS Feed</h3>
+      </template>
+    </modal>
+  </Teleport>
   <div>
     <h1>Feeds</h1> <!-- <button @click="sync">{{ buttonText }}</button> -->
     <div v-if="showMessage" class="message">{{ message }}</div>
     <div id='article' class='article'>
       <p v-if="feeds.length == 0">No unread articles.</p>
-      <template v-for="(feed, index) in feeds">
+      <template v-for="(   feed, index   ) in    feeds   ">
         <div v-bind:id="index" class="observe">
           <h2 @click="getReadable(feed, index)" class="feed-title">{{ feed.title }}</h2>
           <p class="feed-content" v-html='feed.content'></p>

vue/src/components/modal/AddUrl.vue

@@ -0,0 +1,130 @@
+<script setup>
+import { ref } from 'vue';
+import axios from 'axios';
+const props = defineProps({
+  show: Boolean
+})
+const submitted = ref(false)
+const url = ref('')
+const title = ref('')
+const output = ref('')
+
+async function save() {
+  output.value = ''
+  submitted.value = true;
+  console.log('saved ' + url.value)
+  try {
+    const response = await axios.post("feeds/add", {
+      url: url.value,
+      title: title.value,
+      user_id: parseInt(localStorage.getItem("user-id"))
+    },
+      {
+        headers: {
+          'Content-Type': 'application/json',
+          'user-token': localStorage.getItem("user-token")
+        }
+      }
+    )
+
+    console.log(response)
+    output.value = 'saved successfully'
+  } catch (error) {
+    console.error(error.message)
+    output.value = error.message
+  }
+}
+</script>
+
+<template>
+  <Transition name="modal">
+    <div v-if="show" class="modal-mask">
+      <div class="modal-container">
+        <div class="modal-header">
+          <slot name="header">Add RSS Feed</slot>
+        </div>
+        <form @submit.prevent="submitForm">
+          <label for="name">URL:</label>
+          <input v-model="url" id="url" type="text" required />
+          <label for="name">Title:</label>
+          <input v-model="title" id="title" type="text" required />
+
+          <div v-if="submitted">
+            <p>{{ output }}</p>
+          </div>
+
+          <div class="modal-footer">
+            <slot name="footer">
+              <button type="submit" @click="save">Save</button>
+              <button class="modal-default-button" @click="$emit('close')">Close</button>
+            </slot>
+          </div>
+        </form>
+      </div>
+    </div>
+  </Transition>
+</template>
+
+<style>
+input {
+  margin: 15px;
+}
+
+.modal-mask {
+  position: fixed;
+  z-index: 9998;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background-color: rgba(0, 0, 0, 0.5);
+  display: flex;
+  transition: opacity 0.3s ease;
+}
+
+.modal-container {
+  width: 300px;
+  margin: auto;
+  padding: 20px 30px;
+  background-color: #fff;
+  border-radius: 2px;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.33);
+  transition: all 0.3s ease;
+}
+
+.modal-header h3 {
+  margin-top: 0;
+  color: #42b983;
+}
+
+.modal-body {
+  margin: 20px 0;
+}
+
+.modal-default-button {
+  float: right;
+}
+
+/*
+ * The following styles are auto-applied to elements with
+ * transition="modal" when their visibility is toggled
+ * by Vue.js.
+ *
+ * You can easily play with the modal transition by editing
+ * these styles.
+ */
+
+.modal-enter-from {
+  opacity: 0;
+}
+
+.modal-leave-to {
+  opacity: 0;
+}
+
+.modal-enter-from .modal-container,
+.modal-leave-to .modal-container {
+  -webkit-transform: scale(1.1);
+  transform: scale(1.1);
+}
+</style>

vue/vite.config.js

@@ -40,6 +40,12 @@ export default defineConfig({
         secure: false,
         rewrite: (path) => path.replace(/^\/feeds\/read/, ''),
       },
+      '/feeds/add': {
+        target: 'http://localhost:8001/api/v1/article/add',
+        changeOrigin: true,
+        secure: false,
+        rewrite: (path) => path.replace(/^\/feeds\/add/, ''),
+      },
     },
 
     cors: false