jyapayne/langflow
1
0
Fork 0
Code Issues Pull requests Projects Releases 1 Packages Wiki Activity Actions

Formatting

Browse source
This commit is contained in:
Gabriel Luiz Freitas Almeida 2023-07-05 20:18:04 -03:00
commit 0f97dfe678
20 changed files with 103 additions and 73 deletions
Download patch file Download diff file Expand all files Collapse all files

6
src/frontend/src/components/ExtraSidebarComponent/index.tsx
View file

@ -42,7 +42,7 @@ export default function ExtraSidebar() {
item.href.split("/")[2] === current[4]
? "text-ring"
: "text-ring group-hover:text-accent-foreground",
"mr-3 flex-shrink-0 h-6 w-6"
"mr-3 h-6 w-6 flex-shrink-0"
)}
/>
{item.name}
@ -71,8 +71,8 @@ export default function ExtraSidebar() {
<span className="flex-1">{item.name}</span>
<svg
className={classNames(
open ? "text-ring rotate-90" : "text-ring",
"ml-3 h-5 w-5 flex-shrink-0 transition-rotate duration-150 ease-in-out group-hover:text-accent-foreground"
open ? "rotate-90 text-ring" : "text-ring",
"transition-rotate ml-3 h-5 w-5 flex-shrink-0 duration-150 ease-in-out group-hover:text-accent-foreground"
)}
viewBox="0 0 20 20"
aria-hidden="true"

11
src/frontend/src/components/chatComponent/buildTrigger/index.tsx
View file

@ -156,7 +156,11 @@ export default function BuildTrigger({
leaveFrom="translate-y-0"
leaveTo="translate-y-96"
>
<div className={'round-buttons-position' + (isBuilt ? " bottom-20" : " bottom-4")}>
<div
className={
"round-buttons-position" + (isBuilt ? " bottom-20" : " bottom-4")
}
>
<div
className={`${eventClick} round-button-form`}
onClick={() => {
@ -175,7 +179,10 @@ export default function BuildTrigger({
value={progress}
></RadialProgressComponent>
) : isBuilding ? (
<Loading strokeWidth={1.5} className="build-trigger-loading-icon" />
<Loading
strokeWidth={1.5}
className="build-trigger-loading-icon"
/>
) : (
<Zap strokeWidth={1.5} className="build-trigger-icon" />
)}

5
src/frontend/src/components/chatComponent/chatTrigger/index.tsx
View file

@ -31,10 +31,7 @@ export default function ChatTrigger({ open, setOpen, isBuilt }) {
leaveTo="translate-y-96"
>
<div className="message-button-position">
<div
className="round-button-form"
onClick={handleClick}
>
<div className="round-button-form" onClick={handleClick}>
<button>
<div className="round-button-div">
<MessagesSquare

8
src/frontend/src/components/codeAreaComponent/index.tsx
View file

@ -49,7 +49,8 @@ export default function CodeAreaComponent({
className={
editNode
? "input-edit-node input-dialog"
: "input-primary input-dialog " + (disabled ? "input-disable" : "")
: "input-dialog input-primary " +
(disabled ? "input-disable" : "")
}
>
{myValue !== "" ? myValue : "Type something..."}
@ -68,7 +69,10 @@ export default function CodeAreaComponent({
}}
>
{!editNode && (
<ExternalLink strokeWidth={1.5} className="w-6 h-6 hover:text-accent-foreground ml-3" />
<ExternalLink
strokeWidth={1.5}
className="ml-3 h-6 w-6 hover:text-accent-foreground"
/>
)}
</button>
</div>

4
src/frontend/src/components/dropdownComponent/index.tsx
View file

@ -39,8 +39,8 @@ export default function Dropdown({
<Listbox.Button
className={
editNode
? "border-1 relative pr-8 input-edit-node"
: "py-2 pl-3 pr-10 text-left input-primary"
? "border-1 input-edit-node relative pr-8"
: "input-primary py-2 pl-3 pr-10 text-left"
}
>
<span className="block w-full truncate bg-background">

4
src/frontend/src/components/headerComponent/index.tsx
View file

@ -75,7 +75,7 @@ export default function Header() {
href="https://github.com/logspace-ai/langflow"
target="_blank"
rel="noreferrer"
className="inline-flex shadow-sm items-center justify-center text-sm font-medium focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:opacity-50 disabled:pointer-events-none ring-offset-background text-muted-foreground border border-input hover:bg-accent hover:text-accent-foreground h-9 px-3 pr-0 rounded-md"
className="inline-flex h-9 items-center justify-center rounded-md border border-input px-3 pr-0 text-sm font-medium text-muted-foreground shadow-sm ring-offset-background hover:bg-accent hover:text-accent-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50"
>
<FaGithub className="mr-2 h-5 w-5" />
Star
@ -114,7 +114,7 @@ export default function Header() {
)}
</button>
<button
className="text-muted-foreground hover:text-accent-foreground relative"
className="relative text-muted-foreground hover:text-accent-foreground"
onClick={(event: React.MouseEvent<HTMLElement>) => {
setNotificationCenter(false);
const { top, left } = (

5
src/frontend/src/components/inputFileComponent/index.tsx
View file

@ -110,7 +110,10 @@ export default function InputFileComponent({
</span>
<button onClick={handleButtonClick}>
{!editNode && !loading && (
<FileSearch2 strokeWidth={1.5} className="w-6 h-6 hover:text-accent-foreground" />
<FileSearch2
strokeWidth={1.5}
className="h-6 w-6 hover:text-accent-foreground"
/>
)}
{!editNode && loading && (
<span className="loading loading-spinner loading-sm pointer-events-none h-8 pl-3"></span>

13
src/frontend/src/components/promptComponent/index.tsx
View file

@ -31,7 +31,7 @@ export default function PromptAreaComponent({
disabled ? "pointer-events-none w-full cursor-not-allowed" : " w-full"
}
>
<div className="w-full flex items-center">
<div className="flex w-full items-center">
<span
onClick={() => {
openPopUp(
@ -50,7 +50,9 @@ export default function PromptAreaComponent({
className={
editNode
? " input-edit-node " + " input-dialog "
: (disabled ? " input-disable " : "") + " input-primary " + " input-dialog "
: (disabled ? " input-disable " : "") +
" input-primary " +
" input-dialog "
}
>
{myValue !== "" ? myValue : "Type your prompt here"}
@ -71,7 +73,12 @@ export default function PromptAreaComponent({
);
}}
>
{!editNode && <ExternalLink strokeWidth={1.5} className="w-6 h-6 hover:text-accent-foreground ml-3" />}
{!editNode && (
<ExternalLink
strokeWidth={1.5}
className="ml-3 h-6 w-6 hover:text-accent-foreground"
/>
)}
</button>
</div>
</div>

15
src/frontend/src/components/textAreaComponent/index.tsx
View file

@ -30,9 +30,7 @@ export default function TextAreaComponent({
<div className={disabled ? "pointer-events-none cursor-not-allowed" : ""}>
<div
className={
editNode
? "w-full items-center"
: "w-full flex items-center gap-3"
editNode ? "w-full items-center" : "flex w-full items-center gap-3"
}
>
<span
@ -53,7 +51,9 @@ export default function TextAreaComponent({
className={
editNode
? "input-edit-node " + " input-dialog "
: " input_dialog " + "px-3 py-2" + (disabled ? " input-disable " : "")
: " input_dialog " +
"px-3 py-2" +
(disabled ? " input-disable " : "")
}
>
{myValue !== "" ? myValue : "Type something..."}
@ -74,7 +74,12 @@ export default function TextAreaComponent({
);
}}
>
{!editNode && <ExternalLink strokeWidth={1.5} className="w-6 h-6 hover:text-accent-foreground ml-3" />}
{!editNode && (
<ExternalLink
strokeWidth={1.5}
className="ml-3 h-6 w-6 hover:text-accent-foreground"
/>
)}
</button>
</div>
</div>

2
src/frontend/src/components/ui/dialog.tsx
View file

@ -44,7 +44,7 @@ const DialogContent = React.forwardRef<
<DialogPrimitive.Content
ref={ref}
className={cn(
"fixed gap-3 z-50 grid w-full rounded-b-lg border bg-background p-6 shadow-lg animate-in data-[state=open]:fade-in-90 data-[state=open]:slide-in-from-bottom-10 sm:max-w-lg sm:rounded-lg sm:zoom-in-90 data-[state=open]:sm:slide-in-from-bottom-0",
"fixed z-50 grid w-full gap-3 rounded-b-lg border bg-background p-6 shadow-lg animate-in data-[state=open]:fade-in-90 data-[state=open]:slide-in-from-bottom-10 sm:max-w-lg sm:rounded-lg sm:zoom-in-90 data-[state=open]:sm:slide-in-from-bottom-0",
className
)}
{...props}

6
src/frontend/src/contexts/tabsContext.tsx
View file

@ -288,7 +288,11 @@ export function TabsProvider({ children }: { children: ReactNode }) {
// create a link element and set its properties
const link = document.createElement("a");
link.href = jsonString;
link.download = `${flowName && flowName != "" ? flowName : flows.find((f) => f.id === tabId).name}.json`;
link.download = `${
flowName && flowName != ""
? flowName
: flows.find((f) => f.id === tabId).name
}.json`;
// simulate a click on the link element to trigger the download
link.click();

47
src/frontend/src/modals/ApiModal/index.tsx
View file

@ -104,11 +104,10 @@ export default function ApiModal({ flow }: { flow: FlowType }) {
useEffect(() => {
if (closeEdit !== "") {
tweak.current = getTweak;
if(tweak.current.length > 0){
if (tweak.current.length > 0) {
setActiveTab("3");
openAccordions();
}
else{
} else {
startTweaks();
}
} else {
@ -250,25 +249,25 @@ export default function ApiModal({ flow }: { flow: FlowType }) {
function openAccordions() {
let accordionsToOpen = [];
tweak.current.forEach((el) => {
Object.keys(el).forEach((key) => {
if (Object.keys(el[key]).length > 0) {
accordionsToOpen.push(key);
setOpenAccordion(accordionsToOpen);
}
});
tweak.current.forEach((el) => {
Object.keys(el).forEach((key) => {
if (Object.keys(el[key]).length > 0) {
accordionsToOpen.push(key);
setOpenAccordion(accordionsToOpen);
}
});
});
}
return (
<Dialog open={true} onOpenChange={setModalOpen}>
<DialogTrigger></DialogTrigger>
<DialogContent className="lg:max-w-[80vw] h-[80vh]">
<DialogContent className="h-[80vh] lg:max-w-[80vw]">
<DialogHeader>
<DialogTitle className="flex items-center">
<span className="pr-2">Code</span>
<Code2
className="h-6 w-6 text-gray-800 pl-1 dark:text-white"
className="h-6 w-6 pl-1 text-gray-800 dark:text-white"
aria-hidden="true"
/>
</DialogTitle>
@ -277,7 +276,7 @@ export default function ApiModal({ flow }: { flow: FlowType }) {
<Tabs
value={activeTab}
className="w-full h-full overflow-hidden text-center bg-muted rounded-md border"
className="h-full w-full overflow-hidden rounded-md border bg-muted text-center"
onValueChange={(value) => {
setActiveTab(value);
if (value === "3") {
@ -296,7 +295,7 @@ export default function ApiModal({ flow }: { flow: FlowType }) {
{Number(activeTab) < 3 && (
<div className="float-right">
<button
className="flex gap-1.5 items-center rounded bg-none p-1 text-xs text-gray-500 dark:text-gray-300"
className="flex items-center gap-1.5 rounded bg-none p-1 text-xs text-gray-500 dark:text-gray-300"
onClick={copyToClipboard}
>
{isCopied ? <Check size={18} /> : <Clipboard size={15} />}
@ -309,12 +308,12 @@ export default function ApiModal({ flow }: { flow: FlowType }) {
{tabs.map((tab, index) => (
<TabsContent
value={index.toString()}
className="overflow-hidden w-full h-full px-4 pb-4 -mt-1"
className="-mt-1 h-full w-full overflow-hidden px-4 pb-4"
key={index} // Remember to add a unique key prop
>
{index < 3 ? (
<SyntaxHighlighter
className="w-full overflow-auto h-[60vh]"
className="h-[60vh] w-full overflow-auto"
language={tab.mode}
style={oneDark}
>
@ -322,10 +321,10 @@ export default function ApiModal({ flow }: { flow: FlowType }) {
</SyntaxHighlighter>
) : index === 3 ? (
<>
<div className="flex w-full h-full mt-2">
<div className="mt-2 flex h-full w-full">
<div
className={classNames(
"w-full rounded-lg bg-muted h-[60vh]",
"h-[60vh] w-full rounded-lg bg-muted",
1 == 1
? "overflow-scroll overflow-x-hidden custom-scroll"
: "overflow-hidden"
@ -338,14 +337,14 @@ export default function ApiModal({ flow }: { flow: FlowType }) {
trigger={t["data"]["id"]}
open={openAccordion}
>
<div className="flex flex-col gap-5 h-fit">
<div className="flex h-fit flex-col gap-5">
<Table className="table-fixed bg-muted outline-1">
<TableHeader className="border-input text-xs font-medium text-ring h-10">
<TableHeader className="h-10 border-input text-xs font-medium text-ring">
<TableRow className="dark:border-b-muted">
<TableHead className="h-7 text-center">
PARAM
</TableHead>
<TableHead className="p-0 h-7 text-center">
<TableHead className="h-7 p-0 text-center">
VALUE
</TableHead>
</TableRow>
@ -379,11 +378,11 @@ export default function ApiModal({ flow }: { flow: FlowType }) {
key={i}
className="h-10 dark:border-b-muted"
>
<TableCell className="p-0 text-center text-gray-900 text-sm">
<TableCell className="p-0 text-center text-sm text-gray-900">
{n}
</TableCell>
<TableCell className="p-0 text-center text-gray-900 text-xs dark:text-gray-300">
<div className="w-[250px] m-auto">
<TableCell className="p-0 text-center text-xs text-gray-900 dark:text-gray-300">
<div className="m-auto w-[250px]">
{t.data.node.template[n]
.type === "str" &&
!t.data.node.template[n]

4
src/frontend/src/modals/EditNodeModal/index.tsx
View file

@ -81,7 +81,7 @@ export default function EditNodeModal({ data }: { data: NodeDataType }) {
return (
<Dialog open={true} onOpenChange={setModalOpen}>
<DialogTrigger asChild></DialogTrigger>
<DialogContent className="lg:max-w-[700px] sm:max-w-[600px]">
<DialogContent className="sm:max-w-[600px] lg:max-w-[700px]">
<DialogHeader>
<DialogTitle className="flex items-center">
<span className="pr-2">{data.type}</span>
@ -135,7 +135,7 @@ export default function EditNodeModal({ data }: { data: NodeDataType }) {
)
.map((n, i) => (
<TableRow key={i} className="h-10">
<TableCell className="p-0 text-center text-sm text-foreground truncate sm:px-3">
<TableCell className="truncate p-0 text-center text-sm text-foreground sm:px-3">
{data.node.template[n].name
? data.node.template[n].name
: data.node.template[n].display_name}

4
src/frontend/src/modals/codeAreaModal/index.tsx
View file

@ -53,8 +53,8 @@ export default function CodeAreaModal({
<DialogTitle className="flex items-center">
<span className="pr-2">Edit Code</span>
<TerminalSquare
strokeWidth={1.5}
className="h-6 w-6 text-primary pl-1 "
strokeWidth={1.5}
className="h-6 w-6 pl-1 text-primary "
aria-hidden="true"
/>
</DialogTitle>

4
src/frontend/src/modals/exportModal/index.tsx
View file

@ -47,8 +47,8 @@ export default function ExportModal() {
<DialogTitle className="flex items-center">
<span className="pr-2">Export</span>
<Download
strokeWidth={1.5}
className="h-6 w-6 text-foreground pl-1"
strokeWidth={1.5}
className="h-6 w-6 pl-1 text-foreground"
aria-hidden="true"
/>
</DialogTitle>

6
src/frontend/src/modals/genericModal/index.tsx
View file

@ -56,8 +56,8 @@ export default function GenericModal({
<DialogTitle className="flex items-center">
<span className="pr-2">{myModalTitle}</span>
<FileText
strokeWidth={1.5}
className="h-6 w-6 text-primary pl-1 "
strokeWidth={1.5}
className="h-6 w-6 pl-1 text-primary "
aria-hidden="true"
/>
</DialogTitle>
@ -80,7 +80,7 @@ export default function GenericModal({
<div className="mt-2 flex h-full w-full">
<Textarea
ref={ref}
className=" h-[300px] w-full form-primary "
className=" form-primary h-[300px] w-full "
value={myValue}
onChange={(e) => {
setMyValue(e.target.value);

5
src/frontend/src/modals/importModal/index.tsx
View file

@ -160,7 +160,10 @@ export default function ImportModal() {
bgColor="bg-medium-emerald "
description={example.description ?? "Prebuilt Examples"}
icon={
<DocumentDuplicateIcon strokeWidth={1.5} className="h-6 w-6 flex-shrink-0" />
<DocumentDuplicateIcon
strokeWidth={1.5}
className="h-6 w-6 flex-shrink-0"
/>
}
onClick={() => {
addFlow(example, false);

2
src/frontend/src/modals/textAreaModal/index.tsx
View file

@ -92,7 +92,7 @@ export default function TextAreaModal({
<div className="w-full overflow-hidden rounded-lg bg-background px-4 py-5 shadow sm:p-6">
<textarea
ref={ref}
className="form-input h-full w-full form-primary"
className="form-primary form-input h-full w-full"
value={myValue}
onChange={(e) => {
setMyValue(e.target.value);

4
src/frontend/src/pages/FlowPage/components/DisclosureComponent/index.tsx
View file

@ -15,9 +15,7 @@ export default function DisclosureComponent({
<Disclosure.Button className="components-disclosure-arrangement">
<div className="flex gap-4">
<Icon strokeWidth={1.5} size={22} className="text-primary" />
<span className="components-disclosure-title">
{title}
</span>
<span className="components-disclosure-title">{title}</span>
</div>
<div className="components-disclosure-div">
{buttons.map((x, index) => (

21
src/frontend/src/pages/FlowPage/components/extraSidebarComponent/index.tsx
View file

@ -69,27 +69,29 @@ export default function ExtraSidebar() {
uploadFlow();
}}
>
<FileUp strokeWidth={1.5} className="side-bar-button-size "></FileUp>
<FileUp
strokeWidth={1.5}
className="side-bar-button-size "
></FileUp>
</button>
</ShadTooltip>
<ShadTooltip content="Export" side="top">
<button
className={classNames(
"extra-side-bar-buttons"
)}
className={classNames("extra-side-bar-buttons")}
onClick={(event) => {
openPopUp(<ExportModal />);
}}
>
<FileDown strokeWidth={1.5} className="side-bar-button-size"></FileDown>
<FileDown
strokeWidth={1.5}
className="side-bar-button-size"
></FileDown>
</button>
</ShadTooltip>
<ShadTooltip content="Code" side="top">
<button
className={classNames(
"extra-side-bar-buttons"
)}
className={classNames("extra-side-bar-buttons")}
onClick={(event) => {
openPopUp(<ApiModal flow={flows.find((f) => f.id === tabId)} />);
}}
@ -110,7 +112,8 @@ export default function ExtraSidebar() {
<Save
strokeWidth={1.5}
className={
"side-bar-button-size" + (isPending ? " " : " extra-side-bar-save-disable")
"side-bar-button-size" +
(isPending ? " " : " extra-side-bar-save-disable")
}
></Save>
</button>