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

Fix: update shortcut not working

Browse source
This commit is contained in:
igorrCarvalho 2024-06-10 20:50:35 -03:00
commit 1aca27e5f3
2 changed files with 26 additions and 17 deletions
Download patch file Download diff file Expand all files Collapse all files

41
src/frontend/src/CustomNodes/GenericNode/index.tsx
View file

@ -37,6 +37,7 @@ import useValidationStatusString from "../hooks/use-validation-status-string";
import getFieldTitle from "../utils/get-field-title"; import getFieldTitle from "../utils/get-field-title";
import sortFields from "../utils/sort-fields"; import sortFields from "../utils/sort-fields";
import ParameterComponent from "./components/parameterComponent"; import ParameterComponent from "./components/parameterComponent";
import { useHotkeys } from "react-hotkeys-hook";
export default function GenericNode({ export default function GenericNode({
data, data,
@ -48,6 +49,7 @@ export default function GenericNode({
xPos?: number; xPos?: number;
yPos?: number; yPos?: number;
}): JSX.Element { }): JSX.Element {
const preventDefault = true;
const types = useTypesStore((state) => state.types); const types = useTypesStore((state) => state.types);
const templates = useTypesStore((state) => state.templates); const templates = useTypesStore((state) => state.templates);
const deleteNode = useFlowStore((state) => state.deleteNode); const deleteNode = useFlowStore((state) => state.deleteNode);
@ -58,10 +60,10 @@ export default function GenericNode({
const setErrorData = useAlertStore((state) => state.setErrorData); const setErrorData = useAlertStore((state) => state.setErrorData);
const isDark = useDarkStore((state) => state.dark); const isDark = useDarkStore((state) => state.dark);
const buildStatus = useFlowStore( const buildStatus = useFlowStore(
(state) => state.flowBuildStatus[data.id]?.status (state) => state.flowBuildStatus[data.id]?.status,
); );
const lastRunTime = useFlowStore( const lastRunTime = useFlowStore(
(state) => state.flowBuildStatus[data.id]?.timestamp (state) => state.flowBuildStatus[data.id]?.timestamp,
); );
const takeSnapshot = useFlowsManagerStore((state) => state.takeSnapshot); const takeSnapshot = useFlowsManagerStore((state) => state.takeSnapshot);
@ -69,7 +71,7 @@ export default function GenericNode({
const [nodeName, setNodeName] = useState(data.node!.display_name); const [nodeName, setNodeName] = useState(data.node!.display_name);
const [inputDescription, setInputDescription] = useState(false); const [inputDescription, setInputDescription] = useState(false);
const [nodeDescription, setNodeDescription] = useState( const [nodeDescription, setNodeDescription] = useState(
data.node?.description! data.node?.description!,
); );
const [isOutdated, setIsOutdated] = useState(false); const [isOutdated, setIsOutdated] = useState(false);
const [validationStatus, setValidationStatus] = const [validationStatus, setValidationStatus] =
@ -87,7 +89,7 @@ export default function GenericNode({
data.node!, data.node!,
setNode, setNode,
setIsOutdated, setIsOutdated,
updateNodeInternals updateNodeInternals,
); );
const name = nodeIconsLucide[data.type] ? data.type : types[data.type]; const name = nodeIconsLucide[data.type] ? data.type : types[data.type];
@ -118,12 +120,12 @@ export default function GenericNode({
selected: boolean, selected: boolean,
showNode: boolean, showNode: boolean,
buildStatus: BuildStatus | undefined, buildStatus: BuildStatus | undefined,
validationStatus: VertexBuildTypeAPI | null validationStatus: VertexBuildTypeAPI | null,
) => { ) => {
const specificClassFromBuildStatus = getSpecificClassFromBuildStatus( const specificClassFromBuildStatus = getSpecificClassFromBuildStatus(
buildStatus, buildStatus,
validationStatus, validationStatus,
isDark isDark,
); );
const baseBorderClass = getBaseBorderClass(selected); const baseBorderClass = getBaseBorderClass(selected);
@ -132,7 +134,7 @@ export default function GenericNode({
baseBorderClass, baseBorderClass,
nodeSizeClass, nodeSizeClass,
"generic-node-div group/node", "generic-node-div group/node",
specificClassFromBuildStatus specificClassFromBuildStatus,
); );
return names; return names;
}; };
@ -175,7 +177,7 @@ export default function GenericNode({
showNode, showNode,
isEmoji, isEmoji,
nodeIconFragment, nodeIconFragment,
checkNodeIconFragment checkNodeIconFragment,
); );
function countHandles(): void { function countHandles(): void {
@ -233,6 +235,15 @@ export default function GenericNode({
} }
}; };
function handleUpdateCodeWShortcut() {
if (isOutdated && selected) {
handleUpdateCode();
}
}
const update = useShortcutsStore((state) => state.update);
useHotkeys(update, handleUpdateCodeWShortcut, { preventDefault });
const shortcuts = useShortcutsStore((state) => state.shortcuts); const shortcuts = useShortcutsStore((state) => state.shortcuts);
const memoizedNodeToolbarComponent = useMemo(() => { const memoizedNodeToolbarComponent = useMemo(() => {
@ -288,7 +299,7 @@ export default function GenericNode({
selected, selected,
showNode, showNode,
buildStatus, buildStatus,
validationStatus validationStatus,
)} )}
> >
{data.node?.beta && showNode && ( {data.node?.beta && showNode && (
@ -419,7 +430,7 @@ export default function GenericNode({
} }
title={getFieldTitle( title={getFieldTitle(
data.node?.template!, data.node?.template!,
templateField templateField,
)} )}
info={data.node?.template[templateField].info} info={data.node?.template[templateField].info}
name={templateField} name={templateField}
@ -447,7 +458,7 @@ export default function GenericNode({
proxy={data.node?.template[templateField].proxy} proxy={data.node?.template[templateField].proxy}
showNode={showNode} showNode={showNode}
/> />
) ),
)} )}
<ParameterComponent <ParameterComponent
key={scapedJSONStringfy({ key={scapedJSONStringfy({
@ -610,7 +621,7 @@ export default function GenericNode({
!data.node?.description) && !data.node?.description) &&
nameEditable nameEditable
? "font-light italic" ? "font-light italic"
: "" : "",
)} )}
onClick={(e) => { onClick={(e) => {
setInputDescription(true); setInputDescription(true);
@ -672,13 +683,13 @@ export default function GenericNode({
} }
title={getFieldTitle( title={getFieldTitle(
data.node?.template!, data.node?.template!,
templateField templateField,
)} )}
info={data.node?.template[templateField].info} info={data.node?.template[templateField].info}
name={templateField} name={templateField}
tooltipTitle={ tooltipTitle={
data.node?.template[templateField].input_types?.join( data.node?.template[templateField].input_types?.join(
"\n" "\n",
) ?? data.node?.template[templateField].type ) ?? data.node?.template[templateField].type
} }
required={data.node!.template[templateField].required} required={data.node!.template[templateField].required}
@ -705,7 +716,7 @@ export default function GenericNode({
<div <div
className={classNames( className={classNames(
Object.keys(data.node!.template).length < 1 ? "hidden" : "", Object.keys(data.node!.template).length < 1 ? "hidden" : "",
"flex-max-width justify-center" "flex-max-width justify-center",
)} )}
> >
{" "} {" "}

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

@ -175,12 +175,10 @@ export default function NodeToolbarComponent({
const docs = useShortcutsStore((state) => state.docs); const docs = useShortcutsStore((state) => state.docs);
const code = useShortcutsStore((state) => state.code); const code = useShortcutsStore((state) => state.code);
const group = useShortcutsStore((state) => state.group); const group = useShortcutsStore((state) => state.group);
const update = useShortcutsStore((state) => state.update);
const download = useShortcutsStore((state) => state.download); const download = useShortcutsStore((state) => state.download);
const freeze = useShortcutsStore((state) => state.freeze); const freeze = useShortcutsStore((state) => state.freeze);
useHotkeys(minimize, handleMinimizeWShortcut, { preventDefault }); useHotkeys(minimize, handleMinimizeWShortcut, { preventDefault });
useHotkeys(update, handleUpdateWShortcut, { preventDefault });
useHotkeys(group, handleGroupWShortcut, { preventDefault }); useHotkeys(group, handleGroupWShortcut, { preventDefault });
useHotkeys(component, handleShareWShortcut, { preventDefault }); useHotkeys(component, handleShareWShortcut, { preventDefault });
useHotkeys(code, handleCodeWShortcut, { preventDefault }); useHotkeys(code, handleCodeWShortcut, { preventDefault });