mirror of
https://github.com/MODSetter/SurfSense.git
synced 2026-04-25 00:36:31 +02:00
initial release
This commit is contained in:
parent
2e3ce925a5
commit
ecc45c689e
8 changed files with 136 additions and 221 deletions
96
.github/workflows/nextjs.yml
vendored
96
.github/workflows/nextjs.yml
vendored
|
|
@ -1,96 +0,0 @@
|
|||
# Sample workflow for building and deploying a Next.js site to GitHub Pages
|
||||
#
|
||||
# To get started with Next.js see: https://nextjs.org/docs/getting-started
|
||||
#
|
||||
name: Deploy Next.js site to Pages
|
||||
|
||||
on:
|
||||
# Runs on pushes targeting the default branch
|
||||
push:
|
||||
branches: ["main"]
|
||||
|
||||
# Allows you to run this workflow manually from the Actions tab
|
||||
workflow_dispatch:
|
||||
|
||||
# Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages
|
||||
permissions:
|
||||
contents: read
|
||||
pages: write
|
||||
id-token: write
|
||||
|
||||
# Allow only one concurrent deployment, skipping runs queued between the run in-progress and latest queued.
|
||||
# However, do NOT cancel in-progress runs as we want to allow these production deployments to complete.
|
||||
concurrency:
|
||||
group: "pages"
|
||||
cancel-in-progress: false
|
||||
|
||||
jobs:
|
||||
# Build job
|
||||
build:
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- name: Checkout
|
||||
uses: actions/checkout@v4
|
||||
- name: Detect package manager
|
||||
id: detect-package-manager
|
||||
run: |
|
||||
if [ -f "${{ github.workspace }}/yarn.lock" ]; then
|
||||
echo "manager=yarn" >> $GITHUB_OUTPUT
|
||||
echo "command=install" >> $GITHUB_OUTPUT
|
||||
echo "runner=yarn" >> $GITHUB_OUTPUT
|
||||
exit 0
|
||||
elif [ -f "${{ github.workspace }}/package.json" ]; then
|
||||
echo "manager=pnpm" >> $GITHUB_OUTPUT
|
||||
echo "command=install --frozen-lockfile" >> $GITHUB_OUTPUT
|
||||
echo "runner=pnpx" >> $GITHUB_OUTPUT
|
||||
exit 0
|
||||
else
|
||||
echo "Unable to determine package manager"
|
||||
exit 1
|
||||
fi
|
||||
- name: Setup pnpm
|
||||
uses: pnpm/action-setup@v4.0.0
|
||||
|
||||
- name: Setup Node
|
||||
uses: actions/setup-node@v4
|
||||
with:
|
||||
node-version: "20"
|
||||
cache: ${{ steps.detect-package-manager.outputs.manager }}
|
||||
- name: Setup Pages
|
||||
uses: actions/configure-pages@v5
|
||||
with:
|
||||
# Automatically inject basePath in your Next.js configuration file and disable
|
||||
# server side image optimization (https://nextjs.org/docs/api-reference/next/image#unoptimized).
|
||||
#
|
||||
# You may remove this line if you want to manage the configuration yourself.
|
||||
static_site_generator: next
|
||||
- name: Restore cache
|
||||
uses: actions/cache@v4
|
||||
with:
|
||||
path: |
|
||||
.next/cache
|
||||
# Generate a new cache whenever packages or source files change.
|
||||
key: ${{ runner.os }}-nextjs-${{ hashFiles('**/package-lock.json', '**/yarn.lock') }}-${{ hashFiles('**.[jt]s', '**.[jt]sx') }}
|
||||
# If source files changed but packages didn't, rebuild from a prior cache.
|
||||
restore-keys: |
|
||||
${{ runner.os }}-nextjs-${{ hashFiles('**/package-lock.json', '**/yarn.lock') }}-
|
||||
- name: Install dependencies
|
||||
run: ${{ steps.detect-package-manager.outputs.manager }} ${{ steps.detect-package-manager.outputs.command }}
|
||||
- name: Build with Next.js
|
||||
run: pnpm next build
|
||||
- name: Upload artifact
|
||||
uses: actions/upload-pages-artifact@v3
|
||||
with:
|
||||
path: ./out
|
||||
|
||||
# Deployment job
|
||||
deploy:
|
||||
environment:
|
||||
name: github-pages
|
||||
url: ${{ steps.deployment.outputs.page_url }}
|
||||
runs-on: ubuntu-latest
|
||||
needs: build
|
||||
steps:
|
||||
- name: Deploy to GitHub Pages
|
||||
id: deployment
|
||||
uses: actions/deploy-pages@v4
|
||||
152
README.md
152
README.md
|
|
@ -1,36 +1,142 @@
|
|||
This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).
|
||||

