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

Fixed Copy Paste issues by disabling it when the user clicks at the node

Browse source
This commit is contained in:
Lucas Oliveira 2023-05-25 19:56:42 -03:00
commit bef1cc096c
9 changed files with 12 additions and 68 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -14,7 +14,6 @@ export default function FloatComponent({
onChange("");
}
}, [disabled, onChange]);
const {setDisableCopyPaste} = useContext(TabsContext)
return (
<div className={disabled ? "pointer-events-none cursor-not-allowed" : ""}>
<input
@ -29,12 +28,7 @@ export default function FloatComponent({
setMyValue(e.target.value);
onChange(e.target.value);
}}
onBlur={() => {
setDisableCopyPaste(false)
}}
onFocus={() => {
setDisableCopyPaste(true)
}}
/>
</div>
);

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

@ -11,7 +11,6 @@ export default function InputComponent({
}: InputComponentType) {
const [myValue, setMyValue] = useState(value ?? "");
const [pwdVisible, setPwdVisible] = useState(false);
const {setDisableCopyPaste} = useContext(TabsContext)
useEffect(() => {
if (disabled) {
setMyValue("");
@ -28,12 +27,7 @@ export default function InputComponent({
>
<input
value={myValue}
onBlur={() => {
setDisableCopyPaste(false)
}}
onFocus={() => {
setDisableCopyPaste(true)
}}
className={classNames(
"block w-full pr-12 form-input dark:bg-gray-900 dark:border-gray-600 rounded-md border-gray-300 shadow-sm focus:border-indigo-500 focus:ring-indigo-500 sm:text-sm",
disabled ? " bg-gray-200 dark:bg-gray-700" : "",

7
src/frontend/src/components/inputListComponent/index.tsx
View file

@ -17,7 +17,6 @@ export default function InputListComponent({
onChange([""]);
}
}, [disabled, onChange]);
const {setDisableCopyPaste} = useContext(TabsContext)
return (
<div
className={
@ -43,12 +42,6 @@ export default function InputListComponent({
});
onChange(inputList);
}}
onBlur={() => {
setDisableCopyPaste(false)
}}
onFocus={() => {
setDisableCopyPaste(true)
}}
/>
{idx === inputList.length - 1 ? (
<button

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

@ -14,7 +14,6 @@ export default function IntComponent({
onChange("");
}
}, [disabled, onChange]);
const {setDisableCopyPaste} =useContext(TabsContext)
return (
<div
className={
@ -45,12 +44,7 @@ export default function IntComponent({
setMyValue(e.target.value);
onChange(e.target.value);
}}
onBlur={() => {
setDisableCopyPaste(false)
}}
onFocus={() => {
setDisableCopyPaste(true)
}}
/>
</div>

8
src/frontend/src/modals/chatModal/chatInput/index.tsx
View file

@ -17,8 +17,6 @@ export default function ChatInput({
}
}, [chatValue]);
const { setDisableCopyPaste } = useContext(TabsContext);
return (
<div className="relative">
<textarea
@ -27,12 +25,6 @@ export default function ChatInput({
sendMessage();
}
}}
onBlur={() => {
setDisableCopyPaste(false)
}}
onFocus={() => {
setDisableCopyPaste(true)
}}
rows={1}
ref={inputRef}
disabled={lockChat}

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

@ -23,7 +23,6 @@ export default function CodeAreaModal({
const [code, setCode] = useState(value);
const { dark } = useContext(darkContext);
const { setErrorData, setSuccessData } = useContext(alertContext);
const { setDisableCopyPaste } = useContext(TabsContext);
const { closePopUp } = useContext(PopUpContext);
const ref = useRef();
function setModalOpen(x: boolean) {
@ -111,12 +110,6 @@ export default function CodeAreaModal({
onChange={(value) => {
setCode(value);
}}
onBlur={() => {
setDisableCopyPaste(false)
}}
onFocus={() => {
setDisableCopyPaste(true)
}}
className="h-full w-full rounded-lg"
/>
</div>

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

@ -16,7 +16,7 @@ export default function ExportModal() {
const { closePopUp } = useContext(PopUpContext);
const ref = useRef();
const { setErrorData } = useContext(alertContext);
const { flows, tabIndex, updateFlow, downloadFlow,setDisableCopyPaste } = useContext(TabsContext);
const { flows, tabIndex, updateFlow, downloadFlow } = useContext(TabsContext);
function setModalOpen(x: boolean) {
setOpen(x);
if (x === false) {
@ -113,12 +113,6 @@ export default function ExportModal() {
placeholder="File name"
id="name"
className="focus:border focus:border-blue block w-full px-3 py-2 border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-blue-500 focus:border-blue-500 dark:bg-gray-800 dark:border-gray-600 dark:focus:border-blue-500 dark:focus:ring-blue-500 text-gray-900 dark:text-gray-100"
onBlur={() => {
setDisableCopyPaste(false);
}}
onFocus={() => {
setDisableCopyPaste(true);
}}
/>
</div>
<div className="w-full">
@ -133,12 +127,6 @@ export default function ExportModal() {
</span>
</label>
<textarea
onBlur={() => {
setDisableCopyPaste(false);
}}
onFocus={() => {
setDisableCopyPaste(true);
}}
name="description"
id="description"
onChange={(event) => {
@ -163,12 +151,7 @@ export default function ExportModal() {
id="checkbox"
type="checkbox"
className="h-4 w-4 text-blue-600 border-gray-300 rounded dark:bg-gray-800 dark:border-gray-600 dark:focus:border-blue-500 dark:focus:ring-blue-500"
onBlur={() => {
setDisableCopyPaste(false);
}}
onFocus={() => {
setDisableCopyPaste(true);
}}
/>
<span className="ml-2 font-medium text-gray-700 dark:text-white">
Save with my API keys

6
src/frontend/src/pages/FlowPage/components/tabComponent/index.tsx
View file

@ -14,7 +14,7 @@ export default function TabComponent({
selected: boolean;
onClick: () => void;
}) {
const { removeFlow, updateFlow, flows, setDisableCopyPaste } = useContext(TabsContext);
const { removeFlow, updateFlow, flows } = useContext(TabsContext);
const [isRename, setIsRename] = useState(false);
const [value, setValue] = useState("");
return (
@ -40,14 +40,10 @@ export default function TabComponent({
<div className="bg-white dark:text-white dark:bg-gray-700/60 flex select-none justify-between w-44 items-center border border-b-0 border-gray-300 dark:border-gray-600 px-4 py-1 rounded-t-xl -ml-px">
{isRename ? (
<input
onFocus={() => {
setDisableCopyPaste(true);
}}
autoFocus
className="bg-transparent focus:border-none active:outline hover:outline focus:outline outline-gray-300 rounded-md w-28"
onBlur={() => {
setIsRename(false);
setDisableCopyPaste(false);
if (value !== "") {
let newFlow = _.cloneDeep(flow);
newFlow.name = value;

7
src/frontend/src/pages/FlowPage/index.tsx
View file

@ -306,8 +306,10 @@ export default function FlowPage({ flow }: { flow: FlowType }) {
setLastSelection(flow);
}, []);
const {setDisableCopyPaste} = useContext(TabsContext)
return (
<div className="w-full h-full" ref={reactFlowWrapper}>
<div className="w-full h-full" ref={reactFlowWrapper} >
{Object.keys(templates).length > 0 && Object.keys(types).length > 0 ? (
<>
<ReactFlow
@ -316,6 +318,9 @@ export default function FlowPage({ flow }: { flow: FlowType }) {
updateFlow({ ...flow, data: reactFlowInstance.toObject() });
}}
edges={edges}
onPaneClick={() => {setDisableCopyPaste(false);}}
onNodeClick={() => {setDisableCopyPaste(true);}}
onPaneMouseLeave={() => {setDisableCopyPaste(true);}}
onNodesChange={onNodesChange}
onEdgesChange={onEdgesChangeMod}
onConnect={onConnect}