StanGirard/quivr
1
1
Fork 0
mirror of https://github.com/StanGirard/quivr.git synced 2024-12-23 19:32:30 +03:00
Code Issues Packages Projects Releases Wiki Activity

feat(apiBrain): improve ux (#1672)

Browse Source 
Demo:


https://github.com/StanGirard/quivr/assets/63923024/71efe888-285a-41ed-aa89-44e5f0b99162
This commit is contained in:
Mamadou DICKO 2023-11-20 18:22:06 +01:00 committed by GitHub
parent d7d10e3674
commit d902e78ffa
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
10 changed files with 68 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
backend/models/brain_entity.py
View File

@ -43,6 +43,7 @@ class MinimalBrainEntity(BaseModel):
name: str
rights: RoleEnum
status: str
brain_type: BrainType
class PublicBrain(BaseModel):

8
backend/models/databases/supabase/brains.py
View File

@ -73,7 +73,7 @@ class Brain(Repository):
def get_user_brains(self, user_id) -> list[MinimalBrainEntity]:
response = (
self.db.from_("brains_users")
.select("id:brain_id, rights, brains (brain_id, name, status)")
.select("id:brain_id, rights, brains (brain_id, name, status, brain_type)")
.filter("user_id", "eq", user_id)
.execute()
)
@ -85,6 +85,7 @@ class Brain(Repository):
name=item["brains"]["name"],
rights=item["rights"],
status=item["brains"]["status"],
brain_type=item["brains"]["brain_type"],
)
)
user_brains[-1].rights = item["rights"]
@ -120,7 +121,9 @@ class Brain(Repository):
def get_brain_for_user(self, user_id, brain_id) -> MinimalBrainEntity | None:
response = (
self.db.from_("brains_users")
.select("id:brain_id, rights, brains (id: brain_id, status, name)")
.select(
"id:brain_id, rights, brains (id: brain_id, status, name, brain_type)"
)
.filter("user_id", "eq", user_id)
.filter("brain_id", "eq", brain_id)
.execute()
@ -134,6 +137,7 @@ class Brain(Repository):
name=brain_data["brains"]["name"],
rights=brain_data["rights"],
status=brain_data["brains"]["status"],
brain_type=brain_data["brains"]["brain_type"],
)
def get_brain_details(self, brain_id):

8
frontend/app/brains-management/[brainId]/components/BrainsList/components/BrainListItem/BrainListItem.tsx
View File

