restart

.gitignore

@@ -0,0 +1,25 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+
+# testing
+/coverage
+
+# production
+.venv/
+__pycache__/
+input/
+.env
+# misc
+.DS_Store
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*

README.md

@@ -0,0 +1,13 @@
+---
+title: LabAid V2
+emoji: 🧪
+colorFrom: indigo
+colorTo: red
+sdk: docker
+app_file: Dockerfile
+pinned: false
+---
+
+# LabAid V2 - HPLC Instrument Assistant
+
+This Space combines a FastAPI RAG backend (powered by LangChain + Together AI) and a React frontend. It provides HPLC troubleshooting assistance by retrieving knowledge from a Chroma vector database.

api_service.py

@@ -0,0 +1,145 @@
+import os
+import sqlite3  # May be used elsewhere
+from dotenv import load_dotenv
+from fastapi import FastAPI, HTTPException
+from fastapi.middleware.cors import CORSMiddleware
+from pydantic import BaseModel
+from typing import List
+from contextlib import asynccontextmanager
+
+from langchain.schema import Document
+from langchain_together import ChatTogether, TogetherEmbeddings
+from langchain_core.prompts import ChatPromptTemplate
+from langchain_core.output_parsers import StrOutputParser
+from langchain_core.runnables import RunnablePassthrough
+from langchain_core.documents import Document
+
+import chromadb
+from langchain_community.vectorstores import Chroma  # ✅ Updated import
+
+# --- 1. Environment & Constants ---
+load_dotenv()
+
+TOGETHER_API_KEY = os.getenv("TOGETHER_API_KEY")
+if not TOGETHER_API_KEY:
+    raise ValueError("TOGETHER_API_KEY environment variable not set. Please check your .env file.")
+
+VECTOR_DB_DIR = "vector_db_chroma"
+COLLECTION_NAME = "my_instrument_manual_chunks"
+
+LLM_MODEL_NAME = "meta-llama/Meta-Llama-3.1-8B-Instruct-Turbo"
+EMBEDDINGS_MODEL_NAME = "togethercomputer/m2-bert-80M-32k-retrieval"
+
+# --- 2. Lifespan Event Handler ---
+@asynccontextmanager
+async def lifespan(app: FastAPI):
+    global rag_chain, retriever, prompt, llm
+
+    print("--- Initializing RAG components ---")
+    try:
+        llm = ChatTogether(
+            model=LLM_MODEL_NAME,
+            temperature=0.3,
+            api_key=TOGETHER_API_KEY
+        )
+        print(f"LLM {LLM_MODEL_NAME} initialized.")
+
+        embeddings = TogetherEmbeddings(
+            model=EMBEDDINGS_MODEL_NAME,
+            api_key=TOGETHER_API_KEY
+        )
+        client = chromadb.PersistentClient(path=VECTOR_DB_DIR)
+        vectorstore = Chroma(
+            client=client,
+            collection_name=COLLECTION_NAME,
+            embedding_function=embeddings
+        )
+        retriever = vectorstore.as_retriever(search_kwargs={"k": 5})
+        print("Retriever initialized.")
+
+        answer_prompt = """ You are a professional HPLC instrument troubleshooting expert who specializes in helping junior researchers and students.
+                            Your task is to answer the user's troubleshooting questions in detail and clearly based on the HPLC instrument knowledge provided below.
+                            If there is no direct answer in the knowledge, please provide the most reasonable speculative suggestions based on your expert judgment, or ask further clarifying questions.
+                            Please ensure that your answers are logically clear, easy to understand, and directly address the user's questions."""
+        prompt = ChatPromptTemplate.from_messages([
+            ("system", answer_prompt),
+            ("user", "context: {context}\n\nquestion: {question}"),
+        ])
+
+        def format_docs(docs: List[Document]) -> str:
+            return "\n\n".join(doc.page_content for doc in docs)
+
+        rag_chain = (
+            {"context": retriever | format_docs, "question": RunnablePassthrough()}
+            | prompt
+            | llm
+            | StrOutputParser()
+        )
+        print("RAG chain ready.")
+
+    except Exception as e:
+        raise RuntimeError(f"Failed to initialize RAG chain: {e}")
+
+    yield  # Keep app running
+
+# --- 3. Initialize FastAPI App ---
+app = FastAPI(
+    title="LabAid AI",
+    description="API service for a Retrieval-Augmented Generation (RAG) AI assistant.",
+    version="1.0.0",
+    lifespan=lifespan  # ✅ Updated lifespan hook
+)
+
+# --- 4. CORS Middleware ---
+origins = [
+    "http://localhost",
+    "http://localhost:3000",
+    "http://127.0.0.1:8000",
+]
+
+app.add_middleware(
+    CORSMiddleware,
+    allow_origins=origins,
+    allow_credentials=True,
+    allow_methods=["*"],
+    allow_headers=["*"],
+)
+
+# --- 5. Request/Response Models ---
+class QueryRequest(BaseModel):
+    query: str
+
+class QueryResponse(BaseModel):
+    answer: str
+    source_documents: List[str]
+
+# --- 6. RAG Query Endpoint ---
+@app.post("/ask", response_model=QueryResponse)
+async def ask_rag(request: QueryRequest):
+    if rag_chain is None or retriever is None:
+        raise HTTPException(status_code=500, detail="RAG chain not initialized.")
+
+    try:
+        user_query = request.query
+        print(f"Received query: {user_query}")
+
+        retrieved_docs = retriever.invoke(user_query)
+        formatted_context = "\n\n".join(doc.page_content for doc in retrieved_docs)
+
+        answer = (prompt | llm | StrOutputParser()).invoke({
+            "context": formatted_context,
+            "question": user_query
+        })
+
+        sources = [doc.page_content for doc in retrieved_docs]
+        return QueryResponse(answer=answer, source_documents=sources)
+
+    except Exception as e:
+        print(f"Error: {e}")
+        raise HTTPException(status_code=500, detail=f"Failed to process query: {e}")
+
+# --- 7. Run Command Hint ---
+# Run this API with:
+# uvicorn api_service:app --reload --port 8000
+# The --port 8000 parameter specifies the port where the service will run.
+# Open your browser at http://127.0.0.1:8000/docs#/default/ask_rag_ask_post

app.py

@@ -0,0 +1,6 @@
+# app.py
+import uvicorn
+from api_service import app  # 假設你目前這份程式碼存成 api_service.py
+
+if __name__ == "__main__":
+    uvicorn.run(app, host="0.0.0.0", port=7860)

build/asset-manifest.json

@@ -0,0 +1,15 @@
+{
+  "files": {
+    "main.css": "./static/css/main.1eeb7222.css",
+    "main.js": "./static/js/main.d1af9f99.js",
+    "static/js/453.ed3810f9.chunk.js": "./static/js/453.ed3810f9.chunk.js",
+    "index.html": "./index.html",
+    "main.1eeb7222.css.map": "./static/css/main.1eeb7222.css.map",
+    "main.d1af9f99.js.map": "./static/js/main.d1af9f99.js.map",
+    "453.ed3810f9.chunk.js.map": "./static/js/453.ed3810f9.chunk.js.map"
+  },
+  "entrypoints": [
+    "static/css/main.1eeb7222.css",
+    "static/js/main.d1af9f99.js"
+  ]
+}

build/index.html

@@ -0,0 +1 @@
+<!doctype html><html lang="en"><head><meta charset="utf-8"/><link rel="icon" href="./favicon.ico"/><meta name="viewport" content="width=device-width,initial-scale=1"/><meta name="theme-color" content="#000000"/><meta name="description" content="Web site created using create-react-app"/><link rel="apple-touch-icon" href="./logo192.png"/><link rel="manifest" href="./manifest.json"/><title>React App</title><script defer="defer" src="./static/js/main.d1af9f99.js"></script><link href="./static/css/main.1eeb7222.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div></body></html>

build/manifest.json

@@ -0,0 +1,25 @@
+{
+  "short_name": "React App",
+  "name": "Create React App Sample",
+  "icons": [
+    {
+      "src": "favicon.ico",
+      "sizes": "64x64 32x32 24x24 16x16",
+      "type": "image/x-icon"
+    },
+    {
+      "src": "logo192.png",
+      "type": "image/png",
+      "sizes": "192x192"
+    },
+    {
+      "src": "logo512.png",
+      "type": "image/png",
+      "sizes": "512x512"
+    }
+  ],
+  "start_url": ".",
+  "display": "standalone",
+  "theme_color": "#000000",
+  "background_color": "#ffffff"
+}

build/robots.txt

@@ -0,0 +1,3 @@
+# https://www.robotstxt.org/robotstxt.html
+User-agent: *
+Disallow:

build/static/css/main.1eeb7222.css

