chore: update api key, string fields only for interaction

Author: Chris DeMartini

src/App.js

@@ -576,18 +576,12 @@ class App extends Component {
   }
 
   componentDidMount() {
-    const _this = this;
     window.addEventListener('resize', this.resize, true);
     this.resize();
 
     tableauExt
       .initializeAsync({configure: this.configure})
       .then(() => {
-        return fetch('https://mapsconfig.tableau.com/v1/config.json');
-      })
-      .then(response => {
-        return response.json();
-      }).then((configJson) => {
         // console.log('tableau config', configJson);
         // default tableau settings on initial entry into the extension
         // we know if we haven't done anything yet when tableauSettings state = []
@@ -629,8 +623,9 @@ class App extends Component {
         // Initialize the current saved settings global
         TableauSettings.init();
 
+        // default to uber's Kepler key that they requested if user does not enter
         this.setState({
-          tableauKey: (configJson.access_token || []).token,
+          tableauKey: 'pk.eyJ1IjoidWJlcmRhdGEiLCJhIjoiY2p2OGVvejQwMDJxZzRma2dvdWQ2OTQwcSJ9.VbuIamTa_JayuD2yr5tjaA',
           isLoading: false,
           height: window.innerHeight,
           width: window.innerWidth,
@@ -742,7 +737,7 @@ class App extends Component {
               customCallBack={this.customCallBack}
               field={'configuration'}
               tableauSettings={tableauSettingsState}
-              configSheetColumns={this.state.ConfigSheetColumns || []}
+              configSheetColumns={this.state.ConfigSheetStringColumns || []}
             />
             <StepButtons
               onNextClick={this.onNextStep}

src/components/Configuration/CustomScreen.js

@@ -68,8 +68,8 @@ class CustomScreen extends React.Component {
             <OptionTitle style={{paddingLeft: "8px"}}>{this.props.configTitle}</OptionTitle>
             <FormControl className={classes.formControl}>
               <InputLabelWithTooltip
-                title="Mapbox API Key"
-                tooltipText="Your unique API key for utilizing mapbox"
+                title="Optional: Mapbox API Key"
+                tooltipText="Optional: Your unique API key for utilizing mapbox"
               />
               <TextField
                 // className={classes.textField}
@@ -131,7 +131,7 @@ class CustomScreen extends React.Component {
             <FormControl className={classes.formControl}>
               <InputLabelWithTooltip
                     title="Hover Identifying Field"
-                    tooltipText="Select which field to take action on"
+                    tooltipText="Select which STRING field to take action on (we require string for interaction)"
                   />
               <Select
                 value={tableauSettings.hoverField || "None"}
@@ -164,7 +164,7 @@ class CustomScreen extends React.Component {
             <FormControl className={classes.formControl}>
               <InputLabelWithTooltip
                     title="Click Identifying Field"
-                    tooltipText="Select which field to take action on"
+                    tooltipText="Select which STRING field to take action on (we require string for interaction)"
                   />
               <Select
                 value={tableauSettings.clickField || "None"}
@@ -182,7 +182,7 @@ class CustomScreen extends React.Component {
             <FormControl className={classes.formControl}>
               <InputLabelWithTooltip
                     title="Tableau to Kepler Filter Field"
-                    tooltipText="Select which field to use when filtering Kepler"
+                    tooltipText="Select which STRING field to use when filtering Kepler (we require string for interaction)"
                   />
               <Select
                 value={tableauSettings.keplerFilterField || "None"}

src/utils/index.js

@@ -106,9 +106,16 @@ export function getSampleForTypeAnalyze({fields, rows, sampleCount = 50}) {
 }
 
 export function dataTableToKepler(table) {
-  const data = [];
+  const col_names_s = [];
   let keplerFields = table.columns.map(columnToKeplerField);
 
+  table.columns.map(column => {
+    if (column.dataType === 'string') {
+      col_names_s.push(column);
+    }
+  });
+  // console.log('checking the string fields', table, keplerFields, table.columns, col_names_s);
+
   // for string fields, we have to detect their types, because they
   // may contain geometry info
   keplerFields = analyzeStringFields(keplerFields, table.data);
@@ -121,6 +128,7 @@ export function dataTableToKepler(table) {
   return {
     isLoading: false,
     ConfigSheetColumns: table.columns,
+    ConfigSheetStringColumns: col_names_s,
     ConfigSheetData: {fields: keplerFields, rows: keplerData} //data, we need something more like tableau for kepler
   };
 }