Fix: bug on disabled share when there is no api key

src/frontend/src/CustomNodes/GenericNode/index.tsx

@@ -198,14 +198,19 @@ export default function GenericNode({
                     </div>
                   ) : (
                     <ShadTooltip content={data.node?.display_name}>
-                      <div className="flex" onDoubleClick={() => setInputName(true)}>
                       <div
-                          className="generic-node-tooltip-div text-primary pr-3"
+                        className="flex"
-                          
+                        onDoubleClick={() => setInputName(true)}
                       >
+                        <div className="generic-node-tooltip-div pr-3 text-primary">
                           {data.node?.display_name}
                         </div>
-                        {data.node?.flow&& <IconComponent name="Pencil" className="w-5 h-5 text-primary-content" />}
+                        {data.node?.flow && (
+                          <IconComponent
+                            name="Pencil"
+                            className="h-5 w-5 text-primary-content"
+                          />
+                        )}
                       </div>
                     </ShadTooltip>
                   )}

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

@@ -181,13 +181,44 @@ export default function ExtraSidebar(): JSX.Element {
   }, [getFilterEdge, data]);
 
   const ModalMemo = useMemo(
-    () => (
+    () =>
-      <ShareModal is_component={false} component={flow!} disabled={(!hasApiKey||!validApiKey)}>
+      !hasApiKey || !validApiKey ? (
-        <ShadTooltip content="Share" side="top">
+        <button
-          <button disabled={!hasApiKey} className={classNames("extra-side-bar-buttons",(!hasApiKey||!validApiKey)?"button-disable cursor-default":"")}>
+          disabled={!hasApiKey || !validApiKey}
-            <IconComponent name="Share2" className={classNames("side-bar-button-size",(!hasApiKey||!validApiKey)?"extra-side-bar-save-disable":"")} />
+          className={classNames(
+            "extra-side-bar-buttons",
+            !hasApiKey || !validApiKey ? "button-disable  cursor-default" : ""
+          )}
+        >
+          <IconComponent
+            name="Share2"
+            className={classNames(
+              "side-bar-button-size",
+              !hasApiKey || !validApiKey ? "extra-side-bar-save-disable" : ""
+            )}
+          />
+        </button>
+      ) : (
+        <ShareModal
+          is_component={false}
+          component={flow!}
+          disabled={!hasApiKey || !validApiKey}
+        >
+          <button
+            disabled={!hasApiKey || !validApiKey}
+            className={classNames(
+              "extra-side-bar-buttons",
+              !hasApiKey || !validApiKey ? "button-disable  cursor-default" : ""
+            )}
+          >
+            <IconComponent
+              name="Share2"
+              className={classNames(
+                "side-bar-button-size",
+                !hasApiKey || !validApiKey ? "extra-side-bar-save-disable" : ""
+              )}
+            />
           </button>
-        </ShadTooltip>
         </ShareModal>
       ),
     [hasApiKey, validApiKey]
@@ -197,9 +228,7 @@ export default function ExtraSidebar(): JSX.Element {
     () => (
       <ExportModal>
         <ShadTooltip content="Export" side="top">
-          <button
+          <button className={classNames("extra-side-bar-buttons")}>
-            className={classNames("extra-side-bar-buttons")}
-          >
             <IconComponent name="FileDown" className="side-bar-button-size" />
           </button>
         </ShadTooltip>
@@ -280,8 +309,9 @@ export default function ExtraSidebar(): JSX.Element {
             </div>
           </ShadTooltip>
         </div>
-
+        <ShadTooltip content="Share" side="top" styleClasses="cursor-default">
           <div className="side-bar-button">{ModalMemo}</div>
+        </ShadTooltip>
       </div>
       <Separator />
       <div className="side-bar-search-div-placement">

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

@@ -232,7 +232,7 @@ export default function NodeToolbarComponent({
                 </SelectItem>
               )}
 
-              <SelectItem disabled={(!hasApiKey||!validApiKey)} value={"Share"}>
+              <SelectItem disabled={!hasApiKey || !validApiKey} value={"Share"}>
                 <div className="flex">
                   <IconComponent
                     name="Share2"

src/frontend/src/pages/StorePage/index.tsx

@@ -275,8 +275,18 @@ export default function StorePage(): JSX.Element {
               <SelectContent>
                 <SelectGroup>
                   <SelectItem value="all">All</SelectItem>
-                  <SelectItem disabled={!hasApiKey} value="createdbyme">Created By Me</SelectItem>
+                  <SelectItem
-                  <SelectItem disabled={!hasApiKey} value="likedbyme">Liked By Me</SelectItem>
+                    disabled={!hasApiKey || !validApiKey}
+                    value="createdbyme"
+                  >
+                    Created By Me
+                  </SelectItem>
+                  <SelectItem
+                    disabled={!hasApiKey || !validApiKey}
+                    value="likedbyme"
+                  >
+                    Liked By Me
+                  </SelectItem>
                 </SelectGroup>
               </SelectContent>
             </Select>