Spaces:
Sleeping
Sleeping
fix to warning pop up positioning
Browse files
app.py
CHANGED
@@ -3,6 +3,7 @@ import pandas as pd
|
|
3 |
import logging
|
4 |
import asyncio
|
5 |
import os
|
|
|
6 |
from uuid import uuid4
|
7 |
from datetime import datetime, timedelta
|
8 |
from pathlib import Path
|
@@ -22,8 +23,6 @@ import json
|
|
22 |
|
23 |
# # fetch tokens and model config params
|
24 |
SPACES_LOG = os.environ["SPACES_LOG"]
|
25 |
-
# SPACES_LOG = os.getenv('SPACES_LOG')
|
26 |
-
|
27 |
model_config = getconfig("model_params.cfg")
|
28 |
|
29 |
# create the local logs repo
|
@@ -176,11 +175,15 @@ async def chat(query, history, sources, reports, subtype, year, client_ip=None,
|
|
176 |
vectorstore = vectorstores["allreports"]
|
177 |
|
178 |
##------------------------------get context----------------------------------------------
|
179 |
-
|
|
|
180 |
context_retrieved = get_context(vectorstore=vectorstore,query=query,reports=reports,
|
181 |
sources=sources,subtype=subtype,year=year)
|
182 |
-
|
183 |
-
|
|
|
|
|
|
|
184 |
if not context_retrieved or len(context_retrieved) == 0:
|
185 |
warning_message = "⚠️ **No relevant information was found in the audit reports pertaining your query.** Please try rephrasing your question or selecting different report filters."
|
186 |
history[-1] = (query, warning_message)
|
@@ -249,16 +252,16 @@ async def chat(query, history, sources, reports, subtype, year, client_ip=None,
|
|
249 |
"session_duration_seconds": session_duration,
|
250 |
"client_location": session_data['location_info'],
|
251 |
"platform": session_data['platform_info'],
|
252 |
-
|
253 |
-
|
254 |
-
|
255 |
-
|
256 |
-
"year": year,
|
257 |
"question": query,
|
258 |
"retriever": model_config.get('retriever','MODEL'),
|
259 |
"endpoint_type": model_config.get('reader','TYPE'),
|
260 |
"reader": model_config.get('reader','NVIDIA_MODEL'),
|
261 |
-
|
262 |
}
|
263 |
|
264 |
if model_config.get('reader','TYPE') == 'NVIDIA':
|
@@ -383,10 +386,10 @@ with gr.Blocks(title="Audit Q&A", css= "style.css", theme=theme,elem_id = "main-
|
|
383 |
chatbot = gr.Chatbot(
|
384 |
value=[(None,init_prompt)],
|
385 |
show_copy_button=True,show_label = False,elem_id="chatbot",layout = "panel",
|
386 |
-
avatar_images = (None,"data-collection.png")
|
387 |
)
|
388 |
|
389 |
-
|
390 |
with gr.Column(elem_id="feedback-container"):
|
391 |
with gr.Row(visible=False) as feedback_row:
|
392 |
gr.Markdown("Was this response helpful?")
|
@@ -395,9 +398,23 @@ with gr.Blocks(title="Audit Q&A", css= "style.css", theme=theme,elem_id = "main-
|
|
395 |
not_okay_btn = gr.Button("👎 Not to expectations", elem_classes="feedback-button")
|
396 |
feedback_thanks = gr.Markdown("Thanks for the feedback!", visible=False)
|
397 |
feedback_state = gr.State()
|
398 |
-
|
399 |
-
|
400 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
401 |
with gr.Row(elem_id = "input-message"):
|
402 |
textbox=gr.Textbox(placeholder="Ask me anything here!",show_label=False,scale=7,
|
403 |
lines = 1,interactive = True,elem_id="input-textbox")
|
@@ -710,14 +727,6 @@ with gr.Blocks(title="Audit Q&A", css= "style.css", theme=theme,elem_id = "main-
|
|
710 |
warning_state = gr.State(False)
|
711 |
pending_query = gr.State(None)
|
712 |
|
713 |
-
# Warning UI is implemented as a hidden row (to keep it simple)
|
714 |
-
with gr.Row(visible=False, elem_id="warning-row", elem_classes="warning-message") as warning_row:
|
715 |
-
with gr.Column():
|
716 |
-
gr.Markdown("<span class='warning-icon'>⚠️</span> **No report filter selected. Are you sure you want to proceed?**")
|
717 |
-
with gr.Row(elem_classes="warning-buttons"):
|
718 |
-
proceed_btn = gr.Button("Proceed", elem_classes="proceed")
|
719 |
-
cancel_btn = gr.Button("Cancel", elem_classes="cancel")
|
720 |
-
|
721 |
def show_warning():
|
722 |
"""Show warning popup when no filters selected"""
|
723 |
return gr.update(visible=True)
|
@@ -782,13 +791,6 @@ with gr.Blocks(title="Audit Q&A", css= "style.css", theme=theme,elem_id = "main-
|
|
782 |
# Warn users when query is too short (less than 4 words)
|
783 |
short_query_warning_state = gr.State(False)
|
784 |
check_status = gr.State(None)
|
785 |
-
|
786 |
-
# Short query warning UI - using exact same structure as filters warning
|
787 |
-
with gr.Row(visible=False, elem_id="warning-row", elem_classes="warning-message") as short_query_warning_row:
|
788 |
-
with gr.Column():
|
789 |
-
gr.Markdown("<span class='warning-icon'>⚠️</span> **Your query is too short. Please lengthen your query to ensure the app has adequate context.**")
|
790 |
-
with gr.Row(elem_classes="warning-buttons"):
|
791 |
-
short_query_proceed_btn = gr.Button("OK", elem_classes="proceed")
|
792 |
|
793 |
def check_query_length(textbox_value):
|
794 |
"""Check if query has at least 4 words"""
|
|
|
3 |
import logging
|
4 |
import asyncio
|
5 |
import os
|
6 |
+
import time
|
7 |
from uuid import uuid4
|
8 |
from datetime import datetime, timedelta
|
9 |
from pathlib import Path
|
|
|
23 |
|
24 |
# # fetch tokens and model config params
|
25 |
SPACES_LOG = os.environ["SPACES_LOG"]
|
|
|
|
|
26 |
model_config = getconfig("model_params.cfg")
|
27 |
|
28 |
# create the local logs repo
|
|
|
175 |
vectorstore = vectorstores["allreports"]
|
176 |
|
177 |
##------------------------------get context----------------------------------------------
|
178 |
+
### adding for assessing computation time
|
179 |
+
start_time = time.time()
|
180 |
context_retrieved = get_context(vectorstore=vectorstore,query=query,reports=reports,
|
181 |
sources=sources,subtype=subtype,year=year)
|
182 |
+
end_time = time.time()
|
183 |
+
print("Time for retriever:",end_time - start_time)
|
184 |
+
|
185 |
+
# WARNING FOR NO CONTEXT: Check if any paragraphs were retrieved, add warning if none found
|
186 |
+
# We use this in the Gradio UI below (displays in the chat dialogue box)
|
187 |
if not context_retrieved or len(context_retrieved) == 0:
|
188 |
warning_message = "⚠️ **No relevant information was found in the audit reports pertaining your query.** Please try rephrasing your question or selecting different report filters."
|
189 |
history[-1] = (query, warning_message)
|
|
|
252 |
"session_duration_seconds": session_duration,
|
253 |
"client_location": session_data['location_info'],
|
254 |
"platform": session_data['platform_info'],
|
255 |
+
"system_prompt": SYSTEM_PROMPT,
|
256 |
+
"sources": sources,
|
257 |
+
"reports": reports,
|
258 |
+
"subtype": subtype,
|
259 |
+
#"year": year,
|
260 |
"question": query,
|
261 |
"retriever": model_config.get('retriever','MODEL'),
|
262 |
"endpoint_type": model_config.get('reader','TYPE'),
|
263 |
"reader": model_config.get('reader','NVIDIA_MODEL'),
|
264 |
+
"docs": [doc.page_content for doc in context_retrieved],
|
265 |
}
|
266 |
|
267 |
if model_config.get('reader','TYPE') == 'NVIDIA':
|
|
|
386 |
chatbot = gr.Chatbot(
|
387 |
value=[(None,init_prompt)],
|
388 |
show_copy_button=True,show_label = False,elem_id="chatbot",layout = "panel",
|
389 |
+
avatar_images = (None,"data-collection.png")
|
390 |
)
|
391 |
|
392 |
+
#---------------- FEEDBACK ----------------------
|
393 |
with gr.Column(elem_id="feedback-container"):
|
394 |
with gr.Row(visible=False) as feedback_row:
|
395 |
gr.Markdown("Was this response helpful?")
|
|
|
398 |
not_okay_btn = gr.Button("👎 Not to expectations", elem_classes="feedback-button")
|
399 |
feedback_thanks = gr.Markdown("Thanks for the feedback!", visible=False)
|
400 |
feedback_state = gr.State()
|
401 |
+
#---------------- WARNINGS ----------------------
|
402 |
+
# No filters selected warning
|
403 |
+
with gr.Row(visible=False, elem_id="warning-row", elem_classes="warning-message") as warning_row:
|
404 |
+
with gr.Column():
|
405 |
+
gr.Markdown("<span class='warning-icon'>⚠️</span> **No report filter selected. Are you sure you want to proceed?**")
|
406 |
+
with gr.Row(elem_classes="warning-buttons"):
|
407 |
+
proceed_btn = gr.Button("Proceed", elem_classes="proceed")
|
408 |
+
cancel_btn = gr.Button("Cancel", elem_classes="cancel")
|
409 |
+
|
410 |
+
# Short query warning (< 4 words)
|
411 |
+
with gr.Row(visible=False, elem_id="warning-row", elem_classes="warning-message") as short_query_warning_row:
|
412 |
+
with gr.Column():
|
413 |
+
gr.Markdown("<span class='warning-icon'>⚠️</span> **Your query is too short. Please lengthen your query to ensure the app has adequate context.**")
|
414 |
+
with gr.Row(elem_classes="warning-buttons"):
|
415 |
+
short_query_proceed_btn = gr.Button("OK", elem_classes="proceed")
|
416 |
+
|
417 |
+
#---------------- QUERY INPUT ----------------------
|
418 |
with gr.Row(elem_id = "input-message"):
|
419 |
textbox=gr.Textbox(placeholder="Ask me anything here!",show_label=False,scale=7,
|
420 |
lines = 1,interactive = True,elem_id="input-textbox")
|
|
|
727 |
warning_state = gr.State(False)
|
728 |
pending_query = gr.State(None)
|
729 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
730 |
def show_warning():
|
731 |
"""Show warning popup when no filters selected"""
|
732 |
return gr.update(visible=True)
|
|
|
791 |
# Warn users when query is too short (less than 4 words)
|
792 |
short_query_warning_state = gr.State(False)
|
793 |
check_status = gr.State(None)
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
794 |
|
795 |
def check_query_length(textbox_value):
|
796 |
"""Check if query has at least 4 words"""
|
style.css
CHANGED
@@ -56,8 +56,6 @@ body.dark .tip-box * {
|
|
56 |
|
57 |
.message{
|
58 |
font-size:14px !important;
|
59 |
-
position: relative;
|
60 |
-
overflow: hidden;
|
61 |
}
|
62 |
|
63 |
|
@@ -182,90 +180,38 @@ label.selected{
|
|
182 |
|
183 |
@media screen and (min-width: 1024px) {
|
184 |
div#tab-examples{
|
185 |
-
height:
|
186 |
overflow-y: auto;
|
187 |
-
max-height: calc(100vh - 190px);
|
188 |
}
|
189 |
|
190 |
div#sources-textbox{
|
191 |
-
height:
|
192 |
-
overflow-y: auto;
|
193 |
-
max-height: calc(100vh - 190px);
|
194 |
}
|
195 |
|
196 |
div#tab-config{
|
197 |
-
height:
|
198 |
-
overflow-y: auto;
|
199 |
-
max-height: calc(100vh - 190px);
|
200 |
}
|
201 |
|
202 |
div#chatbot-row{
|
203 |
-
height:
|
204 |
-
max-height: calc(100vh - 90px);
|
205 |
-
overflow: hidden;
|
206 |
}
|
207 |
|
208 |
div#chatbot{
|
209 |
-
height:
|
210 |
-
max-height: calc(100vh - 170px);
|
211 |
-
overflow-y: auto;
|
212 |
-
position: relative;
|
213 |
}
|
214 |
|
215 |
.max-height{
|
216 |
-
height:
|
217 |
-
max-height: calc(100vh - 90px);
|
218 |
-
overflow-y: auto;
|
219 |
-
}
|
220 |
-
|
221 |
-
/* Enhanced containment for right panel */
|
222 |
-
#right-panel {
|
223 |
-
height: calc(100vh - 90px);
|
224 |
-
max-height: calc(100vh - 90px);
|
225 |
-
overflow: hidden;
|
226 |
-
position: relative;
|
227 |
-
display: flex;
|
228 |
-
flex-direction: column;
|
229 |
-
}
|
230 |
-
|
231 |
-
#right-panel > div {
|
232 |
-
height: 100%;
|
233 |
-
max-height: 100%;
|
234 |
-
overflow-y: auto;
|
235 |
-
flex: 1;
|
236 |
-
position: relative;
|
237 |
-
}
|
238 |
-
|
239 |
-
.tabitem {
|
240 |
-
height: calc(100vh - 190px);
|
241 |
-
max-height: calc(100vh - 190px);
|
242 |
overflow-y: auto;
|
243 |
-
position: relative;
|
244 |
-
display: flex;
|
245 |
-
flex-direction: column;
|
246 |
}
|
247 |
|
248 |
-
.
|
249 |
-
|
250 |
-
|
251 |
-
|
252 |
-
}
|
253 |
-
|
254 |
-
.other-tabs > div {
|
255 |
-
padding-left: 40px;
|
256 |
-
padding-right: 40px;
|
257 |
-
padding-top: 10px;
|
258 |
-
height: 100%;
|
259 |
-
max-height: 100%;
|
260 |
-
overflow-y: auto;
|
261 |
-
position: relative;
|
262 |
-
}
|
263 |
-
|
264 |
-
.gallery-item {
|
265 |
-
position: relative;
|
266 |
-
overflow: hidden;
|
267 |
-
max-height: fit-content;
|
268 |
-
}
|
269 |
}
|
270 |
|
271 |
footer {
|
@@ -414,9 +360,11 @@ span.chatbot > p > img{
|
|
414 |
text-decoration: none !important;
|
415 |
}
|
416 |
|
|
|
|
|
417 |
/* #_______ Feedback UI _______ */
|
418 |
|
419 |
-
.feedback-button {
|
420 |
border: none;
|
421 |
padding: 8px 16px;
|
422 |
border-radius: 4px;
|
@@ -441,7 +389,7 @@ span.chatbot > p > img{
|
|
441 |
.feedback-button {
|
442 |
min-width: 100px;
|
443 |
margin: 0 5px;
|
444 |
-
}
|
445 |
|
446 |
/* #_______ Warning "popup" styling _______ */
|
447 |
#warning-row {
|
@@ -449,14 +397,18 @@ span.chatbot > p > img{
|
|
449 |
border: 1px solid #ffeeba;
|
450 |
border-radius: 4px;
|
451 |
padding: 15px 20px;
|
452 |
-
margin: 10px 0;
|
453 |
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
|
454 |
-
position:
|
|
|
|
|
|
|
455 |
z-index: 1000;
|
456 |
font-size: 14px;
|
457 |
color: #856404;
|
458 |
-
width: 65%;
|
459 |
-
|
|
|
460 |
}
|
461 |
|
462 |
#warning-row.visible {
|
@@ -568,7 +520,6 @@ span.chatbot > p > img{
|
|
568 |
opacity: 1;
|
569 |
}
|
570 |
|
571 |
-
/* Arrow for tooltip */
|
572 |
.question-tooltip .tooltip-content::after {
|
573 |
content: "";
|
574 |
position: absolute;
|
|
|
56 |
|
57 |
.message{
|
58 |
font-size:14px !important;
|
|
|
|
|
59 |
}
|
60 |
|
61 |
|
|
|
180 |
|
181 |
@media screen and (min-width: 1024px) {
|
182 |
div#tab-examples{
|
183 |
+
height:calc(100vh - 190px) !important;
|
184 |
overflow-y: auto;
|
|
|
185 |
}
|
186 |
|
187 |
div#sources-textbox{
|
188 |
+
height:calc(100vh - 190px) !important;
|
189 |
+
overflow-y: auto !important;
|
|
|
190 |
}
|
191 |
|
192 |
div#tab-config{
|
193 |
+
height:calc(100vh - 190px) !important;
|
194 |
+
overflow-y: auto !important;
|
|
|
195 |
}
|
196 |
|
197 |
div#chatbot-row{
|
198 |
+
height:calc(100vh - 90px) !important;
|
|
|
|
|
199 |
}
|
200 |
|
201 |
div#chatbot{
|
202 |
+
height:calc(100vh - 170px) !important;
|
|
|
|
|
|
|
203 |
}
|
204 |
|
205 |
.max-height{
|
206 |
+
height:calc(100vh - 90px) !important;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
207 |
overflow-y: auto;
|
|
|
|
|
|
|
208 |
}
|
209 |
|
210 |
+
/* .tabitem:nth-child(n+3) {
|
211 |
+
padding-top:30px;
|
212 |
+
padding-left:40px;
|
213 |
+
padding-right:40px;
|
214 |
+
} */
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
215 |
}
|
216 |
|
217 |
footer {
|
|
|
360 |
text-decoration: none !important;
|
361 |
}
|
362 |
|
363 |
+
|
364 |
+
|
365 |
/* #_______ Feedback UI _______ */
|
366 |
|
367 |
+
/* .feedback-button {
|
368 |
border: none;
|
369 |
padding: 8px 16px;
|
370 |
border-radius: 4px;
|
|
|
389 |
.feedback-button {
|
390 |
min-width: 100px;
|
391 |
margin: 0 5px;
|
392 |
+
} */
|
393 |
|
394 |
/* #_______ Warning "popup" styling _______ */
|
395 |
#warning-row {
|
|
|
397 |
border: 1px solid #ffeeba;
|
398 |
border-radius: 4px;
|
399 |
padding: 15px 20px;
|
400 |
+
margin: 10px 0;
|
401 |
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
|
402 |
+
position: fixed;
|
403 |
+
bottom: 100px;
|
404 |
+
left: 50%;
|
405 |
+
transform: translateX(-50%);
|
406 |
z-index: 1000;
|
407 |
font-size: 14px;
|
408 |
color: #856404;
|
409 |
+
width: 65%;
|
410 |
+
max-width: 600px;
|
411 |
+
box-sizing: border-box;
|
412 |
}
|
413 |
|
414 |
#warning-row.visible {
|
|
|
520 |
opacity: 1;
|
521 |
}
|
522 |
|
|
|
523 |
.question-tooltip .tooltip-content::after {
|
524 |
content: "";
|
525 |
position: absolute;
|