frontend done

.gitignore

@@ -1 +1,2 @@
 **/target
+creds.js

frontend/.gitignore

@@ -0,0 +1,7 @@
+# Generated by Cargo
+# will have compiled files and executables
+/target
+.DS_Store
+
+# These are backup files generated by rustfmt
+**/*.rs.bk

frontend/Cargo.toml

@@ -0,0 +1,32 @@
+[package]
+name = "frontend"
+version = "0.1.0"
+authors = ["Mars Ultor <krishna@ayyalasomayajula.net>"]
+edition = "2021"
+
+# See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html
+
+[dependencies]
+dioxus = { version = "0.6.0", features = ["router", "fullstack", "web"] }
+serde_json = "1.0"
+serde = { version = "1.0", features = ["derive"] }
+#redis = "0.28.0"
+redis = { version = "0.28.0", default-features = false }
+lazy_static = "1.4"
+[features]
+default = []
+web = ["dioxus/web"]
+desktop = ["dioxus/desktop"]
+mobile = ["dioxus/mobile"]
+
+[profile]
+
+[profile.wasm-dev]
+inherits = "dev"
+opt-level = 1
+
+[profile.server-dev]
+inherits = "dev"
+
+[profile.android-dev]
+inherits = "dev"

frontend/Dioxus.toml

@@ -0,0 +1,24 @@
+[application]
+
+# App (Project) Name
+name = "frontend"
+
+[web.app]
+
+# HTML title tag content
+title = "frontend"
+
+# include `assets` in web platform
+[web.resource]
+
+# Additional CSS style files
+style = []
+
+# Additional JavaScript files
+script = []
+
+[web.resource.dev]
+
+# Javascript code file
+# serve: [dev-server] only
+script = []

frontend/README.md

@@ -0,0 +1,27 @@
+# Development
+
+Your new jumpstart project includes basic organization with an organized `assets` folder and a `components` folder. 
+If you chose to develop with the router feature, you will also have a `views` folder.
+
+### Tailwind
+1. Install npm: https://docs.npmjs.com/downloading-and-installing-node-js-and-npm
+2. Install the Tailwind CSS CLI: https://tailwindcss.com/docs/installation
+3. Run the following command in the root of the project to start the Tailwind CSS compiler:
+
+```bash
+npx tailwindcss -i ./input.css -o ./assets/tailwind.css --watch
+```
+
+### Serving Your App
+
+Run the following command in the root of your project to start developing with the default platform:
+
+```bash
+dx serve --platform web
+```
+
+To run for a different platform, use the `--platform platform` flag. E.g.
+```bash
+dx serve --platform desktop
+```
+

frontend/assets/styling/blog.css

@@ -0,0 +1,8 @@
+#blog {
+  margin-top: 50px;
+}
+
+#blog a {
+  color: #ffffff;
+  margin-top: 50px;
+}

frontend/assets/styling/echo.css

@@ -0,0 +1,34 @@
+#echo {
+  width: 360px;
+  margin-left: auto;
+  margin-right: auto;
+  margin-top: 50px;
+  background-color: #1e222d;
+  padding: 20px;
+  border-radius: 10px;
+}
+
+#echo>h4 {
+  margin: 0px 0px 15px 0px;
+}
+
+
+#echo>input {
+  border: none;
+  border-bottom: 1px white solid;
+  background-color: transparent;
+  color: #ffffff;
+  transition: border-bottom-color 0.2s ease;
+  outline: none;
+  display: block;
+  padding: 0px 0px 5px 0px;
+  width: 100%;
+}
+
+#echo>input:focus {
+  border-bottom-color: #6d85c6;
+}
+
+#echo>p {
+  margin: 20px 0px 0px auto;
+}

frontend/assets/styling/main.css

@@ -0,0 +1,150 @@
+body {
+    background-color: #0f1116;
+    color: #ffffff;
+    font-family: 'Times New Roman', serif;
+    margin: 20px;
+}
+
+#hero {
+    margin: 0;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+}
+
+#links {
+    width: 400px;
+    text-align: left;
+    font-size: x-large;
+    color: white;
+    display: flex;
+    flex-direction: column;
+}
+
+#links a {
+    color: white;
+    text-decoration: none;
+    margin-top: 20px;
+    margin: 10px 0px;
+    border: white 1px solid;
+    border-radius: 5px;
+    padding: 10px;
+    font-family: 'Times New Roman', serif;
+}
+
+#links a:hover {
+    background-color: #1f1f1f;
+    cursor: pointer;
+}
+
+#header {
+    max-width: 1200px;
+    font-family: 'Arial Narrow', sans-serif;
+}
+.news-story {
+ max-width: 65ch;
+ margin: 2rem auto;
+ padding: 0 1.5rem;
+ font-family: "Escrow Text", Georgia, serif;
+ line-height: 1.7;
+ color: #f8fafc;
+ font-size: 1.125rem;
+}
+
+.news-story p {
+ margin-bottom: 1.5rem;
+}
+.news-story img {
+ max-width: 100%;
+ height: auto;
+ margin: 1.5rem 0;
+}
+
+.news-story h1, 
+.news-story h2, 
+.news-story h3, 
+.news-story h4 {
+ font-family: "Brunel Text", Georgia, serif;
+ color: #f1f5f9;
+ line-height: 1.3;
+ margin-top: 2.5rem;
+ margin-bottom: 1rem;
+ font-weight: 600;
+}
+
+.news-story h1 {
+  font-size: 2.25rem;
+  margin-top: 0;
+}
+
+.news-story h2 {
+  font-size: 1.875rem;
+}
+
+.news-story h3 {
+  font-size: 1.5rem;
+}
+
+.news-story h4 {
+  font-size: 1.25rem;
+}
+
+.news-story a {
+  color: #60a5fa;
+  text-decoration: underline;
+  text-decoration-thickness: 1px;
+  text-underline-offset: 2px;
+  transition: color 0.2s ease;
+}
+
+.news-story a:hover {
+  color: #93c5fd;
+}
+
+.news-story blockquote {
+  border-left: 3px solid #475569;
+  margin: 1.5rem 0;
+  padding: 0.5rem 0 0.5rem 1.5rem;
+  font-style: italic;
+  color: #cbd5e1;
+}
+
+.news-story ul, 
+.news-story ol {
+  margin: 1.5rem 0;
+  padding-left: 1.5rem;
+}
+
+.news-story li {
+  margin-bottom: 0.5rem;
+}
+
+.news-story hr {
+  border: 0;
+  border-top: 1px solid #334155;
+  margin: 2rem 0;
+}
+
+@media (max-width: 640px) {
+  .news-story {
+    font-size: 1rem;
+    padding: 0 1rem;
+  }
+  
+  .news-story h1 {
+    font-size: 1.875rem;
+  }
+  
+  .news-story h2 {
+    font-size: 1.5rem;
+  }
+  
+  .news-story h3 {
+    font-size: 1.25rem;
+  }
+  
+  .news-story h4 {
+    font-size: 1.125rem;
+  }
+}

frontend/assets/styling/navbar.css

@@ -0,0 +1,16 @@
+#navbar {
+  display: flex;
+  flex-direction: row;
+}
+
+#navbar a {
+  color: #ffffff;
+  margin-right: 20px;
+  text-decoration: none;
+  transition: color 0.2s ease;
+}
+
+#navbar a:hover {
+  cursor: pointer;
+  color: #91a4d2;
+}

frontend/input.css

@@ -0,0 +1,3 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;

frontend/src/components/echo.rs

@@ -0,0 +1,37 @@
+use dioxus::prelude::*;
+
+const ECHO_CSS: Asset = asset!("/assets/styling/echo.css");
+
+/// Echo component that demonstrates fullstack server functions.
+#[component]
+pub fn Echo() -> Element {
+    let mut response = use_signal(|| String::new());
+
+    rsx! {
+        document::Link { rel: "stylesheet", href: ECHO_CSS }
+        div {
+            id: "echo",
+            h4 { "ServerFn Echo" }
+            input {
+                placeholder: "Type here to echo...",
+                oninput:  move |event| async move {
+                    let data = echo_server(event.value()).await.unwrap();
+                    response.set(data);
+                },
+            }
+
+            if !response().is_empty() {
+                p {
+                    "Server echoed: "
+                    i { "{response}" }
+                }
+            }
+        }
+    }
+}
+
+/// Echo the user input on the server.
+#[server(EchoServer)]
+async fn echo_server(input: String) -> Result<String, ServerFnError> {
+    Ok(input)
+}

frontend/src/components/hero.rs

@@ -0,0 +1,21 @@
+use dioxus::prelude::*;
+
+const HEADER_SVG: Asset = asset!("/assets/header.svg");
+
+#[component]
+pub fn Hero() -> Element {
+    rsx! {
+        div {
+            id: "hero",
+            img { src: HEADER_SVG, id: "header" }
+            div { id: "links",
+                a { href: "https://dioxuslabs.com/learn/0.6/", "📚 Learn Dioxus" }
+                a { href: "https://dioxuslabs.com/awesome", "🚀 Awesome Dioxus" }
+                a { href: "https://github.com/dioxus-community/", "📡 Community Libraries" }
+                a { href: "https://github.com/DioxusLabs/sdk", "⚙️ Dioxus Development Kit" }
+                a { href: "https://marketplace.visualstudio.com/items?itemName=DioxusLabs.dioxus", "💫 VSCode Extension" }
+                a { href: "https://discord.gg/XgGxMSkvUM", "👋 Community Discord" }
+            }
+        }
+    }
+}

frontend/src/components/mod.rs

@@ -0,0 +1,11 @@
+mod hero;
+pub use hero::Hero;
+
+mod navbar;
+pub use navbar::Navbar;
+
+mod echo;
+pub use echo::Echo;
+
+mod story;
+pub use story::*;

frontend/src/components/navbar.rs

@@ -0,0 +1,21 @@
+use crate::Route;
+use dioxus::prelude::*;
+
+const NAVBAR_CSS: Asset = asset!("/assets/styling/navbar.css");
+
+#[component]
+pub fn Navbar() -> Element {
+    rsx! {
+        document::Link { rel: "stylesheet", href: NAVBAR_CSS }
+
+        div {
+            id: "navbar",
+            Link {
+                to: Route::Home {},
+                "Home"
+            }
+        }
+
+        Outlet::<Route> {}
+    }
+}

frontend/src/components/story.rs

@@ -0,0 +1,56 @@
+use crate::{components::story, Notification};
+use dioxus::prelude::*;
+
+const CSS: Asset = asset!("/assets/styling/main.css");
+
+#[component]
+pub fn Story(static_notification: Notification) -> Element {
+    // Extract fields from the Notification object into local variables
+    let title = static_notification.title;
+    let description = static_notification.description;
+    let url = static_notification.url;
+    let image_url = static_notification.image_url;
+    
+    // Join tickers into a single string
+    let tickers = static_notification.tickers.join(", ");
+
+    rsx! {
+        document::Link {rel: "stylesheet", href: CSS}
+        div {
+            class: "news-story",
+
+            // Image section, if an image URL is provided
+            img {
+                src: image_url,
+                alt: "News Image",
+                class: "news-image",
+            }
+
+            // Title section
+            h2 {
+                class: "news-title",
+                "{title}"
+            }
+
+            // Description section
+            p {
+                class: "news-description",
+                "{description}"
+            }
+
+            // Tickers section, now just displays the joined tickers string
+            div {
+                class: "news-tickers",
+                "Affected Stocks: {tickers}"
+            }
+
+            // Link to the full article
+            a {
+                href: url,
+                class: "news-link",
+                "Read more"
+            }
+        }
+    }
+}
+

frontend/src/main.rs

@@ -0,0 +1,83 @@
+use std::{collections::VecDeque, hash::{Hash, Hasher}, sync::{Arc, Mutex}, thread};
+
+use dioxus::prelude::*;
+
+use components::Navbar;
+use lazy_static::lazy_static;
+use redis::Client;
+use views::{Home};
+use serde_json::Value;
+use serde::{Deserialize, Serialize};
+mod components;
+mod views;
+mod shared;
+#[derive(Debug, Clone, Routable, PartialEq)]
+#[rustfmt::skip]
+enum Route {
+    #[layout(Navbar)]
+    #[route("/")]
+    Home {},
+}
+
+const FAVICON: Asset = asset!("/assets/favicon.ico");
+const MAIN_CSS: Asset = asset!("/assets/styling/main.css");
+const TAILWIND_CSS: Asset = asset!("/assets/tailwind.css");
+
+
+
+fn main() {
+    let reference_arc = Arc::clone(&shared::NOTIFICATION_Q);
+    thread::spawn(move || {
+        let client = Client::open("redis://192.168.1.23/").unwrap();
+        let mut connection = client.get_connection().unwrap();
+        let mut pubsub = connection.as_pubsub();
+        pubsub.subscribe("notifications").unwrap();
+
+        loop{
+            let message = pubsub.get_message().unwrap();
+
+            let payload_string: String = message.get_payload().unwrap();
+            println!("{payload_string}");
+            let notif: Vec<Notification> = serde_json::from_str(payload_string.as_str()).unwrap();
+            println!("Just recieved: {:#?}", notif); 
+            for notification in notif{
+                reference_arc.lock().unwrap().push_front(notification.clone());
+            }
+            while reference_arc.lock().unwrap().len() > 10{
+                reference_arc.lock().unwrap().pop_back();
+
+            }
+            let unique_vec: VecDeque<_> = reference_arc.lock().unwrap().clone().into_iter().collect::<std::collections::HashSet<_>>().into_iter().collect();
+            *reference_arc.lock().unwrap()=unique_vec;
+        }
+    })  ;
+    dioxus::launch(App);
+}
+
+#[component]
+fn App() -> Element {
+    // Build cool things ✌️
+
+    rsx! {
+        // Global app resources
+        document::Link { rel: "icon", href: FAVICON }
+        document::Link { rel: "stylesheet", href: MAIN_CSS }
+        document::Link { rel: "stylesheet", href: TAILWIND_CSS }
+
+        Router::<Route> {}
+    }
+}
+#[derive(Debug, Clone, PartialEq, Deserialize, Serialize, Eq, PartialOrd, Ord)]
+pub struct Notification{
+    title: String,
+    description: String,
+    url: String,
+    image_url: String,
+    tickers: Vec<String>
+}
+impl Hash for Notification{
+    fn hash<H: Hasher>(&self, state: &mut H) {
+        self.title.hash(state);
+        self.url.hash(state);
+    }
+}

frontend/src/shared.rs

@@ -0,0 +1,6 @@
+use lazy_static::lazy_static;
+use std::{collections::VecDeque, sync::{Arc, Mutex}};
+use crate::Notification;
+lazy_static!{
+    pub static ref NOTIFICATION_Q: Arc<Mutex<VecDeque<Notification>>> = Arc::new(Mutex::new(VecDeque::new()));
+}

frontend/src/views/home.rs

@@ -0,0 +1,13 @@
+use crate::components::{Echo, Hero, Story};
+use dioxus::prelude::*;
+use crate::shared::NOTIFICATION_Q;
+#[component]
+pub fn Home() -> Element {
+    let vec_d_clone = NOTIFICATION_Q.lock().unwrap().clone();
+    rsx! {
+        
+        for story in vec_d_clone{
+            Story{ static_notification: story.clone()}
+        }
+    }
+}

frontend/src/views/mod.rs

@@ -0,0 +1,5 @@
+mod home;
+pub use home::Home;
+
+//mod blog;
+//pub use blog::Blog;

frontend/tailwind.config.js

@@ -0,0 +1,9 @@
+/** @type {import('tailwindcss').Config} */
+module.exports = {
+  mode: "all",
+  content: ["./src/**/*.{rs,html,css}", "./dist/**/*.html"],
+  theme: {
+    extend: {},
+  },
+  plugins: [],
+};

