Interactive Citation Graph that maps existing literature in your research domain, generates in-depth summaries for your papers and deploys an AI Assistant (Claude Sonnet 4.6) that uses retrieval-augmented generation to answer your questions.
 |
 |
 |
 |
Live App: https://citation-chain-two.vercel.app/
The user can submit the research paper either by uploading it as a PDF or searching for its DOI/title using the search bar. For PDFs, the client extracts the title and DOI from the first page using unpdf, then sends a query to the OpenAlex API. We use OpenAlex because it has a higher rate limit (100 requests per second) compared to the Semantic Scholar API which has a rate limit of 100 requests per 5 minutes. However, Semantic Scholar offers a more complete and robust dataset, while OpenAlex usually has some missing metadata for a given research paper.
To compensate this we query OpenAlex to see if it has the research paper with all the standard metadata. If OpenAlex has the research paper but is missing some metadata (e.g. author name, DOI, abstract, key fields), we batch all the missing metadata in one query and send a request to Semantic Scholar. If the research paper cannot be found on OpenAlex or both APIs are missing critical metadata, we return an error to the user informing them we are unable to find their research paper.
Note: Research papers that are published after 2025 usually aren't included in either APIs, so unless the user uploads a PDF as input, a citation graph cannot be generated.
We use React Flow to generate the citation graph. The uploaded research paper is the central node and all the outbound citations branch off from it. The appearance of each node is dependent on three variables.
- Number of outbound citation: The size of the node is dependent on the number of outbound citations it has. A node with 100 citations is ~50x larger than a node with only 2 citations.
- Color of the node: The color of the node depends on the field the research paper falls under. OpenAlex lists 26 fields and 4 domains. Each field is assigned a unique color which you can view in the table below, and fields in the same domain have a similar color.
- Shade of the node: The shade of the node depends on the date it was published. Papers that were published closer to the present are shaded darker, while papers published a long time ago appear visually more tinted.
| Domain | Hex | Color |
|---|---|---|
| Life Sciences | ||
| Agricultural and Biological Sciences | #16A34A | Grass Green |
| Biochemistry, Genetics and Molecular Biology | #059669 | Emerald |
| Immunology and Microbiology | #65A30D | Olive Green |
| Neuroscience | #15803D | Forest Green |
| Pharmacology, Toxicology and Pharmaceutics | #34D399 | Mint Jade |
| Health Sciences | ||
| Medicine | #DC2626 | Red |
| Nursing | #F87171 | Coral |
| Veterinary | #BE123C | Crimson |
| Dentistry | #FB7185 | Salmon Pink |
| Health Professions | #E11D48 | Rose |
| Physical Sciences | ||
| Chemical Engineering | #0E7490 | Dark Teal |
| Chemistry | #0891B2 | Cyan |
| Computer Science | #2563EB | Royal Blue |
| Earth and Planetary Sciences | #0C4A6E | Deep Ocean Blue |
| Energy | #38BDF8 | Sky Blue |
| Engineering | #1E40AF | Navy Blue |
| Environmental Science | #06B6D4 | Turquoise |
| Materials Science | #6366F1 | Indigo |
| Mathematics | #7C3AED | Violet |
| Physics and Astronomy | #4F46E5 | Blue-Violet |
| Social Sciences | ||
| Arts and Humanities | #D97706 | Amber |
| Business, Management and Accounting | #EA580C | Orange |
| Decision Sciences | #CA8A04 | Mustard Gold |
| Economics, Econometrics and Finance | #B45309 | Burnt Bronze |
| Psychology | #F59E0B | Golden Yellow |
| Social Sciences | #C2410C | Terracotta Rust |
Each node is clickable. Once you click on it you have the option to view either a light-level summary or in-depth summary. The light-level summary contains standard metadata: title, author name, DOI, key_fields and abstract about the research paper. The in-depth summary is generated upon request by the user using the claude-sonnet-4.6-api. The in-depth summary provides the user more specific information about each section in the research paper. To avoid excessive api token usage, we cap in-depth summary requests at 3 per user.
The AI assistant helps the user understand the domain and work contributed for the citation graph that they just generated. The user can chat with the AI assistant about topics such as the relationship between two papers, methodologies of a study, contributions to the field from each research paper or existing research gaps to name a few. The AI assistant uses Retrieval-Augmented Generation (RAG) to fetch knowledge and context regarding a users request from Supermemory. A light-level summary of each paper is automatically stored in supermemory once the citation graph is generated. The AI assistant fetches knowledge regarding the research papers in the citation graph from those memories. If the user asks a question that is outside the context of the light-level summary, the chatbot directs the user to generate an in-depth summary for that research paper. All in-depth summaries generated in the session are also stored in Supermemory. once the session is complete and the user exits the application, all memories in Supermemory are dumped.
- Bun: JavaScript runtime and package manager. bun.sh
- Supabase project: Postgres database and Storage bucket named
papers(private). supabase.com - Supermemory API key: Vector memory for paper grounding. supermemory.ai
- Anthropic API key: Powers in-depth summaries and the AI chat agent. console.anthropic.com
- Clone the repo and install dependencies:
git clone https://github.com/your-username/citation-chain.git
cd citation-chain
bun install- Create
.env.localin the project root:
NEXT_PUBLIC_SUPABASE_URL=
NEXT_PUBLIC_SUPABASE_PUBLISHABLE_KEY=
SUPABASE_SECRET_KEY=
SUPERMEMORY_API_KEY=
ANTHROPIC_API_KEY=
OPENALEX_MAILTO=- Start the development server:
bun run devThe app runs at http://localhost:3000.