@ -1,9 +1,10 @@
import Link from "next/link";
import { useTranslation } from "react-i18next";
import { FaBrain } from "react-icons/fa";
import { CgFileDocument } from "react-icons/cg";
import { Chip } from "@/lib/components/ui/Chip";
import { MinimalBrainForUser } from "@/lib/context/BrainProvider/types";
import { getBrainIconFromBrainType } from "@/lib/helpers/getBrainIconFromBrainType";
import { cn } from "@/lib/utils";
import { useBrainListItem } from "./hooks/useBrainListItem";
@ -33,7 +34,10 @@ export const BrainListItem = ({ brain }: BrainsListItemProps): JSX.Element => {
>
<div className="flex flex-row flex-1 w-max">
<div className="flex items-center gap-2">
<FaBrain className="text-xl" />
{getBrainIconFromBrainType(brain.brain_type, {
iconSize: 24,
DocBrainIcon: CgFileDocument,
})}
<p>{brain.name}</p>
</div>
{brain.status === "public" && (

22
frontend/app/brains-management/library/components/PublicBrainItem/PublicBrainItem.tsx
View File

@ -1,9 +1,11 @@
import { useTranslation } from "react-i18next";
import { CgFileDocument } from "react-icons/cg";
import { MdAdd, MdLink } from "react-icons/md";
import Button from "@/lib/components/ui/Button";
import { Modal } from "@/lib/components/ui/Modal";
import { PublicBrain } from "@/lib/context/BrainProvider/types";
import { getBrainIconFromBrainType } from "@/lib/helpers/getBrainIconFromBrainType";
import { SecretsDefinitionFields } from "./components/SecretsDefinitionFields";
import { usePublicBrainItem } from "./hooks/usePublicBrainItem";
@ -61,7 +63,15 @@ export const PublicBrainItem = ({
Trigger={
<div className="flex p-5 justify-center items-center flex-col flex-1 w-full h-full shadow-md dark:shadow-primary/25 hover:shadow-xl transition-shadow rounded-xl overflow-hidden bg-white dark:bg-black border border-black/10 dark:border-white/25 md:p-5 cursor-pointer">
<div>
<p className="font-bold mb-5 text-xl line-clamp-1">{brain.name}</p>
<p className="font-bold mb-5 text-xl line-clamp-1 flex items-center">
<span className="mr-2">
{getBrainIconFromBrainType(brain.brain_type, {
iconSize: 24,
DocBrainIcon: CgFileDocument,
})}
</span>
{brain.name}
</p>
</div>
<div className="flex-1">
<p
@ -77,7 +87,15 @@ export const PublicBrainItem = ({
}
>
<div>
<p className="text-2xl font-bold text-center mb-10">{brain.name}</p>
<p className="text-2xl font-bold text-center mb-10 flex items-center justify-center">
<span className="mr-2">
{getBrainIconFromBrainType(brain.brain_type, {
iconSize: 30,
DocBrainIcon: CgFileDocument,
})}
</span>
{brain.name}
</p>
<p className={`mb-10 ${isBrainDescriptionEmpty && "text-gray-400"}`}>
{brainDescription}
</p>

2
frontend/app/brains-management/library/components/PublicBrainItem/components/SecretsDefinitionFields.tsx
View File

@ -31,7 +31,7 @@ export const SecretsDefinitionFields = ({
<div className="flex flex-col">
<input
type="text"
className="w-full outline-dotted"
className="flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50"
placeholder={secret.description}
{...register(`secrets.${secret.name}`)}
/>

6
frontend/app/chat/[chatId]/components/ActionsBar/components/ChatInput/index.tsx
View File

@ -9,7 +9,7 @@ import { OnboardingQuestions } from "./components";
import { ChatBar } from "./components/ChatBar/ChatBar";
import { ConfigModal } from "./components/ConfigModal";
import { useChatInput } from "./hooks/useChatInput";
import { getKnowledgeCardIconFromBrainType } from "./utils/getKnowledgeCardIconFromBrainType";
import { getBrainIconFromBrainType } from "../../../../../../../lib/helpers/getBrainIconFromBrainType";
type ChatInputProps = {
shouldDisplayFeedOrSecretsCard: boolean;
@ -46,9 +46,7 @@ export const ChatInput = ({
onClick={() => setShouldDisplayFeedCard(true)}
tooltip={t("add_content_card_button_tooltip")}
>
{getKnowledgeCardIconFromBrainType(
currentBrainDetails?.brain_type
)}
{getBrainIconFromBrainType(currentBrainDetails?.brain_type)}
</Button>
)}

19
frontend/app/chat/[chatId]/components/ActionsBar/components/ChatInput/utils/getKnowledgeCardIconFromBrainType.tsx
View File

@ -1,19 +0,0 @@
import { LuBrain } from "react-icons/lu";
import { PiPaperclipFill } from "react-icons/pi";
import { TbWorld } from "react-icons/tb";
import { BrainType } from "@/lib/types/brainConfig";
export const getKnowledgeCardIconFromBrainType = (
brainType?: BrainType
): JSX.Element => {
const iconSize = 38;
if (brainType === undefined) {
return <TbWorld size={iconSize} />;
}
if (brainType === "api") {
return <LuBrain size={iconSize} />;
}
return <PiPaperclipFill size={iconSize} />;
};

1
frontend/lib/api/brain/utils/mapBackendMinimalBrainToMinimalBrain.ts
View File

@ -10,4 +10,5 @@ export const mapBackendMinimalBrainToMinimalBrain = (
name: backendMinimalBrain.name,
role: backendMinimalBrain.rights,
status: backendMinimalBrain.status,
brain_type: backendMinimalBrain.brain_type,
});

1
frontend/lib/context/BrainProvider/types.ts
View File

@ -28,6 +28,7 @@ export type MinimalBrainForUser = {
name: string;
role: BrainRoleType;
status: BrainAccessStatus;
brain_type: BrainType;
};
//TODO: rename rights to role in Backend and use MinimalBrainForUser instead of BackendMinimalBrainForUser

30
frontend/lib/helpers/getBrainIconFromBrainType.tsx Normal file
View File

@ -0,0 +1,30 @@
import { IconType } from "react-icons/lib";
import { LuBrain } from "react-icons/lu";
import { PiPaperclipFill } from "react-icons/pi";
import { TbWorld } from "react-icons/tb";
import { BrainType } from "@/lib/types/brainConfig";
type GetBrainIconFromBrainTypeOptions = {
iconSize?: number;
ApiBrainIcon?: IconType;
DocBrainIcon?: IconType;
};
export const getBrainIconFromBrainType = (
brainType?: BrainType,
options?: GetBrainIconFromBrainTypeOptions
): JSX.Element => {
const iconSize = options?.iconSize ?? 38;
const ApiBrainIcon = options?.ApiBrainIcon ?? TbWorld;
const DocBrainIcon = options?.DocBrainIcon ?? PiPaperclipFill;
if (brainType === undefined) {
return <LuBrain size={iconSize} />;
}
if (brainType === "api") {
return <ApiBrainIcon size={iconSize} />;
}
return <DocBrainIcon size={iconSize} />;
};