Fix: Code is ready to run success alert showing up in tweaks page

This commit is contained in:
igorrCarvalho 2023-08-23 20:23:18 -03:00
commit 8fb73e689a
7 changed files with 20 additions and 15 deletions

View file

@ -32,13 +32,6 @@ export default function AccordionComponent({
value === "" ? setValue(keyValue!) : setValue(""); value === "" ? setValue(keyValue!) : setValue("");
} }
const handleKeyDown = (event) => {
/* if (event.key === "Backspace") {
event.preventDefault();
event.stopPropagation();
} */
};
return ( return (
<> <>
<Accordion <Accordion
@ -46,7 +39,6 @@ export default function AccordionComponent({
className="w-full" className="w-full"
value={value} value={value}
onValueChange={setValue} onValueChange={setValue}
onKeyDown={handleKeyDown}
> >
<AccordionItem value={keyValue!} className="border-b"> <AccordionItem value={keyValue!} className="border-b">
<AccordionTrigger <AccordionTrigger

View file

@ -34,6 +34,7 @@ import { classNames } from "../../utils/utils";
import IconComponent from "../genericIconComponent"; import IconComponent from "../genericIconComponent";
import { unselectAllNodes } from "../../utils/reactflowUtils"; import { unselectAllNodes } from "../../utils/reactflowUtils";
import { typesContext } from "../../contexts/typesContext"; import { typesContext } from "../../contexts/typesContext";
import { alertContext } from "../../contexts/alertContext";
export default function CodeTabsComponent({ export default function CodeTabsComponent({
flow, flow,
@ -48,6 +49,7 @@ export default function CodeTabsComponent({
const [openAccordion, setOpenAccordion] = useState<string[]>([]); const [openAccordion, setOpenAccordion] = useState<string[]>([]);
const { dark } = useContext(darkContext); const { dark } = useContext(darkContext);
const { reactFlowInstance } = useContext(typesContext); const { reactFlowInstance } = useContext(typesContext);
const { isTweakPage, setIsTweakPage } = useContext(alertContext);
useEffect(() => { useEffect(() => {
if (flow && flow["data"]!["nodes"]) { if (flow && flow["data"]!["nodes"]) {
@ -62,6 +64,10 @@ export default function CodeTabsComponent({
reactFlowInstance?.setNodes(nodes); reactFlowInstance?.setNodes(nodes);
} }
}); });
return () => {
if (isTweakPage) setIsTweakPage(false);
};
}, []) }, [])
const copyToClipboard = () => { const copyToClipboard = () => {

View file

@ -26,6 +26,8 @@ const initialValue: alertContextType = {
pushNotificationList: () => {}, pushNotificationList: () => {},
clearNotificationList: () => {}, clearNotificationList: () => {},
removeFromNotificationList: () => {}, removeFromNotificationList: () => {},
isTweakPage: false,
setIsTweakPage: () => {},
}; };
export const alertContext = createContext<alertContextType>(initialValue); export const alertContext = createContext<alertContextType>(initialValue);
@ -48,6 +50,7 @@ export function AlertProvider({ children }: { children: ReactNode }) {
const [successOpen, setSuccessOpen] = useState(false); const [successOpen, setSuccessOpen] = useState(false);
const [notificationCenter, setNotificationCenter] = useState(false); const [notificationCenter, setNotificationCenter] = useState(false);
const [notificationList, setNotificationList] = useState<AlertItemType[]>([]); const [notificationList, setNotificationList] = useState<AlertItemType[]>([]);
const [isTweakPage, setIsTweakPage] = useState<boolean>(false);
const pushNotificationList = (notification: AlertItemType) => { const pushNotificationList = (notification: AlertItemType) => {
setNotificationList((old) => { setNotificationList((old) => {
let newNotificationList = _.cloneDeep(old); let newNotificationList = _.cloneDeep(old);
@ -120,6 +123,8 @@ export function AlertProvider({ children }: { children: ReactNode }) {
return ( return (
<alertContext.Provider <alertContext.Provider
value={{ value={{
isTweakPage,
setIsTweakPage,
removeFromNotificationList, removeFromNotificationList,
clearNotificationList, clearNotificationList,
notificationList, notificationList,

View file

@ -28,7 +28,7 @@ export default function CodeAreaModal({
const { dark } = useContext(darkContext); const { dark } = useContext(darkContext);
const { reactFlowInstance } = useContext(typesContext); const { reactFlowInstance } = useContext(typesContext);
const [height, setHeight] = useState<string | null>(null); const [height, setHeight] = useState<string | null>(null);
const { setErrorData, setSuccessData } = useContext(alertContext); const { setErrorData, setSuccessData, isTweakPage } = useContext(alertContext);
const [error, setError] = useState<{ const [error, setError] = useState<{
detail: { error: string | undefined; traceback: string | undefined }; detail: { error: string | undefined; traceback: string | undefined };
} | null>(null); } | null>(null);
@ -39,7 +39,7 @@ export default function CodeAreaModal({
if (dynamic && Object.keys(nodeClass!.template).length > 2) { if (dynamic && Object.keys(nodeClass!.template).length > 2) {
return; return;
} }
processCode(); if (!isTweakPage) processCode();
}, []); }, []);
function processNonDynamicField() { function processNonDynamicField() {

View file

@ -21,7 +21,7 @@ export default function ExtraSidebar(): JSX.Element {
const { data, templates } = useContext(typesContext); const { data, templates } = useContext(typesContext);
const { flows, tabId, uploadFlow, tabsState, saveFlow, isBuilt } = const { flows, tabId, uploadFlow, tabsState, saveFlow, isBuilt } =
useContext(TabsContext); useContext(TabsContext);
const { setSuccessData, setErrorData } = useContext(alertContext); const { setSuccessData, setErrorData, setIsTweakPage } = useContext(alertContext);
const [dataFilter, setFilterData] = useState(data); const [dataFilter, setFilterData] = useState(data);
const [search, setSearch] = useState(""); const [search, setSearch] = useState("");
const isPending = tabsState[tabId]?.isPending; const isPending = tabsState[tabId]?.isPending;
@ -100,7 +100,10 @@ export default function ExtraSidebar(): JSX.Element {
<div className="side-bar-button"> <div className="side-bar-button">
{flow && flow.data && ( {flow && flow.data && (
<ApiModal flow={flow} disable={!isBuilt}> <ApiModal flow={flow} disable={!isBuilt}>
<div className={classNames("extra-side-bar-buttons")}> <div
className={classNames("extra-side-bar-buttons")}
onClick={() => setIsTweakPage(true)}
>
<IconComponent <IconComponent
name="Code2" name="Code2"
className={ className={

View file

@ -39,6 +39,8 @@ export type alertContextType = {
removeFromNotificationList: (index: string) => void; removeFromNotificationList: (index: string) => void;
loading: boolean; loading: boolean;
setLoading: (newState: boolean) => void; setLoading: (newState: boolean) => void;
isTweakPage: boolean;
setIsTweakPage: (newState: boolean) => void;
}; };
export type darkContextType = { export type darkContextType = {

View file

@ -5,15 +5,12 @@ import {
Node, Node,
ReactFlowInstance, ReactFlowInstance,
ReactFlowJsonObject, ReactFlowJsonObject,
useNodesState,
} from "reactflow"; } from "reactflow";
import { specialCharsRegex } from "../constants/constants"; import { specialCharsRegex } from "../constants/constants";
import { APITemplateType } from "../types/api"; import { APITemplateType } from "../types/api";
import { FlowType, NodeType } from "../types/flow"; import { FlowType, NodeType } from "../types/flow";
import { cleanEdgesType, unselectAllNodesType } from "../types/utils/reactflowUtils"; import { cleanEdgesType, unselectAllNodesType } from "../types/utils/reactflowUtils";
import { toNormalCase } from "./utils"; import { toNormalCase } from "./utils";
import { useContext } from "react";
import { typesContext } from "../contexts/typesContext";
export function cleanEdges({ export function cleanEdges({
flow: { edges, nodes }, flow: { edges, nodes },