-
Notifications
You must be signed in to change notification settings - Fork 1
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat: wire up front end to download service
- Loading branch information
Showing
10 changed files
with
208 additions
and
161 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,3 +1,4 @@ | ||
VITE_FIREBASE_CONFIG={...} | ||
VITE_DISCOVER_KEY= | ||
VITE_WEB_API_KEY= | ||
VITE_DOWNLOAD_URL= |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -122,6 +122,7 @@ | |
"VITE", | ||
"wksh", | ||
"woodside", | ||
"wrappity", | ||
"wstrn", | ||
"wstrn no", | ||
"xlsxwriter", | ||
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,69 +1,64 @@ | ||
import PropTypes from 'prop-types'; | ||
import { useRef } from 'react'; | ||
import { fieldNames } from '../../../functions/common/config'; | ||
import Icon from '../../utah-design-system/Icon'; | ||
import ResultStatusIcons from './ResultStatusIcons'; | ||
import Tag from '../Tag'; | ||
|
||
export default function DownloadProgress({ layers, results }) { | ||
const anchorTagRefs = useRef(new Map()); | ||
import Spinner from '../../utah-design-system/Spinner'; | ||
|
||
/** | ||
* @param {Object} props | ||
* @param {import('../../../functions/common/config').QueryLayerConfig[]} props.layers | ||
* @param {string} props.url | ||
* @param {Error} [props.error] | ||
* @returns {JSX.Element} | ||
*/ | ||
export default function DownloadProgress({ layers, url, error }) { | ||
return ( | ||
<> | ||
<h3>Download Results</h3> | ||
<ul> | ||
{layers.map((searchLayer) => { | ||
const tableName = searchLayer[fieldNames.queryLayers.tableName]; | ||
const resultConfig = results.find( | ||
(result) => result.tableName === tableName, | ||
); | ||
const layerName = searchLayer[fieldNames.queryLayers.layerName]; | ||
|
||
return ( | ||
<li key={tableName} className="mb-1"> | ||
<div className="flex items-center justify-start"> | ||
<ResultStatusIcons | ||
resultConfig={resultConfig} | ||
layerName={layerName} | ||
/> | ||
<span className="leading-5"> | ||
{layerName} | ||
{resultConfig?.features ? ( | ||
<Tag>{resultConfig.features.length.toLocaleString()}</Tag> | ||
) : null} | ||
</span> | ||
<span className="leading-5">{layerName}</span> | ||
</div> | ||
{resultConfig?.url ? ( | ||
<a | ||
ref={(node) => { | ||
if (node) { | ||
anchorTagRefs.current.set(tableName, node); | ||
} else { | ||
anchorTagRefs.current.delete(tableName); | ||
} | ||
}} | ||
href={resultConfig.url} | ||
download={resultConfig.url.substring( | ||
resultConfig.url.lastIndexOf('/') + 1, | ||
)} | ||
className="flex items-center justify-center rounded-md border-2 border-success-500 p-1 font-bold text-success-500" | ||
> | ||
<Icon className="mr-2" name="arrowDown" label="download" />{' '} | ||
download | ||
</a> | ||
) : null} | ||
</li> | ||
); | ||
})} | ||
</ul> | ||
<p className="mt-4"> | ||
This can take up to several minutes for larger datasets. | ||
</p> | ||
{url ? ( | ||
<a | ||
href={url} | ||
download={url.substring(url.lastIndexOf('/') + 1)} | ||
className="mt-4 flex items-center justify-center rounded-md border-2 border-success-500 p-1 font-bold text-success-500" | ||
> | ||
<Icon className="mr-2" name="arrowDown" label="download" /> download | ||
</a> | ||
) : error ? ( | ||
<p className="mt-4 flex align-middle text-error-500"> | ||
<Icon | ||
name="error" | ||
className="mr-1" | ||
label="error message" | ||
size="3xl" | ||
/> | ||
There was an error downloading the data: {error.message} | ||
</p> | ||
) : ( | ||
<> | ||
<p className="mt-4"> | ||
This can take up to several minutes for larger datasets. | ||
</p> | ||
<div className="flex items-center justify-center"> | ||
<Spinner | ||
ariaLabel="downloading activity indicator" | ||
size="custom" | ||
className="h-14 w-14" | ||
/> | ||
</div> | ||
</> | ||
)} | ||
</> | ||
); | ||
} | ||
|
||
DownloadProgress.propTypes = { | ||
layers: PropTypes.arrayOf(PropTypes.object).isRequired, | ||
results: PropTypes.arrayOf(PropTypes.object), | ||
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.