|
||||
|
||||
## Getting Started
|
||||
# SurfSense
|
||||
|
||||
First, run the development server:
|
||||
When I’m browsing the internet, I tend to save a ton of content—but remembering it all? Total brain freeze! ❄️ That’s where SurfSense comes in. SurfSense is like a Knowledge Graph 🧠 Brain 🧠 for anything you see on the World Wide Web. Now, you’ll never forget any browsing session. Just ask your personal knowledge base anything about your saved content, and voilà—instant recall! 🧑💻🌐
|
||||
|
||||
```bash
|
||||
npm run dev
|
||||
# or
|
||||
yarn dev
|
||||
# or
|
||||
pnpm dev
|
||||
# or
|
||||
bun dev
|
||||
```
|
||||
|
||||
Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
|
||||
## Key Features
|
||||
|
||||
You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file.
|
||||
- 💡 **Idea**: Save any content you see on the internet in your own Knowledge Graph.
|
||||
- 🔍 **Powerful Search**: Quickly find anything in your Web Browsing Sessions.
|
||||
- 💬 **Chat with your Web History**: Interact in Natural Language with your saved Web Browsing Sessions.
|
||||
- 🏠 **Self Hostable**: Open source and easy to deploy locally.
|
||||
- 📊 **Use GraphRAG**: Utilize the power of GraphRAG to find meaningful relations in your saved content.
|
||||
|
||||
This project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font.
|
||||
## How to get started?
|
||||
|
||||
## Learn More
|
||||
Since the official Chrome extension for SurfSense is still under review, you'll need to set up the SurfSense Backend and SurfSense extension yourself for now. Don’t worry, it’s dead simple—just change a few environment variables, and you’ll be ready to go.
|
||||
|
||||
To learn more about Next.js, take a look at the following resources:
|
||||
Before we begin, we need to set up our Neo4j Graph Database. This is where SurfSense stores all your saved information. For a quick setup, I suggest getting your free Neo4j Aura DB from [https://neo4j.com/cloud/platform/aura-graph-database/](https://neo4j.com/cloud/platform/aura-graph-database/) or setting it up locally.
|
||||
|
||||
- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
|
||||
- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
|
||||
After obtaining your Neo4j credentials, make sure to get your OpenAI API Key from [https://platform.openai.com/](https://platform.openai.com/).
|
||||
|
||||
You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!
|
||||
For authentication purposes, you’ll also need a PostgreSQL instance running on your machine.
|
||||
|
||||
## Deploy on Vercel
|
||||
Now lets setup the SurfSense BackEnd
|
||||
1. Clone this repo.
|
||||
2. Go to ./backend subdirectory.
|
||||
3. Setup Python Virtual Enviroment
|
||||
4. Run `pip install -r requirements.txt` to install all required dependencies.
|
||||
5. Update the required Environment variables in envs.py
|
||||
|
||||
|ENV VARIABLE|Description |
|
||||
|--|--|
|
||||
| POSTGRES_DATABASE_URL | postgresql+psycopg2://user:pass@host:5432/database|
|
||||
| API_SECRET_KEY | Can be any Random String value. Make Sure to remember it for as you need to send it in request to Backend for security purposes.|
|
||||
|
||||
The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
|
||||
|
||||
Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.
|
||||
6. Backend is a FastAPI Backend so now just run the server on unicorn using command `uvicorn server:app --host 0.0.0.0 --port 8000`
|
||||
7. If everything worked fine you should see screen like this.
|
||||
|
||||

|
||||
|
||||
After Setting up the BackEnd Lets do a quick build of the extension.
|
||||
|
||||
1. Go to ./extension subdirectory.
|
||||
2. Run `pnpm i` to install required dependencies.
|
||||
3. Update Env variables at `./src/env.tsx`
|
||||
|
||||
|ENV VARIABLE|Description |
|
||||
|--|--|
|
||||
| API_SECRET_KEY | Same String value your set for Backend |
|
||||
| BACKEND_URL | Give hosted backend url here. Eg. `http://127.0.0.1:8000`|
|
||||
|
||||
4. Run `pnpm run build` to build your extension. Build will be generated in `./dist` folder
|
||||
5. Enable Developer Mode in Chrome and load the extinction from `./dist` folder.
|
||||
6. Extension will load successfully.
|
||||
|
||||
Now resister a quick user through Swagger API > Try it Out: http://127.0.0.1:8000/docs#/default/register_user_register_post
|
||||
|
||||
Make Sure in request body `"apisecretkey"` value is same value as `API_SECRET_KEY` we been assigning.
|
||||
|
||||
---
|
||||
|
||||
Now you are ready to use SurfSense. Start by first logging into the Extension.
|
||||
|
||||
When you start the extension you should see a Login page like this
|
||||
|
||||

|
||||
|
||||
After logging in you will need to fill your Neo4j Credentials & OpenAPI Key.
|
||||
|
||||

|
||||
|
||||
After Saving you should be able to use extension now.
|
||||

|
||||
|
||||
|Options|Explanations|
|
||||
|--|--|
|
||||
| Clear Inactive History Sessions | It clears the saved content for Inactive Tab Sessions. |
|
||||
| Save Current Webpage Snapshot | Stores the current webpage session info into SurfSense history store|
|
||||
| Save to SurfSense | Processes the SurfSense History Store & Initiates a Save Job |
|
||||
|
||||
---
|
||||
Now just start browsing the Internet. Whatever you want to save any content take its Snapshot and save it to SurfSense. After Save Job is completed you are ready to ask anything about it to your Knowledge Graph Brain 🧠.
|
||||
|
||||
If you don't want to deal with frontend local setup you can quickly go to https://www.surfsense.net/ and start interacting with your Knowledge Graph Brain 🧠.
|
||||
Just login to SurfSense at https://www.surfsense.net/ using these demo credentials
|
||||
|key|val|
|
||||
|--|--|
|
||||
| Username | test |
|
||||
| Password | test|
|
||||
|
||||
and then set the credentials of Neo4j & OpenAPI in https://www.surfsense.net/settings.
|
||||
|
||||
---
|
||||
|
||||
For local frontend setup just fill out the `.env` file of frontend.
|
||||
|
||||
|ENV VARIABLE|Description |
|
||||
|--|--|
|
||||
| NEXT_PUBLIC_API_SECRET_KEY | Same String value your set for Backend & Extension |
|
||||
| NEXT_PUBLIC_BACKEND_URL | Give hosted backend url here. Eg. `http://127.0.0.1:8000`|
|
||||
| NEXT_PUBLIC_RECAPTCHA_SITE_KEY | Google Recaptcha v2 Client Key |
|
||||
| RECAPTCHA_SECRET_KEY | Google Recaptcha v2 Server Key|
|
||||
|
||||
and run it using `pnpm run dev`
|
||||
|
||||
---
|
||||
|
||||
After that just go to https://www.surfsense.net/chat and start interacting.
|
||||
As an example lets visit : https://myanimelist.net/anime/season (Summer 2024 Anime atm) and save it to SurfSense.
|
||||
|
||||
Now lets ask SurfSense "Give list of summer 2024 animes with images."
|
||||
|
||||
Sample Response:
|
||||

|
||||
|
||||
Now Let's ask it more information about our related session.
|
||||

|
||||
|
||||
Sample More Description Response:
|
||||

|
||||
|
||||
|
||||
|
||||
## Tech Stack
|
||||
|
||||
- **Extenstion** : Chrome Manifest v3
|
||||
- **BackEnd** : FastAPI with LangChain
|
||||
- **FrontEnd**: Next.js with Aceternity.
|
||||
|
||||
#### Architecture:
|
||||
In Progress...........
|
||||
|
||||
|
||||
|
||||
## Contribute
|
||||
|
||||
Contributions are very welcome! A contribution can be as small as a ⭐ or even finding and creating issues.
|
||||
Fine-tuning the Backend is always desired.
|
||||
|
||||
|
|
|
|||
Binary file not shown.
|
|
@ -1,2 +1,2 @@
|
|||
export const API_SECRET_KEY = "SURFSENSENGvKkWM2VwcIlfFTOz3HR7zB0E4pHFM4llbT3BlbkFJJ0Ood1rgtXbvEXq6Lf"
|
||||
export const BACKEND_URL = "http://18.227.190.91:8000"
|
||||
export const BACKEND_URL = "https://www.clashforacure.org"
|
||||
|
|
@ -48,12 +48,12 @@ export const FillEnvVariables = () => {
|
|||
<form className="space-y-4 md:space-y-6" onSubmit={handleSubmit}>
|
||||
<div>
|
||||
<label className="block mb-2 text-sm font-medium text-gray-900 dark:text-white">Neo4J URL</label>
|
||||
<input type="text" value={neourl} onChange={(e) => setNeourl(e.target.value)} name="neourl" id="neourl" className="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-primary-600 focus:border-primary-600 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500" placeholder="name@company.com" />
|
||||
<input type="text" value={neourl} onChange={(e) => setNeourl(e.target.value)} name="neourl" id="neourl" className="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-primary-600 focus:border-primary-600 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500" placeholder="neo4j url" />
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label className="block mb-2 text-sm font-medium text-gray-900 dark:text-white">Neo4J Username</label>
|
||||
<input type="text" value={neouser} onChange={(e) => setNeouser(e.target.value)} name="neouser" id="neouser" className="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-primary-600 focus:border-primary-600 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500" placeholder="name@company.com" />
|
||||
<input type="text" value={neouser} onChange={(e) => setNeouser(e.target.value)} name="neouser" id="neouser" className="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-primary-600 focus:border-primary-600 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500" placeholder="neo4j username" />
|
||||
</div>
|
||||
<div>
|
||||
<label className="block mb-2 text-sm font-medium text-gray-900 dark:text-white">Neo4J Password</label>
|
||||
|
|
@ -61,7 +61,7 @@ export const FillEnvVariables = () => {
|
|||
</div>
|
||||
<div>
|
||||
<label className="block mb-2 text-sm font-medium text-gray-900 dark:text-white">OpenAI API Key</label>
|
||||
<input type="text" value={openaikey} onChange={(e) => setOpenaiKey(e.target.value)} name="openaikey" id="openaikey" className="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-primary-600 focus:border-primary-600 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500" placeholder="name@company.com" />
|
||||
<input type="text" value={openaikey} onChange={(e) => setOpenaiKey(e.target.value)} name="openaikey" id="openaikey" className="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-primary-600 focus:border-primary-600 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500" placeholder="OpenAI API Key" />
|
||||
</div>
|
||||
<button type="submit" className="mt-4 w-full text-white bg-primary-600 hover:bg-primary-700 focus:ring-4 focus:outline-none focus:ring-primary-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center dark:bg-primary-600 dark:hover:bg-primary-700 dark:focus:ring-primary-800">{loading ? 'Saving....' : 'Save & Proceed'}</button>
|
||||
{error && <p style={{ color: 'red' }}>{error}</p>}
|
||||
|
|
|
|||
|
|
@ -70,7 +70,7 @@ export const Popup = () => {
|
|||
useEffect(() => {
|
||||
const verifyToken = async () => {
|
||||
const token = localStorage.getItem('token');
|
||||
console.log(token)
|
||||
// console.log(token)
|
||||
try {
|
||||
const response = await fetch(`${BACKEND_URL}/verify-token/${token}`);
|
||||
|
||||
|
|
|
|||
96
web/.github/workflows/nextjs.yml
vendored
96
web/.github/workflows/nextjs.yml
vendored
|
|
@ -1,96 +0,0 @@
|
|||
# Sample workflow for building and deploying a Next.js site to GitHub Pages
|
||||
#
|
||||
# To get started with Next.js see: https://nextjs.org/docs/getting-started
|
||||
#
|
||||
name: Deploy Next.js site to Pages
|
||||
|
||||
on:
|
||||
# Runs on pushes targeting the default branch
|
||||
push:
|
||||
branches: ["main"]
|
||||
|
||||
# Allows you to run this workflow manually from the Actions tab
|
||||
workflow_dispatch:
|
||||
|
||||
# Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages
|
||||
permissions:
|
||||
contents: read
|
||||
pages: write
|
||||
id-token: write
|
||||
|
||||
# Allow only one concurrent deployment, skipping runs queued between the run in-progress and latest queued.
|
||||
# However, do NOT cancel in-progress runs as we want to allow these production deployments to complete.
|
||||
concurrency:
|
||||
group: "pages"
|
||||
cancel-in-progress: false
|
||||
|
||||
jobs:
|
||||
# Build job
|
||||
build:
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- name: Checkout
|
||||
uses: actions/checkout@v4
|
||||
- name: Detect package manager
|
||||
id: detect-package-manager
|
||||
run: |
|
||||
if [ -f "/home/runner/work/SurfSense/yarn.lock" ]; then
|
||||
echo "manager=yarn" >> $GITHUB_OUTPUT
|
||||
echo "command=install" >> $GITHUB_OUTPUT
|
||||
echo "runner=yarn" >> $GITHUB_OUTPUT
|
||||
exit 0
|
||||
elif [ -f "$/home/runner/work/SurfSense/package.json" ]; then
|
||||
echo "manager=pnpm" >> $GITHUB_OUTPUT
|
||||
echo "command=install --frozen-lockfile" >> $GITHUB_OUTPUT
|
||||
echo "runner=pnpx" >> $GITHUB_OUTPUT
|
||||
exit 0
|
||||
else
|
||||
echo "Unable to determine package manager"
|
||||
exit 1
|
||||
fi
|
||||
- name: Setup pnpm
|
||||
uses: pnpm/action-setup@v4.0.0
|
||||
|
||||
- name: Setup Node
|
||||
uses: actions/setup-node@v4
|
||||
with:
|
||||
node-version: "20"
|
||||
cache: ${{ steps.detect-package-manager.outputs.manager }}
|
||||
- name: Setup Pages
|
||||
uses: actions/configure-pages@v5
|
||||
with:
|
||||
# Automatically inject basePath in your Next.js configuration file and disable
|
||||
# server side image optimization (https://nextjs.org/docs/api-reference/next/image#unoptimized).
|
||||
#
|
||||
# You may remove this line if you want to manage the configuration yourself.
|
||||
static_site_generator: next
|
||||
- name: Restore cache
|
||||
uses: actions/cache@v4
|
||||
with:
|
||||
path: |
|
||||
.next/cache
|
||||
# Generate a new cache whenever packages or source files change.
|
||||
key: ${{ runner.os }}-nextjs-${{ hashFiles('**/package-lock.json', '**/yarn.lock') }}-${{ hashFiles('**.[jt]s', '**.[jt]sx') }}
|
||||
# If source files changed but packages didn't, rebuild from a prior cache.
|
||||
restore-keys: |
|
||||
${{ runner.os }}-nextjs-${{ hashFiles('**/package-lock.json', '**/yarn.lock') }}-
|
||||
- name: Install dependencies
|
||||
run: ${{ steps.detect-package-manager.outputs.manager }} ${{ steps.detect-package-manager.outputs.command }}
|
||||
- name: Build with Next.js
|
||||
run: pnpm next build
|
||||
- name: Upload artifact
|
||||
uses: actions/upload-pages-artifact@v3
|
||||
with:
|
||||
path: ./out
|
||||
|
||||
# Deployment job
|
||||
deploy:
|
||||
environment:
|
||||
name: github-pages
|
||||
url: ${{ steps.deployment.outputs.page_url }}
|
||||
runs-on: ubuntu-latest
|
||||
needs: build
|
||||
steps:
|
||||
- name: Deploy to GitHub Pages
|
||||
id: deployment
|
||||
uses: actions/deploy-pages@v4
|
||||
|
|
@ -37,5 +37,6 @@
|
|||
"postcss": "^8.4.41",
|
||||
"tailwindcss": "^3.4.9",
|
||||
"typescript": "^5"
|
||||
}
|
||||
},
|
||||
"packageManager": "^pnpm@6.32.4"
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue