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

merge fix

Browse source
This commit is contained in:
cristhianzl 2024-06-06 17:40:03 -03:00
commit 7d943b8755
22 changed files with 894 additions and 652 deletions
Download patch file Download diff file Expand all files Collapse all files

16
src/frontend/src/components/tableComponent/index.tsx
View file

@ -13,6 +13,7 @@ import ForwardedIconComponent from "../genericIconComponent";
import { Alert, AlertDescription, AlertTitle } from "../ui/alert";
import ResetColumns from "./components/ResetColumns";
import resetGrid from "./utils/reset-grid-columns";
import { useParams } from "react-router-dom";
interface TableComponentProps extends AgGridReactProps {
columnDefs: NonNullable<AgGridReactProps["columnDefs"]>;
@ -32,7 +33,7 @@ const TableComponent = forwardRef<
alertDescription = DEFAULT_TABLE_ALERT_MSG,
...props
},
ref
ref,
) => {
let colDef = props.columnDefs.map((col, index) => {
let newCol = {
@ -82,16 +83,16 @@ const TableComponent = forwardRef<
// @ts-ignore
realRef.current = params;
const updatedColumnDefs = makeLastColumnNonResizable([...colDef]);
params.api.setColumnDefs(updatedColumnDefs);
params.api.setGridOption("columnDefs", updatedColumnDefs);
initialColumnDefs.current = params.api.getColumnDefs();
if (props.onGridReady) props.onGridReady(params);
};
const onColumnMoved = (params) => {
const updatedColumnDefs = makeLastColumnNonResizable(
params.columnApi.getAllGridColumns().map((col) => col.getColDef())
params.columnApi.getAllGridColumns().map((col) => col.getColDef()),
);
params.api.setColumnDefs(updatedColumnDefs);
params.api.setGridOption("columnDefs", updatedColumnDefs);
if (props.onColumnMoved) props.onColumnMoved(params);
};
@ -114,7 +115,7 @@ const TableComponent = forwardRef<
className={cn(
dark ? "ag-theme-quartz-dark" : "ag-theme-quartz",
"ag-theme-shadcn flex h-full flex-col",
"relative"
"relative",
)} // applying the grid theme
>
<AgGridReact
@ -126,9 +127,6 @@ const TableComponent = forwardRef<
}}
columnDefs={colDef}
ref={realRef}
getRowId={(params) => {
return params.data.id;
}}
pagination={true}
onGridReady={onGridReady}
onColumnMoved={onColumnMoved}
@ -136,7 +134,7 @@ const TableComponent = forwardRef<
<ResetColumns resetGrid={() => resetGrid(realRef, initialColumnDefs)} />
</div>
);
}
},
);
export default TableComponent;

2
src/frontend/src/customNodes/genericNode/index.tsx
View file

