fix(extraSidebarComponent): change variable name from hasApiKey to hasApiKey for consistency

fix(nodeToolbarComponent): add condition to show Share option only if `hasApiKey` is true

src/frontend/src/pages/FlowPage/components/extraSidebarComponent/index.tsx

@@ -23,12 +23,14 @@ import {
 } from "../../../../utils/utils";
 import DisclosureComponent from "../DisclosureComponent";
 import SidebarDraggableComponent from "./sideBarDraggableComponent";
+import { StoreContext } from "../../../../contexts/storeContext";
 
 export default function ExtraSidebar(): JSX.Element {
   const { data, templates, getFilterEdge, setFilterEdge, reactFlowInstance } =
     useContext(typesContext);
   const { flows, tabId, uploadFlow, tabsState, saveFlow, isBuilt, version } =
     useContext(FlowsContext);
+  const {hasApiKey} = useContext(StoreContext)
   const { setErrorData } = useContext(alertContext);
   const [dataFilter, setFilterData] = useState(data);
   const [search, setSearch] = useState("");
@@ -48,6 +50,8 @@ export default function ExtraSidebar(): JSX.Element {
     event.dataTransfer.setData("nodedata", JSON.stringify(data));
   }
 
+  
+
   // Handle showing components after use search input
   function handleSearchInput(e: string) {
     if (e === "") {
@@ -195,9 +199,9 @@ export default function ExtraSidebar(): JSX.Element {
     () => (
       <ExportModal>
         <ShadTooltip content="Export" side="top">
-          <div className={classNames("extra-side-bar-buttons")}>
+          <button disabled={!hasApiKey} className={classNames("extra-side-bar-buttons")}>
             <IconComponent name="FileDown" className="side-bar-button-size" />
-          </div>
+          </button>
         </ShadTooltip>
       </ExportModal>
     ),

src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx

@@ -21,6 +21,7 @@ import {
   updateFlowPosition,
 } from "../../../../utils/reactflowUtils";
 import { classNames } from "../../../../utils/utils";
+import { StoreContext } from "../../../../contexts/storeContext";
 
 export default function NodeToolbarComponent({
   data,
@@ -50,6 +51,7 @@ export default function NodeToolbarComponent({
   );
   const updateNodeInternals = useUpdateNodeInternals();
   const { getNodeId } = useContext(FlowsContext);
+  const {hasApiKey} = useContext(StoreContext)
 
   function canMinimize() {
     let countHandles: number = 0;
@@ -87,7 +89,7 @@ export default function NodeToolbarComponent({
         downloadNode(createFlowComponent(cloneDeep(data), version));
         break;
       case "Share":
-        setShowconfirmShare(true);
+        if(hasApiKey) setShowconfirmShare(true);
         break;
       case "SaveAll":
         saveComponent(cloneDeep(data));
@@ -211,7 +213,7 @@ export default function NodeToolbarComponent({
                   Save{" "}
                 </div>{" "}
               </SelectItem>
-              <SelectItem value={"Share"}>
+              {hasApiKey && <SelectItem value={"Share"}>
                 <div className="flex">
                   <IconComponent
                     name="Share2"
@@ -219,7 +221,7 @@ export default function NodeToolbarComponent({
                   />{" "}
                   Share{" "}
                 </div>{" "}
-              </SelectItem>
+              </SelectItem>}
               <SelectItem value={"Download"}>
                 <div className="flex">
                   <IconComponent