Merge branch 'master' of github.com:khoj-ai/khoj into features/migrate-to-spring-ui

documentation/docs/contributing/development.mdx

@@ -186,7 +186,7 @@ In whichever clients you're using for testing, you'll need to update the server
 ### Before Making Changes
 1. Install Git Hooks for Validation
    ```shell
-   pre-commit install -t pre-push -t pre-commit
+   ./scripts/dev_setup.sh
    ```
    - This ensures standard code formatting fixes and other checks run automatically on every commit and push
    - Note 1: If [pre-commit](https://pre-commit.com/#intro) didn't already get installed, [install it](https://pre-commit.com/#install) via `pip install pre-commit`

scripts/dev_setup.sh

@@ -0,0 +1,119 @@
+# Initialize the development environment for the project
+# ---
+PROJECT_ROOT=$(git rev-parse --show-toplevel)
+
+# Install Web App
+# ---
+echo "Installing Web App..."
+cd $PROJECT_ROOT/src/interface/web
+yarn install
+
+# Install Obsidian App
+# ---
+echo "Installing Obsidian App..."
+cd $PROJECT_ROOT/src/interface/obsidian
+yarn install
+
+# Install Desktop App
+# ---
+echo "Installing Desktop App..."
+cd $PROJECT_ROOT/src/interface/desktop
+yarn install
+
+# Install Server App
+# ---
+echo "Installing Server App..."
+cd $PROJECT_ROOT
+# pip install --user pipenv && pipenv install -e '.[dev]' --skip-lock && pipenv shell
+python3 -m venv .venv && pip install -e '.[dev]' && . .venv/bin/activate
+
+# Install pre-commit hooks
+# ----
+echo "Installing pre-commit hooks..."
+
+# Setup pre-commit hooks using the pre-commit package
+pre-commit install -t pre-push -t pre-commit
+
+# Run Prettier on web app
+cat << 'EOF' > temp_pre_commit
+# Run Prettier for Web App
+# -------------------------
+
+# Function to check if color output is possible
+can_use_color() {
+    if [ -t 1 ] && command -v tput >/dev/null 2>&1 && tput colors >/dev/null 2>&1; then
+        return 0
+    else
+        return 1
+    fi
+}
+
+# Function to print colored text if possible
+print_color() {
+    if can_use_color; then
+        tput setab "$1"
+        printf "%s" "$2"
+        tput sgr0
+    else
+        printf "%s" "$2"
+    fi
+}
+
+print_status() {
+    local status="$1"
+    local color="$2"
+    printf "prettier%-64s" "..."
+    print_color "$color" "$status"
+    printf "\n"
+}
+
+PROJECT_ROOT=$(git rev-parse --show-toplevel)
+# Get the list of staged files
+FILES=$(git diff --cached --name-only --diff-filter=ACMR | grep '^src/interface/web/' | sed 's| |\\ |g')
+if [ -z "$FILES" ]; then
+    if [ -t 1 ]; then
+        print_status "Skipped" 6
+    else
+        echo "prettier.....................................................Skipped"
+    fi
+else
+    # Run prettier on staged files
+    echo "$FILES" | xargs $PROJECT_ROOT/src/interface/web/node_modules/.bin/prettier --ignore-unknown --write
+
+    # Check if any files were modified by prettier
+    MODIFIED=$(git diff --name-only -- $FILES)
+    if [ -n "$MODIFIED" ]; then
+        if [ -t 1 ]; then
+            print_status "Modified" 1
+        else
+            echo "prettier.....................................................Modified"
+        fi
+        exit 1
+    fi
+
+    # Add back the modified/prettified files to staging
+    # echo "$FILES" | xargs git add
+
+    # Show the user if changes were made
+    if [ -t 1 ]; then
+        print_status "Passed" 2
+    else
+        echo "prettier.....................................................Passed"
+    fi
+fi
+EOF
+
+# Prepend the new content to the existing pre-commit file
+cat temp_pre_commit "$(git rev-parse --git-dir)/hooks/pre-commit" > temp_combined_pre_commit
+
+# Replace the old pre-commit file with the new combined one
+mv temp_combined_pre_commit "$(git rev-parse --git-dir)/hooks/pre-commit"
+
+# Clean up
+# ---
+
+# Remove the temporary pre-commit file
+rm temp_pre_commit
+
+# Make sure the pre-commit hook is executable
+chmod +x "$(git rev-parse --git-dir)/hooks/pre-commit"

src/interface/desktop/package.json

@@ -16,7 +16,7 @@
     "start": "yarn electron ."
   },
   "dependencies": {
-    "@todesktop/runtime": "^1.3.0",
+    "@todesktop/runtime": "^1.6.4",
     "axios": "^1.6.4",
     "cron": "^2.4.3",
     "electron-store": "^8.1.0"

src/interface/desktop/todesktop.json

@@ -1,6 +1,9 @@
 {
     "id": "",
-    "icon": "./assets/icons/favicon-128x128.png",
+    "icon": "./assets/icons/favicon.icns",
     "appPath": ".",
-    "schemaVersion": 1
+    "schemaVersion": 1,
+    "windows": {
+        "icon": "./assets/icons/favicon-128x128.png"
+    }
 }

src/interface/desktop/yarn.lock

@@ -50,10 +50,10 @@
   dependencies:
     defer-to-connect "^2.0.0"
 
-"@todesktop/runtime@^1.3.0":
-  version "1.6.3"
-  resolved "https://registry.yarnpkg.com/@todesktop/runtime/-/runtime-1.6.3.tgz#152dda0ad49e0f0ab0f33493e185b594b8871964"
-  integrity sha512-1PNBSuTSZxlIS5/3lVRRD76/z0i4iqD1H9GItV2arXwWbfwBKwV9h51aLQR0SQ7BgAvzQcHvJTQaiA8WL0ku4g==
+"@todesktop/runtime@^1.6.4":
+  version "1.6.4"
+  resolved "https://registry.yarnpkg.com/@todesktop/runtime/-/runtime-1.6.4.tgz#a9d62a021cf2647c51371c892bfb1d4c5a29ed7e"
+  integrity sha512-n6dOxhrKKsXMM+i2u9iRvoJSR2KCWw0orYK+FT9RbWNPykhuFIYd0yy8dYgYy/OuClKGyGl4SJFi2757FLhWDA==
   dependencies:
     del "^6.0.0"
     electron-updater "^4.6.1"

src/interface/web/app/components/navMenu/navMenu.tsx

@@ -171,7 +171,7 @@ export default function NavMenu() {
                                 </DropdownMenuItem>
                             ) : (
                                 <DropdownMenuItem>
-                                    <Link href="/auth/login" className="no-underline w-full">
+                                    <Link href="/login" className="no-underline w-full">
                                         <div className="flex flex-rows">
                                             <ArrowRight className="w-6 h-6" />
                                             <p className="ml-3 font-semibold">Login</p>
@@ -275,7 +275,7 @@ export default function NavMenu() {
                                     </MenubarItem>
                                 ) : (
                                     <MenubarItem>
-                                        <Link href="/auth/login" className="no-underline w-full">
+                                        <Link href="/login" className="no-underline w-full">
                                             <div className="flex flex-rows">
                                                 <ArrowRight className="w-6 h-6" />
                                                 <p className="ml-3 font-semibold">Login</p>

src/interface/web/app/components/suggestions/suggestionCard.tsx

@@ -5,7 +5,6 @@ import styles from "./suggestions.module.css";
 import { converColorToBgGradient } from "@/app/common/colorUtils";
 import { convertSuggestionTitleToIconClass } from "./suggestionsData";
 
-
 interface SuggestionCardProps {
     title: string;
     body: string;
@@ -23,10 +22,7 @@ export default function SuggestionCard(data: SuggestionCardProps) {
         <Card className={cardClassName}>
             <CardHeader className="m-0 p-2 pb-1 relative">
                 <div className="flex flex-row md:flex-col">
-                    {convertSuggestionTitleToIconClass(
-                        data.title,
-                        data.color.toLowerCase(),
-                    )}
+                    {convertSuggestionTitleToIconClass(data.title, data.color.toLowerCase())}
                     <CardTitle className={titleClassName}>{data.title}</CardTitle>
                 </div>
             </CardHeader>

src/interface/web/app/components/suggestions/suggestionsData.ts

@@ -41,29 +41,32 @@ addSuggestionColorMap(SuggestionType.Interviewing, "purple");
 addSuggestionColorMap(SuggestionType.Home, "green");
 addSuggestionColorMap(SuggestionType.Fun, "fuchsia");
 addSuggestionColorMap(SuggestionType.Code, "purple");
-addSuggestionColorMap(SuggestionType.Finance, "green")
+addSuggestionColorMap(SuggestionType.Finance, "green");
 
 const DEFAULT_COLOR = "orange";
 
 export function convertSuggestionTitleToIconClass(title: string, color: string) {
-    if (title === SuggestionType.Automation) return getIconFromIconName("Robot", color, "w-8", "h-8");
+    if (title === SuggestionType.Automation)
+        return getIconFromIconName("Robot", color, "w-8", "h-8");
     if (title === SuggestionType.Paint) return getIconFromIconName("Palette", color, "w-8", "h-8");
-    if (title === SuggestionType.PopCulture) return getIconFromIconName("Confetti", color, "w-8", "h-8");
+    if (title === SuggestionType.PopCulture)
+        return getIconFromIconName("Confetti", color, "w-8", "h-8");
     if (title === SuggestionType.Travel) return getIconFromIconName("Jeep", color, "w-8", "h-8");
     if (title === SuggestionType.Learning) return getIconFromIconName("Book", color, "w-8", "h-8");
-    if (title === SuggestionType.Health) return getIconFromIconName("Asclepius", color, "w-8", "h-8");
+    if (title === SuggestionType.Health)
+        return getIconFromIconName("Asclepius", color, "w-8", "h-8");
     if (title === SuggestionType.Fun) return getIconFromIconName("Island", color, "w-8", "h-8");
     if (title === SuggestionType.Home) return getIconFromIconName("House", color, "w-8", "h-8");
-    if (title === SuggestionType.Language) return getIconFromIconName("Translate", color, "w-8", "h-8");
+    if (title === SuggestionType.Language)
+        return getIconFromIconName("Translate", color, "w-8", "h-8");
     if (title === SuggestionType.Code) return getIconFromIconName("Code", color, "w-8", "h-8");
     if (title === SuggestionType.Food) return getIconFromIconName("BowlFood", color, "w-8", "h-8");
-    if (title === SuggestionType.Interviewing) return getIconFromIconName("Lectern", color, "w-8", "h-8");
+    if (title === SuggestionType.Interviewing)
+        return getIconFromIconName("Lectern", color, "w-8", "h-8");
     if (title === SuggestionType.Finance) return getIconFromIconName("Wallet", color, "w-8", "h-8");
     else return getIconFromIconName("Lightbulb", color, "w-8", "h-8");
 }
 
-
-
 export const suggestionsData: Suggestion[] = [
     {
         type: SuggestionType.Automation,
@@ -516,19 +519,22 @@ export const suggestionsData: Suggestion[] = [
     {
         type: SuggestionType.Learning,
         color: suggestionToColorMap[SuggestionType.Learning] || DEFAULT_COLOR,
-        description: "Guide a high school student through solving a quadratic equation step-by-step.",
+        description:
+            "Guide a high school student through solving a quadratic equation step-by-step.",
         link: "",
     },
     {
         type: SuggestionType.Learning,
         color: suggestionToColorMap[SuggestionType.Learning] || DEFAULT_COLOR,
-        description: "Create a series of questions to help a student discover the principles of basic economics.",
+        description:
+            "Create a series of questions to help a student discover the principles of basic economics.",
         link: "",
     },
     {
         type: SuggestionType.Learning,
         color: suggestionToColorMap[SuggestionType.Learning] || DEFAULT_COLOR,
-        description: "Develop a hands-on experiment to demonstrate the concept of density to middle schoolers.",
+        description:
+            "Develop a hands-on experiment to demonstrate the concept of density to middle schoolers.",
         link: "",
     },
     {
@@ -540,19 +546,22 @@ export const suggestionsData: Suggestion[] = [
     {
         type: SuggestionType.Learning,
         color: suggestionToColorMap[SuggestionType.Learning] || DEFAULT_COLOR,
-        description: "Create a personalized learning plan for a student struggling with grammar concepts.",
+        description:
+            "Create a personalized learning plan for a student struggling with grammar concepts.",
         link: "",
     },
     {
         type: SuggestionType.Learning,
         color: suggestionToColorMap[SuggestionType.Learning] || DEFAULT_COLOR,
-        description: "Design a series of questions to encourage critical thinking about climate change.",
+        description:
+            "Design a series of questions to encourage critical thinking about climate change.",
         link: "",
     },
     {
         type: SuggestionType.Learning,
         color: suggestionToColorMap[SuggestionType.Learning] || DEFAULT_COLOR,
-        description: "Develop a step-by-step guide for conducting a basic science experiment on plant growth.",
+        description:
+            "Develop a step-by-step guide for conducting a basic science experiment on plant growth.",
         link: "",
     },
     {
@@ -576,7 +585,8 @@ export const suggestionsData: Suggestion[] = [
     {
         type: SuggestionType.Health,
         color: suggestionToColorMap[SuggestionType.Health] || DEFAULT_COLOR,
-        description: "Explain the differences between various types of headaches and their treatments.",
+        description:
+            "Explain the differences between various types of headaches and their treatments.",
         link: "",
     },
     {
@@ -606,7 +616,8 @@ export const suggestionsData: Suggestion[] = [
     {
         type: SuggestionType.Health,
         color: suggestionToColorMap[SuggestionType.Health] || DEFAULT_COLOR,
-        description: "Provide an overview of the different types of cancer screenings and their importance.",
+        description:
+            "Provide an overview of the different types of cancer screenings and their importance.",
         link: "",
     },
     {
@@ -624,13 +635,15 @@ export const suggestionsData: Suggestion[] = [
     {
         type: SuggestionType.Finance,
         color: suggestionToColorMap[SuggestionType.Finance] || DEFAULT_COLOR,
-        description: "Explain the concept of compound interest and its importance in long-term savings.",
+        description:
+            "Explain the concept of compound interest and its importance in long-term savings.",
         link: "",
     },
     {
         type: SuggestionType.Finance,
         color: suggestionToColorMap[SuggestionType.Finance] || DEFAULT_COLOR,
-        description: "Provide an overview of different types of retirement accounts (e.g., 401(k), IRA, Roth IRA).",
+        description:
+            "Provide an overview of different types of retirement accounts (e.g., 401(k), IRA, Roth IRA).",
         link: "",
     },
     {
@@ -654,7 +667,8 @@ export const suggestionsData: Suggestion[] = [
     {
         type: SuggestionType.Finance,
         color: suggestionToColorMap[SuggestionType.Finance] || DEFAULT_COLOR,
-        description: "Describe different methods for paying off debt, such as the snowball and avalanche methods.",
+        description:
+            "Describe different methods for paying off debt, such as the snowball and avalanche methods.",
         link: "",
     },
     {
@@ -666,7 +680,8 @@ export const suggestionsData: Suggestion[] = [
     {
         type: SuggestionType.Finance,
         color: suggestionToColorMap[SuggestionType.Finance] || DEFAULT_COLOR,
-        description: "Provide an overview of different types of insurance and their importance in financial planning.",
+        description:
+            "Provide an overview of different types of insurance and their importance in financial planning.",
         link: "",
     },
     {

src/interface/web/app/settings/page.tsx

@@ -848,11 +848,12 @@ export default function SettingsView() {
                                         <CardHeader className="flex flex-row text-2xl">
                                             <Laptop className="h-8 w-8 mr-2" />
                                             Files
-                                            {
-                                                userConfig.enabled_content_source.computer && (
-                                                    <CheckCircle className="h-6 w-6 ml-auto text-green-500" weight="fill" />
-                                                )
-                                            }
+                                            {userConfig.enabled_content_source.computer && (
+                                                <CheckCircle
+                                                    className="h-6 w-6 ml-auto text-green-500"
+                                                    weight="fill"
+                                                />
+                                            )}
                                         </CardHeader>
                                         <CardContent className="overflow-hidden pb-12 text-gray-400">
                                             Manage your synced files
@@ -915,11 +916,12 @@ export default function SettingsView() {
                                         <CardHeader className="text-xl flex flex-row">
                                             <NotionLogo className="h-7 w-7 mr-2" />
                                             Notion
-                                            {
-                                                userConfig.enabled_content_source.notion && (
-                                                    <CheckCircle className="h-6 w-6 ml-auto text-green-500" weight="fill" />
-                                                )
-                                            }
+                                            {userConfig.enabled_content_source.notion && (
+                                                <CheckCircle
+                                                    className="h-6 w-6 ml-auto text-green-500"
+                                                    weight="fill"
+                                                />
+                                            )}
                                         </CardHeader>
                                         <CardContent className="grid gap-4">
                                             <p className="text-gray-400">