@@ -0,0 +1,2 @@
+body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;margin:0}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.chat-container{font-family:Arial,sans-serif;height:100vh;margin:auto;max-width:800px}.chat-header{background-color:#4a90e2;font-size:1.5rem;padding:16px}.chat-messages{background-color:#f5f5f5;padding:16px}.chat-bubble{word-wrap:break-word;border-radius:16px;max-width:70%;padding:12px;white-space:pre-wrap}.chat-bubble.user{align-self:flex-end;background-color:#dcf8c6}.chat-bubble.ai{align-self:flex-start;background-color:#fff;border:1px solid #ddd}.chat-bubble.loading{font-style:italic;opacity:.6}.chat-input-area{background-color:#fff;border-top:1px solid #ccc;padding:12px}.chat-input-area input{border:1px solid #ccc;margin-right:8px;padding:8px}.chat-input-area button{background-color:#4a90e2;padding:8px 16px}.chat-input-area button:disabled{background-color:#a0c4f2;cursor:not-allowed}.back-button{background-color:#f2f2f2;border:none;border-radius:8px;cursor:pointer;float:right;font-size:14px;margin-right:20px;padding:6px 12px}.back-button:hover{background-color:#ddd}.App{text-align:center}.App-logo{height:40vmin;pointer-events:none}@media (prefers-reduced-motion:no-preference){.App-logo{animation:App-logo-spin 20s linear infinite}}.App-header{align-items:center;background-color:#282c34;color:#fff;display:flex;flex-direction:column;font-size:calc(10px + 2vmin);justify-content:center;min-height:100vh}.App-link{color:#61dafb}@keyframes App-logo-spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.landing-container{display:flex;flex-direction:column;font-family:Arial,sans-serif;min-height:100vh}.landing-footer,.landing-header{align-items:center;background:#f8f9fb;display:flex;justify-content:space-between;padding:20px 40px}.landing-main{align-items:center;display:flex;flex:1 1;flex-direction:column;padding:40px}.landing-header .logo{font-size:1.5rem;font-weight:700}.landing-nav a,.lang-select{color:#222;margin:0 10px;text-decoration:none}.start-btn{background:#2563eb;border:none;border-radius:8px;color:#fff;cursor:pointer;font-size:1.1rem;margin:24px 0;padding:14px 32px}.how-it-works{margin:40px 0;max-width:900px;width:100%}.how-it-works h2{text-align:center}.steps{display:flex;justify-content:space-between}.step{background:#fff;border-radius:12px;box-shadow:0 2px 8px #e5e7eb;flex:1 1;margin:0 10px;padding:24px;text-align:center}.step-number{align-items:center;background:#2563eb;border-radius:50%;color:#fff;display:flex;font-size:1.2rem;height:40px;justify-content:center;margin:0 auto 12px;width:40px}.download-resources{margin:40px 0;max-width:900px;width:100%}.download-resources h2{text-align:center}.resources{display:flex;justify-content:space-between}.resource-card{background:#fff;border-radius:12px;box-shadow:0 2px 8px #e5e7eb;flex:1 1;margin:0 10px;padding:24px;text-align:center}.view-all{color:#2563eb;display:block;margin-top:16px;text-align:right;text-decoration:none}.chat-container{background:#f4f6fa;display:flex;flex-direction:column;min-height:100vh}.chat-header{background:#2563eb;color:#fff;font-size:1.3rem;padding:20px;text-align:center}.chat-messages{display:flex;flex:1 1;flex-direction:column;gap:12px;overflow-y:auto;padding:24px}.chat-message{border-radius:16px;margin-bottom:8px;max-width:60%;padding:12px 18px}.chat-message.user{align-self:flex-end;background:#2563eb;color:#fff}.chat-message.ai{align-self:flex-start;background:#fff;border:1px solid #e5e7eb;color:#222}.chat-input-area{background:#fff;border-top:1px solid #e5e7eb;display:flex;padding:16px}.chat-input-area input{border:1px solid #e5e7eb;border-radius:8px;flex:1 1;font-size:1rem;margin-right:10px;padding:10px}.chat-input-area button{background:#2563eb;border:none;border-radius:8px;color:#fff;cursor:pointer;font-size:1rem;padding:10px 24px}.labassist-footer{align-items:center;background-color:#112;display:flex;flex-direction:column;padding:60px 40px}.footer-main-content{display:flex;flex-wrap:wrap;justify-content:space-between;margin-bottom:50px;max-width:1200px;width:100%}.footer-column{flex-basis:22%;margin-bottom:20px}.footer-column h4{color:#fff;font-size:1.1em;font-weight:700;margin-bottom:15px}.footer-column ul{list-style:none}.footer-column ul li{margin-bottom:8px}.footer-column ul li a{color:#b0b0b0;font-size:.95em;text-decoration:none;transition:color .3s ease}.footer-column ul li a:hover{color:#fff}.company-info{flex-basis:30%;min-width:250px}.company-logo-section{align-items:center;display:flex;margin-bottom:15px}.footer-logo{height:30px;margin-right:10px}.company-logo-section span{color:#fff;font-size:1.2em;font-weight:700}.company-info p{color:#b0b0b0;font-size:.9em;line-height:1.6;margin-bottom:20px}.social-icons{display:flex;gap:15px}.social-icons a img{filter:invert(100%) brightness(80%);height:20px;transition:filter .3s ease;width:20px}.social-icons a:hover img{filter:invert(100%) brightness(100%)}.footer-bottom-bar{align-items:center;border-top:1px solid #334;color:#889;display:flex;font-size:.85em;justify-content:space-between;max-width:1200px;padding-top:30px;width:100%}.footer-legal-links a{color:#889;margin-left:20px;text-decoration:none;transition:color .3s ease}.footer-legal-links a:hover{color:#fff}@media (max-width:768px){.labassist-footer{padding:40px 20px}.footer-main-content{align-items:flex-start;flex-direction:column;gap:30px}.footer-column{flex-basis:100%;max-width:100%}.footer-bottom-bar{flex-direction:column;text-align:center}.footer-legal-links{margin-top:15px}.footer-legal-links a{margin:0 10px}}@media (max-width:480px){.labassist-footer{padding:30px 15px}.footer-main-content{gap:20px}.social-icons{gap:10px}}
+/*# sourceMappingURL=main.1eeb7222.css.map*/

build/static/css/main.1eeb7222.css.map

@@ -0,0 +1 @@
+{"version":3,"file":"static/css/main.1eeb7222.css","mappings":"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","sources":["index.css","ChatPage.css","App.css","foot.css"],"sourcesContent":["body {\n  margin: 0;\n  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',\n    'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',\n    sans-serif;\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n}\n\ncode {\n  font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',\n    monospace;\n}\n",".chat-container {\r\n  display: flex;\r\n  flex-direction: column;\r\n  height: 100vh;\r\n  max-width: 800px;\r\n  margin: auto;\r\n  font-family: Arial, sans-serif;\r\n}\r\n\r\n.chat-header {\r\n  padding: 16px;\r\n  background-color: #4a90e2;\r\n  color: white;\r\n  font-size: 1.5rem;\r\n  text-align: center;\r\n}\r\n\r\n.chat-messages {\r\n  flex: 1;\r\n  padding: 16px;\r\n  overflow-y: auto;\r\n  background-color: #f5f5f5;\r\n  display: flex;\r\n  flex-direction: column;\r\n  gap: 12px;\r\n}\r\n\r\n.chat-bubble {\r\n  max-width: 70%;\r\n  padding: 12px;\r\n  border-radius: 16px;\r\n  white-space: pre-wrap;\r\n  word-wrap: break-word;\r\n}\r\n\r\n.chat-bubble.user {\r\n  align-self: flex-end;\r\n  background-color: #dcf8c6;\r\n}\r\n\r\n.chat-bubble.ai {\r\n  align-self: flex-start;\r\n  background-color: #ffffff;\r\n  border: 1px solid #ddd;\r\n}\r\n\r\n.chat-bubble.loading {\r\n  font-style: italic;\r\n  opacity: 0.6;\r\n}\r\n\r\n.chat-input-area {\r\n  display: flex;\r\n  padding: 12px;\r\n  border-top: 1px solid #ccc;\r\n  background-color: #fff;\r\n}\r\n\r\n.chat-input-area input {\r\n  flex: 1;\r\n  padding: 8px;\r\n  border: 1px solid #ccc;\r\n  border-radius: 8px;\r\n  margin-right: 8px;\r\n}\r\n\r\n.chat-input-area button {\r\n  padding: 8px 16px;\r\n  background-color: #4a90e2;\r\n  color: white;\r\n  border: none;\r\n  border-radius: 8px;\r\n  cursor: pointer;\r\n}\r\n\r\n.chat-input-area button:disabled {\r\n  background-color: #a0c4f2;\r\n  cursor: not-allowed;\r\n}\r\n\r\n.back-button {\r\n  float: right;\r\n  margin-right: 20px;\r\n  background-color: #f2f2f2;\r\n  border: none;\r\n  padding: 6px 12px;\r\n  border-radius: 8px;\r\n  cursor: pointer;\r\n  font-size: 14px;\r\n}\r\n\r\n.back-button:hover {\r\n  background-color: #ddd;\r\n}",".App {\n  text-align: center;\n}\n\n.App-logo {\n  height: 40vmin;\n  pointer-events: none;\n}\n\n@media (prefers-reduced-motion: no-preference) {\n  .App-logo {\n    animation: App-logo-spin infinite 20s linear;\n  }\n}\n\n.App-header {\n  background-color: #282c34;\n  min-height: 100vh;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  font-size: calc(10px + 2vmin);\n  color: white;\n}\n\n.App-link {\n  color: #61dafb;\n}\n\n@keyframes App-logo-spin {\n  from {\n    transform: rotate(0deg);\n  }\n  to {\n    transform: rotate(360deg);\n  }\n}\n\n/* Landing Page Styles */\n.landing-container { font-family: Arial, sans-serif; min-height: 100vh; display: flex; flex-direction: column; }\n.landing-header, .landing-footer { background: #f8f9fb; padding: 20px 40px; display: flex; justify-content: space-between; align-items: center; }\n.landing-main { flex: 1; padding: 40px; display: flex; flex-direction: column; align-items: center; }\n.landing-header .logo { font-weight: bold; font-size: 1.5rem; }\n.landing-nav a, .lang-select { margin: 0 10px; text-decoration: none; color: #222; }\n.start-btn { background: #2563eb; color: #fff; border: none; padding: 14px 32px; border-radius: 8px; font-size: 1.1rem; margin: 24px 0; cursor: pointer; }\n.how-it-works { margin: 40px 0; width: 100%; max-width: 900px; }\n.how-it-works h2 {text-align: center; }\n.steps { display: flex; justify-content: space-between; }\n.step { background: #fff; border-radius: 12px; box-shadow: 0 2px 8px #e5e7eb; padding: 24px; flex: 1; margin: 0 10px; text-align: center; }\n.step-number { background: #2563eb; color: #fff; border-radius: 50%; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; margin: 0 auto 12px; font-size: 1.2rem; }\n.download-resources { margin: 40px 0; width: 100%; max-width: 900px; }\n.download-resources h2 {text-align: center; }\n.resources { display: flex; justify-content: space-between; }\n.resource-card { background: #fff; border-radius: 12px; box-shadow: 0 2px 8px #e5e7eb; padding: 24px; flex: 1; margin: 0 10px; text-align: center; }\n.view-all { display: block; margin-top: 16px; text-align: right; color: #2563eb; text-decoration: none; }\n\n/* Chat Page Styles */\n.chat-container { min-height: 100vh; display: flex; flex-direction: column; background: #f4f6fa; }\n.chat-header { background: #2563eb; color: #fff; padding: 20px; font-size: 1.3rem; text-align: center; }\n.chat-messages { flex: 1; padding: 24px; overflow-y: auto; display: flex; flex-direction: column; gap: 12px; }\n.chat-message { max-width: 60%; padding: 12px 18px; border-radius: 16px; margin-bottom: 8px; }\n.chat-message.user { align-self: flex-end; background: #2563eb; color: #fff; }\n.chat-message.ai { align-self: flex-start; background: #fff; color: #222; border: 1px solid #e5e7eb; }\n.chat-input-area { display: flex; padding: 16px; background: #fff; border-top: 1px solid #e5e7eb; }\n.chat-input-area input { flex: 1; padding: 10px; border-radius: 8px; border: 1px solid #e5e7eb; margin-right: 10px; font-size: 1rem; }\n.chat-input-area button { background: #2563eb; color: #fff; border: none; border-radius: 8px; padding: 10px 24px; font-size: 1rem; cursor: pointer; }\n",".labassist-footer {\r\n  background-color: #111122; /* 頁腳背景色，比 body 略深 */\r\n  padding: 60px 40px; /* 上下左右內邊距 */\r\n  display: flex;\r\n  flex-direction: column; /* 讓主要內容和底部版權資訊垂直堆疊 */\r\n  align-items: center; /* 讓整個 footer 的內容水平居中（在有 max-width 的情況下） */\r\n}\r\n\r\n/* 主要內容區域：包含四個列 */\r\n.footer-main-content {\r\n  display: flex;\r\n  justify-content: space-between; /* 將四個列均勻分佈在水平空間 */\r\n  width: 100%; /* 佔滿父容器寬度 */\r\n  max-width: 1200px; /* 限制內容的最大寬度，使其不會太寬 */\r\n  margin-bottom: 50px; /* 與底部版權資訊的間距 */\r\n  flex-wrap: wrap; /* 允許在小螢幕上換行 */\r\n}\r\n\r\n/* 每一個列（公司資訊、Product、Support、Company） */\r\n.footer-column {\r\n  flex-basis: 22%; /* 讓每列佔據大約 22% 的空間，以便容納 4 列並留有間距 */\r\n  /* 可以根據內容調整 flex-basis，或者使用 flex-grow: 1; 讓它們自動分配空間 */\r\n  margin-bottom: 20px; /* 小螢幕換行時的間距 */\r\n}\r\n\r\n.footer-column h4 {\r\n  font-size: 1.1em;\r\n  color: #FFFFFF; /* 標題文字白色 */\r\n  margin-bottom: 15px; /* 標題與下方連結的間距 */\r\n  font-weight: bold;\r\n}\r\n\r\n.footer-column ul {\r\n  list-style: none; /* 移除列表點 */\r\n}\r\n\r\n.footer-column ul li {\r\n  margin-bottom: 8px; /* 連結之間的間距 */\r\n}\r\n\r\n.footer-column ul li a {\r\n  color: #B0B0B0; /* 連結文字顏色 */\r\n  text-decoration: none; /* 移除下劃線 */\r\n  font-size: 0.95em;\r\n  transition: color 0.3s ease; /* 平滑過渡效果 */\r\n}\r\n\r\n.footer-column ul li a:hover {\r\n  color: #FFFFFF; /* 鼠標懸停時變白 */\r\n}\r\n\r\n/* 左側公司資訊區塊特有樣式 */\r\n.company-info {\r\n  flex-basis: 30%; /* 給公司資訊列更多空間 */\r\n  min-width: 250px; /* 確保在小螢幕上有足夠寬度 */\r\n}\r\n\r\n.company-logo-section {\r\n  display: flex;\r\n  align-items: center;\r\n  margin-bottom: 15px;\r\n}\r\n\r\n.footer-logo {\r\n  height: 30px; /* Logo 高度 */\r\n  margin-right: 10px;\r\n}\r\n\r\n.company-logo-section span {\r\n  font-size: 1.2em;\r\n  font-weight: bold;\r\n  color: #FFFFFF;\r\n}\r\n\r\n.company-info p {\r\n  font-size: 0.9em;\r\n  line-height: 1.6;\r\n  margin-bottom: 20px;\r\n  color: #B0B0B0;\r\n}\r\n\r\n.social-icons {\r\n  display: flex;\r\n  gap: 15px; /* 圖標間距 */\r\n}\r\n\r\n.social-icons a img {\r\n  width: 20px; /* 圖標大小 */\r\n  height: 20px;\r\n  filter: invert(100%) brightness(80%); /* 將圖標顏色反轉為淺色 */\r\n  transition: filter 0.3s ease;\r\n}\r\n\r\n.social-icons a:hover img {\r\n  filter: invert(100%) brightness(100%); /* 鼠標懸停時變亮 */\r\n}\r\n\r\n\r\n/* 底部版權資訊區域 */\r\n.footer-bottom-bar {\r\n  border-top: 1px solid #333344; /* 上方加一條細分隔線 */\r\n  padding-top: 30px;\r\n  width: 100%;\r\n  max-width: 1200px; /* 與主要內容寬度保持一致 */\r\n  display: flex;\r\n  justify-content: space-between; /* 版權資訊靠左，法律連結靠右 */\r\n  align-items: center; /* 垂直居中對齊 */\r\n  font-size: 0.85em;\r\n  color: #888899; /* 較淺的灰色 */\r\n}\r\n\r\n.footer-legal-links a {\r\n  color: #888899;\r\n  text-decoration: none;\r\n  margin-left: 20px; /* 連結之間的間距 */\r\n  transition: color 0.3s ease;\r\n}\r\n\r\n.footer-legal-links a:hover {\r\n  color: #FFFFFF;\r\n}\r\n\r\n/* 響應式設計：小螢幕適應 */\r\n@media (max-width: 768px) {\r\n  .labassist-footer {\r\n    padding: 40px 20px;\r\n  }\r\n\r\n  .footer-main-content {\r\n    flex-direction: column; /* 小螢幕時，列變成垂直堆疊 */\r\n    align-items: flex-start; /* 讓每個列都靠左對齊 */\r\n    gap: 30px; /* 列之間的間距 */\r\n  }\r\n\r\n  .footer-column {\r\n    flex-basis: 100%; /* 每列佔據全部寬度 */\r\n    max-width: 100%; /* 確保最大寬度 */\r\n  }\r\n\r\n  .footer-bottom-bar {\r\n    flex-direction: column; /* 版權和法律連結垂直堆疊 */\r\n    text-align: center;\r\n  }\r\n\r\n  .footer-legal-links {\r\n    margin-top: 15px; /* 與版權資訊的間距 */\r\n  }\r\n\r\n  .footer-legal-links a {\r\n    margin: 0 10px; /* 調整連結間距 */\r\n  }\r\n}\r\n\r\n@media (max-width: 480px) {\r\n  .labassist-footer {\r\n    padding: 30px 15px;\r\n  }\r\n\r\n  .footer-main-content {\r\n    gap: 20px;\r\n  }\r\n\r\n  .social-icons {\r\n    gap: 10px;\r\n  }\r\n}"],"names":[],"sourceRoot":""}

build/static/js/453.ed3810f9.chunk.js

@@ -0,0 +1,2 @@
+"use strict";(self.webpackChunkmy_app=self.webpackChunkmy_app||[]).push([[453],{453:(e,t,n)=>{n.r(t),n.d(t,{getCLS:()=>y,getFCP:()=>g,getFID:()=>C,getLCP:()=>P,getTTFB:()=>D});var i,r,a,o,u=function(e,t){return{name:e,value:void 0===t?-1:t,delta:0,entries:[],id:"v2-".concat(Date.now(),"-").concat(Math.floor(8999999999999*Math.random())+1e12)}},c=function(e,t){try{if(PerformanceObserver.supportedEntryTypes.includes(e)){if("first-input"===e&&!("PerformanceEventTiming"in self))return;var n=new PerformanceObserver((function(e){return e.getEntries().map(t)}));return n.observe({type:e,buffered:!0}),n}}catch(e){}},f=function(e,t){var n=function n(i){"pagehide"!==i.type&&"hidden"!==document.visibilityState||(e(i),t&&(removeEventListener("visibilitychange",n,!0),removeEventListener("pagehide",n,!0)))};addEventListener("visibilitychange",n,!0),addEventListener("pagehide",n,!0)},s=function(e){addEventListener("pageshow",(function(t){t.persisted&&e(t)}),!0)},m=function(e,t,n){var i;return function(r){t.value>=0&&(r||n)&&(t.delta=t.value-(i||0),(t.delta||void 0===i)&&(i=t.value,e(t)))}},v=-1,p=function(){return"hidden"===document.visibilityState?0:1/0},d=function(){f((function(e){var t=e.timeStamp;v=t}),!0)},l=function(){return v<0&&(v=p(),d(),s((function(){setTimeout((function(){v=p(),d()}),0)}))),{get firstHiddenTime(){return v}}},g=function(e,t){var n,i=l(),r=u("FCP"),a=function(e){"first-contentful-paint"===e.name&&(f&&f.disconnect(),e.startTime<i.firstHiddenTime&&(r.value=e.startTime,r.entries.push(e),n(!0)))},o=window.performance&&performance.getEntriesByName&&performance.getEntriesByName("first-contentful-paint")[0],f=o?null:c("paint",a);(o||f)&&(n=m(e,r,t),o&&a(o),s((function(i){r=u("FCP"),n=m(e,r,t),requestAnimationFrame((function(){requestAnimationFrame((function(){r.value=performance.now()-i.timeStamp,n(!0)}))}))})))},h=!1,T=-1,y=function(e,t){h||(g((function(e){T=e.value})),h=!0);var n,i=function(t){T>-1&&e(t)},r=u("CLS",0),a=0,o=[],v=function(e){if(!e.hadRecentInput){var t=o[0],i=o[o.length-1];a&&e.startTime-i.startTime<1e3&&e.startTime-t.startTime<5e3?(a+=e.value,o.push(e)):(a=e.value,o=[e]),a>r.value&&(r.value=a,r.entries=o,n())}},p=c("layout-shift",v);p&&(n=m(i,r,t),f((function(){p.takeRecords().map(v),n(!0)})),s((function(){a=0,T=-1,r=u("CLS",0),n=m(i,r,t)})))},E={passive:!0,capture:!0},w=new Date,L=function(e,t){i||(i=t,r=e,a=new Date,F(removeEventListener),S())},S=function(){if(r>=0&&r<a-w){var e={entryType:"first-input",name:i.type,target:i.target,cancelable:i.cancelable,startTime:i.timeStamp,processingStart:i.timeStamp+r};o.forEach((function(t){t(e)})),o=[]}},b=function(e){if(e.cancelable){var t=(e.timeStamp>1e12?new Date:performance.now())-e.timeStamp;"pointerdown"==e.type?function(e,t){var n=function(){L(e,t),r()},i=function(){r()},r=function(){removeEventListener("pointerup",n,E),removeEventListener("pointercancel",i,E)};addEventListener("pointerup",n,E),addEventListener("pointercancel",i,E)}(t,e):L(t,e)}},F=function(e){["mousedown","keydown","touchstart","pointerdown"].forEach((function(t){return e(t,b,E)}))},C=function(e,t){var n,a=l(),v=u("FID"),p=function(e){e.startTime<a.firstHiddenTime&&(v.value=e.processingStart-e.startTime,v.entries.push(e),n(!0))},d=c("first-input",p);n=m(e,v,t),d&&f((function(){d.takeRecords().map(p),d.disconnect()}),!0),d&&s((function(){var a;v=u("FID"),n=m(e,v,t),o=[],r=-1,i=null,F(addEventListener),a=p,o.push(a),S()}))},k={},P=function(e,t){var n,i=l(),r=u("LCP"),a=function(e){var t=e.startTime;t<i.firstHiddenTime&&(r.value=t,r.entries.push(e),n())},o=c("largest-contentful-paint",a);if(o){n=m(e,r,t);var v=function(){k[r.id]||(o.takeRecords().map(a),o.disconnect(),k[r.id]=!0,n(!0))};["keydown","click"].forEach((function(e){addEventListener(e,v,{once:!0,capture:!0})})),f(v,!0),s((function(i){r=u("LCP"),n=m(e,r,t),requestAnimationFrame((function(){requestAnimationFrame((function(){r.value=performance.now()-i.timeStamp,k[r.id]=!0,n(!0)}))}))}))}},D=function(e){var t,n=u("TTFB");t=function(){try{var t=performance.getEntriesByType("navigation")[0]||function(){var e=performance.timing,t={entryType:"navigation",startTime:0};for(var n in e)"navigationStart"!==n&&"toJSON"!==n&&(t[n]=Math.max(e[n]-e.navigationStart,0));return t}();if(n.value=n.delta=t.responseStart,n.value<0||n.value>performance.now())return;n.entries=[t],e(n)}catch(e){}},"complete"===document.readyState?setTimeout(t,0):addEventListener("load",(function(){return setTimeout(t,0)}))}}}]);
+//# sourceMappingURL=453.ed3810f9.chunk.js.map

build/static/js/453.ed3810f9.chunk.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"static/js/453.ed3810f9.chunk.js","mappings":"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","sources":["../node_modules/web-vitals/dist/web-vitals.js"],"sourcesContent":["var e,t,n,i,r=function(e,t){return{name:e,value:void 0===t?-1:t,delta:0,entries:[],id:\"v2-\".concat(Date.now(),\"-\").concat(Math.floor(8999999999999*Math.random())+1e12)}},a=function(e,t){try{if(PerformanceObserver.supportedEntryTypes.includes(e)){if(\"first-input\"===e&&!(\"PerformanceEventTiming\"in self))return;var n=new PerformanceObserver((function(e){return e.getEntries().map(t)}));return n.observe({type:e,buffered:!0}),n}}catch(e){}},o=function(e,t){var n=function n(i){\"pagehide\"!==i.type&&\"hidden\"!==document.visibilityState||(e(i),t&&(removeEventListener(\"visibilitychange\",n,!0),removeEventListener(\"pagehide\",n,!0)))};addEventListener(\"visibilitychange\",n,!0),addEventListener(\"pagehide\",n,!0)},u=function(e){addEventListener(\"pageshow\",(function(t){t.persisted&&e(t)}),!0)},c=function(e,t,n){var i;return function(r){t.value>=0&&(r||n)&&(t.delta=t.value-(i||0),(t.delta||void 0===i)&&(i=t.value,e(t)))}},f=-1,s=function(){return\"hidden\"===document.visibilityState?0:1/0},m=function(){o((function(e){var t=e.timeStamp;f=t}),!0)},v=function(){return f<0&&(f=s(),m(),u((function(){setTimeout((function(){f=s(),m()}),0)}))),{get firstHiddenTime(){return f}}},d=function(e,t){var n,i=v(),o=r(\"FCP\"),f=function(e){\"first-contentful-paint\"===e.name&&(m&&m.disconnect(),e.startTime<i.firstHiddenTime&&(o.value=e.startTime,o.entries.push(e),n(!0)))},s=window.performance&&performance.getEntriesByName&&performance.getEntriesByName(\"first-contentful-paint\")[0],m=s?null:a(\"paint\",f);(s||m)&&(n=c(e,o,t),s&&f(s),u((function(i){o=r(\"FCP\"),n=c(e,o,t),requestAnimationFrame((function(){requestAnimationFrame((function(){o.value=performance.now()-i.timeStamp,n(!0)}))}))})))},p=!1,l=-1,h=function(e,t){p||(d((function(e){l=e.value})),p=!0);var n,i=function(t){l>-1&&e(t)},f=r(\"CLS\",0),s=0,m=[],v=function(e){if(!e.hadRecentInput){var t=m[0],i=m[m.length-1];s&&e.startTime-i.startTime<1e3&&e.startTime-t.startTime<5e3?(s+=e.value,m.push(e)):(s=e.value,m=[e]),s>f.value&&(f.value=s,f.entries=m,n())}},h=a(\"layout-shift\",v);h&&(n=c(i,f,t),o((function(){h.takeRecords().map(v),n(!0)})),u((function(){s=0,l=-1,f=r(\"CLS\",0),n=c(i,f,t)})))},T={passive:!0,capture:!0},y=new Date,g=function(i,r){e||(e=r,t=i,n=new Date,w(removeEventListener),E())},E=function(){if(t>=0&&t<n-y){var r={entryType:\"first-input\",name:e.type,target:e.target,cancelable:e.cancelable,startTime:e.timeStamp,processingStart:e.timeStamp+t};i.forEach((function(e){e(r)})),i=[]}},S=function(e){if(e.cancelable){var t=(e.timeStamp>1e12?new Date:performance.now())-e.timeStamp;\"pointerdown\"==e.type?function(e,t){var n=function(){g(e,t),r()},i=function(){r()},r=function(){removeEventListener(\"pointerup\",n,T),removeEventListener(\"pointercancel\",i,T)};addEventListener(\"pointerup\",n,T),addEventListener(\"pointercancel\",i,T)}(t,e):g(t,e)}},w=function(e){[\"mousedown\",\"keydown\",\"touchstart\",\"pointerdown\"].forEach((function(t){return e(t,S,T)}))},L=function(n,f){var s,m=v(),d=r(\"FID\"),p=function(e){e.startTime<m.firstHiddenTime&&(d.value=e.processingStart-e.startTime,d.entries.push(e),s(!0))},l=a(\"first-input\",p);s=c(n,d,f),l&&o((function(){l.takeRecords().map(p),l.disconnect()}),!0),l&&u((function(){var a;d=r(\"FID\"),s=c(n,d,f),i=[],t=-1,e=null,w(addEventListener),a=p,i.push(a),E()}))},b={},F=function(e,t){var n,i=v(),f=r(\"LCP\"),s=function(e){var t=e.startTime;t<i.firstHiddenTime&&(f.value=t,f.entries.push(e),n())},m=a(\"largest-contentful-paint\",s);if(m){n=c(e,f,t);var d=function(){b[f.id]||(m.takeRecords().map(s),m.disconnect(),b[f.id]=!0,n(!0))};[\"keydown\",\"click\"].forEach((function(e){addEventListener(e,d,{once:!0,capture:!0})})),o(d,!0),u((function(i){f=r(\"LCP\"),n=c(e,f,t),requestAnimationFrame((function(){requestAnimationFrame((function(){f.value=performance.now()-i.timeStamp,b[f.id]=!0,n(!0)}))}))}))}},P=function(e){var t,n=r(\"TTFB\");t=function(){try{var t=performance.getEntriesByType(\"navigation\")[0]||function(){var e=performance.timing,t={entryType:\"navigation\",startTime:0};for(var n in e)\"navigationStart\"!==n&&\"toJSON\"!==n&&(t[n]=Math.max(e[n]-e.navigationStart,0));return t}();if(n.value=n.delta=t.responseStart,n.value<0||n.value>performance.now())return;n.entries=[t],e(n)}catch(e){}},\"complete\"===document.readyState?setTimeout(t,0):addEventListener(\"load\",(function(){return setTimeout(t,0)}))};export{h as getCLS,d as getFCP,L as getFID,F as getLCP,P as getTTFB};\n"],"names":["e","t","n","i","r","name","value","delta","entries","id","concat","Date","now","Math","floor","random","a","PerformanceObserver","supportedEntryTypes","includes","self","getEntries","map","observe","type","buffered","o","document","visibilityState","removeEventListener","addEventListener","u","persisted","c","f","s","m","timeStamp","v","setTimeout","firstHiddenTime","d","disconnect","startTime","push","window","performance","getEntriesByName","requestAnimationFrame","p","l","h","hadRecentInput","length","takeRecords","T","passive","capture","y","g","w","E","entryType","target","cancelable","processingStart","forEach","S","L","b","F","once","P","getEntriesByType","timing","max","navigationStart","responseStart","readyState"],"sourceRoot":""}

