diff --git a/site/src/components/AppLink/AppLink.stories.tsx b/site/src/components/AppLink/AppLink.stories.tsx index f957316046ad1..b3784055081dc 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 c28f5d8870d90..26140c9703cf8 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 = ({ "Your admin has not configured subdomain application access" } + const isPrivateApp = app.sharing_level === "owner" + const button = ( ) diff --git a/site/src/components/AppLink/ShareIcon.stories.tsx b/site/src/components/AppLink/ShareIcon.stories.tsx new file mode 100644 index 0000000000000..e69de29bb2d1d diff --git a/site/src/components/AppLink/ShareIcon.tsx b/site/src/components/AppLink/ShareIcon.tsx index 634d2a73beb9e..635d03bc8d7de 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 = ({ app }) => { +export const ShareIcon = ({ app }: ShareIconProps) => { const { t } = useTranslation("agent") - - let shareIcon = - let shareTooltip = t("shareTooltip.private") + if (app.external) { + return ( + + + + ) + } if (app.sharing_level === "authenticated") { - shareIcon = - shareTooltip = t("shareTooltip.authenticated") + return ( + + + + ) } if (app.sharing_level === "public") { - shareIcon = - shareTooltip = t("shareTooltip.public") - } - if (app.external) { - shareIcon = - shareTooltip = t("shareTooltip.external") + return ( + + + + ) } - return {shareIcon} + return null }