fix: prevent unintentional sidebar text selection (#8895)

* fix(frontend): make entire sidebar non-selectable, clean up redundant select-none, keep cursor-default on headers/labels

* [autofix.ci] apply automated fixes

---------

Co-authored-by: autofix-ci[bot] <114827586+autofix-ci[bot]@users.noreply.github.com>
Co-authored-by: Edwin Jose <edwin.jose@datastax.com>
Co-authored-by: Cristhian Zanforlin Lousa <cristhian.lousa@gmail.com>

src/frontend/src/App.css

@@ -217,3 +217,9 @@ code {
 .cm-gutters {
   display: none !important;
 }
+
+.user-select-none {
+  user-select: none;
+  -webkit-user-select: none;
+  -ms-user-select: none;
+}

src/frontend/src/pages/FlowPage/components/flowSidebarComponent/components/bundleItems/index.tsx

@@ -48,7 +48,7 @@ export const BundleItem = memo(
               <div
                 tabIndex={0}
                 onKeyDown={(e) => handleKeyDownInput(e, item.name)}
-                className="flex cursor-pointer items-center gap-2"
+                className="user-select-none flex cursor-pointer items-center gap-2"
                 data-testid={`disclosure-bundles-${item.display_name.toLowerCase()}`}
               >
                 <ForwardedIconComponent

src/frontend/src/pages/FlowPage/components/flowSidebarComponent/components/categoryDisclouse/index.tsx

@@ -61,7 +61,7 @@ export const CategoryDisclosure = memo(function CategoryDisclosure({
               data-testid={`disclosure-${item.display_name.toLocaleLowerCase()}`}
               tabIndex={0}
               onKeyDown={handleKeyDownInput}
-              className="flex cursor-pointer items-center gap-2"
+              className="user-select-none flex cursor-pointer items-center gap-2"
             >
               <ForwardedIconComponent
                 name={item.icon}

src/frontend/src/pages/FlowPage/components/flowSidebarComponent/components/featureTogglesComponent/index.tsx

@@ -29,7 +29,7 @@ const FeatureToggles = ({
       {toggles.map((toggle) => (
         <div key={toggle.label} className="flex items-center justify-between">
           <div className="flex items-center space-x-2">
-            <span className="flex gap-2 text-sm font-medium">
+            <span className="flex cursor-default gap-2 text-sm font-medium">
               Show
               <Badge variant={toggle.badgeVariant} size="xq">
                 {toggle.label}

src/frontend/src/pages/FlowPage/components/flowSidebarComponent/components/sidebarBundles/index.tsx

@@ -33,7 +33,9 @@ export const MemoizedSidebarGroup = memo(
 
     return (
       <SidebarGroup className="p-3">
-        <SidebarGroupLabel>Bundles</SidebarGroupLabel>
+        <SidebarGroupLabel className="cursor-default">
+          Bundles
+        </SidebarGroupLabel>
         <SidebarGroupContent>
           <SidebarMenu>
             {sortedBundles.map((item) => (

src/frontend/src/pages/FlowPage/components/flowSidebarComponent/components/sidebarHeader/index.tsx

@@ -39,7 +39,9 @@ export const SidebarHeaderComponent = memo(function SidebarHeaderComponent({
           <SidebarTrigger className="text-muted-foreground">
             <ForwardedIconComponent name="PanelLeftClose" />
           </SidebarTrigger>
-          <h3 className="flex-1 text-sm font-semibold">Components</h3>
+          <h3 className="flex-1 cursor-default text-sm font-semibold">
+            Components
+          </h3>
           <DisclosureTrigger>
             <div>
               <ShadTooltip content="Component settings" styleClasses="z-50">

src/frontend/src/pages/FlowPage/components/flowSidebarComponent/index.tsx

@@ -291,7 +291,7 @@ export function FlowSidebarComponent({ isLoading }: FlowSidebarComponentProps) {
     <Sidebar
       collapsible="offcanvas"
       data-testid="shad-sidebar"
-      className="noflow"
+      className="noflow select-none"
     >
       <SidebarHeaderComponent
         showConfig={showConfig}