build/static/js/main.d1af9f99.js.LICENSE.txt

@@ -0,0 +1,71 @@
+/**
+ * @license React
+ * react-dom-client.production.js
+ *
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/**
+ * @license React
+ * react-dom.production.js
+ *
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/**
+ * @license React
+ * react-jsx-runtime.production.js
+ *
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/**
+ * @license React
+ * react.production.js
+ *
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/**
+ * @license React
+ * scheduler.production.js
+ *
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/**
+ * @remix-run/router v1.23.0
+ *
+ * Copyright (c) Remix Software Inc.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE.md file in the root directory of this source tree.
+ *
+ * @license MIT
+ */
+
+/**
+ * React Router v6.30.1
+ *
+ * Copyright (c) Remix Software Inc.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE.md file in the root directory of this source tree.
+ *
+ * @license MIT
+ */

database/processed_documents.db

@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:3bdefd49f0d6b66e66b97cf2f699ae75fa5aa6963380031c31d7a61e4b3d6ce0
+size 999424

dockerfile

@@ -0,0 +1,34 @@
+# Use a base image with Python
+FROM python:3.10-slim
+
+# Set environment variables
+ENV PYTHONDONTWRITEBYTECODE=1
+ENV PYTHONUNBUFFERED=1
+
+# Set working directory
+WORKDIR /app
+
+# Install system dependencies
+RUN apt-get update && apt-get install -y build-essential && rm -rf /var/lib/apt/lists/*
+
+# Install Node.js (for serving frontend if needed)
+RUN apt-get install -y curl && \
+    curl -fsSL https://deb.nodesource.com/setup_18.x | bash - && \
+    apt-get install -y nodejs
+
+# Copy and install Python dependencies
+COPY requirements.txt ./
+RUN pip install --upgrade pip && pip install -r requirements.txt
+
+# Copy all files
+COPY . .
+
+# Set environment variable for Together API key (set via HF secrets)
+ENV TOGETHER_API_KEY=${TOGETHER_API_KEY}
+
+# Build React frontend
+RUN cd ./ && npm install && npm run build
+
+# Use uvicorn to launch FastAPI
+EXPOSE 7860
+CMD ["uvicorn", "api_service:app", "--host", "0.0.0.0", "--port", "7860"]

main.py

@@ -0,0 +1,143 @@
+#main.py 負責構建 RAG 鏈。
+
+import os
+import chromadb
+from dotenv import load_dotenv
+
+from langchain_together import TogetherEmbeddings, ChatTogether
+from langchain.vectorstores import Chroma
+from langchain_core.prompts import ChatPromptTemplate
+from langchain_core.output_parsers import StrOutputParser
+from langchain_core.runnables import RunnablePassthrough
+from langchain.chains import create_retrieval_chain
+from langchain.chains.combine_documents import create_stuff_documents_chain
+from langchain_core.documents import Document
+
+# Load environment variables from .env file
+load_dotenv()
+
+# --- Configuration ---
+db_directory = "database"
+db_path = os.path.join(db_directory, "processed_documents.db")
+vector_db_dir = "vector_db_chroma"
+collection_name = "my_instrument_manual_chunks"
+
+# Ensure TOGETHER_API_KEY is set
+together_api_key = os.getenv("TOGETHER_API_KEY")
+if not together_api_key:
+    # 更好的錯誤處理：直接拋出異常，應用啟動就會失敗，避免後續問題
+    raise ValueError("TOGETHER_API_KEY environment variable not set. Please set it in your .env file.")
+
+# --- LLM Setup ---
+try:
+    llm = ChatTogether(
+        model="meta-llama/Meta-Llama-3.1-8B-Instruct-Turbo", # 或您選擇的其他 Together AI 模型
+        temperature=0.3,
+        api_key=together_api_key
+    )
+    print("LLM (Together AI) Instantiation succeeded.")
+except Exception as e:
+    llm = None
+    print(f"Error instantiating LLM: {e}")
+    print("Please check your TOGETHER_API_KEY and model name.")
+
+# --- Retriever Setup ---
+embeddings_model_name = "togethercomputer/m2-bert-80M-32k-retrieval" # 必須與 setup_knowledge_base.py 中使用的模型一致
+
+try:
+    retriever_embeddings = TogetherEmbeddings(
+        model=embeddings_model_name,
+        api_key=together_api_key
+    )
+
+    # Instantiate ChromaDB client and load the collection
+    client = chromadb.PersistentClient(path=vector_db_dir)
+    vectorstore = Chroma(
+        client=client,
+        collection_name=collection_name,
+        embedding_function=retriever_embeddings # 用於將查詢嵌入
+    )
+    # Check if the collection is empty, if so, warn the user to run setup_knowledge_base.py
+    if vectorstore._collection.count() == 0:
+        print(f"Warning: ChromaDB collection '{collection_name}' is empty. Please run 'python setup_knowledge_base.py' to populate the knowledge base.")
+    
+    retriever = vectorstore.as_retriever(search_kwargs={"k": 5})
+    print(f"Retriever (ChromaDB) Instantiation succeeded, retrieving {retriever.search_kwargs['k']} chunks.")
+
+except Exception as e:
+    retriever = None
+    print(f"Error setting up ChromaDB retriever: {e}")
+    print("Please ensure you have run 'python setup_knowledge_base.py' to create and populate the vector database.")
+
+# --- Prompt Template Setup ---
+answer_prompt = """
+You are a professional HPLC instrument troubleshooting expert who specializes in helping junior researchers and students.
+Your task is to answer the user's troubleshooting questions in detail and clearly based on the HPLC instrument knowledge provided below.
+If there is no direct answer in the knowledge, please provide the most reasonable speculative suggestions based on your expert judgment, or ask further clarifying questions.
+Please ensure that your answers are logically clear, easy to understand, and directly address the user's questions.
+"""
+
+# --- RAG Chain Construction ---
+rag_chain = None # 預設為 None
+if llm and retriever: # Only build the chain if both LLM and retriever were successfully initialized
+    try:
+        # format_docs 函數用於將檢索到的 LangChain Document 對象轉換為字符串
+        def format_docs(docs):
+            return "\n\n".join(doc.page_content for doc in docs if hasattr(doc, 'page_content'))
+
+        # 新的 RAG 鏈結構:
+        # 1. 接收一個問題 (str)
+        # 2. 將問題傳遞給檢索器 (retriever)，獲取相關文檔
+        # 3. 將文檔格式化 (format_docs)
+        # 4. 將格式化後的文檔作為 context，原始問題作為 question，填充到 ChatPromptTemplate
+        # 5. 將填充後的 prompt 傳遞給 LLM
+        # 6. 使用 StrOutputParser() 將 LLM 輸出解析為字符串
+
+        # 修改 Prompt Template
+        prompt = ChatPromptTemplate.from_messages([
+            ("system", answer_prompt),
+            ("user", "Context: {context}\n\nQuestion: {question}"),
+        ])
+        print("Prompt Template build success.")
+
+        rag_chain = (
+            {
+                "context": retriever | format_docs,
+                "question": RunnablePassthrough() # 這裡將接收到的輸入直接作為 'question' 傳遞
+            }
+            | prompt
+            | llm
+            | StrOutputParser()
+        )
+        print("RAG LangChain assemble success.")
+    except Exception as e:
+        rag_chain = None
+        print(f"Error assembling RAG LangChain: {e}")
+        print("Please check previous setup steps for LLM and Retriever.")
+else:
+    print("RAG LangChain could not be assembled due to LLM or Retriever initialization failure.")
+
+# --- Main execution for testing (optional, for direct script run) ---
+if __name__ == "__main__":
+    print("--- Running main.py for direct test ---")
+    if rag_chain:
+        # Example queries for testing
+        question_1 = "What are the steps for instrument calibration?"
+        print(f"\n--- Executing query: {question_1} ---")
+        response_1 = rag_chain.invoke(question_1) # 直接傳遞字符串給 invoke
+        print("\nLLM's Answer:")
+        print(response_1)
+
+        print("\n--- Executing another query ---")
+        question_2 = "How do I troubleshoot common equipment malfunctions?"
+        response_2 = rag_chain.invoke(question_2) # 直接傳遞字符串給 invoke
+        print("\nLLM's Answer:")
+        print(response_2)
+
+        print("\n--- Executing a query that might not have an answer ---")
+        question_3 = "How to make Tiramisu cake?"
+        response_3 = rag_chain.invoke(question_3) # 直接傳遞字符串給 invoke
+        print("\nLLM's Answer:")
+        print(response_3)
+    else:
+        print("RAG chain is not available for testing. Please ensure 'setup_knowledge_base.py' has been run successfully and check API key/model setup in main.py.")

package.json

@@ -0,0 +1,46 @@
+{
+  "name": "my-app",
+  "version": "0.1.0",
+  "private": true,
+  "homepage": ".",
+  "dependencies": {
+    "@testing-library/dom": "^10.4.0",
+    "@testing-library/jest-dom": "^6.6.3",
+    "@testing-library/react": "^16.3.0",
+    "@testing-library/user-event": "^13.5.0",
+    "@types/jest": "^27.5.2",
+    "@types/node": "^16.18.126",
+    "@types/react": "^19.1.8",
+    "@types/react-dom": "^19.1.6",
+    "react": "^19.1.0",
+    "react-dom": "^19.1.0",
+    "react-scripts": "5.0.1",
+    "typescript": "^4.9.5",
+    "web-vitals": "^2.1.4",
+    "react-router-dom": "^6.22.3"
+  },
+  "scripts": {
+    "start": "react-scripts start",
+    "build": "react-scripts build",
+    "test": "react-scripts test",
+    "eject": "react-scripts eject"
+  },
+  "eslintConfig": {
+    "extends": [
+      "react-app",
+      "react-app/jest"
+    ]
+  },
+  "browserslist": {
+    "production": [
+      ">0.2%",
+      "not dead",
+      "not op_mini all"
+    ],
+    "development": [
+      "last 1 chrome version",
+      "last 1 firefox version",
+      "last 1 safari version"
+    ]
+  }
+}

public/index.html

@@ -0,0 +1,43 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <meta name="theme-color" content="#000000" />
+    <meta
+      name="description"
+      content="Web site created using create-react-app"
+    />
+    <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
+    <!--
+      manifest.json provides metadata used when your web app is installed on a
+      user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
+    -->
+    <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
+    <!--
+      Notice the use of %PUBLIC_URL% in the tags above.
+      It will be replaced with the URL of the `public` folder during the build.
+      Only files inside the `public` folder can be referenced from the HTML.
+
+      Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
+      work correctly both with client-side routing and a non-root public URL.
+      Learn how to configure a non-root public URL by running `npm run build`.
+    -->
+    <title>React App</title>
+  </head>
+  <body>
+    <noscript>You need to enable JavaScript to run this app.</noscript>
+    <div id="root"></div>
+    <!--
+      This HTML file is a template.
+      If you open it directly in the browser, you will see an empty page.
+
+      You can add webfonts, meta tags, or analytics to this file.
+      The build step will place the bundled scripts into the <body> tag.
+
+      To begin the development, run `npm start` or `yarn start`.
+      To create a production bundle, use `npm run build` or `yarn build`.
+    -->
+  </body>
+</html>

public/manifest.json

@@ -0,0 +1,25 @@
+{
+  "short_name": "React App",
+  "name": "Create React App Sample",
+  "icons": [
+    {
+      "src": "favicon.ico",
+      "sizes": "64x64 32x32 24x24 16x16",
+      "type": "image/x-icon"
+    },
+    {
+      "src": "logo192.png",
+      "type": "image/png",
+      "sizes": "192x192"
+    },
+    {
+      "src": "logo512.png",
+      "type": "image/png",
+      "sizes": "512x512"
+    }
+  ],
+  "start_url": ".",
+  "display": "standalone",
+  "theme_color": "#000000",
+  "background_color": "#ffffff"
+}

public/robots.txt

@@ -0,0 +1,3 @@
+# https://www.robotstxt.org/robotstxt.html
+User-agent: *
+Disallow:

requirements.txt

@@ -0,0 +1,17 @@
+pypdf
+langchain
+together
+langchain-together
+python-dotenv
+chromadb
+fastapi
+uvicorn
+pydantic
+python-multipart
+gradio
+transformers
+tokenizers
+huggingface_hub
+accelerate
+peft
+langchain-community

setup_knowledge_base.py

@@ -0,0 +1,376 @@
+#這個文件將負責所有的數據準備工作。在運行 app.py 之前，你需要先執行這個文件一次。
+import re
+import os
+import sqlite3
+import datetime
+import chromadb
+
+from pypdf import PdfReader
+from langchain.text_splitter import RecursiveCharacterTextSplitter
+from together import Together
+from langchain_together import TogetherEmbeddings
+from dotenv import load_dotenv
+from chromadb.utils import embedding_functions
+from langchain_core.documents import Document
+
+# Load environment variables from .env file
+load_dotenv()
+
+def extract_text_from_pdf(pdf_path):
+    """
+    Extract all text content from PDF files.
+    """
+    text = ""
+    try:
+        reader = PdfReader(pdf_path)
+        for page in reader.pages:
+            text += page.extract_text() + "\n"  # 提取每頁文字並換行
+    except Exception as e:
+        print(f"Error reading PDF {pdf_path}: {e}")
+    return text
+
+def clean_text_content(text):
+    """
+    Remove irrelevant content, such as copyright information, legal notices, and long blank spaces.
+    """
+    text = re.sub(r'\n\s*\n', '\n\n', text)
+    text = re.sub(r'^\s*\d+\s*$', '', text, flags=re.MULTILINE)
+    text = re.sub(r'\s+\d+\s*$', '', text, flags=re.MULTILINE)
+    text = re.sub(r'Copyright © \d{4} [^\n]*\. All Rights Reserved\.', '', text, flags=re.IGNORECASE)
+    text = re.sub(r'Confidential and Proprietary Information[^\n]*', '', text, flags=re.IGNORECASE)
+    text = re.sub(r'Disclaimer:[^.]*\.', '', text, flags=re.IGNORECASE)
+    text = re.sub(r'\s+', ' ', text).strip()
+    return text
+
+def standardize_text_format(text):
+    """
+    Try to organize everything into clear paragraphs.
+    """
+    text = re.sub(r'([a-zA-Z])-(\n)([a-zA-Z])', r'\1\3', text)
+    text = re.sub(r'([.?!])\s*([A-Z])', r'\1  \2', text)
+    text = re.sub(r'\s+', ' ', text).strip()
+    text = re.sub(r'([^\n])\n([^\n])', r'\1 \2', text)
+    text = re.sub(r'\n{2,}', '\n\n', text)
+    return text
+
+def create_database_table(db_path):
+    """
+    Create a SQLite database and define the table structure.
+    """
+    conn = sqlite3.connect(db_path)
+    cursor = conn.cursor()
+    cursor.execute('''
+        CREATE TABLE IF NOT EXISTS documents (
+            id INTEGER PRIMARY KEY AUTOINCREMENT,
+            original_filename TEXT NOT NULL UNIQUE, -- Add UNIQUE constraint
+            source_type TEXT,
+            processed_text TEXT NOT NULL,
+            processed_date TEXT
+        )
+    ''')
+    conn.commit()
+    conn.close()
+    print(f"SQLite table 'documents' ensured in {db_path}")
+
+def create_chunks_table(db_path):
+    """
+    Create a table to store the segmented text blocks.
+    """
+    conn = sqlite3.connect(db_path)
+    cursor = conn.cursor()
+    cursor.execute('''
+        CREATE TABLE IF NOT EXISTS chunks (
+            id INTEGER PRIMARY KEY AUTOINCREMENT,
+            document_id INTEGER NOT NULL,
+            chunk_index INTEGER NOT NULL,
+            chunk_content TEXT NOT NULL,
+            chunk_length INTEGER,
+            created_at TEXT,
+            UNIQUE(document_id, chunk_index), -- Ensure chunks are unique per document
+            FOREIGN KEY (document_id) REFERENCES documents(id)
+        )
+    ''')
+    conn.commit()
+    conn.close()
+    print(f"SQLite table 'chunks' ensured in {db_path}")
+
+def insert_document_data(db_path, original_filename, source_type, processed_text, processed_date):
+    """
+    Insert the processed file data into the database.
+    """
+    conn = sqlite3.connect(db_path)
+    cursor = conn.cursor()
+    # 檢查是否已存在相同的原始文件
+    cursor.execute("SELECT id FROM documents WHERE original_filename = ?", (original_filename,))
+    existing_doc = cursor.fetchone()
+    if existing_doc:
+        print(f"Document '{original_filename}' already exists in DB (ID: {existing_doc[0]}). Skipping insertion.")
+        conn.close()
+        return existing_doc[0]
+    else:
+        cursor.execute('''
+            INSERT INTO documents (original_filename, source_type, processed_text, processed_date)
+            VALUES (?, ?, ?, ?)
+        ''', (original_filename, source_type, processed_text, processed_date))
+        conn.commit()
+        doc_id = cursor.lastrowid
+        conn.close()
+        print(f"Document '{original_filename}' saved to database: {db_path} with ID: {doc_id}")
+        return doc_id
+
+def get_document_text_from_db(db_path, document_id=None, limit=None):
+    """
+    Reads the processed text contents of one or more files from a SQLite database.
+    """
+    conn = None
+    try:
+        conn = sqlite3.connect(db_path)
+        cursor = conn.cursor()
+        query = "SELECT id, processed_text FROM documents"
+        params = []
+        if document_id:
+            query += " WHERE id = ?"
+            params.append(document_id)
+        if limit:
+            query += " LIMIT ?"
+            params.append(limit)
+        cursor.execute(query, params)
+        if document_id:
+            row = cursor.fetchone()
+            if row:
+                return {'id': row[0], 'processed_text': row[1]}
+            return None
+        else:
+            return [{'id': row[0], 'processed_text': row[1]} for row in cursor.fetchall()]
+    except sqlite3.Error as e:
+        print(f"Error reading from SQLite database: {e}")
+        return []
+    finally:
+        if conn:
+            conn.close()
+
+def chunk_text(text, chunk_size=500, chunk_overlap=100): # Adjusted chunk size and overlap for potentially smaller chunks
+    """
+    Splits the text using RecursiveCharacterTextSplitter.
+    """
+    text_splitter = RecursiveCharacterTextSplitter(
+        chunk_size=chunk_size,
+        chunk_overlap=chunk_overlap,
+        length_function=len,
+        add_start_index=True
+    )
+    chunks = text_splitter.create_documents([text])
+    return [chunk.page_content for chunk in chunks]
+
+def insert_chunks_to_db(db_path, document_id, chunks):
+    """
+    Inserts all text blocks from the specified file into the database.
+    Checks if chunks for this document_id already exist and skips if found.
+    """
+    conn = sqlite3.connect(db_path)
+    cursor = conn.cursor()
+    current_time = datetime.datetime.now().isoformat()
+
+    # Check if chunks for this document_id already exist
+    cursor.execute("SELECT COUNT(*) FROM chunks WHERE document_id = ?", (document_id,))
+    if cursor.fetchone()[0] > 0:
+        print(f"Chunks for document ID {document_id} already exist. Skipping chunk insertion.")
+        conn.close()
+        return
+
+    data_to_insert = []
+    for i, chunk in enumerate(chunks):
+        data_to_insert.append((document_id, i, chunk, len(chunk), current_time))
+
+    cursor.executemany('''
+        INSERT INTO chunks (document_id, chunk_index, chunk_content, chunk_length, created_at)
+        VALUES (?, ?, ?, ?, ?)
+    ''', data_to_insert)
+    conn.commit()
+    conn.close()
+    print(f"Saved {len(chunks)} chunks into the database for file ID {document_id}.")
+
+def generate_embeddings(texts, model_name="togethercomputer/m2-bert-80M-32k-retrieval"):
+    """
+    Generates text embeddings using Together AI's embedding model.
+    """
+    try:
+        embeddings_model = TogetherEmbeddings(
+            model=model_name,
+            api_key=os.getenv("TOGETHER_API_KEY")
+        )
+        vectors = embeddings_model.embed_documents(texts)
+        print(f"Successfully generated embeddings for {len(texts)} text chunks using {model_name}.")
+        return vectors
+    except Exception as e:
+        print(f"Error generating embeddings: {e}")
+        return []
+
+def get_chunks_from_db_for_embedding(db_path):
+    """
+    Reads all split text chunks from the SQLite database, including their IDs.
+    """
+    conn = None
+    try:
+        conn = sqlite3.connect(db_path)
+        cursor = conn.cursor()
+        cursor.execute("SELECT id, document_id, chunk_index, chunk_content FROM chunks ORDER BY document_id, chunk_index")
+        rows = cursor.fetchall()
+        return [{'id': row[0], 'source_document_id': row[1], 'chunk_index': row[2], 'text': row[3]} for row in rows]
+    except sqlite3.Error as e:
+        print(f"Error reading chunks from SQLite database: {e}")
+        return []
+    finally:
+        if conn:
+            conn.close()
+
+def load_chunks_to_vector_db(chunks_data, db_path="vector_db_chroma", collection_name="document_chunks", embeddings_model_name="togethercomputer/m2-bert-80M-32k-retrieval"):
+    """
+    Loads text chunks and their embeddings into a ChromaDB vector database.
+    This function will now ADD chunks if they are new (based on their IDs).
+    """
+    try:
+        client = chromadb.PersistentClient(path=db_path)
+        collection = client.get_or_create_collection(name=collection_name)
+
+        # Check existing IDs in ChromaDB to avoid adding duplicates
+        existing_chroma_ids = set()
+        if collection.count() > 0:
+            # Fetching all existing IDs can be slow for very large collections.
+            # A more efficient approach for very large databases might involve
+            # querying a batch of IDs or checking after insertion.
+            # For now, this is simpler for demonstration.
+            try:
+                all_ids_in_chroma = collection.get(ids=collection.get()['ids'])['ids']
+                existing_chroma_ids = set(all_ids_in_chroma)
+            except Exception as e:
+                print(f"Warning: Could not retrieve all existing IDs from ChromaDB. May attempt to add duplicates. Error: {e}")
+
+
+        ids_to_add = []
+        documents_to_add = []
+        embeddings_to_add = []
+        metadatas_to_add = []
+
+        for item in chunks_data:
+            chunk_id_str = str(item['id'])
+            if chunk_id_str not in existing_chroma_ids:
+                ids_to_add.append(chunk_id_str)
+                documents_to_add.append(item['text'])
+                embeddings_to_add.append(item['embedding'])
+                metadatas_to_add.append({"source_document_id": item.get('source_document_id', 'unknown'),
+                                        "chunk_index": item.get('chunk_index', None)})
+            else:
+                print(f"Chunk ID {chunk_id_str} already exists in ChromaDB. Skipping.")
+
+        if ids_to_add:
+            collection.add(
+                embeddings=embeddings_to_add,
+                documents=documents_to_add,
+                metadatas=metadatas_to_add,
+                ids=ids_to_add
+            )
+            print(f"Successfully added {len(ids_to_add)} new text chunks into ChromaDB collection '{collection_name}'.")
+        else:
+            print(f"No new chunks to add to ChromaDB collection '{collection_name}'.")
+
+    except Exception as e:
+        print(f"Error loading data into ChromaDB: {e}")
+
+
+if __name__ == "__main__":
+    # Define the directory containing your PDF files
+    current_dir = os.path.dirname(os.path.abspath(__file__))
+    pdf_input_directory = os.path.join(current_dir, "input")
+    #pdf_input_directory = "input" # Ensure this directory exists and contains your PDFs
+    db_directory = "database"
+    db_path = os.path.join(db_directory, "processed_documents.db")
+    vector_db_dir = "vector_db_chroma"
+    collection_name = "my_instrument_manual_chunks"
+    embeddings_model_name = "togethercomputer/m2-bert-80M-32k-retrieval" # 確保與 main.py 中使用的一致
+
+    # Create necessary directories
+    os.makedirs(db_directory, exist_ok=True)
+    os.makedirs(vector_db_dir, exist_ok=True)
+
+    print("--- Starting knowledge base setup ---")
+
+    # 1. 確保 SQLite 表格存在
+    create_database_table(db_path)
+    create_chunks_table(db_path)
+
+    # 2. 遍歷指定目錄下的所有 PDF 文件
+    pdf_files = [f for f in os.listdir(pdf_input_directory) if f.lower().endswith('.pdf')]
+    if not pdf_files:
+        print(f"No PDF files found in '{pdf_input_directory}'. Please place your PDF documents there.")
+    
+    for pdf_filename in pdf_files:
+        pdf_full_path = os.path.join(pdf_input_directory, pdf_filename)
+        print(f"\n--- Processing PDF: {pdf_full_path} ---")
+
+        # 檢查文件是否已在 documents 表中處理過
+        conn = sqlite3.connect(db_path)
+        cursor = conn.cursor()
+        cursor.execute("SELECT id FROM documents WHERE original_filename = ?", (pdf_filename,))
+        existing_doc_id = cursor.fetchone()
+        conn.close()
+
+        if existing_doc_id:
+            doc_id = existing_doc_id[0]
+            print(f"Document '{pdf_filename}' already in 'documents' table with ID: {doc_id}. Skipping PDF extraction and text processing.")
+            # Still process chunks if they aren't in 'chunks' table or ChromaDB
+        else:
+            pdf_content = extract_text_from_pdf(pdf_full_path)
+            if pdf_content:
+                cleaned_text = clean_text_content(pdf_content)
+                final_processed_text = standardize_text_format(cleaned_text)
+                current_date = datetime.date.today().isoformat()
+                doc_id = insert_document_data(db_path, pdf_filename, "PDF", final_processed_text, current_date)
+            else:
+                print(f"No content extracted from {pdf_full_path}. Skipping document insertion for this PDF.")
+                continue # Move to the next PDF if no content
+
+        # 如果 doc_id 存在（無論是新插入還是已存在的），則進行分塊和嵌入處理
+        if doc_id is not None:
+            # 從 SQLite documents 表讀取並分塊，存儲到 SQLite chunks 表
+            document_from_db = get_document_text_from_db(db_path, document_id=doc_id)
+            if document_from_db:
+                full_text = document_from_db['processed_text']
+                print(f"--- Chunking document ID {doc_id} ('{pdf_filename}') ---")
+                chunks = chunk_text(full_text, chunk_size=500, chunk_overlap=100) # Re-evaluate chunk_size
+                if chunks:
+                    insert_chunks_to_db(db_path, doc_id, chunks)
+                else:
+                    print(f"Document ID {doc_id} unable to split any chunks.")
+            else:
+                print(f"Could not retrieve processed text for document ID {doc_id}.")
+
+    # 3. 從 SQLite chunks 表讀取所有塊並生成嵌入，載入到 ChromaDB
+    # 我們需要重新從 DB 獲取所有 chunks，因為可能有多個 PDF 的 chunks
+    chunks_from_db_for_embedding = get_chunks_from_db_for_embedding(db_path)
+
+    if chunks_from_db_for_embedding:
+        # Filter out chunks that already have an embedding in ChromaDB if checking was efficient
+        # For simplicity, we'll try to generate embeddings for all chunks retrieved from SQLite
+        # and let load_chunks_to_vector_db handle duplicates in ChromaDB.
+        texts_to_embed = [item['text'] for item in chunks_from_db_for_embedding]
+        print(f"\n--- Generating embeddings for {len(texts_to_embed)} total chunks ---")
+        text_embeddings = generate_embeddings(texts_to_embed, model_name=embeddings_model_name)
+
+        if text_embeddings:
+            data_for_vector_db = []
+            for i, chunk_data in enumerate(chunks_from_db_for_embedding):
+                if i < len(text_embeddings):
+                    chunk_data['embedding'] = text_embeddings[i]
+                    data_for_vector_db.append(chunk_data)
+                else:
+                    print(f"Warning: Missing embedding for chunk {chunk_data['id']}. Skipping this chunk for ChromaDB.")
+
+            print(f"--- Loading/Updating {len(data_for_vector_db)} chunks into ChromaDB ---")
+            load_chunks_to_vector_db(data_for_vector_db, db_path=vector_db_dir, collection_name=collection_name, embeddings_model_name=embeddings_model_name)
+        else:
+            print("No embeddings generated. Skipping ChromaDB loading.")
+    else:
+        print("No text chunks read from the database for embedding and loading into ChromaDB.")
+
+    print("\n--- Knowledge base setup complete ---")

src/App.css

@@ -0,0 +1,67 @@
+.App {
+  text-align: center;
+}
+
+.App-logo {
+  height: 40vmin;
+  pointer-events: none;
+}
+
+@media (prefers-reduced-motion: no-preference) {
+  .App-logo {
+    animation: App-logo-spin infinite 20s linear;
+  }
+}
+
+.App-header {
+  background-color: #282c34;
+  min-height: 100vh;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  font-size: calc(10px + 2vmin);
+  color: white;
+}
+
+.App-link {
+  color: #61dafb;
+}
+
+@keyframes App-logo-spin {
+  from {
+    transform: rotate(0deg);
+  }
+  to {
+    transform: rotate(360deg);
+  }
+}
+
+/* Landing Page Styles */
+.landing-container { font-family: Arial, sans-serif; min-height: 100vh; display: flex; flex-direction: column; }
+.landing-header, .landing-footer { background: #f8f9fb; padding: 20px 40px; display: flex; justify-content: space-between; align-items: center; }
+.landing-main { flex: 1; padding: 40px; display: flex; flex-direction: column; align-items: center; }
+.landing-header .logo { font-weight: bold; font-size: 1.5rem; }
+.landing-nav a, .lang-select { margin: 0 10px; text-decoration: none; color: #222; }
+.start-btn { background: #2563eb; color: #fff; border: none; padding: 14px 32px; border-radius: 8px; font-size: 1.1rem; margin: 24px 0; cursor: pointer; }
+.how-it-works { margin: 40px 0; width: 100%; max-width: 900px; }
+.how-it-works h2 {text-align: center; }
+.steps { display: flex; justify-content: space-between; }
+.step { background: #fff; border-radius: 12px; box-shadow: 0 2px 8px #e5e7eb; padding: 24px; flex: 1; margin: 0 10px; text-align: center; }
+.step-number { background: #2563eb; color: #fff; border-radius: 50%; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; margin: 0 auto 12px; font-size: 1.2rem; }
+.download-resources { margin: 40px 0; width: 100%; max-width: 900px; }
+.download-resources h2 {text-align: center; }
+.resources { display: flex; justify-content: space-between; }
+.resource-card { background: #fff; border-radius: 12px; box-shadow: 0 2px 8px #e5e7eb; padding: 24px; flex: 1; margin: 0 10px; text-align: center; }
+.view-all { display: block; margin-top: 16px; text-align: right; color: #2563eb; text-decoration: none; }
+
+/* Chat Page Styles */
+.chat-container { min-height: 100vh; display: flex; flex-direction: column; background: #f4f6fa; }
+.chat-header { background: #2563eb; color: #fff; padding: 20px; font-size: 1.3rem; text-align: center; }
+.chat-messages { flex: 1; padding: 24px; overflow-y: auto; display: flex; flex-direction: column; gap: 12px; }
+.chat-message { max-width: 60%; padding: 12px 18px; border-radius: 16px; margin-bottom: 8px; }
+.chat-message.user { align-self: flex-end; background: #2563eb; color: #fff; }
+.chat-message.ai { align-self: flex-start; background: #fff; color: #222; border: 1px solid #e5e7eb; }
+.chat-input-area { display: flex; padding: 16px; background: #fff; border-top: 1px solid #e5e7eb; }
+.chat-input-area input { flex: 1; padding: 10px; border-radius: 8px; border: 1px solid #e5e7eb; margin-right: 10px; font-size: 1rem; }
+.chat-input-area button { background: #2563eb; color: #fff; border: none; border-radius: 8px; padding: 10px 24px; font-size: 1rem; cursor: pointer; }

src/App.tsx

@@ -0,0 +1,19 @@
+import React from 'react';
+import { Routes, Route } from 'react-router-dom';
+import LandingPage from './LandingPage';
+import ChatPage from './ChatPage';
+import './App.css';
+import './foot.css';
+
+function App() {
+  return (
+    <Routes>
+      <Route path="/" element={<LandingPage />} />
+      <Route path="/chat" element={<ChatPage />} />
+    </Routes>
+  );
+}
+
+export default App;
+
+

src/ChatPage.css

@@ -0,0 +1,94 @@
+.chat-container {
+  display: flex;
+  flex-direction: column;
+  height: 100vh;
+  max-width: 800px;
+  margin: auto;
+  font-family: Arial, sans-serif;
+}
+
+.chat-header {
+  padding: 16px;
+  background-color: #4a90e2;
+  color: white;
+  font-size: 1.5rem;
+  text-align: center;
+}
+
+.chat-messages {
+  flex: 1;
+  padding: 16px;
+  overflow-y: auto;
+  background-color: #f5f5f5;
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+}
+
+.chat-bubble {
+  max-width: 70%;
+  padding: 12px;
+  border-radius: 16px;
+  white-space: pre-wrap;
+  word-wrap: break-word;
+}
+
+.chat-bubble.user {
+  align-self: flex-end;
+  background-color: #dcf8c6;
+}
+
+.chat-bubble.ai {
+  align-self: flex-start;
+  background-color: #ffffff;
+  border: 1px solid #ddd;
+}
+
+.chat-bubble.loading {
+  font-style: italic;
+  opacity: 0.6;
+}
+
+.chat-input-area {
+  display: flex;
+  padding: 12px;
+  border-top: 1px solid #ccc;
+  background-color: #fff;
+}
+
+.chat-input-area input {
+  flex: 1;
+  padding: 8px;
+  border: 1px solid #ccc;
+  border-radius: 8px;
+  margin-right: 8px;
+}
+
+.chat-input-area button {
+  padding: 8px 16px;
+  background-color: #4a90e2;
+  color: white;
+  border: none;
+  border-radius: 8px;
+  cursor: pointer;
+}
+
+.chat-input-area button:disabled {
+  background-color: #a0c4f2;
+  cursor: not-allowed;
+}
+
+.back-button {
+  float: right;
+  margin-right: 20px;
+  background-color: #f2f2f2;
+  border: none;
+  padding: 6px 12px;
+  border-radius: 8px;
+  cursor: pointer;
+  font-size: 14px;
+}
+
+.back-button:hover {
+  background-color: #ddd;
+}

src/ChatPage.tsx

@@ -0,0 +1,90 @@
+import React, { useState } from 'react';
+import './ChatPage.css'; // 確保你有這個樣式檔案
+import { useNavigate } from 'react-router-dom';
+
+// frontend message type
+interface Message {
+  sender: 'user' | 'ai';
+  text: string;
+}
+
+// Type definition of backend return data
+interface AskResponse {
+  answer: string;
+  source_documents: string[];
+}
+
+const ChatPage: React.FC = () => {
+  const [messages, setMessages] = useState<Message[]>([]);
+  const [input, setInput] = useState('');
+  const [loading, setLoading] = useState(false);
+  const navigate = useNavigate();
+
+  const handleSend = async () => {
+    if (input.trim() === '') return;
+
+    const userMessage: Message = { sender: 'user', text: input };
+    setMessages((prev) => [...prev, userMessage]);
+    setInput('');
+    setLoading(true);
+
+    try {
+
+      const res = await fetch('/ask', {  // 改成相對路徑
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({ query: input }),
+      });
+
+
+      if (!res.ok) throw new Error('Backend error');
+
+      const data: AskResponse = await res.json();
+
+      const aiText = `${data.answer}\n\n📚 Source Snippets:\n${data.source_documents.slice(0, 2).join('\n\n')}`;
+      const aiMessage: Message = { sender: 'ai', text: aiText };
+
+      setMessages((prev) => [...prev, aiMessage]);
+    } catch (err) {
+      console.error('Fetch error:', err);
+      const errorMessage: Message = { sender: 'ai', text: '❌ Unable to get a response, please try again later.' };
+      setMessages((prev) => [...prev, errorMessage]);
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  return (
+    <div className="chat-container">
+      <div className="back-button-container">
+        <button className="back-button" onClick={() => navigate('/')}>
+          🔙 Back to Home Page
+        </button>
+      </div>  
+      <header className="chat-header">LabAid AI Chat</header>
+      <div className="chat-messages">
+        {messages.map((msg, idx) => (
+          <div key={idx} className={`chat-bubble ${msg.sender}`}>
+            {msg.text}
+          </div>
+        ))}
+        {loading && <div className="chat-bubble ai loading">💬 thinking...</div>}
+      </div>
+
+      <div className="chat-input-area">
+        <input
+          type="text"
+          value={input}
+          onChange={(e) => setInput(e.target.value)}
+          onKeyDown={(e) => {
+            if (e.key === 'Enter') handleSend();
+          }}
+          placeholder="please enter your question..."
+        />
+        <button onClick={handleSend} disabled={loading}>send</button>
+      </div>
+    </div>
+  );
+};
+
+export default ChatPage;

src/LandingPage.tsx

@@ -0,0 +1,123 @@
+import React from 'react';
+import { useNavigate } from 'react-router-dom';
+
+
+
+const LandingPage: React.FC = () => {
+  const navigate = useNavigate();
+
+  return (
+    <div className="landing-container">
+      <header className="landing-header">
+        <div className="logo">LabAid AI</div>
+        <nav className="landing-nav">
+          <a href="#features">Features</a>
+          <a href="#how-it-works">How It Works</a>
+          <a href="#pricing">Pricing</a>
+          <span className="lang-select">English</span>
+        </nav>
+      </header>
+      <main className="landing-main">
+        <h1>AI-Powered Lab <span className="highlight">Troubleshooting</span></h1>
+        <p>Instantly diagnose and resolve equipment issues with our intelligent AI assistant. Get step-by-step solutions, maintenance tips, and expert guidance 24/7.</p>
+        <button className="start-btn" onClick={() => navigate('/chat')}>Start Troubleshooting</button>
+        <section className="how-it-works" id="how-it-works">
+          <h2>How It Works</h2>
+          <div className="steps">
+            <div className="step">
+              <div className="step-number">1</div>
+              <h3>Describe the Issue</h3>
+              <p>Simply tell our AI what's wrong with your equipment. Use natural language - no technical jargon required.</p>
+            </div>
+            <div className="step">
+              <div className="step-number">2</div>
+              <h3>Get AI Analysis</h3>
+              <p>Our advanced AI analyzes your description and equipment type to provide accurate diagnosis and solutions.</p>
+            </div>
+            <div className="step">
+              <div className="step-number">3</div>
+              <h3>Follow the Steps</h3>
+              <p>Receive detailed, step-by-step instructions with visual aids to resolve the issue quickly and safely.</p>
+            </div>
+          </div>
+        </section>
+        <section className="download-resources">
+          <h2>Download Resources</h2>
+          <div className="resources">
+            <div className="resource-card">
+              <h3>Equipment Manual</h3>
+              <p>Complete user manual for lab equipment operation and safety guidelines.</p>
+              <span>PDF · 2.4 MB</span>
+              <button>Download</button>
+            </div>
+            <div className="resource-card">
+              <h3>Troubleshooting Guide</h3>
+              <p>Step-by-step solutions for common equipment issues and error codes.</p>
+              <span>PDF · 1.8 MB</span>
+              <button>Download</button>
+            </div>
+            <div className="resource-card">
+              <h3>Maintenance Schedule</h3>
+              <p>Recommended maintenance timeline and procedures for optimal performance.</p>
+              <span>PDF · 0.9 MB</span>
+              <button>Download</button>
+            </div>
+          </div>
+          <a href="#all-documents" className="view-all">View All Documents →</a>
+        </section>
+      </main>
+      <footer className="labassist-footer">
+        <div className="footer-main-content">
+          <div className="footer-column company-info">
+            <div className="company-logo-section">
+              
+              <span>LabAid AI</span>
+            </div>
+            <p>Revolutionizing lab equipment troubleshooting with AI-powered solutions.</p>
+            <div className="social-icons">
+             
+            </div>
+          </div>
+          <div className="footer-column">
+            <h4>Product</h4>
+            <ul>
+            <li><a href="#">Features</a></li>
+            <li><a href="#">Pricing</a></li>
+            <li><a href="#">API</a></li>
+            <li><a href="#">Documentation</a></li>
+            </ul>
+          </div>
+          <div className="footer-column">
+            <h4>Support</h4>
+            <ul>
+            <li><a href="#">Help Center</a></li>
+            <li><a href="#">Contact Us</a></li>
+            <li><a href="#">Status</a></li>
+            <li><a href="#">Community</a></li>
+            </ul>
+          </div>
+          <div className="footer-column">
+            <h4>Company</h4>
+            <ul>
+            <li><a href="#">About</a></li>
+            <li><a href="#">Blog</a></li>
+            <li><a href="#">Careers</a></li>
+            <li><a href="#">Press</a></li>
+            </ul>
+          </div>
+        </div>
+        <div className="footer-bottom-bar">
+          <p>© 2024 LabAssist AI. All rights reserved.</p>
+          <div className="footer-legal-links">
+             <a href="#">Privacy Policy</a>
+             <a href="#">Terms of Service</a>
+          </div>
+        </div>
+      </footer>
+    </div>
+
+
+  );
+};
+
+export default LandingPage; 

src/foot.css

@@ -0,0 +1,166 @@
+.labassist-footer {
+  background-color: #111122; /* 頁腳背景色，比 body 略深 */
+  padding: 60px 40px; /* 上下左右內邊距 */
+  display: flex;
+  flex-direction: column; /* 讓主要內容和底部版權資訊垂直堆疊 */
+  align-items: center; /* 讓整個 footer 的內容水平居中（在有 max-width 的情況下） */
+}
+
+/* 主要內容區域：包含四個列 */
+.footer-main-content {
+  display: flex;
+  justify-content: space-between; /* 將四個列均勻分佈在水平空間 */
+  width: 100%; /* 佔滿父容器寬度 */
+  max-width: 1200px; /* 限制內容的最大寬度，使其不會太寬 */
+  margin-bottom: 50px; /* 與底部版權資訊的間距 */
+  flex-wrap: wrap; /* 允許在小螢幕上換行 */
+}
+
+/* 每一個列（公司資訊、Product、Support、Company） */
+.footer-column {
+  flex-basis: 22%; /* 讓每列佔據大約 22% 的空間，以便容納 4 列並留有間距 */
+  /* 可以根據內容調整 flex-basis，或者使用 flex-grow: 1; 讓它們自動分配空間 */
+  margin-bottom: 20px; /* 小螢幕換行時的間距 */
+}
+
+.footer-column h4 {
+  font-size: 1.1em;
+  color: #FFFFFF; /* 標題文字白色 */
+  margin-bottom: 15px; /* 標題與下方連結的間距 */
+  font-weight: bold;
+}
+
+.footer-column ul {
+  list-style: none; /* 移除列表點 */
+}
+
+.footer-column ul li {
+  margin-bottom: 8px; /* 連結之間的間距 */
+}
+
+.footer-column ul li a {
+  color: #B0B0B0; /* 連結文字顏色 */
+  text-decoration: none; /* 移除下劃線 */
+  font-size: 0.95em;
+  transition: color 0.3s ease; /* 平滑過渡效果 */
+}
+
+.footer-column ul li a:hover {
+  color: #FFFFFF; /* 鼠標懸停時變白 */
+}
+
+/* 左側公司資訊區塊特有樣式 */
+.company-info {
+  flex-basis: 30%; /* 給公司資訊列更多空間 */
+  min-width: 250px; /* 確保在小螢幕上有足夠寬度 */
+}
+
+.company-logo-section {
+  display: flex;
+  align-items: center;
+  margin-bottom: 15px;
+}
+
+.footer-logo {
+  height: 30px; /* Logo 高度 */
+  margin-right: 10px;
+}
+
+.company-logo-section span {
+  font-size: 1.2em;
+  font-weight: bold;
+  color: #FFFFFF;
+}
+
+.company-info p {
+  font-size: 0.9em;
+  line-height: 1.6;
+  margin-bottom: 20px;
+  color: #B0B0B0;
+}
+
+.social-icons {
+  display: flex;
+  gap: 15px; /* 圖標間距 */
+}
+
+.social-icons a img {
+  width: 20px; /* 圖標大小 */
+  height: 20px;
+  filter: invert(100%) brightness(80%); /* 將圖標顏色反轉為淺色 */
+  transition: filter 0.3s ease;
+}
+
+.social-icons a:hover img {
+  filter: invert(100%) brightness(100%); /* 鼠標懸停時變亮 */
+}
+
+
+/* 底部版權資訊區域 */
+.footer-bottom-bar {
+  border-top: 1px solid #333344; /* 上方加一條細分隔線 */
+  padding-top: 30px;
+  width: 100%;
+  max-width: 1200px; /* 與主要內容寬度保持一致 */
+  display: flex;
+  justify-content: space-between; /* 版權資訊靠左，法律連結靠右 */
+  align-items: center; /* 垂直居中對齊 */
+  font-size: 0.85em;
+  color: #888899; /* 較淺的灰色 */
+}
+
+.footer-legal-links a {
+  color: #888899;
+  text-decoration: none;
+  margin-left: 20px; /* 連結之間的間距 */
+  transition: color 0.3s ease;
+}
+
+.footer-legal-links a:hover {
+  color: #FFFFFF;
+}
+
+/* 響應式設計：小螢幕適應 */
+@media (max-width: 768px) {
+  .labassist-footer {
+    padding: 40px 20px;
+  }
+
+  .footer-main-content {
+    flex-direction: column; /* 小螢幕時，列變成垂直堆疊 */
+    align-items: flex-start; /* 讓每個列都靠左對齊 */
+    gap: 30px; /* 列之間的間距 */
+  }
+
+  .footer-column {
+    flex-basis: 100%; /* 每列佔據全部寬度 */
+    max-width: 100%; /* 確保最大寬度 */
+  }
+
+  .footer-bottom-bar {
+    flex-direction: column; /* 版權和法律連結垂直堆疊 */
+    text-align: center;
+  }
+
+  .footer-legal-links {
+    margin-top: 15px; /* 與版權資訊的間距 */
+  }
+
+  .footer-legal-links a {
+    margin: 0 10px; /* 調整連結間距 */
+  }
+}
+
+@media (max-width: 480px) {
+  .labassist-footer {
+    padding: 30px 15px;
+  }
+
+  .footer-main-content {
+    gap: 20px;
+  }
+
+  .social-icons {
+    gap: 10px;
+  }
+}

src/index.css

@@ -0,0 +1,13 @@
+body {
+  margin: 0;
+  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
+    'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
+    sans-serif;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+code {
+  font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
+    monospace;
+}

src/index.tsx

@@ -0,0 +1,20 @@
+import React from 'react';
+import ReactDOM from 'react-dom/client';
+import './index.css';
+import App from './App';
+import reportWebVitals from './reportWebVitals';
+import { HashRouter } from 'react-router-dom';
+
+const root = ReactDOM.createRoot(
+  document.getElementById('root') as HTMLElement
+);
+
+root.render(
+  <React.StrictMode>
+    <HashRouter>
+      <App />
+    </HashRouter>
+  </React.StrictMode>
+);
+
+reportWebVitals();

src/react-app-env.d.ts

@@ -0,0 +1 @@
+/// <reference types="react-scripts" />

src/reportWebVitals.ts

@@ -0,0 +1,15 @@
+import { ReportHandler } from 'web-vitals';
+
+const reportWebVitals = (onPerfEntry?: ReportHandler) => {
+  if (onPerfEntry && onPerfEntry instanceof Function) {
+    import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => {
+      getCLS(onPerfEntry);
+      getFID(onPerfEntry);
+      getFCP(onPerfEntry);
+      getLCP(onPerfEntry);
+      getTTFB(onPerfEntry);
+    });
+  }
+};
+
+export default reportWebVitals;

src/setupTests.ts

@@ -0,0 +1,5 @@
+// jest-dom adds custom jest matchers for asserting on DOM nodes.
+// allows you to do things like:
+// expect(element).toHaveTextContent(/react/i)
+// learn more: https://github.com/testing-library/jest-dom
+import '@testing-library/jest-dom';

tsconfig.json

@@ -0,0 +1,26 @@
+{
+  "compilerOptions": {
+    "target": "es5",
+    "lib": [
+      "dom",
+      "dom.iterable",
+      "esnext"
+    ],
+    "allowJs": true,
+    "skipLibCheck": true,
+    "esModuleInterop": true,
+    "allowSyntheticDefaultImports": true,
+    "strict": true,
+    "forceConsistentCasingInFileNames": true,
+    "noFallthroughCasesInSwitch": true,
+    "module": "esnext",
+    "moduleResolution": "node",
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "noEmit": true,
+    "jsx": "react-jsx"
+  },
+  "include": [
+    "src"
+  ]
+}

vector_db_chroma/chroma.sqlite3

@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:a2d0d855229b7e7711de0cecbee3f1b2214b1b4b9a84f9e6a47510907654a0ae
+size 7811072

vector_db_chroma/e00074a2-0e3e-4a43-a595-44f28c720a1a/data_level0.bin

@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:23add52afbe7588391f32d3deffb581b2663d2e2ad8851aba7de25e6b3f66761
+size 32120000

vector_db_chroma/e00074a2-0e3e-4a43-a595-44f28c720a1a/header.bin

@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:f8c7f00b4415698ee6cb94332eff91aedc06ba8e066b1f200e78ca5df51abb57
+size 100

vector_db_chroma/e00074a2-0e3e-4a43-a595-44f28c720a1a/length.bin

@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:29382d806e774618a2c3512be096526ba7c53fe3fcfb120b10c4f353accbad9f
+size 40000