diff --git a/packages/grafana-ui/src/components/Button/Button.tsx b/packages/grafana-ui/src/components/Button/Button.tsx
index 3a78e354a9b..c71f4c92247 100644
--- a/packages/grafana-ui/src/components/Button/Button.tsx
+++ b/packages/grafana-ui/src/components/Button/Button.tsx
@@ -205,13 +205,14 @@ export const getButtonStyles = (props: StyleProps) => {
       : css({
           marginRight: theme.spacing(padding / 2),
         }),
-    content: css`
-      display: flex;
-      flex-direction: row;
-      align-items: center;
-      white-space: nowrap;
-      height: 100%;
-    `,
+    content: css({
+      display: 'flex',
+      flexDirection: 'row',
+      alignItems: 'center',
+      whiteSpace: 'nowrap',
+      overflow: 'hidden',
+      height: '100%',
+    }),
   };
 };
 
diff --git a/public/app/core/components/NestedFolderPicker/NestedFolderList.tsx b/public/app/core/components/NestedFolderPicker/NestedFolderList.tsx
index 7c8dedc630f..8e83126abfc 100644
--- a/public/app/core/components/NestedFolderPicker/NestedFolderList.tsx
+++ b/public/app/core/components/NestedFolderPicker/NestedFolderList.tsx
@@ -116,8 +116,8 @@ function Row({ index, style: virtualStyles, data }: RowProps) {
         onKeyDown={handleKeyDown}
       />
 
-      <Indent level={level} />
       <div className={styles.rowBody}>
+        <Indent level={level} />
         {foldersAreOpenable ? (
           <IconButton
             size={CHEVRON_SIZE}
@@ -150,7 +150,8 @@ const getStyles = (theme: GrafanaTheme2) => {
     alignItems: 'center',
     flexGrow: 1,
     gap: theme.spacing(0.5),
-    paddingLeft: theme.spacing(1),
+    overflow: 'hidden',
+    padding: theme.spacing(0, 1),
   });
 
   return {
@@ -163,14 +164,6 @@ const getStyles = (theme: GrafanaTheme2) => {
       paddingLeft: `calc(${getSvgSize(CHEVRON_SIZE)}px + ${theme.spacing(0.5)})`,
     }),
 
-    headerRow: css({
-      backgroundColor: theme.colors.background.secondary,
-      height: ROW_HEIGHT,
-      lineHeight: ROW_HEIGHT + 'px',
-      margin: 0,
-      paddingLeft: theme.spacing(3.5),
-    }),
-
     row: css({
       display: 'flex',
       position: 'relative',
@@ -210,6 +203,10 @@ const getStyles = (theme: GrafanaTheme2) => {
     label: css({
       lineHeight: ROW_HEIGHT + 'px',
       flexGrow: 1,
+      minWidth: 0,
+      overflow: 'hidden',
+      textOverflow: 'ellipsis',
+      whiteSpace: 'nowrap',
       '&:hover': {
         textDecoration: 'underline',
         cursor: 'pointer',
diff --git a/public/app/core/components/NestedFolderPicker/NestedFolderPicker.tsx b/public/app/core/components/NestedFolderPicker/NestedFolderPicker.tsx
index e468cb8ad68..ce9faf8820a 100644
--- a/public/app/core/components/NestedFolderPicker/NestedFolderPicker.tsx
+++ b/public/app/core/components/NestedFolderPicker/NestedFolderPicker.tsx
@@ -6,6 +6,7 @@ import { useAsync } from 'react-use';
 
 import { GrafanaTheme2 } from '@grafana/data';
 import { Alert, Button, FilterInput, LoadingBar, useStyles2 } from '@grafana/ui';
+import { Text } from '@grafana/ui/src/components/Text/Text';
 import { skipToken, useGetFolderQuery } from 'app/features/browse-dashboards/api/browseDashboardsAPI';
 import { listFolders, PAGE_SIZE } from 'app/features/browse-dashboards/api/services';
 import { createFlatTree } from 'app/features/browse-dashboards/state';
@@ -141,8 +142,8 @@ export function NestedFolderPicker({ value, onChange }: NestedFolderPickerProps)
     offset: [0, 0],
     trigger: 'click',
     onVisibleChange: (value: boolean) => {
-      // Clear search state when closing the overlay
-      if (!value) {
+      // ensure search state is clean on opening the overlay
+      if (value) {
         setSearch('');
       }
       setOverlayOpen(value);
@@ -167,7 +168,13 @@ export function NestedFolderPicker({ value, onChange }: NestedFolderPickerProps)
         icon={value !== undefined ? 'folder' : undefined}
         ref={setTriggerRef}
       >
-        {selectedFolder.isLoading ? <Skeleton width={100} /> : label ?? 'Select folder'}
+        {selectedFolder.isLoading ? (
+          <Skeleton width={100} />
+        ) : (
+          <Text as="span" truncate>
+            {label ?? 'Select folder'}
+          </Text>
+        )}
       </Button>
     );
   }