Spaces:

gauthamnairy
/

Finder

Sleeping

App Files Files Community

gauthamnairy commited on Feb 23, 2025

Commit

fd6cc4b

verified ·

1 Parent(s): 31cc724

Update templates/index.html

Browse files

Files changed (1) hide show

templates/index.html +164 -2

templates/index.html CHANGED Viewed

@@ -340,6 +340,119 @@
             from { opacity: 0; transform: translateY(20px); }
             to { opacity: 1; transform: translateY(0); }
         }
     </style>
 </head>
 <body>
@@ -554,6 +667,47 @@
             return messageEl;
         }
         async function sendMessage() {
             const queryInput = document.getElementById('query');
             const messageText = queryInput.value.trim();
@@ -580,13 +734,21 @@
                     headers: { 'Content-Type': 'application/json' },
                     body: JSON.stringify({ query: messageText, role: currentRole, file_id: currentFileId })
                 });
                 if (!response.ok) {
                     throw new Error(`HTTP error! status: ${response.status}`);
                 }
                 const data = await response.json();
                 typingIndicator.remove();
-                const assistantMessage = renderMessage(data.response || data.answer, false);
-                messagesContainer.appendChild(assistantMessage);
                 messagesContainer.scrollTop = messagesContainer.scrollHeight;
             } catch (error) {
                 console.error('Error:', error);

             from { opacity: 0; transform: translateY(20px); }
             to { opacity: 1; transform: translateY(0); }
         }
+        /* News Output Styling */
+        .news-container {
+            max-width: 800px;
+            margin: 0 auto;
+            padding: 1rem;
+        }
+        .market-summary {
+            background: var(--surface-dark);
+            border: 1px solid var(--border-light);
+            border-radius: 1rem;
+            padding: 1.5rem;
+            margin-bottom: 2rem;
+        }
+        .market-summary h2 {
+            color: var(--text-primary);
+            font-size: 1.5rem;
+            font-weight: 600;
+            margin-bottom: 1rem;
+            padding-bottom: 0.5rem;
+            border-bottom: 1px solid var(--border-light);
+        }
+        .market-summary-content {
+            color: var(--text-secondary);
+            font-size: 1rem;
+            line-height: 1.6;
+            white-space: pre-wrap;
+        }
+        .articles-section {
+            margin-top: 2rem;
+        }
+        .articles-section h2 {
+            color: var(--text-primary);
+            font-size: 1.5rem;
+            font-weight: 600;
+            margin-bottom: 1.5rem;
+            padding-bottom: 0.5rem;
+            border-bottom: 1px solid var(--border-light);
+        }
+        .articles-grid {
+            display: flex;
+            flex-direction: column;
+            gap: 1.5rem;
+        }
+        .article-card {
+            background: var(--surface-dark);
+            border: 1px solid var(--border-light);
+            border-radius: 1rem;
+            padding: 1.5rem;
+            transition: all 0.3s ease;
+        }
+        .article-card:hover {
+            transform: translateY(-2px);
+            box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
+        }
+        .article-card h3 {
+            color: var(--text-primary);
+            font-size: 1.2rem;
+            font-weight: 600;
+            margin-bottom: 1rem;
+            line-height: 1.4;
+        }
+        .article-card .source {
+            color: #6366f1;
+            font-size: 0.9rem;
+            margin-bottom: 0.75rem;
+        }
+        .article-card .analysis {
+            color: var(--text-secondary);
+            font-size: 1rem;
+            line-height: 1.6;
+            margin-bottom: 1rem;
+            white-space: pre-wrap;
+        }
+        .article-card .article-footer {
+            display: flex;
+            justify-content: space-between;
+            align-items: center;
+            margin-top: 1rem;
+            padding-top: 1rem;
+            border-top: 1px solid var(--border-light);
+        }
+        .article-card .read-more {
+            color: #6366f1;
+            text-decoration: none;
+            font-size: 0.9rem;
+            font-weight: 500;
+            display: flex;
+            align-items: center;
+            gap: 0.5rem;
+            transition: color 0.2s ease;
+        }
+        .article-card .read-more:hover {
+            color: #4f46e5;
+        }
+        .article-card .read-more i {
+            font-size: 0.8rem;
+        }
     </style>
 </head>
 <body>
             return messageEl;
         }
+        function renderNewsResponse(data) {
+            const messagesContainer = document.getElementById('messages');
+            // Create a news container
+            const newsContainer = document.createElement('div');
+            newsContainer.classList.add('message', 'assistant-message');
+            // Add market summary
+            if (data.summary) {
+                const summarySection = document.createElement('div');
+                summarySection.innerHTML = `
+                    <h2>Market Summary</h2>
+                    <div class="market-summary">
+                        ${data.summary}
+                    </div>
+                `;
+                newsContainer.appendChild(summarySection);
+            }
+            // Add articles
+            if (data.articles && data.articles.length > 0) {
+                const articlesSection = document.createElement('div');
+                articlesSection.innerHTML = `
+                    <h2>Related Articles</h2>
+                    <div class="articles-grid">
+                        ${data.articles.map(article => `
+                            <div class="article-card">
+                                <h3>${article.title}</h3>
+                                <p>${article.analysis}</p>
+                                <a href="${article.link}" target="_blank" rel="noopener noreferrer">Read More</a>
+                            </div>
+                        `).join('')}
+                    </div>
+                `;
+                newsContainer.appendChild(articlesSection);
+            }
+            messagesContainer.appendChild(newsContainer);
+            messagesContainer.scrollTop = messagesContainer.scrollHeight;
+        }
         async function sendMessage() {
             const queryInput = document.getElementById('query');
             const messageText = queryInput.value.trim();
                     headers: { 'Content-Type': 'application/json' },
                     body: JSON.stringify({ query: messageText, role: currentRole, file_id: currentFileId })
                 });
                 if (!response.ok) {
                     throw new Error(`HTTP error! status: ${response.status}`);
                 }
                 const data = await response.json();
                 typingIndicator.remove();
+                if (isNewsMode) {
+                    renderNewsResponse(data);
+                } else {
+                    const assistantMessage = renderMessage(data.response || data.answer, false);
+                    messagesContainer.appendChild(assistantMessage);
+                }
                 messagesContainer.scrollTop = messagesContainer.scrollHeight;
             } catch (error) {
                 console.error('Error:', error);