diff --git a/src/interface/web/app/components/logo/khojLogo.tsx b/src/interface/web/app/components/logo/khojLogo.tsx index b3afd9ca..66cb2396 100644 --- a/src/interface/web/app/components/logo/khojLogo.tsx +++ b/src/interface/web/app/components/logo/khojLogo.tsx @@ -1,10 +1,11 @@ -export function KhojLogoType() { +export function KhojLogoType({ className }: { className?: string }) { + const classes = className ?? "fill-zinc-950 dark:fill-zinc-300"; return ( @@ -45,13 +46,14 @@ export function KhojLogoType() { ); } -export function KhojLogo() { +export function KhojLogo({ className }: { className?: string }) { + const classes = className ?? "fill-zinc-950 dark:fill-zinc-300"; return ( @@ -87,3 +89,106 @@ export function KhojLogo() { ); } + +export function KhojSearchLogo({ className }: { className?: string }) { + const classes = className ?? "w-6 h-6"; + return ( + + + + + + ); +} + +export function KhojAutomationLogo({ className }: { className?: string }) { + const classes = className ?? "w-6 h-6"; + return ( + + + + + + + + ); +} + +export function KhojAgentLogo({ className }: { className?: string }) { + const classes = className ?? "w-6 h-6"; + // Icon Source: AI by Palash Jain from Noun Project (CC BY 3.0) + return ( + + + + ); +} diff --git a/src/interface/web/app/components/navMenu/navMenu.tsx b/src/interface/web/app/components/navMenu/navMenu.tsx index 9510620d..e59d686a 100644 --- a/src/interface/web/app/components/navMenu/navMenu.tsx +++ b/src/interface/web/app/components/navMenu/navMenu.tsx @@ -34,6 +34,7 @@ import { ArrowRight, UsersFour, } from "@phosphor-icons/react"; +import { KhojAgentLogo, KhojAutomationLogo, KhojSearchLogo } from "../logo/khojLogo"; export default function NavMenu() { const userData = useAuthenticatedData(); @@ -99,6 +100,12 @@ export default function NavMenu() { )} + +
+

{userData?.email}

+
+ + setDarkMode(!darkMode)} className="w-full cursor-pointer" @@ -117,7 +124,7 @@ export default function NavMenu() {
- +

Agents

@@ -125,7 +132,7 @@ export default function NavMenu() {
- +

Automations

@@ -134,7 +141,7 @@ export default function NavMenu() {
- +

Search

@@ -200,6 +207,12 @@ export default function NavMenu() { )} + +
+

{userData?.email}

+
+
+ setDarkMode(!darkMode)} className="w-full hover:cursor-pointer" @@ -218,7 +231,7 @@ export default function NavMenu() {
- +

Agents

@@ -226,7 +239,7 @@ export default function NavMenu() {
- +

Automations

@@ -235,7 +248,7 @@ export default function NavMenu() {
- +

Search

diff --git a/src/interface/web/app/search/page.tsx b/src/interface/web/app/search/page.tsx index a6972d80..a49f0268 100644 --- a/src/interface/web/app/search/page.tsx +++ b/src/interface/web/app/search/page.tsx @@ -20,8 +20,6 @@ import { ArrowRight, FileDashed, FileMagnifyingGlass, - Folder, - FolderOpen, GithubLogo, Lightbulb, LinkSimple, @@ -31,6 +29,7 @@ import { } from "@phosphor-icons/react"; import { Button } from "@/components/ui/button"; import Link from "next/link"; +import { getIconFromFilename } from "../common/iconUtils"; interface AdditionalData { file: string; @@ -87,14 +86,15 @@ function Note(props: NoteResultProps) { const fileName = isFileNameURL ? note.additional.heading : note.additional.file.split("/").pop(); + const fileIcon = getIconFromFilename(fileName || ".txt", "h-4 w-4 inline mr-2"); return ( - + {getNoteTypeIcon(note.additional.source)} - - {fileName} + {fileName} +
{note.entry}
@@ -118,8 +118,8 @@ function Note(props: NoteResultProps) { {note.additional.file} ) : ( -
- +
+ {fileIcon} {note.additional.file}
)} @@ -133,6 +133,8 @@ function focusNote(note: SearchResult) { const fileName = isFileNameURL ? note.additional.heading : note.additional.file.split("/").pop(); + const fileIcon = getIconFromFilename(fileName || ".txt", "h-4 w-4 inline mr-2"); + return ( @@ -150,7 +152,7 @@ function focusNote(note: SearchResult) { ) : (
- + {fileIcon} {note.additional.file}
)} @@ -243,18 +245,21 @@ export default function Search() {
-
- +
setSearchQuery(e.currentTarget.value)} onKeyDown={(e) => e.key === "Enter" && search()} type="search" placeholder="Search Documents" /> -
{focusSearchResult && ( diff --git a/src/khoj/interface/web/assets/icons/agents.svg b/src/khoj/interface/web/assets/icons/agents.svg index f3974293..27540107 100644 --- a/src/khoj/interface/web/assets/icons/agents.svg +++ b/src/khoj/interface/web/assets/icons/agents.svg @@ -1,6 +1,18 @@ - - - + + + diff --git a/src/khoj/interface/web/assets/icons/automation.svg b/src/khoj/interface/web/assets/icons/automation.svg index 162dd9ba..d49a0c5b 100644 --- a/src/khoj/interface/web/assets/icons/automation.svg +++ b/src/khoj/interface/web/assets/icons/automation.svg @@ -1,37 +1,42 @@ - - - - - + xmlns="http://www.w3.org/2000/svg" + version="1.1" + viewBox="0 0 24 24" + width="800" + height="800" + fill="none" +> + + + + + diff --git a/src/khoj/interface/web/assets/icons/search.svg b/src/khoj/interface/web/assets/icons/search.svg index f0e463f2..261e0d21 100644 --- a/src/khoj/interface/web/assets/icons/search.svg +++ b/src/khoj/interface/web/assets/icons/search.svg @@ -1,25 +1,57 @@ - + + version="1.1" + id="svg3" + sodipodi:docname="search.svg" + inkscape:version="1.3 (0e150ed, 2023-07-21)" + xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" + xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" + xmlns="http://www.w3.org/2000/svg" + xmlns:svg="http://www.w3.org/2000/svg"> + + + stroke-dasharray="none" + id="path1" + sodipodi:nodetypes="cssssccccsssss" /> + stroke-linecap="round" + id="path2" /> + stroke-linecap="round" + id="path3" /> diff --git a/src/khoj/interface/web/login.html b/src/khoj/interface/web/login.html index d9b24bb1..39c3911b 100644 --- a/src/khoj/interface/web/login.html +++ b/src/khoj/interface/web/login.html @@ -18,7 +18,7 @@