@ -114,7 +114,7 @@ export default function GenericNode({
selected: boolean,
showNode: boolean,
buildStatus: BuildStatus | undefined,
validationStatus: validationStatusType | null
validationStatus: VertexBuildTypeAPI | null
) => {
const specificClassFromBuildStatus = getSpecificClassFromBuildStatus(
buildStatus,

8
src/frontend/src/modals/IOModal/components/chatView/index.tsx
View file

@ -131,7 +131,7 @@ export default function ChatView({
function updateChat(
chat: ChatMessageType,
message: string,
stream_url?: string
stream_url?: string,
) {
// if (message === "") return;
chat.message = message;
@ -163,14 +163,12 @@ export default function ChatView({
className="flex gap-1"
size="none"
variant="none"
disabled={lockChat}
onClick={() => handleSelectChange("builds")}
>
<IconComponent
name="Eraser"
className={classNames(
"h-5 w-5 transition-all duration-100",
lockChat ? "animate-pulse text-primary" : "text-primary"
)}
className={classNames("h-5 w-5 text-primary")}
aria-hidden="true"
/>
</Button>

6
src/frontend/src/modals/baseModal/helpers/switch-case-size.ts
View file

@ -44,17 +44,17 @@ export const switchCaseModalSize = (size: string) => {
break;
case "large-thin":
minWidth = "min-w-[65vw]";
height = "h-[80vh]";
height = "h-[90vh]";
break;
case "md-thin":
minWidth = "min-w-[85vw]";
height = "h-[70vh]";
height = "h-[90vh]";
break;
case "sm-thin":
minWidth = "min-w-[65vw]";
height = "h-[70vh]";
height = "h-[90vh]";
break;
case "large-h-full":

38
src/frontend/src/modals/baseModal/index.tsx
View file

@ -103,7 +103,7 @@ interface BaseModalProps {
React.ReactElement<ContentProps>,
React.ReactElement<HeaderProps>,
React.ReactElement<TriggerProps>?,
React.ReactElement<FooterProps>?
React.ReactElement<FooterProps>?,
];
open?: boolean;
setOpen?: (open: boolean) => void;
@ -139,16 +139,16 @@ function BaseModal({
onSubmit,
}: BaseModalProps) {
const headerChild = React.Children.toArray(children).find(
(child) => (child as React.ReactElement).type === Header
(child) => (child as React.ReactElement).type === Header,
);
const triggerChild = React.Children.toArray(children).find(
(child) => (child as React.ReactElement).type === Trigger
(child) => (child as React.ReactElement).type === Trigger,
);
const ContentChild = React.Children.toArray(children).find(
(child) => (child as React.ReactElement).type === Content
(child) => (child as React.ReactElement).type === Content,
);
const ContentFooter = React.Children.toArray(children).find(
(child) => (child as React.ReactElement).type === Footer
(child) => (child as React.ReactElement).type === Footer,
);
let { minWidth, height } = switchCaseModalSize(size);
@ -165,17 +165,21 @@ function BaseModal({
{type === "modal" ? (
<Modal open={open} onOpenChange={setOpen}>
{triggerChild}
<ModalContent className={cn(minWidth, "duration-300")}>
<div className="truncate-doubleline word-break-break-word">
<ModalContent
className={cn(minWidth, height, "flex flex-col duration-300")}
>
<div className="flex-shrink-0 truncate-doubleline word-break-break-word">
{headerChild}
</div>
<div
className={`flex flex-col ${height} w-full transition-all duration-300`}
className={`flex w-full flex-1 flex-col transition-all duration-300`}
>
{ContentChild}
</div>
{ContentFooter && (
<div className="flex flex-row-reverse">{ContentFooter}</div>
<div className="flex flex-shrink-0 flex-row-reverse">
{ContentFooter}
</div>
)}
</ModalContent>
</Modal>
@ -185,7 +189,7 @@ function BaseModal({
<DialogContent
className={cn(minWidth, height, "flex flex-col duration-300")}
>
<div className="truncate-doubleline word-break-break-word">
<div className="flex-shrink-0 truncate-doubleline word-break-break-word">
{headerChild}
</div>
{onSubmit ? (
@ -194,26 +198,30 @@ function BaseModal({
event.preventDefault();
onSubmit();
}}
className="flex flex-1 flex-col gap-6"
className="flex min-h-0 flex-1 flex-col gap-6"
>
<div
className={`flex w-full flex-1 flex-col transition-all duration-300`}
className={`flex w-full flex-1 flex-col overflow-hidden transition-all duration-300`}
>
{ContentChild}
</div>
{ContentFooter && (
<div className="flex flex-row-reverse">{ContentFooter}</div>
<div className="flex flex-shrink-0 flex-row-reverse">
{ContentFooter}
</div>
)}
</Form.Root>
) : (
<>
<div
className={`flex w-full flex-1 flex-col transition-all duration-300`}
className={`flex min-h-0 w-full flex-1 flex-col transition-all duration-300`}
>
{ContentChild}
</div>
{ContentFooter && (
<div className="flex flex-row-reverse">{ContentFooter}</div>
<div className="flex flex-shrink-0 flex-row-reverse">
{ContentFooter}
</div>
)}
</>
)}

2
src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx
View file

@ -11,13 +11,13 @@ import ReactFlow, {
SelectionDragHandler,
updateEdge,
} from "reactflow";
import GenericNode from "../../../../CustomNodes/GenericNode";
import {
INVALID_SELECTION_ERROR_ALERT,
UPLOAD_ALERT_LIST,
UPLOAD_ERROR_ALERT,
WRONG_FILE_ERROR_ALERT,
} from "../../../../constants/alerts_constants";
import GenericNode from "../../../../customNodes/genericNode";
import useAlertStore from "../../../../stores/alertStore";
import useFlowStore from "../../../../stores/flowStore";
import useFlowsManagerStore from "../../../../stores/flowsManagerStore";

11
src/frontend/src/pages/SettingsPage/pages/ShortcutsPage/index.tsx
View file

@ -20,7 +20,7 @@ export default function ShortcutsPage() {
const redoShortcut = `${isMac ? "Cmd" : "Ctrl"} + Y`;
// Column Definitions: Defines the columns to be displayed.
const [colDefs, setColDefs] = useState<(ColDef<any> | ColGroupDef<any>)[]>([
const colDefs = [
{
headerName: "Functionality",
field: "name",
@ -33,9 +33,9 @@ export default function ShortcutsPage() {
editable: false,
resizable: false,
},
]);
];
const [nodesRowData, setNodesRowData] = useState([
const nodesRowData = [
{
name: "Advanced Settings Component",
shortcut: advancedShortcut,
@ -96,7 +96,7 @@ export default function ShortcutsPage() {
shortcut: redoShortcut,
resizable: false,
},
]);
];
return (
<div className="flex h-full w-full flex-col gap-6">
@ -114,11 +114,10 @@ export default function ShortcutsPage() {
</p>
</div>
</div>
<div className="grid gap-6">
<div className="flex h-full w-full flex-col justify-between">
<Card x-chunk="dashboard-04-chunk-2" className="h-full pt-4">
<CardContent className="h-full">
<TableComponent
domLayout="autoHeight"
pagination={false}
columnDefs={colDefs}
rowData={nodesRowData}

2
src/frontend/src/utils/reactflowUtils.ts
View file

@ -8,6 +8,7 @@ import {
XYPosition,
} from "reactflow";
import ShortUniqueId from "short-unique-id";
import getFieldTitle from "../CustomNodes/utils/get-field-title";
import {
INPUT_TYPES,
LANGFLOW_SUPPORTED_TYPES,
@ -16,7 +17,6 @@ import {
specialCharsRegex,
} from "../constants/constants";
import { downloadFlowsFromDatabase } from "../controllers/API";
import getFieldTitle from "../customNodes/utils/get-field-title";
import { DESCRIPTIONS } from "../flow_constants";
import {
APIClassType,