From 0973dbebf3eb254b46e2d4840c57c62500a74ac0 Mon Sep 17 00:00:00 2001
From: Bruno <bruno@coder.com>
Date: Wed, 20 Jul 2022 16:24:29 +0000
Subject: [PATCH 1/2] fix: Fix statuses breaking line in the UI

---
 site/src/components/AppLink/AppLink.tsx         | 5 +++++
 site/src/components/BuildsTable/BuildsTable.tsx | 7 ++++++-
 site/src/components/Resources/Resources.tsx     | 8 +++++++-
 3 files changed, 18 insertions(+), 2 deletions(-)

diff --git a/site/src/components/AppLink/AppLink.tsx b/site/src/components/AppLink/AppLink.tsx
index 9fd5d087be38b..4837acc53ec2d 100644
--- a/site/src/components/AppLink/AppLink.tsx
+++ b/site/src/components/AppLink/AppLink.tsx
@@ -38,6 +38,7 @@ export const AppLink: FC<AppLinkProps> = ({ userName, workspaceName, appName, ap
       <Button
         size="small"
         startIcon={appIcon ? <img alt={`${appName} Icon`} src={appIcon} /> : <ComputerIcon />}
+        className={styles.button}
       >
         {appName}
       </Button>
@@ -49,4 +50,8 @@ const useStyles = makeStyles(() => ({
   link: {
     textDecoration: "none !important",
   },
+
+  button: {
+    whiteSpace: "nowrap",
+  },
 }))
diff --git a/site/src/components/BuildsTable/BuildsTable.tsx b/site/src/components/BuildsTable/BuildsTable.tsx
index b5a9c7a8923d5..1a282b4184055 100644
--- a/site/src/components/BuildsTable/BuildsTable.tsx
+++ b/site/src/components/BuildsTable/BuildsTable.tsx
@@ -79,7 +79,9 @@ export const BuildsTable: FC<BuildsTableProps> = ({ builds, className }) => {
                   </span>
                 </TableCellLink>
                 <TableCellLink to={buildPageLink}>
-                  <span style={{ color: status.color }}>{status.status}</span>
+                  <span style={{ color: status.color }} className={styles.status}>
+                    {status.status}
+                  </span>
                 </TableCellLink>
                 <TableCellLink to={buildPageLink}>
                   <div className={styles.arrowCell}>
@@ -126,4 +128,7 @@ const useStyles = makeStyles((theme) => ({
   arrowCell: {
     display: "flex",
   },
+  status: {
+    whiteSpace: "nowrap",
+  },
 }))
diff --git a/site/src/components/Resources/Resources.tsx b/site/src/components/Resources/Resources.tsx
index 55d9e4ba07429..119de5240167a 100644
--- a/site/src/components/Resources/Resources.tsx
+++ b/site/src/components/Resources/Resources.tsx
@@ -100,7 +100,9 @@ export const Resources: FC<ResourcesProps> = ({
                       {agent.name}
                       <div className={styles.agentInfo}>
                         <span className={styles.operatingSystem}>{agent.operating_system}</span>
-                        <span style={{ color: agentStatus.color }}>{agentStatus.status}</span>
+                        <span style={{ color: agentStatus.color }} className={styles.status}>
+                          {agentStatus.status}
+                        </span>
                       </div>
                     </TableCell>
                     <TableCell>
@@ -182,4 +184,8 @@ const useStyles = makeStyles((theme) => ({
     flexWrap: "wrap",
     justifyContent: "flex-end",
   },
+
+  status: {
+    whiteSpace: "nowrap",
+  },
 }))

From 7c17b8be43df54aab586fd6c0480b0db12a0394c Mon Sep 17 00:00:00 2001
From: Bruno <bruno@coder.com>
Date: Wed, 20 Jul 2022 16:43:22 +0000
Subject: [PATCH 2/2] fix: AppLink stories

---
 site/src/components/AppLink/AppLink.stories.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/site/src/components/AppLink/AppLink.stories.tsx b/site/src/components/AppLink/AppLink.stories.tsx
index 1b67d439784e6..b008905ef6c9d 100644
--- a/site/src/components/AppLink/AppLink.stories.tsx
+++ b/site/src/components/AppLink/AppLink.stories.tsx
@@ -14,7 +14,7 @@ WithIcon.args = {
   userName: "developer",
   workspaceName: MockWorkspace.name,
   appName: "code-server",
-  appIcon: "/code.svg",
+  appIcon: "/icon/code.svg",
 }
 
 export const WithoutIcon = Template.bind({})