mirror of
https://github.com/khoaliber/khoj.git
synced 2026-03-03 05:29:12 +00:00
Merge branch 'features/clean-up-authenticated-data' of github.com:khoj-ai/khoj into features/update-home-page
This commit is contained in:
sabaimran
@@ -429,7 +429,7 @@ export function AgentCard(props: AgentCardProps) {
|
||||
{props.editCard ? (
|
||||
<DialogContent
|
||||
className={
|
||||
"lg:max-w-screen-lg py-4 overflow-y-scroll h-4/6 rounded-lg flex flex-col"
|
||||
"lg:max-w-screen-lg py-4 overflow-y-scroll h-full md:h-4/6 rounded-lg flex flex-col"
|
||||
}
|
||||
>
|
||||
<DialogTitle>
|
||||
@@ -535,6 +535,8 @@ export function AgentModificationForm(props: AgentModificationFormProps) {
|
||||
const basicFields = [
|
||||
{ name: "name", label: "Name" },
|
||||
{ name: "persona", label: "Personality" },
|
||||
{ name: "color", label: "Color" },
|
||||
{ name: "icon", label: "Icon" },
|
||||
];
|
||||
|
||||
const toolsFields = [
|
||||
@@ -545,17 +547,15 @@ export function AgentModificationForm(props: AgentModificationFormProps) {
|
||||
const knowledgeBaseFields = [{ name: "files", label: "Knowledge Base" }];
|
||||
|
||||
const customizationFields = [
|
||||
{ name: "color", label: "Color" },
|
||||
{ name: "icon", label: "Icon" },
|
||||
{ name: "chat_model", label: "Chat Model" },
|
||||
{ name: "privacy_level", label: "Privacy Level" },
|
||||
];
|
||||
|
||||
const formGroups = [
|
||||
{ fields: basicFields, label: "Basic Settings", tabName: "basic" },
|
||||
{ fields: customizationFields, label: "Customization & Access", tabName: "customize" },
|
||||
{ fields: knowledgeBaseFields, label: "Knowledge Base", tabName: "knowledge" },
|
||||
{ fields: toolsFields, label: "Tools Settings", tabName: "tools" },
|
||||
{ fields: basicFields, label: "1. Basic Settings", tabName: "basic" },
|
||||
{ fields: customizationFields, label: "2. Model & Privacy", tabName: "customize" },
|
||||
{ fields: knowledgeBaseFields, label: "3. Knowledge Base", tabName: "knowledge" },
|
||||
{ fields: toolsFields, label: "4. Tools", tabName: "tools" },
|
||||
];
|
||||
|
||||
const fileInputRef = useRef<HTMLInputElement>(null);
|
||||
@@ -754,7 +754,7 @@ export function AgentModificationForm(props: AgentModificationFormProps) {
|
||||
control={props.form.control}
|
||||
name="chat_model"
|
||||
render={({ field }) => (
|
||||
<FormItem className="my-3 grid gap-2">
|
||||
<FormItem className="my-2 grid gap-2">
|
||||
<FormLabel>Chat Model</FormLabel>
|
||||
<FormDescription>
|
||||
{!props.isSubscribed ? (
|
||||
@@ -801,7 +801,7 @@ export function AgentModificationForm(props: AgentModificationFormProps) {
|
||||
control={props.form.control}
|
||||
name="privacy_level"
|
||||
render={({ field }) => (
|
||||
<FormItem className="my-3 grid gap-2">
|
||||
<FormItem className="my-2 grid gap-2">
|
||||
<FormLabel>
|
||||
<div>Privacy Level</div>
|
||||
</FormLabel>
|
||||
@@ -858,7 +858,7 @@ export function AgentModificationForm(props: AgentModificationFormProps) {
|
||||
control={props.form.control}
|
||||
name="color"
|
||||
render={({ field }) => (
|
||||
<FormItem className="space-y-3">
|
||||
<FormItem className="space-y-3 my-2">
|
||||
<FormLabel>Color</FormLabel>
|
||||
<Select onValueChange={field.onChange} defaultValue={field.value}>
|
||||
<FormControl>
|
||||
@@ -892,7 +892,7 @@ export function AgentModificationForm(props: AgentModificationFormProps) {
|
||||
control={props.form.control}
|
||||
name="icon"
|
||||
render={({ field }) => (
|
||||
<FormItem className="space-y-3">
|
||||
<FormItem className="space-y-3 my-2">
|
||||
<FormLabel>Icon</FormLabel>
|
||||
<Select onValueChange={field.onChange} defaultValue={field.value}>
|
||||
<FormControl>
|
||||
@@ -928,12 +928,12 @@ export function AgentModificationForm(props: AgentModificationFormProps) {
|
||||
control={props.form.control}
|
||||
name="persona"
|
||||
render={({ field }) => (
|
||||
<FormItem className="space-y-1 grid gap-2">
|
||||
<FormItem className="space-y-1 my-2 grid gap-2">
|
||||
<FormLabel>Personality</FormLabel>
|
||||
<FormDescription>
|
||||
What is the personality, thought process, or tuning of this
|
||||
agent? Get creative; this is how you can influence the agent
|
||||
constitution.
|
||||
agent? This is where you can provide any instructions to the
|
||||
agent.
|
||||
</FormDescription>
|
||||
<FormControl>
|
||||
<Textarea
|
||||
@@ -954,7 +954,7 @@ export function AgentModificationForm(props: AgentModificationFormProps) {
|
||||
control={props.form.control}
|
||||
name="files"
|
||||
render={({ field }) => (
|
||||
<FormItem className="flex flex-col gap-2">
|
||||
<FormItem className="my-2 flex flex-col gap-2">
|
||||
<FormLabel>Knowledge Base</FormLabel>
|
||||
<FormDescription>
|
||||
Which information should be part of its digital brain?{" "}
|
||||
@@ -1259,7 +1259,7 @@ export function AgentModificationForm(props: AgentModificationFormProps) {
|
||||
<Form {...props.form}>
|
||||
<form
|
||||
onSubmit={props.form.handleSubmit(handleSubmit)}
|
||||
className="space-y-6 h-full flex flex-col justify-between"
|
||||
className="space-y-6 pb-4 h-full flex flex-col justify-between"
|
||||
>
|
||||
<Tabs defaultValue="basic" value={formGroups[currentStep].tabName}>
|
||||
<TabsList className="grid grid-cols-2 md:grid-cols-4 gap-2 h-fit">
|
||||
@@ -1267,13 +1267,15 @@ export function AgentModificationForm(props: AgentModificationFormProps) {
|
||||
<TabsTrigger
|
||||
key={group.tabName}
|
||||
value={group.tabName}
|
||||
className={`text-center ${areRequiredFieldsCompletedForCurrentStep(group) ? "" : "text-red-500"}`}
|
||||
onClick={() =>
|
||||
setCurrentStep(
|
||||
formGroups.findIndex((g) => g.tabName === group.tabName),
|
||||
)
|
||||
}
|
||||
>
|
||||
{group.label}
|
||||
{group.label}{" "}
|
||||
{!areRequiredFieldsCompletedForCurrentStep(group) && "*"}
|
||||
</TabsTrigger>
|
||||
))}
|
||||
</TabsList>
|
||||
@@ -1304,7 +1306,7 @@ export function AgentModificationForm(props: AgentModificationFormProps) {
|
||||
}
|
||||
className={`items-center ${isSaving ? "bg-stone-100 dark:bg-neutral-900" : ""} text-white ${colorOptionClassName}`}
|
||||
>
|
||||
Next
|
||||
Continue
|
||||
<ArrowRight className="ml-2 h-4 w-4" />
|
||||
</Button>
|
||||
) : (
|
||||
|
||||
@@ -883,13 +883,9 @@ const fetchChatHistory = async (url: string) => {
|
||||
};
|
||||
|
||||
export const useChatSessionsFetchRequest = (url: string) => {
|
||||
const { data, error } = useSWR<ChatHistory[]>(url, fetchChatHistory);
|
||||
const { data, isLoading, error } = useSWR<ChatHistory[]>(url, fetchChatHistory);
|
||||
|
||||
return {
|
||||
data,
|
||||
isLoading: !error && !data,
|
||||
isError: error,
|
||||
};
|
||||
return { data, isLoading, error };
|
||||
};
|
||||
|
||||
interface SidePanelProps {
|
||||
@@ -965,10 +961,12 @@ export default function AllConversations(props: SidePanelProps) {
|
||||
|
||||
return (
|
||||
<SidebarGroup>
|
||||
<SidebarGroupLabel className="!p-0 m-0 px-0">Conversations</SidebarGroupLabel>
|
||||
<div className={`flex justify-between flex-col`}>
|
||||
{authenticatedData && (
|
||||
<>
|
||||
<SidebarGroupLabel className="!p-0 m-0 px-0">
|
||||
Conversations
|
||||
</SidebarGroupLabel>
|
||||
<div
|
||||
className={`${props.sideBarOpen ? "border-l-2 border-light-blue-500 border-opacity-25 " : ""}`}
|
||||
>
|
||||
|
||||
@@ -20,9 +20,12 @@ import { Gear } from "@phosphor-icons/react/dist/ssr";
|
||||
import { Plus } from "@phosphor-icons/react";
|
||||
import { useEffect, useState } from "react";
|
||||
import AllConversations from "../allConversations/allConversations";
|
||||
import NavMenu from "../navMenu/navMenu";
|
||||
import FooterMenu from "../navMenu/navMenu";
|
||||
import { useSidebar } from "@/components/ui/sidebar";
|
||||
import { useIsMobileWidth } from "@/app/common/utils";
|
||||
import { UserPlusIcon } from "lucide-react";
|
||||
import { useAuthenticatedData } from "@/app/common/auth";
|
||||
import LoginPrompt from "../loginPrompt/loginPrompt";
|
||||
|
||||
// Menu items.
|
||||
const items = [
|
||||
@@ -63,12 +66,21 @@ interface AppSidebarProps {
|
||||
|
||||
export function AppSidebar(props: AppSidebarProps) {
|
||||
const isMobileWidth = useIsMobileWidth();
|
||||
const { data, isLoading, error } = useAuthenticatedData();
|
||||
|
||||
const { state, open, setOpen, openMobile, setOpenMobile, isMobile, toggleSidebar } =
|
||||
useSidebar();
|
||||
|
||||
const [showLoginPrompt, setShowLoginPrompt] = useState(false);
|
||||
|
||||
useEffect(() => {
|
||||
if (!isLoading && !data) {
|
||||
setShowLoginPrompt(true);
|
||||
}
|
||||
}, [isLoading, data]);
|
||||
|
||||
return (
|
||||
<Sidebar collapsible={"icon"} variant="sidebar">
|
||||
<Sidebar collapsible={"icon"} variant="sidebar" className="md:py-2">
|
||||
<SidebarHeader>
|
||||
<SidebarMenu className="p-0 m-0">
|
||||
<SidebarMenuItem className="p-0 m-0">
|
||||
@@ -82,7 +94,6 @@ export function AppSidebar(props: AppSidebarProps) {
|
||||
<SidebarMenuButton asChild>
|
||||
<a className="flex items-center gap-2 no-underline" href="/">
|
||||
<KhojLogo className="w-14 h-auto" />
|
||||
<span className="text-lg">Khoj</span>
|
||||
</a>
|
||||
</SidebarMenuButton>
|
||||
)}
|
||||
@@ -90,9 +101,29 @@ export function AppSidebar(props: AppSidebarProps) {
|
||||
</SidebarMenu>
|
||||
</SidebarHeader>
|
||||
<SidebarContent>
|
||||
{showLoginPrompt && (
|
||||
<LoginPrompt
|
||||
onOpenChange={(isOpen) => setShowLoginPrompt(isOpen)}
|
||||
isMobileWidth={isMobileWidth}
|
||||
/>
|
||||
)}
|
||||
<SidebarGroup>
|
||||
<SidebarGroupContent>
|
||||
<SidebarMenu className="p-0 m-0">
|
||||
{!isLoading && !data && (
|
||||
<SidebarMenuItem className="p-0 m-0 list-none">
|
||||
<SidebarMenuButton
|
||||
asChild
|
||||
variant={"default"}
|
||||
onClick={() => setShowLoginPrompt(true)}
|
||||
>
|
||||
<div>
|
||||
<UserPlusIcon />
|
||||
<span>Sign up to get started</span>
|
||||
</div>
|
||||
</SidebarMenuButton>
|
||||
</SidebarMenuItem>
|
||||
)}
|
||||
{items.map((item) => (
|
||||
<SidebarMenuItem key={item.title} className="p-0 list-none m-0">
|
||||
<SidebarMenuButton asChild>
|
||||
@@ -117,7 +148,7 @@ export function AppSidebar(props: AppSidebarProps) {
|
||||
</SidebarGroup>
|
||||
</SidebarContent>
|
||||
<SidebarFooter>
|
||||
<NavMenu sideBarIsOpen={open} />
|
||||
<FooterMenu sideBarIsOpen={open} />
|
||||
</SidebarFooter>
|
||||
</Sidebar>
|
||||
);
|
||||
|
||||
@@ -43,7 +43,7 @@ interface NavMenuProps {
|
||||
sideBarIsOpen: boolean;
|
||||
}
|
||||
|
||||
export default function NavMenu({ sideBarIsOpen }: NavMenuProps) {
|
||||
export default function FooterMenu({ sideBarIsOpen }: NavMenuProps) {
|
||||
const {
|
||||
data: userData,
|
||||
error: authenticationError,
|
||||
@@ -106,13 +106,13 @@ export default function NavMenu({ sideBarIsOpen }: NavMenuProps) {
|
||||
>
|
||||
<AvatarImage src={userData?.photo} alt="user profile" />
|
||||
<AvatarFallback className="bg-transparent hover:bg-muted">
|
||||
{userData?.username[0].toUpperCase()}
|
||||
{userData.username[0].toUpperCase()}
|
||||
</AvatarFallback>
|
||||
</Avatar>
|
||||
{sideBarIsOpen && (
|
||||
<>
|
||||
<p>{userData?.username}</p>
|
||||
<ChevronUp className="w-6 h-6" />
|
||||
<ChevronUp className="w-6 h-6 ml-auto" />
|
||||
</>
|
||||
)}
|
||||
</span>
|
||||
|
||||
Reference in New Issue
Block a user