fix(desktop): set userSelect to text instead of auto to fix an issue (l…

…oft-sh#1472) where users were not able to select text in DevPod Desktop
janekbaraniewski · Dec 13, 2024 · 3092dd6 · 3092dd6
1 parent f835c0b
commit 3092dd6
Show file tree

Hide file tree

Showing 7 changed files with 10 additions and 10 deletions.
diff --git a/desktop/src/Theme/theme.ts b/desktop/src/Theme/theme.ts
@@ -41,7 +41,7 @@ const Link = defineStyleConfig({
 const FormError = defineStyleConfig({
   baseStyle: {
     text: {
-      userSelect: "auto",
+      userSelect: "text",
       cursor: "text",
     },
   },
@@ -71,10 +71,10 @@ export const theme = extendTheme({
           cursor: "default",
         },
         td: {
-          userSelect: "auto",
+          userSelect: "text",
         },
         code: {
-          userSelect: "auto",
+          userSelect: "text",
           cursor: "text",
         },
         "input::placeholder": {

diff --git a/desktop/src/components/Error/ErrorMessageBox.tsx b/desktop/src/components/Error/ErrorMessageBox.tsx
@@ -14,7 +14,7 @@ export function ErrorMessageBox({ error, ...boxProps }: TErrorMessageBox) {
       borderRadius="md"
       display="inline-block"
       {...boxProps}>
-      <Text userSelect="auto" cursor="text" color={textColor} fontFamily="monospace">
+      <Text userSelect="text" cursor="text" color={textColor} fontFamily="monospace">
         {error.message.split("\n").map((line, index) => (
           <React.Fragment key={index}>
             {line}

diff --git a/desktop/src/components/Warning/WarningMessageBox.tsx b/desktop/src/components/Warning/WarningMessageBox.tsx
@@ -42,7 +42,7 @@ export function WarningMessageBox({
             borderRadius: "md",
           }
         : {})}
-      userSelect="auto"
+      userSelect="text"
       display="inline-block">
       <Text color={textColor} fontSize={fontSize}>
         {warning}

diff --git a/desktop/src/views/Pro/CreateWorkspace/InfrastructureTemplateInput.tsx b/desktop/src/views/Pro/CreateWorkspace/InfrastructureTemplateInput.tsx
@@ -319,7 +319,7 @@ function OptionFormField({
       {exists(optionError) ? (
         <FormErrorMessage>{optionError.message?.toString() ?? "Error"}</FormErrorMessage>
       ) : (
-        exists(description) && <FormHelperText userSelect="auto">{description}</FormHelperText>
+        exists(description) && <FormHelperText userSelect="text">{description}</FormHelperText>
       )}
 
       {input}

diff --git a/desktop/src/views/Providers/AddProvider/OptionFormField.tsx b/desktop/src/views/Providers/AddProvider/OptionFormField.tsx
@@ -177,7 +177,7 @@ export function OptionFormField({
       {exists(optionError) ? (
         <FormErrorMessage>{optionError.message?.toString() ?? "Error"}</FormErrorMessage>
       ) : (
-        exists(description) && <FormHelperText userSelect="auto">{description}</FormHelperText>
+        exists(description) && <FormHelperText userSelect="text">{description}</FormHelperText>
       )}
     </FormControl>
   )

diff --git a/desktop/src/views/Workspaces/CreateWorkspace/ProviderOptionsPopover.tsx b/desktop/src/views/Workspaces/CreateWorkspace/ProviderOptionsPopover.tsx
@@ -196,7 +196,7 @@ function ProviderOptionList({ options }: TProviderOptionListProps) {
                 width="full"
                 overflowX="hidden"
                 color={valueColor}
-                userSelect="auto"
+                userSelect="text"
                 _hover={{ overflow: "visible", cursor: "text" }}>
                 {option.enum.find((e) => e.value === value)?.displayName ?? value}
               </Text>
@@ -208,7 +208,7 @@ function ProviderOptionList({ options }: TProviderOptionListProps) {
                 width="full"
                 overflowX="hidden"
                 color={valueColor}
-                userSelect="auto"
+                userSelect="text"
                 _hover={{ overflow: "visible", cursor: "text" }}>
                 {value}
               </Text>

diff --git a/desktop/src/views/Workspaces/WorkspaceCard.tsx b/desktop/src/views/Workspaces/WorkspaceCard.tsx
@@ -220,7 +220,7 @@ export function WorkspaceCard({ workspaceID, isSelected, onSelectionChange }: TW
                 <Text
                   fontSize="sm"
                   color="gray.500"
-                  userSelect="auto"
+                  userSelect="text"
                   maxWidth="30rem"
                   overflow="hidden"
                   whiteSpace="nowrap"