diff --git a/components/CDPUserDashboard.tsx b/components/CDPUserDashboard.tsx index 0bd2d81..683504a 100644 --- a/components/CDPUserDashboard.tsx +++ b/components/CDPUserDashboard.tsx @@ -1,5 +1,12 @@ import React, { useEffect, useState } from 'react' -import { Alert, Badge, ListGroup, ListGroupItem } from 'react-bootstrap' +import { + Alert, + Badge, + ListGroup, + ListGroupItem, + Tab, + Tabs +} from 'react-bootstrap' import { WithAuth0Props, withAuth0 } from '@auth0/auth0-react' import { secureFetch } from '../util/middleware' @@ -40,6 +47,41 @@ const CDPZip = (props: CDPZipProps): JSX.Element => ( ) +/** Component which renders a list of CDP files */ +const FileListing = ({ + cdpUser, + downloadedFiles, + files, + setCurrentlyDownloadingFile +}: { + cdpUser?: CDPUser + downloadedFiles: string[] + files: CDPFile[] + setCurrentlyDownloadingFile: (file: string) => void +}): JSX.Element => + files?.length === 0 ? ( + + Loading... + + ) : ( + + {files?.map((file: CDPFile) => { + const fakeDownloadedAt = + downloadedFiles.includes(file.key) && Date.now() + return ( + + ) + })} + + ) + /** * The high-level component visible to a CDPUser when they log in. This * lists the s3 files the user is able to access, and presents some instructional info. @@ -109,36 +151,46 @@ const CDPUserDashboard = (props: Props): JSX.Element => { // Negative sorts "reverse alphabetically" which allows newest files to appear first .sort((a: CDPFile, b: CDPFile) => -a.key.localeCompare(b.key)) + // wanted either filters out or only includes survey responses + const isSurveyResponse = (wanted: boolean) => (file: CDPFile) => + file.key.includes('survey-response') === wanted + const surveyResponses = files.filter(isSurveyResponse(true)) + return ( - <> -

Raw Request Data Download

-

- These zip files contain anonymized OTP requests for the date(s) - indicated. -

- - {files?.length === 0 && ( - - Loading... - + + +

+ These zip files contain anonymized OTP requests for the date and time + indicated. +

+ +
+ {surveyResponses.length > 0 && ( + +

+ Select a date to download all survey responses from that date. + Individual csv files are individual user responses. +

+ + // Sort by the number of slashes in the key name so that merged responses (not in subfolders) + // appear first. + (a.key.match(/\//g) || []).length - + (b.key.match(/\//g) || []).length + )} + setCurrentlyDownloadingFile={setCurrentlyDownloadingFile} + /> +
)} - - {files?.map((file: CDPFile) => { - const fakeDownloadedAt = - downloadedFiles.includes(file.key) && Date.now() - return ( - - ) - })} - - +
) } diff --git a/util/ui.ts b/util/ui.ts index a9d5e33..bf5e39a 100644 --- a/util/ui.ts +++ b/util/ui.ts @@ -98,8 +98,9 @@ export const getActiveUserTypes = (): { * Able to handle all the date/time formats that are generated by the CDP. */ export const getDateFromCDPFileName = (filename: string): string => { - const date = filename.split('-anon-trip-data')?.[0].split('/')?.[1] - if (!date) return filename + const TRIP_DATA_SUFFIX = '-anon-trip-data' + const date = filename.split(TRIP_DATA_SUFFIX)?.[0].split('/')?.[1] + if (!date || !filename.includes(TRIP_DATA_SUFFIX)) return filename const parsedDate = getDateOnlyFromCDPFileName(date) || getDateAndTimeFromCDPFileName(date) diff --git a/yarn.lock b/yarn.lock index f88a54e..e8e45a5 100644 --- a/yarn.lock +++ b/yarn.lock @@ -4966,9 +4966,9 @@ camelize@^1.0.0: integrity sha1-FkpUg+Yw+kMh5a8HAg5TGDGyYJs= caniuse-lite@^1.0.30001111, caniuse-lite@^1.0.30001173, caniuse-lite@^1.0.30001283, caniuse-lite@^1.0.30001286: - version "1.0.30001309" - resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001309.tgz#e0ee78b9bec0704f67304b00ff3c5c0c768a9f62" - integrity sha512-Pl8vfigmBXXq+/yUz1jUwULeq9xhMJznzdc/xwl4WclDAuebcTHVefpz8lE/bMI+UN7TOkSSe7B7RnZd6+dzjA== + version "1.0.30001374" + resolved "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001374.tgz" + integrity sha512-mWvzatRx3w+j5wx/mpFN5v5twlPrabG8NqX2c6e45LCpymdoGqNvRkRutFUqpRTXKFQFNQJasvK0YT7suW6/Hw== cardinal@^2.1.1: version "2.1.1"