From e8199b8228dcb97eba42641b8ca6250a2f5ebdbf Mon Sep 17 00:00:00 2001
From: Weixuan Fu <weixuanf@outlook.com>
Date: Sat, 2 Mar 2024 22:21:18 +0800
Subject: [PATCH] ui fixes

---
 ui/src/App.tsx                      |  1 +
 ui/src/share/ShareDialog.tsx        |  3 +-
 ui/src/share/SharedTopbarButton.tsx | 53 +++++++++--------------------
 3 files changed, 20 insertions(+), 37 deletions(-)

diff --git a/ui/src/App.tsx b/ui/src/App.tsx
index 8439826..7cdbfc4 100644
--- a/ui/src/App.tsx
+++ b/ui/src/App.tsx
@@ -227,6 +227,7 @@ export default function App() {
       app.loadGraphData(JSON.parse(version.json));
     } else {
       setCurFlowIDAndName(flow);
+      setCurVersion(null);
       app.loadGraphData(JSON.parse(flow.json));
     }
     setRoute("root");
diff --git a/ui/src/share/ShareDialog.tsx b/ui/src/share/ShareDialog.tsx
index 38a797d..9d23397 100644
--- a/ui/src/share/ShareDialog.tsx
+++ b/ui/src/share/ShareDialog.tsx
@@ -1,4 +1,5 @@
 import {
+  Badge,
   Button,
   Flex,
   HStack,
@@ -270,7 +271,7 @@ export default function ShareDialog({ onClose }: Props) {
                     }}
                   />
                   <Flex color="green">
-                    <Text>New version</Text>
+                    <Badge colorScheme="purple">New version</Badge>
                   </Flex>
                 </HStack>
 
diff --git a/ui/src/share/SharedTopbarButton.tsx b/ui/src/share/SharedTopbarButton.tsx
index 7938704..1d5a821 100644
--- a/ui/src/share/SharedTopbarButton.tsx
+++ b/ui/src/share/SharedTopbarButton.tsx
@@ -1,9 +1,8 @@
-import { Button, Link, HStack, IconButton } from "@chakra-ui/react";
-import { IconCloud, IconCopy } from "@tabler/icons-react";
+import { Button, DarkMode } from "@chakra-ui/react";
+import { IconCloud } from "@tabler/icons-react";
 import { workflowsTable } from "../db-tables/WorkspaceDB";
 import { useContext, useEffect, useState } from "react";
 import { WorkspaceContext } from "../WorkspaceContext";
-import HoverMenu from "../components/HoverMenu";
 import { WorkflowPrivacy } from "../types/dbTypes";
 import { PrivacyLabel, fetchCloudWorkflowPrivacy } from "./shareUtils";
 
@@ -29,38 +28,20 @@ export function SharedTopbarButton({}) {
   if (!cloudURL) return null;
 
   return (
-    <>
-      <HoverMenu
-        menuButton={
-          <Button
-            onClick={() => {
-              window.open(cloudURL);
-            }}
-            variant={"ghost"}
-            aria-label={"Shared"}
-            size={"xs"}
-            iconSpacing={"2px"}
-            leftIcon={<IconCloud />}
-            height={"26px"}
-            px={1}
-          >
-            {privacy ? <PrivacyLabel privacy={privacy} /> : "Shared"}
-          </Button>
-        }
-        menuContent={
-          <HStack width={"200px"} p={1} color={"blue.400"}>
-            <Link href={cloudURL} noOfLines={1} isExternal>
-              {cloudURL.replace("https://www.", "")}
-            </Link>
-            <IconButton
-              size={"xs"}
-              variant={"ghost"}
-              icon={<IconCopy size={19} />}
-              aria-label="copy link"
-            ></IconButton>
-          </HStack>
-        }
-      />
-    </>
+    <a href={cloudURL} style={{ textDecoration: "none" }} target="_blank">
+      <DarkMode>
+        <Button
+          variant={"ghost"}
+          aria-label={"Shared"}
+          size={"xs"}
+          iconSpacing={"2px"}
+          leftIcon={<IconCloud />}
+          height={"26px"}
+          px={1}
+        >
+          {privacy ? <PrivacyLabel privacy={privacy} /> : "Shared"}
+        </Button>
+      </DarkMode>
+    </a>
   );
 }