From 6ac4f4ef2fbd7c717a41f33ae511a54f3e10f098 Mon Sep 17 00:00:00 2001
From: Kamil Gabryjelski <kamil.gabryjelski@gmail.com>
Date: Mon, 9 Aug 2021 17:50:11 +0200
Subject: [PATCH] chore(explore): change dnd placeholders (#16116)

* chore(explore): change dnd placeholders

* Fix tests and lint
---
 .../DndColumnSelectControl/DndColumnSelect.test.tsx       | 2 +-
 .../controls/DndColumnSelectControl/DndColumnSelect.tsx   | 3 ++-
 .../DndColumnSelectControl/DndFilterSelect.test.tsx       | 8 ++++----
 .../controls/DndColumnSelectControl/DndFilterSelect.tsx   | 2 +-
 .../DndColumnSelectControl/DndMetricSelect.test.tsx       | 4 ++--
 .../controls/DndColumnSelectControl/DndMetricSelect.tsx   | 4 ++--
 .../DndColumnSelectControl/DndSelectLabel.test.tsx        | 2 +-
 .../controls/DndColumnSelectControl/DndSelectLabel.tsx    | 2 +-
 8 files changed, 14 insertions(+), 13 deletions(-)

diff --git a/superset-frontend/src/explore/components/controls/DndColumnSelectControl/DndColumnSelect.test.tsx b/superset-frontend/src/explore/components/controls/DndColumnSelectControl/DndColumnSelect.test.tsx
index 3a1325875c..93d00a7059 100644
--- a/superset-frontend/src/explore/components/controls/DndColumnSelectControl/DndColumnSelect.test.tsx
+++ b/superset-frontend/src/explore/components/controls/DndColumnSelectControl/DndColumnSelect.test.tsx
@@ -29,7 +29,7 @@ const defaultProps: LabelProps = {
 
 test('renders with default props', () => {
   render(<DndColumnSelect {...defaultProps} />, { useDnd: true });
-  expect(screen.getByText('Drop columns')).toBeInTheDocument();
+  expect(screen.getByText('Drop columns here')).toBeInTheDocument();
 });
 
 test('renders with value', () => {
diff --git a/superset-frontend/src/explore/components/controls/DndColumnSelectControl/DndColumnSelect.tsx b/superset-frontend/src/explore/components/controls/DndColumnSelectControl/DndColumnSelect.tsx
index e8f64db146..46b3889fdd 100644
--- a/superset-frontend/src/explore/components/controls/DndColumnSelectControl/DndColumnSelect.tsx
+++ b/superset-frontend/src/explore/components/controls/DndColumnSelectControl/DndColumnSelect.tsx
@@ -143,7 +143,8 @@ export const DndColumnSelect = (props: LabelProps) => {
       accept={DndItemType.Column}
       displayGhostButton={multi || optionSelector.values.length === 0}
       ghostButtonText={
-        ghostButtonText || tn('Drop column', 'Drop columns', multi ? 2 : 1)
+        ghostButtonText ||
+        tn('Drop column here', 'Drop columns here', multi ? 2 : 1)
       }
       {...props}
     />
diff --git a/superset-frontend/src/explore/components/controls/DndColumnSelectControl/DndFilterSelect.test.tsx b/superset-frontend/src/explore/components/controls/DndColumnSelectControl/DndFilterSelect.test.tsx
index bf7d135b78..bddb80a9aa 100644
--- a/superset-frontend/src/explore/components/controls/DndColumnSelectControl/DndFilterSelect.test.tsx
+++ b/superset-frontend/src/explore/components/controls/DndColumnSelectControl/DndFilterSelect.test.tsx
@@ -38,7 +38,7 @@ const defaultProps = {
 
 test('renders with default props', () => {
   render(<DndFilterSelect {...defaultProps} />, { useDnd: true });
-  expect(screen.getByText('Drop columns or metrics')).toBeInTheDocument();
+  expect(screen.getByText('Drop columns or metrics here')).toBeInTheDocument();
 });
 
 test('renders with value', () => {
@@ -56,7 +56,7 @@ test('renders options with saved metric', () => {
   render(<DndFilterSelect {...defaultProps} formData={['saved_metric']} />, {
     useDnd: true,
   });
-  expect(screen.getByText('Drop columns or metrics')).toBeInTheDocument();
+  expect(screen.getByText('Drop columns or metrics here')).toBeInTheDocument();
 });
 
 test('renders options with column', () => {
@@ -76,7 +76,7 @@ test('renders options with column', () => {
       useDnd: true,
     },
   );
-  expect(screen.getByText('Drop columns or metrics')).toBeInTheDocument();
+  expect(screen.getByText('Drop columns or metrics here')).toBeInTheDocument();
 });
 
 test('renders options with adhoc metric', () => {
@@ -87,5 +87,5 @@ test('renders options with adhoc metric', () => {
   render(<DndFilterSelect {...defaultProps} formData={[adhocMetric]} />, {
     useDnd: true,
   });
-  expect(screen.getByText('Drop columns or metrics')).toBeInTheDocument();
+  expect(screen.getByText('Drop columns or metrics here')).toBeInTheDocument();
 });
diff --git a/superset-frontend/src/explore/components/controls/DndColumnSelectControl/DndFilterSelect.tsx b/superset-frontend/src/explore/components/controls/DndColumnSelectControl/DndFilterSelect.tsx
index dc7e892e3f..66849b2d1f 100644
--- a/superset-frontend/src/explore/components/controls/DndColumnSelectControl/DndFilterSelect.tsx
+++ b/superset-frontend/src/explore/components/controls/DndColumnSelectControl/DndFilterSelect.tsx
@@ -374,7 +374,7 @@ export const DndFilterSelect = (props: DndFilterSelectProps) => {
         canDrop={canDrop}
         valuesRenderer={valuesRenderer}
         accept={DND_ACCEPTED_TYPES}
-        ghostButtonText={t('Drop columns or metrics')}
+        ghostButtonText={t('Drop columns or metrics here')}
         {...props}
       />
       <AdhocFilterPopoverTrigger
diff --git a/superset-frontend/src/explore/components/controls/DndColumnSelectControl/DndMetricSelect.test.tsx b/superset-frontend/src/explore/components/controls/DndColumnSelectControl/DndMetricSelect.test.tsx
index 51fb9aac3b..71cf4bf548 100644
--- a/superset-frontend/src/explore/components/controls/DndColumnSelectControl/DndMetricSelect.test.tsx
+++ b/superset-frontend/src/explore/components/controls/DndColumnSelectControl/DndMetricSelect.test.tsx
@@ -31,10 +31,10 @@ const defaultProps = {
 
 test('renders with default props', () => {
   render(<DndMetricSelect {...defaultProps} />, { useDnd: true });
-  expect(screen.getByText('Drop column or metric')).toBeInTheDocument();
+  expect(screen.getByText('Drop column or metric here')).toBeInTheDocument();
 });
 
 test('renders with default props and multi = true', () => {
   render(<DndMetricSelect {...defaultProps} multi />, { useDnd: true });
-  expect(screen.getByText('Drop columns or metrics')).toBeInTheDocument();
+  expect(screen.getByText('Drop columns or metrics here')).toBeInTheDocument();
 });
diff --git a/superset-frontend/src/explore/components/controls/DndColumnSelectControl/DndMetricSelect.tsx b/superset-frontend/src/explore/components/controls/DndColumnSelectControl/DndMetricSelect.tsx
index 77dbfa3285..ed32e1b907 100644
--- a/superset-frontend/src/explore/components/controls/DndColumnSelectControl/DndMetricSelect.tsx
+++ b/superset-frontend/src/explore/components/controls/DndColumnSelectControl/DndMetricSelect.tsx
@@ -334,8 +334,8 @@ export const DndMetricSelect = (props: any) => {
         valuesRenderer={valuesRenderer}
         accept={DND_ACCEPTED_TYPES}
         ghostButtonText={tn(
-          'Drop column or metric',
-          'Drop columns or metrics',
+          'Drop column or metric here',
+          'Drop columns or metrics here',
           multi ? 2 : 1,
         )}
         displayGhostButton={multi || value.length === 0}
diff --git a/superset-frontend/src/explore/components/controls/DndColumnSelectControl/DndSelectLabel.test.tsx b/superset-frontend/src/explore/components/controls/DndColumnSelectControl/DndSelectLabel.test.tsx
index d6090e2a26..d9689d7e8d 100644
--- a/superset-frontend/src/explore/components/controls/DndColumnSelectControl/DndSelectLabel.test.tsx
+++ b/superset-frontend/src/explore/components/controls/DndColumnSelectControl/DndSelectLabel.test.tsx
@@ -33,7 +33,7 @@ const defaultProps = {
 
 test('renders with default props', async () => {
   render(<DndSelectLabel {...defaultProps} />, { useDnd: true });
-  expect(await screen.findByText('Drop columns')).toBeInTheDocument();
+  expect(await screen.findByText('Drop columns here')).toBeInTheDocument();
 });
 
 test('renders ghost button when empty', async () => {
diff --git a/superset-frontend/src/explore/components/controls/DndColumnSelectControl/DndSelectLabel.tsx b/superset-frontend/src/explore/components/controls/DndColumnSelectControl/DndSelectLabel.tsx
index daaeb91852..7ffdb175e2 100644
--- a/superset-frontend/src/explore/components/controls/DndColumnSelectControl/DndSelectLabel.tsx
+++ b/superset-frontend/src/explore/components/controls/DndColumnSelectControl/DndSelectLabel.tsx
@@ -55,7 +55,7 @@ export default function DndSelectLabel<T, O>({
     return (
       <AddControlLabel cancelHover>
         <Icons.PlusSmall iconColor={theme.colors.grayscale.light1} />
-        {t(props.ghostButtonText || 'Drop columns')}
+        {t(props.ghostButtonText || 'Drop columns here')}
       </AddControlLabel>
     );
   }