Add API key field to covidcast imports

src/api/EpiData.ts

@@ -112,6 +112,7 @@ export function loadDataSet(
   fixedParams: Record<string, unknown>,
   userParams: Record<string, unknown>,
   columns: string[],
+  api_key = '',
 ): Promise<DataGroup | null> {
   const duplicates = get(expandedDataGroups).filter((d) => d.title == title);
   if (duplicates.length > 0) {
@@ -124,7 +125,11 @@ export function loadDataSet(
       )
       .then(() => null);
   }
-  const url = new URL(ENDPOINT + `/${endpoint}/`);
+  let url_string = ENDPOINT + `/${endpoint}/`;
+  if (api_key !== '') {
+    url_string += `?api_key=${api_key}`;
+  }
+  const url = new URL(url_string);
   const params = cleanParams(userParams);
   Object.entries(fixedParams).forEach(([key, value]) => {
     url.searchParams.set(key, String(value));
@@ -150,8 +155,12 @@ export function loadDataSet(
     });
 }
 
-export function fetchCOVIDcastMeta(): Promise<{ geo_type: string; signal: string; data_source: string }[]> {
-  const url = new URL(ENDPOINT + `/covidcast_meta/`);
+export function fetchCOVIDcastMeta(api_key = ''): Promise<{ geo_type: string; signal: string; data_source: string }[]> {
+  let url_string = ENDPOINT + `/covidcast_meta/`;
+  if (api_key !== '') {
+    url_string += `?api_key=${api_key}`;
+  }
+  const url = new URL(url_string);
   url.searchParams.set('format', 'json');
   return fetchImpl<{ geo_type: string; signal: string; data_source: string }[]>(url).catch((error) => {
     console.warn('failed fetching data', error);
@@ -179,12 +188,14 @@ export function importCOVIDcast({
   geo_value,
   signal,
   time_type = 'day',
+  api_key,
 }: {
   data_source: string;
   signal: string;
   time_type?: 'day';
   geo_type: string;
   geo_value: string;
+  api_key: string;
 }): Promise<DataGroup | null> {
   const title = `[API] Delphi CODIDcast: ${geo_value} ${signal} (${data_source})`;
   return loadDataSet(
@@ -196,6 +207,7 @@ export function importCOVIDcast({
     },
     { data_source, signal, time_type, geo_type, geo_value },
     ['value', 'stderr', 'sample_size'],
+    api_key,
   );
 }
 

src/components/dialogs/dataSources/COVIDcast.svelte

@@ -7,6 +7,7 @@
 
   export let id: string;
 
+  let api_key = '';
   let data_source = '';
   let signal = '';
   let geo_type = '';
@@ -23,34 +24,41 @@
     }
   }
 
-  onMount(() => {
-    fetchCOVIDcastMeta().then((res) => {
-      geoTypes = [...new Set(res.map((d) => d.geo_type))];
-      const byDataSource = new Map<string, LabelValue & { signals: string[] }>();
-      for (const row of res) {
-        const ds = byDataSource.get(row.data_source);
-        if (!ds) {
-          byDataSource.set(row.data_source, {
-            label: row.data_source,
-            value: row.data_source,
-            signals: [row.signal],
-          });
-        } else if (!ds.signals.includes(row.signal)) {
-          ds.signals.push(row.signal);
+  function fetchMetadata() {
+    fetchCOVIDcastMeta((api_key = api_key)).then((res) => {
+      if (res.length !== 0) {
+        geoTypes = [...new Set(res.map((d) => d.geo_type))];
+        const byDataSource = new Map<string, LabelValue & { signals: string[] }>();
+        for (const row of res) {
+          const ds = byDataSource.get(row.data_source);
+          if (!ds) {
+            byDataSource.set(row.data_source, {
+              label: row.data_source,
+              value: row.data_source,
+              signals: [row.signal],
+            });
+          } else if (!ds.signals.includes(row.signal)) {
+            ds.signals.push(row.signal);
+          }
         }
+        byDataSource.forEach((entry) => {
+          entry.signals.sort();
+        });
+        dataSources = [...byDataSource.values()].sort((a, b) => a.value.localeCompare(b.value));
       }
-      byDataSource.forEach((entry) => {
-        entry.signals.sort();
-      });
-      dataSources = [...byDataSource.values()].sort((a, b) => a.value.localeCompare(b.value));
     });
+  }
+
+  onMount(() => {
+    fetchMetadata();
   });
 
   export function importDataSet() {
-    return importCOVIDcast({ data_source, signal, geo_type, geo_value });
+    return importCOVIDcast({ data_source, signal, geo_type, geo_value, api_key });
   }
 </script>
 
+<TextField id="{id}-api" label="API Key" name="api_key" on_change={() => fetchMetadata()} bind:value={api_key} />
 <SelectField id="{id}-r" label="Data Source" name="data_source" bind:value={data_source} options={dataSources} />
 <SelectField id="{id}-r" label="Data Signal" name="signal" bind:value={signal} options={dataSignals} />
 <SelectField id="{id}-gt" label="Geographic Type" bind:value={geo_type} name="geo_type" options={geoTypes} />

src/components/dialogs/inputs/TextField.svelte

@@ -5,11 +5,12 @@
   export let value: string;
   export let placeholder = '';
   export let required = true;
+  export let on_change: () => void = () => {};
 </script>
 
 <div>
   <label class="uk-form-label" for={id}>{label}</label>
   <div class="uk-form-controls">
-    <input type="text" class="uk-input" {name} {required} {id} bind:value {placeholder} />
+    <input type="text" class="uk-input" {name} {required} {id} bind:value on:change={on_change} {placeholder} />
   </div>
 </div>