import os
import re
import json
import time
from tqdm import tqdm
from pathlib import Path
import spaces
import gradio as gr
# Helper functions that don't use GPU
def safe_tokenize(text):
"""Pure regex tokenizer with no NLTK dependency"""
if not text:
return []
# Replace punctuation with spaces around them
text = re.sub(r'([.,!?;:()\[\]{}"\'/\\])', r' \1 ', text)
# Split on whitespace and filter empty strings
return [token for token in re.split(r'\s+', text.lower()) if token]
def detect_language(text):
"""Detect if text is primarily Arabic or English"""
# Simple heuristic: count Arabic characters
arabic_chars = re.findall(r'[\u0600-\u06FF]', text)
is_arabic = len(arabic_chars) > len(text) * 0.5
return "arabic" if is_arabic else "english"
# Comprehensive evaluation dataset
comprehensive_evaluation_data = [
# === Overview ===
{
"query": "ما هي رؤية السعودية 2030؟",
"reference": "رؤية السعودية 2030 هي خطة استراتيجية تهدف إلى تنويع الاقتصاد السعودي وتقليل الاعتماد على النفط مع تطوير قطاعات مختلفة مثل الصحة والتعليم والسياحة.",
"category": "overview",
"language": "arabic"
},
{
"query": "What is Saudi Vision 2030?",
"reference": "Saudi Vision 2030 is a strategic framework aiming to diversify Saudi Arabia's economy and reduce dependence on oil, while developing sectors like health, education, and tourism.",
"category": "overview",
"language": "english"
},
# === Economic Goals ===
{
"query": "ما هي الأهداف الاقتصادية لرؤية 2030؟",
"reference": "تشمل الأهداف الاقتصادية زيادة مساهمة القطاع الخاص إلى 65%، وزيادة الصادرات غير النفطية إلى 50% من الناتج المحلي غير النفطي، وخفض البطالة إلى 7%.",
"category": "economic",
"language": "arabic"
},
{
"query": "What are the economic goals of Vision 2030?",
"reference": "The economic goals of Vision 2030 include increasing private sector contribution from 40% to 65% of GDP, raising non-oil exports from 16% to 50%, reducing unemployment from 11.6% to 7%.",
"category": "economic",
"language": "english"
},
# === Social Goals ===
{
"query": "كيف تعزز رؤية 2030 الإرث الثقافي السعودي؟",
"reference": "تتضمن رؤية 2030 الحفاظ على الهوية الوطنية، تسجيل مواقع أثرية في اليونسكو، وتعزيز الفعاليات الثقافية.",
"category": "social",
"language": "arabic"
},
{
"query": "How does Vision 2030 aim to improve quality of life?",
"reference": "Vision 2030 plans to enhance quality of life by expanding sports facilities, promoting cultural activities, and boosting tourism and entertainment sectors.",
"category": "social",
"language": "english"
}
]
# RAG Service class
class Vision2030Service:
def __init__(self):
self.initialized = False
self.model = None
self.tokenizer = None
self.vector_store = None
self.conversation_history = []
@spaces.GPU
def initialize(self):
"""Initialize the system - ALL GPU operations must happen here"""
if self.initialized:
return True
try:
# Import all GPU-dependent libraries only inside this function
import torch
import PyPDF2
from transformers import AutoTokenizer, AutoModelForCausalLM
from sentence_transformers import SentenceTransformer
from langchain.text_splitter import RecursiveCharacterTextSplitter
from langchain_community.vectorstores import FAISS
from langchain.schema import Document
from langchain.embeddings import HuggingFaceEmbeddings
# Define paths for PDF files
pdf_files = ["saudi_vision203.pdf", "saudi_vision2030_ar.pdf"]
# Process PDFs and create vector store
vector_store_dir = "vector_stores"
os.makedirs(vector_store_dir, exist_ok=True)
if os.path.exists(os.path.join(vector_store_dir, "index.faiss")):
print("Loading existing vector store...")
embedding_function = HuggingFaceEmbeddings(
model_name="sentence-transformers/paraphrase-multilingual-mpnet-base-v2"
)
# Important: Add allow_dangerous_deserialization=True to fix the pickle error
self.vector_store = FAISS.load_local(
vector_store_dir,
embedding_function,
allow_dangerous_deserialization=True # Add this parameter
)
else:
print("Creating new vector store...")
# Process PDFs
documents = []
for pdf_path in pdf_files:
if not os.path.exists(pdf_path):
print(f"Warning: {pdf_path} does not exist")
continue
print(f"Processing {pdf_path}...")
text = ""
with open(pdf_path, 'rb') as file:
reader = PyPDF2.PdfReader(file)
for page in reader.pages:
page_text = page.extract_text()
if page_text:
text += page_text + "\n\n"
if text.strip():
doc = Document(
page_content=text,
metadata={"source": pdf_path, "filename": os.path.basename(pdf_path)}
)
documents.append(doc)
if not documents:
raise ValueError("No documents were processed successfully.")
# Split into chunks
text_splitter = RecursiveCharacterTextSplitter(
chunk_size=500,
chunk_overlap=50,
separators=["\n\n", "\n", ".", "!", "?", ",", " ", ""]
)
chunks = []
for doc in documents:
doc_chunks = text_splitter.split_text(doc.page_content)
chunks.extend([
Document(page_content=chunk, metadata=doc.metadata)
for chunk in doc_chunks
])
# Create vector store
embedding_function = HuggingFaceEmbeddings(
model_name="sentence-transformers/paraphrase-multilingual-mpnet-base-v2"
)
self.vector_store = FAISS.from_documents(chunks, embedding_function)
self.vector_store.save_local(vector_store_dir)
# Load model
model_name = "ALLaM-AI/ALLaM-7B-Instruct-preview"
self.tokenizer = AutoTokenizer.from_pretrained(
model_name,
trust_remote_code=True,
use_fast=False
)
self.model = AutoModelForCausalLM.from_pretrained(
model_name,
torch_dtype=torch.bfloat16,
trust_remote_code=True,
device_map="auto",
)
self.initialized = True
return True
except Exception as e:
import traceback
print(f"Initialization error: {e}")
print(traceback.format_exc())
return False
@spaces.GPU
def retrieve_context(self, query, top_k=5):
"""Retrieve contexts from vector store"""
# Import must be inside the function to avoid CUDA init in main process
if not self.initialized:
return []
try:
results = self.vector_store.similarity_search_with_score(query, k=top_k)
contexts = []
for doc, score in results:
contexts.append({
"content": doc.page_content,
"source": doc.metadata.get("source", "Unknown"),
"relevance_score": score
})
return contexts
except Exception as e:
print(f"Error retrieving context: {e}")
return []
@spaces.GPU
def generate_response(self, query, contexts, language="auto"):
"""Generate response using the model"""
# Import must be inside the function to avoid CUDA init in main process
import torch
if not self.initialized or self.model is None or self.tokenizer is None:
return "I'm still initializing. Please try again in a moment."
try:
# Auto-detect language if not specified
if language == "auto":
language = detect_language(query)
# Format the prompt based on language
if language == "arabic":
instruction = (
"أنت مساعد افتراضي يهتم برؤية السعودية 2030. استخدم المعلومات التالية للإجابة على السؤال. "
"إذا لم تعرف الإجابة، فقل بأمانة إنك لا تعرف."
)
else: # english
instruction = (
"You are a virtual assistant for Saudi Vision 2030. Use the following information to answer the question. "
"If you don't know the answer, honestly say you don't know."
)
# Combine retrieved contexts
context_text = "\n\n".join([f"Document: {ctx['content']}" for ctx in contexts])
# Format the prompt for ALLaM instruction format
prompt = f"""<s>[INST] {instruction}
Context:
{context_text}
Question: {query} [/INST]</s>"""
# Generate response
inputs = self.tokenizer(prompt, return_tensors="pt").to(self.model.device)
outputs = self.model.generate(
inputs.input_ids,
attention_mask=inputs.attention_mask,
max_new_tokens=512,
temperature=0.7,
top_p=0.9,
do_sample=True,
repetition_penalty=1.1
)
# Decode the response
full_output = self.tokenizer.decode(outputs[0], skip_special_tokens=True)
# Extract just the answer part (after the instruction)
response = full_output.split("[/INST]")[-1].strip()
# If response is empty for some reason, return the full output
if not response:
response = full_output
return response
except Exception as e:
import traceback
print(f"Error generating response: {e}")
print(traceback.format_exc())
return f"Sorry, I encountered an error while generating a response."
@spaces.GPU
def answer_question(self, query):
"""Process a user query and return a response with sources"""
if not self.initialized:
if not self.initialize():
return "System initialization failed. Please check the logs.", []
try:
# Add user query to conversation history
self.conversation_history.append({"role": "user", "content": query})
# Get the full conversation context
conversation_context = "\n".join([
f"{'User' if msg['role'] == 'user' else 'Assistant'}: {msg['content']}"
for msg in self.conversation_history[-6:] # Keep last 3 turns
])
# Enhance query with conversation context
enhanced_query = f"{conversation_context}\n{query}"
# Retrieve relevant contexts
contexts = self.retrieve_context(enhanced_query, top_k=5)
# Generate response
response = self.generate_response(query, contexts)
# Add response to conversation history
self.conversation_history.append({"role": "assistant", "content": response})
# Get sources
sources = [ctx.get("source", "Unknown") for ctx in contexts]
unique_sources = list(set(sources))
return response, unique_sources
except Exception as e:
import traceback
print(f"Error answering question: {e}")
print(traceback.format_exc())
return f"Sorry, I encountered an error: {str(e)}", []
def reset_conversation(self):
"""Reset the conversation history"""
self.conversation_history = []
return "Conversation has been reset."
def main():
# Create the Vision 2030 service
service = Vision2030Service()
# Define theme and styling
theme = gr.themes.Soft(
primary_hue="emerald",
secondary_hue="teal",
).set(
body_background_fill="linear-gradient(to right, #f0f9ff, #e6f7ff)",
button_primary_background_fill="linear-gradient(90deg, #1e9e5a, #1d8753)",
button_primary_background_fill_hover="linear-gradient(90deg, #1d8753, #176f44)",
button_primary_text_color="white",
button_secondary_background_fill="#f0f0f0",
button_secondary_background_fill_hover="#e0e0e0",
block_title_text_weight="600",
block_border_width="2px",
block_shadow="0px 4px 6px rgba(0, 0, 0, 0.1)",
background_fill_primary="#ffffff",
)
# Build the Gradio interface with enhanced styling
with gr.Blocks(title="Vision 2030 Assistant", theme=theme, css="""
.language-toggle { margin-bottom: 20px; }
.container { border-radius: 10px; padding: 20px; box-shadow: 0 4px 6px rgba(0,0,0,0.1); }
.header-img { margin-bottom: 10px; border-radius: 10px; }
.highlight { background-color: rgba(46, 175, 125, 0.1); padding: 15px; border-radius: 8px; margin: 10px 0; }
.footer { text-align: center; margin-top: 30px; color: #666; font-size: 0.9em; }
.loading-spinner { display: inline-block; width: 20px; height: 20px; margin-right: 10px; }
.status-indicator { display: inline-flex; align-items: center; padding: 8px; border-radius: 4px; }
.status-indicator.success { background-color: rgba(46, 175, 125, 0.2); }
.status-indicator.warning { background-color: rgba(255, 190, 0, 0.2); }
.status-indicator.error { background-color: rgba(255, 76, 76, 0.2); }
.header { display: flex; justify-content: space-between; align-items: center; }
.lang-btn { min-width: 100px; }
.chat-input { background-color: white; border-radius: 8px; border: 1px solid #ddd; }
.info-box { background-color: #f8f9fa; padding: 10px; border-radius: 8px; margin-top: 10px; }
/* Style for sample question buttons */
.gradio-button.secondary {
margin-bottom: 8px;
text-align: left;
background-color: #f0f9ff;
transition: all 0.3s ease;
display: block;
width: 100%;
padding: 8px 12px;
}
.gradio-button.secondary:hover {
background-color: #e0f2fe;
transform: translateX(3px);
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}
""") as demo:
# Header with stylized title (no external images)
with gr.Row():
with gr.Column():
with gr.Row():
# Add local logo image on the left
with gr.Column(scale=1, min_width=100):
gr.Image("logo.png", show_label=False, height=80)
# Title and tagline on the right
with gr.Column(scale=4):
gr.Markdown("""
# Vision 2030 Assistant
### Your interactive guide to Saudi Arabia's national transformation program
""")
# Language toggle in the header with better styling
with gr.Row(elem_classes=["language-toggle"]):
with gr.Column(scale=1):
language_toggle = gr.Radio(
choices=["English", "العربية (Arabic)", "Auto-detect"],
value="Auto-detect",
label="Interface Language",
info="Choose your preferred language",
elem_classes=["lang-btn"]
)
# Main interface with tabs
with gr.Tabs() as tabs:
# Chat Tab with enhanced design
with gr.TabItem("💬 Chat", id="chat"):
with gr.Row():
with gr.Column(scale=2):
chatbot = gr.Chatbot(
height=450,
bubble_full_width=False,
show_label=False
)
with gr.Row():
msg = gr.Textbox(
label="",
placeholder="Ask a question about Saudi Vision 2030...",
show_label=False,
elem_classes=["chat-input"],
scale=9
)
submit_btn = gr.Button("Send", variant="primary", scale=1)
with gr.Row():
clear = gr.Button("Clear History", variant="secondary")
thinking_indicator = gr.HTML(
value='<div id="thinking" style="display:none;">The assistant is thinking...</div>',
visible=True
)
# Sidebar with features
with gr.Column(scale=1):
gr.Markdown("### Quick Information")
with gr.Accordion("Vision 2030 Pillars", open=False):
gr.Markdown("""
* **Vibrant Society** - Cultural and social development
* **Thriving Economy** - Economic diversification
* **Ambitious Nation** - Effective governance
""")
with gr.Accordion("About this Assistant", open=False):
gr.Markdown("""
This assistant uses advanced NLP models to answer questions about Saudi Vision 2030 in both English and Arabic. The system retrieves information from official documents and provides relevant answers.
""")
system_status = gr.HTML(
value='<div class="status-indicator warning">⚠️ System initializing</div>',
visible=True
)
init_btn = gr.Button("Initialize System", variant="primary")
# Replace dropdown with clickable buttons
gr.Markdown("### Sample Questions")
with gr.Group():
# English questions
q1_btn = gr.Button("What is Saudi Vision 2030?", variant="secondary")
q2_btn = gr.Button("What are the economic goals of Vision 2030?", variant="secondary")
q3_btn = gr.Button("How does Vision 2030 aim to improve quality of life?", variant="secondary")
# Arabic questions
q4_btn = gr.Button("ما هي رؤية السعودية 2030؟", variant="secondary")
q5_btn = gr.Button("ما هي الأهداف الاقتصادية لرؤية 2030؟", variant="secondary")
q6_btn = gr.Button("كيف تعزز رؤية 2030 الإرث الثقافي السعودي؟", variant="secondary")
# Analytics and insights tab
with gr.TabItem("📊 Analytics", id="analytics"):
gr.Markdown("### Vision 2030 Progress Tracking")
with gr.Tabs():
with gr.TabItem("Economic Metrics"):
gr.Markdown("""
<div class="highlight">
<h3>Key Economic Indicators</h3>
<p>This section displays real-time progress on economic targets of Vision 2030.</p>
</div>
""")
with gr.Row():
with gr.Column():
gr.HTML("""
<div style="background: white; padding: 15px; border-radius: 10px; box-shadow: 0 2px 5px rgba(0,0,0,0.1);">
<h4>GDP Non-oil Growth</h4>
<div style="height: 20px; background-color: #e0e0e0; border-radius: 10px; margin: 10px 0;">
<div style="height: 100%; width: 68%; background: linear-gradient(to right, #1e9e5a, #63e6be); border-radius: 10px;">
</div>
</div>
<div style="display: flex; justify-content: space-between;">
<span>Target: 65%</span>
<span>Current: 44%</span>
</div>
</div>
""")
with gr.Column():
gr.HTML("""
<div style="background: white; padding: 15px; border-radius: 10px; box-shadow: 0 2px 5px rgba(0,0,0,0.1);">
<h4>Unemployment Rate</h4>
<div style="height: 20px; background-color: #e0e0e0; border-radius: 10px; margin: 10px 0;">
<div style="height: 100%; width: 55%; background: linear-gradient(to right, #1e9e5a, #63e6be); border-radius: 10px;">
</div>
</div>
<div style="display: flex; justify-content: space-between;">
<span>Target: 7%</span>
<span>Current: 9.9%</span>
</div>
</div>
""")
with gr.Column():
gr.HTML("""
<div style="background: white; padding: 15px; border-radius: 10px; box-shadow: 0 2px 5px rgba(0,0,0,0.1);">
<h4>SME Contribution to GDP</h4>
<div style="height: 20px; background-color: #e0e0e0; border-radius: 10px; margin: 10px 0;">
<div style="height: 100%; width: 32%; background: linear-gradient(to right, #1e9e5a, #63e6be); border-radius: 10px;">
</div>
</div>
<div style="display: flex; justify-content: space-between;">
<span>Target: 35%</span>
<span>Current: 22%</span>
</div>
</div>
""")
with gr.TabItem("Social Development"):
gr.Markdown("#### Social Initiative Progress")
social_chart = gr.HTML("""
<div style="background: white; padding: 20px; border-radius: 10px; margin-top: 15px;">
<h3>Quality of Life Improvement Programs</h3>
<div style="display: flex; height: 200px; align-items: flex-end; justify-content: space-around; margin: 30px 0;">
<div style="display: flex; flex-direction: column; align-items: center;">
<div style="width: 50px; height: 150px; background: linear-gradient(to top, #1e9e5a, #63e6be); border-radius: 5px 5px 0 0;"></div>
<span style="margin-top: 10px;">Tourism</span>
</div>
<div style="display: flex; flex-direction: column; align-items: center;">
<div style="width: 50px; height: 120px; background: linear-gradient(to top, #1e9e5a, #63e6be); border-radius: 5px 5px 0 0;"></div>
<span style="margin-top: 10px;">Entertainment</span>
</div>
<div style="display: flex; flex-direction: column; align-items: center;">
<div style="width: 50px; height: 180px; background: linear-gradient(to top, #1e9e5a, #63e6be); border-radius: 5px 5px 0 0;"></div>
<span style="margin-top: 10px;">Healthcare</span>
</div>
<div style="display: flex; flex-direction: column; align-items: center;">
<div style="width: 50px; height: 100px; background: linear-gradient(to top, #1e9e5a, #63e6be); border-radius: 5px 5px 0 0;"></div>
<span style="margin-top: 10px;">Housing</span>
</div>
<div style="display: flex; flex-direction: column; align-items: center;">
<div style="width: 50px; height: 160px; background: linear-gradient(to top, #1e9e5a, #63e6be); border-radius: 5px 5px 0 0;"></div>
<span style="margin-top: 10px;">Education</span>
</div>
</div>
</div>
""")
with gr.TabItem("Giga-Projects"):
gr.Markdown("#### Major Development Projects")
with gr.Row():
for project, desc in [
("NEOM", "A $500 billion mega-city with advanced technologies"),
("Red Sea Project", "Luxury tourism destination across 28,000 km²"),
("Qiddiya", "Entertainment, sports and arts destination")
]:
with gr.Column():
gr.HTML(f"""
<div style="background: white; padding: 15px; border-radius: 10px; box-shadow: 0 2px 5px rgba(0,0,0,0.1); height: 200px; position: relative; overflow: hidden;">
<div style="position: absolute; top: 0; left: 0; width: 100%; height: 70px; background: linear-gradient(90deg, #1e9e5a, #45b08c); border-radius: 10px 10px 0 0;"></div>
<div style="position: relative; padding-top: 80px; text-align: center;">
<h3>{project}</h3>
<p>{desc}</p>
<button style="background: #1e9e5a; color: white; border: none; padding: 8px 15px; border-radius: 5px; cursor: pointer; margin-top: 15px;">Learn More</button>
</div>
</div>
""")
# Technical System Status with improved visualization
with gr.TabItem("⚙️ System", id="system"):
with gr.Row():
with gr.Column():
gr.Markdown("### System Diagnostics")
status_box = gr.Textbox(
label="Status",
value="System not initialized",
lines=1
)
with gr.Group():
gr.Markdown("### PDF Documents")
pdf_status = gr.Dataframe(
headers=["File", "Status", "Size"],
datatype=["str", "str", "str"],
col_count=(3, "fixed"),
value=[["saudi_vision203.pdf", "Checking...", ""],
["saudi_vision2030_ar.pdf", "Checking...", ""]]
)
pdf_btn = gr.Button("Check PDF Files", variant="secondary")
gr.Markdown("### System Dependencies")
sys_status = gr.Dataframe(
headers=["Component", "Status"],
datatype=["str", "str"],
col_count=(2, "fixed"),
value=[["PyTorch", "Not checked"],
["Transformers", "Not checked"],
["LangChain", "Not checked"],
["FAISS", "Not checked"]]
)
sys_btn = gr.Button("Check Dependencies", variant="secondary")
# Visualization column
with gr.Column():
gr.Markdown("### System Architecture")
gr.HTML("""
<div style="background: white; padding: 20px; border-radius: 10px; margin-top: 15px;">
<svg viewBox="0 0 800 500" xmlns="http://www.w3.org/2000/svg">
<!-- User Input -->
<rect x="50" y="50" width="150" height="60" rx="10" fill="#e6f7ff" stroke="#1e9e5a" stroke-width="2"/>
<text x="125" y="85" text-anchor="middle" font-size="16">User Query</text>
<!-- Arrow down -->
<path d="M125 110 L125 160" stroke="#1e9e5a" stroke-width="3" stroke-dasharray="5,5"/>
<polygon points="125,170 120,160 130,160" fill="#1e9e5a"/>
<!-- RAG System -->
<rect x="50" y="170" width="150" height="60" rx="10" fill="#e6f7ff" stroke="#1e9e5a" stroke-width="2"/>
<text x="125" y="205" text-anchor="middle" font-size="16">RAG System</text>
<!-- Arrow right -->
<path d="M200 200 L300 200" stroke="#1e9e5a" stroke-width="3" stroke-dasharray="5,5"/>
<polygon points="310,200 300,195 300,205" fill="#1e9e5a"/>
<!-- Document Store -->
<rect x="310" y="170" width="150" height="60" rx="10" fill="#e6f7ff" stroke="#1e9e5a" stroke-width="2"/>
<text x="385" y="195" text-anchor="middle" font-size="16">Vector Store</text>
<text x="385" y="215" text-anchor="middle" font-size="14">(FAISS)</text>
<!-- Document icons -->
<rect x="350" y="270" width="30" height="40" fill="#e6f7ff" stroke="#1e9e5a" stroke-width="1"/>
<rect x="355" y="265" width="30" height="40" fill="#e6f7ff" stroke="#1e9e5a" stroke-width="1"/>
<rect x="360" y="260" width="30" height="40" fill="#e6f7ff" stroke="#1e9e5a" stroke-width="1"/>
<text x="375" y="330" text-anchor="middle" font-size="14">PDF Docs</text>
<!-- Arrow up -->
<path d="M375 260 L375 230" stroke="#1e9e5a" stroke-width="2"/>
<polygon points="375,230 370,240 380,240" fill="#1e9e5a"/>
<!-- Arrow back to RAG -->
<path d="M310 220 L200 220" stroke="#1e9e5a" stroke-width="3" stroke-dasharray="5,5"/>
<polygon points="190,220 200,215 200,225" fill="#1e9e5a"/>
<!-- Arrow down from RAG -->
<path d="M125 230 L125 280" stroke="#1e9e5a" stroke-width="3"/>
<polygon points="125,290 120,280 130,280" fill="#1e9e5a"/>
<!-- LLM -->
<rect x="50" y="290" width="150" height="60" rx="10" fill="#e6f7ff" stroke="#1e9e5a" stroke-width="2"/>
<text x="125" y="315" text-anchor="middle" font-size="16">ALLaM Model</text>
<text x="125" y="335" text-anchor="middle" font-size="14">(7B Params)</text>
<!-- Arrow down -->
<path d="M125 350 L125 400" stroke="#1e9e5a" stroke-width="3"/>
<polygon points="125,410 120,400 130,400" fill="#1e9e5a"/>
<!-- User Response -->
<rect x="50" y="410" width="150" height="60" rx="10" fill="#e6f7ff" stroke="#1e9e5a" stroke-width="2"/>
<text x="125" y="445" text-anchor="middle" font-size="16">Response</text>
</svg>
</div>
""")
# Memory usage visualization
gr.Markdown("### System Resources")
gr.HTML("""
<div style="background: white; padding: 15px; border-radius: 10px; box-shadow: 0 2px 5px rgba(0,0,0,0.1); margin-top: 15px;">
<h4>GPU Memory Usage</h4>
<div style="height: 20px; background-color: #e0e0e0; border-radius: 10px; margin: 10px 0;">
<div style="height: 100%; width: 72%; background: linear-gradient(to right, #1e9e5a, #ffc107); border-radius: 10px;">
</div>
</div>
<div style="display: flex; justify-content: space-between;">
<span>Total: 16GB</span>
<span>Used: 11.5GB</span>
</div>
<h4 style="margin-top: 20px;">CPU Usage</h4>
<div style="height: 20px; background-color: #e0e0e0; border-radius: 10px; margin: 10px 0;">
<div style="height: 100%; width: 45%; background: linear-gradient(to right, #1e9e5a, #63e6be); border-radius: 10px;">
</div>
</div>
<div style="display: flex; justify-content: space-between;">
<span>0%</span>
<span>45%</span>
<span>100%</span>
</div>
</div>
""")
# Footer
gr.HTML("""
<div class="footer">
<p>Vision 2030 Assistant • Powered by ALLaM-7B-Instruct • © 2025</p>
</div>
""")
# JavaScript for animations and enhanced UI effects
demo.load(js="""
function setupThinking() {
const thinking = document.getElementById('thinking');
function animateThinking() {
if (thinking) {
thinking.style.display = 'block';
let dots = '.';
setInterval(() => {
dots = dots.length < 3 ? dots + '.' : '.';
thinking.innerHTML = `<div class="status-indicator">🤔 The assistant is thinking${dots}</div>`;
}, 500);
}
}
// Demo code to show the thinking animation
document.querySelectorAll('button').forEach(btn => {
if (btn.textContent.includes('Send')) {
btn.addEventListener('click', () => {
setTimeout(() => {
animateThinking();
}, 100);
});
}
});
}
// Run setup when page loads
if (document.readyState === 'complete') {
setupThinking();
} else {
window.addEventListener('load', setupThinking);
}
""")
# Event handlers
@spaces.GPU
def respond(message, history):
if not message:
return history, ""
# Set thinking indicator
time.sleep(0.5) # Simulate thinking time
response, sources = service.answer_question(message)
sources_text = ", ".join(sources) if sources else "No specific sources"
# Format the response to include sources
full_response = f"{response}\n\nSources: {sources_text}"
return history + [[message, full_response]], ""
def reset_chat():
service.reset_conversation()
return [], "Conversation history has been reset."
@spaces.GPU
def initialize_system():
success = service.initialize()
# Update system status indicator with styled HTML
if success:
status_html = '<div class="status-indicator success">✅ System initialized and ready</div>'
return "System initialized successfully!", status_html
else:
status_html = '<div class="status-indicator error">❌ System initialization failed</div>'
return "System initialization failed. Check logs for details.", status_html
def use_sample_question(question):
return question
def check_pdfs():
result = []
for pdf_file in ["saudi_vision203.pdf", "saudi_vision2030_ar.pdf"]:
if os.path.exists(pdf_file):
size = os.path.getsize(pdf_file) / (1024 * 1024) # Size in MB
result.append([pdf_file, "Found ✅", f"{size:.2f} MB"])
else:
result.append([pdf_file, "Not found ❌", "0 MB"])
return result
@spaces.GPU
def check_dependencies():
result = []
# Safe imports inside GPU-decorated function
try:
import torch
result.append(["PyTorch", f"✅ {torch.__version__}"])
except ImportError:
result.append(["PyTorch", "❌ Not installed"])
try:
import transformers
result.append(["Transformers", f"✅ {transformers.__version__}"])
except ImportError:
result.append(["Transformers", "❌ Not installed"])
try:
import langchain
result.append(["LangChain", f"✅ {langchain.__version__}"])
except ImportError:
result.append(["LangChain", "❌ Not installed"])
try:
import faiss
result.append(["FAISS", "✅ Installed"])
except ImportError:
result.append(["FAISS", "❌ Not installed"])
return result
# Connect event handlers
msg.submit(respond, [msg, chatbot], [chatbot, msg])
submit_btn.click(respond, [msg, chatbot], [chatbot, msg])
clear.click(reset_chat, None, [chatbot, msg])
init_btn.click(initialize_system, None, [status_box, system_status])
# Connect all sample question buttons to the message input
q1_btn.click(lambda: "What is Saudi Vision 2030?", None, msg)
q2_btn.click(lambda: "What are the economic goals of Vision 2030?", None, msg)
q3_btn.click(lambda: "How does Vision 2030 aim to improve quality of life?", None, msg)
q4_btn.click(lambda: "ما هي رؤية السعودية 2030؟", None, msg)
q5_btn.click(lambda: "ما هي الأهداف الاقتصادية لرؤية 2030؟", None, msg)
q6_btn.click(lambda: "كيف تعزز رؤية 2030 الإرث الثقافي السعودي؟", None, msg)
pdf_btn.click(check_pdfs, None, pdf_status)
sys_btn.click(check_dependencies, None, sys_status)
# Initialize system on page load
demo.load(initialize_system, None, [status_box, system_status])
return demo
if __name__ == "__main__":
demo = main()
demo.queue()
demo.launch()