From 08afe3cfad6a618a04a5e0c213b169494211e888 Mon Sep 17 00:00:00 2001
From: Kira Pilot <kira@coder.com>
Date: Mon, 27 Mar 2023 06:24:42 -0700
Subject: [PATCH] chore(UI): remove private icon from apps in dashboard (#6801)

* chore(UI): remove private icon from apps in dashboard

* clean up redudant snapshots
---
 .../components/AppLink/AppLink.stories.tsx    | 29 +++++++++++++---
 site/src/components/AppLink/AppLink.tsx       |  9 +++--
 .../components/AppLink/ShareIcon.stories.tsx  |  0
 site/src/components/AppLink/ShareIcon.tsx     | 34 +++++++++++--------
 4 files changed, 50 insertions(+), 22 deletions(-)
 create mode 100644 site/src/components/AppLink/ShareIcon.stories.tsx

diff --git a/site/src/components/AppLink/AppLink.stories.tsx b/site/src/components/AppLink/AppLink.stories.tsx
index f957316046..b378405508 100644
--- a/site/src/components/AppLink/AppLink.stories.tsx
+++ b/site/src/components/AppLink/AppLink.stories.tsx
@@ -25,8 +25,8 @@ WithIcon.args = {
   agent: MockWorkspaceAgent,
 }
 
-export const WithIconExternal = Template.bind({})
-WithIconExternal.args = {
+export const ExternalApp = Template.bind({})
+ExternalApp.args = {
   workspace: MockWorkspace,
   app: {
     ...MockWorkspaceApp,
@@ -35,13 +35,32 @@ WithIconExternal.args = {
   agent: MockWorkspaceAgent,
 }
 
-export const WithoutIcon = Template.bind({})
-WithoutIcon.args = {
+export const SharingLevelOwner = Template.bind({})
+SharingLevelOwner.args = {
   workspace: MockWorkspace,
   app: {
     ...MockWorkspaceApp,
     sharing_level: "owner",
-    health: "healthy",
+  },
+  agent: MockWorkspaceAgent,
+}
+
+export const SharingLevelAuthenticated = Template.bind({})
+SharingLevelAuthenticated.args = {
+  workspace: MockWorkspace,
+  app: {
+    ...MockWorkspaceApp,
+    sharing_level: "authenticated",
+  },
+  agent: MockWorkspaceAgent,
+}
+
+export const SharingLevelPublic = Template.bind({})
+SharingLevelPublic.args = {
+  workspace: MockWorkspace,
+  app: {
+    ...MockWorkspaceApp,
+    sharing_level: "public",
   },
   agent: MockWorkspaceAgent,
 }
diff --git a/site/src/components/AppLink/AppLink.tsx b/site/src/components/AppLink/AppLink.tsx
index c28f5d8870..26140c9703 100644
--- a/site/src/components/AppLink/AppLink.tsx
+++ b/site/src/components/AppLink/AppLink.tsx
@@ -5,6 +5,7 @@ import { makeStyles } from "@material-ui/core/styles"
 import Tooltip from "@material-ui/core/Tooltip"
 import ErrorOutlineIcon from "@material-ui/icons/ErrorOutline"
 import { FC } from "react"
+import { combineClasses } from "util/combineClasses"
 import * as TypesGen from "../../api/typesGenerated"
 import { generateRandomString } from "../../util/random"
 import { BaseIcon } from "./BaseIcon"
@@ -79,15 +80,19 @@ export const AppLink: FC<AppLinkProps> = ({
       "Your admin has not configured subdomain application access"
   }
 
+  const isPrivateApp = app.sharing_level === "owner"
+
   const button = (
     <Button
       size="small"
       startIcon={icon}
-      endIcon={<ShareIcon app={app} />}
+      endIcon={isPrivateApp ? undefined : <ShareIcon app={app} />}
       className={styles.button}
       disabled={!canClick}
     >
-      <span className={styles.appName}>{appDisplayName}</span>
+      <span className={combineClasses({ [styles.appName]: !isPrivateApp })}>
+        {appDisplayName}
+      </span>
     </Button>
   )
 
diff --git a/site/src/components/AppLink/ShareIcon.stories.tsx b/site/src/components/AppLink/ShareIcon.stories.tsx
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/site/src/components/AppLink/ShareIcon.tsx b/site/src/components/AppLink/ShareIcon.tsx
index 634d2a73be..635d03bc8d 100644
--- a/site/src/components/AppLink/ShareIcon.tsx
+++ b/site/src/components/AppLink/ShareIcon.tsx
@@ -1,8 +1,6 @@
 import PublicOutlinedIcon from "@material-ui/icons/PublicOutlined"
-import LockOutlinedIcon from "@material-ui/icons/LockOutlined"
 import GroupOutlinedIcon from "@material-ui/icons/GroupOutlined"
 import LaunchOutlinedIcon from "@material-ui/icons/LaunchOutlined"
-import { FC } from "react"
 import * as TypesGen from "../../api/typesGenerated"
 import Tooltip from "@material-ui/core/Tooltip"
 import { useTranslation } from "react-i18next"
@@ -11,23 +9,29 @@ export interface ShareIconProps {
   app: TypesGen.WorkspaceApp
 }
 
-export const ShareIcon: FC<ShareIconProps> = ({ app }) => {
+export const ShareIcon = ({ app }: ShareIconProps) => {
   const { t } = useTranslation("agent")
-
-  let shareIcon = <LockOutlinedIcon />
-  let shareTooltip = t("shareTooltip.private")
+  if (app.external) {
+    return (
+      <Tooltip title={t("shareTooltip.external")}>
+        <LaunchOutlinedIcon />
+      </Tooltip>
+    )
+  }
   if (app.sharing_level === "authenticated") {
-    shareIcon = <GroupOutlinedIcon />
-    shareTooltip = t("shareTooltip.authenticated")
+    return (
+      <Tooltip title={t("shareTooltip.authenticated")}>
+        <GroupOutlinedIcon />
+      </Tooltip>
+    )
   }
   if (app.sharing_level === "public") {
-    shareIcon = <PublicOutlinedIcon />
-    shareTooltip = t("shareTooltip.public")
-  }
-  if (app.external) {
-    shareIcon = <LaunchOutlinedIcon />
-    shareTooltip = t("shareTooltip.external")
+    return (
+      <Tooltip title={t("shareTooltip.public")}>
+        <PublicOutlinedIcon />
+      </Tooltip>
+    )
   }
 
-  return <Tooltip title={shareTooltip}>{shareIcon}</Tooltip>
+  return null
 }