From 6984267d0f70f080bc1e1e6397b2377145e3cae2 Mon Sep 17 00:00:00 2001
From: srichman333 <sarah_n_richman@brown.edu>
Date: Fri, 28 Jul 2023 12:13:52 -0400
Subject: DataVizBox from 'tools' instructions

---
 src/client/views/nodes/DataVizBox/DataVizBox.scss | 4 ++++
 src/client/views/nodes/DataVizBox/DataVizBox.tsx  | 6 +++++-
 2 files changed, 9 insertions(+), 1 deletion(-)

(limited to 'src/client/views')

diff --git a/src/client/views/nodes/DataVizBox/DataVizBox.scss b/src/client/views/nodes/DataVizBox/DataVizBox.scss
index 32c0bbfc1..ab2f19726 100644
--- a/src/client/views/nodes/DataVizBox/DataVizBox.scss
+++ b/src/client/views/nodes/DataVizBox/DataVizBox.scss
@@ -8,3 +8,7 @@
         flex-direction: row;
     }
 }
+.start-message {
+    margin: 10px;
+    align-self: baseline;
+}
diff --git a/src/client/views/nodes/DataVizBox/DataVizBox.tsx b/src/client/views/nodes/DataVizBox/DataVizBox.tsx
index 4ddebb833..d5e21ce0e 100644
--- a/src/client/views/nodes/DataVizBox/DataVizBox.tsx
+++ b/src/client/views/nodes/DataVizBox/DataVizBox.tsx
@@ -136,7 +136,11 @@ export class DataVizBox extends ViewBoxAnnotatableComponent<FieldViewProps>() {
     render() {
         if (!this.layoutDoc._dataVizView) this.layoutDoc._dataVizView = this.dataVizView;
         return !this.pairs?.length ? (
-            <div>Loading...</div>
+            <div className="start-message">
+                To create a DataViz box, either import / drag a CSV file into your canvas
+                or copy a data table and use the command 'ctrl + t' to bring the data table
+                to your canvas.
+            </div>
         ) : (
             <div
                 className="dataViz"
-- 
cgit v1.2.3-70-g09d2