tweak language around the app (#1470)

Author: jsladerman

www/src/components/create-cluster/CreateCluster.tsx

@@ -166,7 +166,7 @@ export function CreateCluster() {
         </SidebarWrapperSC>
         <ContentWrapperSC>
           <ContentHeaderSC>
-            <span css={theme.partials.text.title2}>Create Cluster</span>
+            <span css={theme.partials.text.title2}>Create Plural instance</span>
             <Button
               secondary
               startIcon={<SendMessageIcon />}

www/src/components/create-cluster/steps/ChooseCloudStep.tsx

@@ -31,15 +31,15 @@ export function ChooseCloudStep() {
           icon={<CloudIcon size={40} />}
           chip={<Chip>Free Plan</Chip>}
           header="Deploy Yourself"
-          description="Host your control plane in your own cloud."
+          description="Host your management plane in your own cloud."
         />
         <CloudOption
           selected={cloudOption === 'cloud'}
           onClick={() => setCloudOption('cloud')}
           icon={<ConsoleIcon size={40} />}
           chip={<Chip severity="info">Pro Plan</Chip>}
           header="Use Plural Cloud"
-          description="Host your control plane in a Plural Cloud instance."
+          description="Host your management plane in a Plural Cloud instance."
         />
       </Flex>
       {cloudOption === 'cloud' &&

www/src/components/create-cluster/steps/ConfigureCloudInstanceStep.tsx

@@ -94,15 +94,15 @@ export function ConfigureCloudInstanceStep() {
           to deploy. It will run in the background as you proceed.
         </Callout>
         <FormFieldSC
-          label="Cluster name"
+          label="Instance name"
           hint={
             showNameError && (
               <ValidationHintSC>{nameErrorMessage}</ValidationHintSC>
             )
           }
         >
           <Input
-            placeholder="Enter cluster name"
+            placeholder="Enter instance name"
             borderColor={
               name === '' || isNameValid
                 ? undefined
@@ -112,7 +112,7 @@ export function ConfigureCloudInstanceStep() {
             onChange={(e) => setName(e.target.value.trim())}
           />
         </FormFieldSC>
-        <FormFieldSC label="Cluster size">
+        <FormFieldSC label="Instance size">
           <Select
             selectedKey={size}
             onSelectionChange={(size) => setSize(size as ConsoleSize)}
@@ -131,11 +131,11 @@ export function ConfigureCloudInstanceStep() {
       <Confirm
         open={confirm}
         error={error}
-        title={`Create cluster`}
-        text={`Would you like to proceed with cluster creation?`}
+        title="Create cloud instance"
+        text="Would you like to proceed with cloud instance creation?"
         submit={() => mutation()}
         close={() => setConfirm(false)}
-        label="Create cluster"
+        label="Create cloud instance"
         loading={loading}
       />
     </>

www/src/components/create-cluster/steps/InstallCliStep.tsx

@@ -13,7 +13,7 @@ export function InstallCliStep() {
     >
       {cloudOption === 'cloud' && (
         <Callout title="The next two steps are in your local terminal">
-          This will help to setup and properly configure the control plane and
+          This will help to setup and properly configure the management plane and
           Plural Cloud instance with your local environment.
         </Callout>
       )}

www/src/components/layout/Sidebar.tsx

@@ -47,13 +47,13 @@ type MenuItem = {
 
 const MENU_ITEMS: MenuItem[] = [
   {
-    text: 'Clusters',
+    text: 'Management planes',
     icon: <ClusterIcon />,
     path: '/overview',
     pathRegexp: /^\/(overview|clusters|apps)/,
   },
   {
-    text: 'Cloud Shell',
+    text: 'Cloud shell',
     icon: <TerminalIcon />,
     path: '/shell',
     pathRegexp: /^\/(shell|oauth\/callback\/.+\/shell)/,

www/src/components/overview/OverviewHeader.tsx

@@ -7,7 +7,7 @@ import { LinkTabWrap } from '../utils/Tabs'
 
 const DIRECTORY = [
   { path: '/overview/clusters/all', label: 'All' },
-  { path: '/overview/clusters/self-hosted', label: 'Self-hosted clusters' },
+  { path: '/overview/clusters/self-hosted', label: 'Self-hosted instances' },
   { path: '/overview/clusters/plural-cloud', label: 'Plural cloud instances' },
 ]
 

www/src/components/overview/clusters/ClusterListEmptyState.tsx

@@ -24,13 +24,13 @@ export function ClusterListEmptyState() {
           textAlign="center"
         >
           <Title2H1 css={{ fontWeight: 400 }}>
-            Create your first cluster
+            Create your first Plural instance
           </Title2H1>
           <Body2P
             $color="text-light"
             css={{ maxWidth: 450 }}
           >
-            Once you create your first cluster, you will find an overview of its
+            Once you create your first management plane, you will find an overview of its
             details here.
           </Body2P>
         </Flex>
@@ -39,7 +39,7 @@ export function ClusterListEmptyState() {
           to="/create-cluster"
           style={{ maxWidth: 300, width: '100%' }}
         >
-          {showUnfinished ? 'Resume cluster creation' : 'Create cluster'}
+          {showUnfinished ? 'Resume instance creation' : 'Create new Plural instance'}
         </Button>
         {showUnfinished && (
           <Button
@@ -48,7 +48,7 @@ export function ClusterListEmptyState() {
             css={{ maxWidth: 300, width: '100%' }}
             onClick={triggerDelete}
           >
-            Cancel cluster creation
+            Cancel instance creation
           </Button>
         )}
       </CreateClusterCardSC>

www/src/components/overview/clusters/Clusters.tsx

@@ -115,7 +115,7 @@ export function Clusters(): ReactElement | null {
             first="Welcome to Plural"
             firstPartialType="title2"
             firstColor="text"
-            second="To get started with Plural, create your first management cluster."
+            second="To get started with Plural, create your first management plane."
             secondPartialType="body2"
             gap="small"
             css={{ '& *': { fontWeight: 400, fontFamily: 'Inter' } }}
@@ -126,7 +126,7 @@ export function Clusters(): ReactElement | null {
               as={Link}
               to="/create-cluster"
             >
-              Create cluster
+              Create new Plural instance
             </Button>
           )}
         </Flex>

www/src/components/overview/clusters/self-hosted/SelfHostedClusters.tsx

@@ -24,7 +24,7 @@ export function SelfHostedClusters() {
     <Table
       data={selfHostedClusters}
       columns={columns}
-      emptyStateProps={{ message: 'No self-hosted clusters found' }}
+      emptyStateProps={{ message: 'No self-hosted instances found' }}
       onRowClick={(_, { original }: Row<ClusterListElement>) =>
         original.accessible && navigate(`/clusters/${original.id}`)
       }