stock_news_publisher/src/main.rs

@@ -17,9 +17,9 @@ fn main() {
    let mut connection = client.get_connection().unwrap();
     
    loop{
-       let query_url_gte: String = format!("https://api.marketaux.com/v1/news/all/?api_token={}&countries={}&sentiment_gte={}&language={}&published_after={}&limit={}", NEWS_API_KEY.clone(), encode("us,ca").into_owned(),encode(0.25f32.to_string().as_str()).into_owned(), "en", 
+       let query_url_gte: String = format!("https://api.marketaux.com/v1/news/all/?api_token={}&countries={}&sentiment_gte={}&language={}&published_after={}&limit={}", NEWS_API_KEY.clone(), encode("us,ca").into_owned(),encode(0.5f32.to_string().as_str()).into_owned(), "en", 
                encode((Local::now() - Duration::from_secs(20*60)).format("%Y-%m-%dT%H:%M:%S").to_string().as_str()).into_owned(), 10);
-       let query_url_lte: String = format!("https://api.marketaux.com/v1/news/all/?api_token={}&countries={}&sentiment_lte={}&language={}&published_after={}&limit={}", NEWS_API_KEY.clone(), encode("us,ca").into_owned(), encode((-0.25f32).to_string().as_str()).into_owned(), "en", 
+       let query_url_lte: String = format!("https://api.marketaux.com/v1/news/all/?api_token={}&countries={}&sentiment_lte={}&language={}&published_after={}&limit={}", NEWS_API_KEY.clone(), encode("us,ca").into_owned(), encode((-0.5f32).to_string().as_str()).into_owned(), "en", 
                encode((Local::now() - Duration::from_secs(20*60)).format("%Y-%m-%dT%H:%M:%S").to_string().as_str()).into_owned(), 10);
        info!(" Query url: {}", query_url_gte); 
        let response_batch_gte = reqwest::blocking::get(query_url_gte.as_str()).unwrap().text().unwrap();