This commit is contained in:
ogabrielluiz 2023-03-10 07:20:53 -03:00
commit 5dbbbbb7ba
6 changed files with 182 additions and 169 deletions

View file

@ -86,7 +86,7 @@ def get_tool_signature(name: str):
type_dict = { type_dict = {
"str": { "str": {
"type": "str", "type": "str",
"required": False, "required": True,
"list": False, "list": False,
"show": True, "show": True,
"placeholder": "", "placeholder": "",
@ -111,9 +111,15 @@ def get_tool_signature(name: str):
params = [] params = []
template = { template = {
param: (type_dict[param] if param == "llm" else type_dict["str"]) param: (type_dict[param].copy() if param == "llm" else type_dict["str"].copy())
for param in params for param in params
} # type: Dict[str, Any] }
# Remove required from aiosession
if "aiosession" in template.keys():
template["aiosession"]["required"] = False
template["aiosession"]["show"] = False
template["_type"] = tool_type template["_type"] = tool_type
return { return {

View file

@ -1,64 +1,66 @@
import { Transition } from "@headlessui/react"; import { Transition } from "@headlessui/react";
import { XCircleIcon, XMarkIcon } from "@heroicons/react/24/outline"; import { XCircleIcon, XMarkIcon } from "@heroicons/react/24/outline";
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import { ErrorAlertType} from "../../types/alerts"; import { ErrorAlertType } from "../../types/alerts";
export default function ErrorAlert({ title, list = [], id, removeAlert }:ErrorAlertType) { export default function ErrorAlert({
const [show, setShow] = useState(true); title,
useEffect(() => { list = [],
if(show){ id,
setTimeout(() => { removeAlert,
setShow(false); setTimeout(() => {removeAlert(id);}, 500); }: ErrorAlertType) {
}, 5000); const [show, setShow] = useState(true);
} useEffect(() => {
}, [id, removeAlert, show]); if (show) {
return ( setTimeout(() => {
<Transition setShow(false);
className="relative" setTimeout(() => {
show={show} removeAlert(id);
appear={true} }, 500);
enter="transition-transform duration-500 ease-out" }, 5000);
enterFrom={"transform translate-x-[-100%]"} }
enterTo={"transform translate-x-0"} }, [id, removeAlert, show]);
leave="transition-transform duration-500 ease-in" return (
leaveFrom={"transform translate-x-0"} <Transition
leaveTo={"transform translate-x-[-100%]"} className="relative"
> show={show}
<div className="rounded-md w-96 mt-6 shadow-xl bg-red-50 p-4"> appear={true}
<div className="flex"> enter="transition-transform duration-500 ease-out"
<div className="flex-shrink-0"> enterFrom={"transform translate-x-[-100%]"}
<XCircleIcon className="h-5 w-5 text-red-400" aria-hidden="true" /> enterTo={"transform translate-x-0"}
</div> leave="transition-transform duration-500 ease-in"
<div className="ml-3"> leaveFrom={"transform translate-x-0"}
<h3 className="text-sm font-medium text-red-800">{title}</h3> leaveTo={"transform translate-x-[-100%]"}
{list.length !== 0 >
? <div
<div className="mt-2 text-sm text-red-700"> onClick={() => {
<ul className="list-disc space-y-1 pl-5"> setShow(false);
{list.map((item, index) => ( setTimeout(() => {
<li key={index} >{item}</li> removeAlert(id);
))} }, 500);
</ul> }}
</div> className="rounded-md w-96 mt-6 shadow-xl bg-red-50 p-4 cursor-pointer"
: >
<></> <div className="flex">
} <div className="flex-shrink-0">
<XCircleIcon className="h-5 w-5 text-red-400" aria-hidden="true" />
</div> </div>
<div className="ml-auto pl-3"> <div className="ml-3">
<div className="-mx-1.5 -my-1.5"> <h3 className="text-sm font-medium text-red-800">{title}</h3>
<button {list.length !== 0 ? (
type="button" <div className="mt-2 text-sm text-red-700">
onClick={()=>{setShow(false); setTimeout(() => {removeAlert(id);}, 500);}} <ul className="list-disc space-y-1 pl-5">
className="inline-flex rounded-md bg-red-50 p-1.5 text-red-500" {list.map((item, index) => (
> <li key={index}>{item}</li>
<span className="sr-only">Dismiss</span> ))}
<XMarkIcon className="h-5 w-5" aria-hidden="true" /> </ul>
</button> </div>
</div> ) : (
</div> <></>
</div> )}
</div> </div>
</Transition> </div>
); </div>
</Transition>
);
} }

View file

@ -4,63 +4,64 @@ import { useEffect, useState } from "react";
import { Link } from "react-router-dom"; import { Link } from "react-router-dom";
import { NoticeAlertType } from "../../types/alerts"; import { NoticeAlertType } from "../../types/alerts";
export default function NoticeAlert({ title, link = "", id, removeAlert }:NoticeAlertType) { export default function NoticeAlert({
const [show, setShow] = useState(true); title,
useEffect(() => { link = "",
if(show){ id,
setTimeout(() => { removeAlert,
setShow(false); setTimeout(() => {removeAlert(id);}, 500); }: NoticeAlertType) {
}, 5000); const [show, setShow] = useState(true);
} useEffect(() => {
}, [id, removeAlert, show]); if (show) {
return ( setTimeout(() => {
<Transition setShow(false);
show={show} setTimeout(() => {
enter="transition-transform duration-500 ease-out" removeAlert(id);
enterFrom={"transform translate-x-[-100%]"} }, 500);
enterTo={"transform translate-x-0"} }, 5000);
leave="transition-transform duration-500 ease-in" }
leaveFrom={"transform translate-x-0"} }, [id, removeAlert, show]);
leaveTo={"transform translate-x-[-100%]"} return (
> <Transition
<div className="rounded-md w-96 mt-6 shadow-xl bg-blue-50 p-4"> show={show}
<div className="flex"> enter="transition-transform duration-500 ease-out"
<div className="flex-shrink-0"> enterFrom={"transform translate-x-[-100%]"}
<InformationCircleIcon enterTo={"transform translate-x-0"}
className="h-5 w-5 text-blue-400" leave="transition-transform duration-500 ease-in"
aria-hidden="true" leaveFrom={"transform translate-x-0"}
/> leaveTo={"transform translate-x-[-100%]"}
</div> >
<div className="ml-3 flex-1 md:flex md:justify-between"> <div
<p className="text-sm text-blue-700">{title}</p> onClick={() => {
<p className="mt-3 text-sm md:mt-0 md:ml-6"> setShow(false);
{link !== "" removeAlert(id);
? }}
<Link className="rounded-md w-96 mt-6 shadow-xl bg-blue-50 p-4"
to={link} >
className="whitespace-nowrap font-medium text-blue-700 hover:text-blue-600" <div className="flex">
> <div className="flex-shrink-0">
Details <InformationCircleIcon
</Link> className="h-5 w-5 text-blue-400"
: aria-hidden="true"
<></> />
} </div>
</p> <div className="ml-3 flex-1 md:flex md:justify-between">
</div> <p className="text-sm text-blue-700">{title}</p>
<div className="ml-auto pl-3"> <p className="mt-3 text-sm md:mt-0 md:ml-6">
<div className="-mx-1.5 -my-1.5"> {link !== "" ? (
<button <Link
type="button" to={link}
onClick={()=>{setShow(false); removeAlert(id);}} className="whitespace-nowrap font-medium text-blue-700 hover:text-blue-600"
className="inline-flex rounded-md bg-blue-50 p-1.5 text-blue-500" >
> Details
<span className="sr-only">Dismiss</span> </Link>
<XMarkIcon className="h-5 w-5" aria-hidden="true" /> ) : (
</button> <></>
</div> )}
</div> </p>
</div> </div>
</div> </div>
</Transition> </div>
); </Transition>
);
} }

View file

@ -3,50 +3,51 @@ import { CheckCircleIcon, XMarkIcon } from "@heroicons/react/24/outline";
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import { SuccessAlertType } from "../../types/alerts"; import { SuccessAlertType } from "../../types/alerts";
export default function SuccessAlert({ title, id, removeAlert }:SuccessAlertType) { export default function SuccessAlert({
const [show, setShow] = useState(true); title,
useEffect(() => { id,
if(show){ removeAlert,
setTimeout(() => { }: SuccessAlertType) {
setShow(false); setTimeout(() => {removeAlert(id);}, 500); const [show, setShow] = useState(true);
}, 5000); useEffect(() => {
} if (show) {
}, [id, removeAlert, show]); setTimeout(() => {
return ( setShow(false);
<Transition setTimeout(() => {
show={show} removeAlert(id);
enter="transition-transform duration-500 ease-out" }, 500);
enterFrom={"transform translate-x-[-100%]"} }, 5000);
enterTo={"transform translate-x-0"} }
leave="transition-transform duration-500 ease-in" }, [id, removeAlert, show]);
leaveFrom={"transform translate-x-0"} return (
leaveTo={"transform translate-x-[-100%]"} <Transition
> show={show}
<div className="rounded-md w-96 mt-6 shadow-xl bg-green-50 p-4"> enter="transition-transform duration-500 ease-out"
<div className="flex"> enterFrom={"transform translate-x-[-100%]"}
<div className="flex-shrink-0"> enterTo={"transform translate-x-0"}
<CheckCircleIcon leave="transition-transform duration-500 ease-in"
className="h-5 w-5 text-green-400" leaveFrom={"transform translate-x-0"}
aria-hidden="true" leaveTo={"transform translate-x-[-100%]"}
/> >
</div> <div
<div className="ml-3"> onClick={() => {
<p className="text-sm font-medium text-green-800">{title}</p> setShow(false);
</div> removeAlert(id);
<div className="ml-auto pl-3"> }}
<div className="-mx-1.5 -my-1.5"> className="rounded-md w-96 mt-6 shadow-xl bg-green-50 p-4"
<button >
type="button" <div className="flex">
onClick={()=>{setShow(false); removeAlert(id);}} <div className="flex-shrink-0">
className="inline-flex rounded-md bg-green-50 p-1.5 text-green-500" <CheckCircleIcon
> className="h-5 w-5 text-green-400"
<span className="sr-only">Dismiss</span> aria-hidden="true"
<XMarkIcon className="h-5 w-5" aria-hidden="true" /> />
</button> </div>
</div> <div className="ml-3">
</div> <p className="text-sm font-medium text-green-800">{title}</p>
</div> </div>
</div> </div>
</Transition> </div>
); </Transition>
);
} }

View file

@ -147,7 +147,7 @@ export default function Chat({ flow, reactFlowInstance }: ChatType) {
clearChat(); clearChat();
}} }}
> >
clear Clear
</button> </button>
</div> </div>
<div className="w-full h-[400px] flex gap-3 mb-auto overflow-y-auto scrollbar-hide flex-col bg-gray-50 dark:bg-gray-900 p-3 py-5"> <div className="w-full h-[400px] flex gap-3 mb-auto overflow-y-auto scrollbar-hide flex-col bg-gray-50 dark:bg-gray-900 p-3 py-5">

View file

@ -1,7 +1,8 @@
import { createContext, useEffect, useState, useRef, ReactNode } from "react"; import { createContext, useEffect, useState, useRef, ReactNode, useContext } from "react";
import { FlowType } from "../types/flow"; import { FlowType } from "../types/flow";
import { TabsContextType } from "../types/tabs"; import { TabsContextType } from "../types/tabs";
import { normalCaseToSnakeCase } from "../utils"; import { normalCaseToSnakeCase } from "../utils";
import { alertContext } from "./alertContext";
const TabsContextInitialValue: TabsContextType = { const TabsContextInitialValue: TabsContextType = {
tabIndex: 0, tabIndex: 0,
@ -20,6 +21,7 @@ export const TabsContext = createContext<TabsContextType>(
); );
export function TabsProvider({ children }: { children: ReactNode }) { export function TabsProvider({ children }: { children: ReactNode }) {
const {setNoticeData} = useContext(alertContext)
const [tabIndex, setTabIndex] = useState(0); const [tabIndex, setTabIndex] = useState(0);
const [flows, setFlows] = useState<Array<FlowType>>([]); const [flows, setFlows] = useState<Array<FlowType>>([]);
const [id, setId] = useState(0); const [id, setId] = useState(0);
@ -66,6 +68,7 @@ export function TabsProvider({ children }: { children: ReactNode }) {
// simulate a click on the link element to trigger the download // simulate a click on the link element to trigger the download
link.click(); link.click();
setNoticeData({title:"Warning: Critical data, including API keys, in JSON file. Keep secure and do not share."})
} }
/** /**