From 2b750c7a2e7b80e3a91855610e3a91e6293e205f Mon Sep 17 00:00:00 2001
From: Jon Ayers <jon@coder.com>
Date: Fri, 15 Sep 2023 01:14:19 +0000
Subject: [PATCH 1/3] chore: move workspace cleanup out of experimental

---
 .../components/DeploySettingsLayout/Badges.tsx   | 16 ++++++++++++++++
 site/src/components/Form/Form.tsx                |  5 ++++-
 .../TemplateScheduleForm.tsx                     |  4 ++++
 3 files changed, 24 insertions(+), 1 deletion(-)

diff --git a/site/src/components/DeploySettingsLayout/Badges.tsx b/site/src/components/DeploySettingsLayout/Badges.tsx
index 5c32fcd8f133a..8abf917853eac 100644
--- a/site/src/components/DeploySettingsLayout/Badges.tsx
+++ b/site/src/components/DeploySettingsLayout/Badges.tsx
@@ -85,6 +85,15 @@ export const EnterpriseBadge: FC = () => {
   );
 };
 
+export const AlphaBadge: FC = () => {
+  const styles = useStyles();
+  return (
+    <span className={combineClasses([styles.badge, styles.alphaBadge])}>
+      Alpha
+    </span>
+  );
+};
+
 export const Badges: FC<PropsWithChildren> = ({ children }) => {
   const styles = useStyles();
   return (
@@ -123,6 +132,13 @@ const useStyles = makeStyles((theme) => ({
     border: `1px solid ${theme.palette.info.light}`,
   },
 
+  alphaBadge: {
+    border: `1px solid ${theme.palette.error.light}`,
+    backgroundColor: theme.palette.error.dark,
+    display: "inline",
+    marginLeft: "10px",
+  },
+
   versionBadge: {
     border: `1px solid ${theme.palette.success.light}`,
     backgroundColor: theme.palette.success.dark,
diff --git a/site/src/components/Form/Form.tsx b/site/src/components/Form/Form.tsx
index 7779ddbf5824e..a0687d28297fb 100644
--- a/site/src/components/Form/Form.tsx
+++ b/site/src/components/Form/Form.tsx
@@ -1,4 +1,5 @@
 import { makeStyles } from "@mui/styles";
+import { AlphaBadge } from "components/DeploySettingsLayout/Badges";
 import {
   FormFooterProps as BaseFormFooterProps,
   FormFooter as BaseFormFooter,
@@ -67,8 +68,9 @@ export const FormSection: FC<
       sectionInfo?: string;
       infoTitle?: string;
     };
+    alpha?: boolean;
   }
-> = ({ children, title, description, classes = {} }) => {
+> = ({ children, title, description, classes = {}, alpha = false }) => {
   const formContext = useContext(FormContext);
   const styles = useStyles(formContext);
 
@@ -87,6 +89,7 @@ export const FormSection: FC<
           ])}
         >
           {title}
+          {alpha ? <AlphaBadge /> : null}
         </h2>
         <div className={styles.formSectionInfoDescription}>{description}</div>
       </div>
diff --git a/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/TemplateScheduleForm.tsx b/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/TemplateScheduleForm.tsx
index f52ac32db3ebd..e651b0134214d 100644
--- a/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/TemplateScheduleForm.tsx
+++ b/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/TemplateScheduleForm.tsx
@@ -36,6 +36,7 @@ import {
   calculateAutostopRequirementDaysValue,
   convertAutostopRequirementDaysValue,
 } from "./AutostopRequirementHelperText";
+import { AlphaBadge } from "components/DeploySettingsLayout/Badges";
 
 const MS_HOUR_CONVERSION = 3600000;
 const MS_DAY_CONVERSION = 86400000;
@@ -464,6 +465,7 @@ export const TemplateScheduleForm: FC<TemplateScheduleForm> = ({
           <FormSection
             title="Failure Cleanup"
             description="When enabled, Coder will attempt to stop workspaces that are in a failed state after a specified number of days."
+            alpha={true}
           >
             <FormFields>
               <FormControlLabel
@@ -492,6 +494,7 @@ export const TemplateScheduleForm: FC<TemplateScheduleForm> = ({
           <FormSection
             title="Dormancy Threshold"
             description="When enabled, Coder will mark workspaces as dormant after a period of time with no connections. Dormant workspaces can be auto-deleted (see below) or manually reviewed by the workspace owner or admins."
+            alpha={true}
           >
             <FormFields>
               <FormControlLabel
@@ -524,6 +527,7 @@ export const TemplateScheduleForm: FC<TemplateScheduleForm> = ({
           <FormSection
             title="Dormancy Auto-Deletion"
             description="When enabled, Coder will permanently delete dormant workspaces after a period of time. Once a workspace is deleted it cannot be recovered."
+            alpha={true}
           >
             <FormFields>
               <FormControlLabel

From e5176c54cc85b3eff72e07a2d6bf90bb62ea3f0f Mon Sep 17 00:00:00 2001
From: Jon Ayers <jon@coder.com>
Date: Wed, 20 Sep 2023 21:55:37 +0000
Subject: [PATCH 2/3] fix css

---
 site/src/components/DeploySettingsLayout/Badges.tsx |  2 --
 site/src/components/Form/Form.tsx                   | 10 +++++++++-
 2 files changed, 9 insertions(+), 3 deletions(-)

diff --git a/site/src/components/DeploySettingsLayout/Badges.tsx b/site/src/components/DeploySettingsLayout/Badges.tsx
index 8abf917853eac..41de522f0cff8 100644
--- a/site/src/components/DeploySettingsLayout/Badges.tsx
+++ b/site/src/components/DeploySettingsLayout/Badges.tsx
@@ -135,8 +135,6 @@ const useStyles = makeStyles((theme) => ({
   alphaBadge: {
     border: `1px solid ${theme.palette.error.light}`,
     backgroundColor: theme.palette.error.dark,
-    display: "inline",
-    marginLeft: "10px",
   },
 
   versionBadge: {
diff --git a/site/src/components/Form/Form.tsx b/site/src/components/Form/Form.tsx
index a0687d28297fb..b487050513484 100644
--- a/site/src/components/Form/Form.tsx
+++ b/site/src/components/Form/Form.tsx
@@ -85,11 +85,12 @@ export const FormSection: FC<
         <h2
           className={combineClasses([
             styles.formSectionInfoTitle,
+            alpha && styles.formSectionInfoTitleAlpha,
             classes.infoTitle,
           ])}
         >
           {title}
-          {alpha ? <AlphaBadge /> : null}
+          {alpha && <AlphaBadge />}
         </h2>
         <div className={styles.formSectionInfoDescription}>{description}</div>
       </div>
@@ -174,6 +175,13 @@ const useStyles = makeStyles((theme) => ({
     marginBottom: theme.spacing(1),
   },
 
+  formSectionInfoTitleAlpha: {
+    display: "flex",
+    flexDirection: "row",
+    alignItems: "center",
+    gap: theme.spacing(1.5),
+  },
+
   formSectionInfoDescription: {
     fontSize: 14,
     color: theme.palette.text.secondary,

From a424db1a739189c9c296756f2f802bddc17154e0 Mon Sep 17 00:00:00 2001
From: Jon Ayers <jon@coder.com>
Date: Wed, 20 Sep 2023 22:04:59 +0000
Subject: [PATCH 3/3] lint

---
 .../TemplateSchedulePage/TemplateScheduleForm.tsx          | 7 +++----
 1 file changed, 3 insertions(+), 4 deletions(-)

diff --git a/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/TemplateScheduleForm.tsx b/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/TemplateScheduleForm.tsx
index e651b0134214d..818ea0657eda3 100644
--- a/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/TemplateScheduleForm.tsx
+++ b/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/TemplateScheduleForm.tsx
@@ -36,7 +36,6 @@ import {
   calculateAutostopRequirementDaysValue,
   convertAutostopRequirementDaysValue,
 } from "./AutostopRequirementHelperText";
-import { AlphaBadge } from "components/DeploySettingsLayout/Badges";
 
 const MS_HOUR_CONVERSION = 3600000;
 const MS_DAY_CONVERSION = 86400000;
@@ -465,7 +464,7 @@ export const TemplateScheduleForm: FC<TemplateScheduleForm> = ({
           <FormSection
             title="Failure Cleanup"
             description="When enabled, Coder will attempt to stop workspaces that are in a failed state after a specified number of days."
-            alpha={true}
+            alpha
           >
             <FormFields>
               <FormControlLabel
@@ -494,7 +493,7 @@ export const TemplateScheduleForm: FC<TemplateScheduleForm> = ({
           <FormSection
             title="Dormancy Threshold"
             description="When enabled, Coder will mark workspaces as dormant after a period of time with no connections. Dormant workspaces can be auto-deleted (see below) or manually reviewed by the workspace owner or admins."
-            alpha={true}
+            alpha
           >
             <FormFields>
               <FormControlLabel
@@ -527,7 +526,7 @@ export const TemplateScheduleForm: FC<TemplateScheduleForm> = ({
           <FormSection
             title="Dormancy Auto-Deletion"
             description="When enabled, Coder will permanently delete dormant workspaces after a period of time. Once a workspace is deleted it cannot be recovered."
-            alpha={true}
+            alpha
           >
             <FormFields>
               <FormControlLabel