diff --git a/packages/data-portal-explore/src/components/FileTable.tsx b/packages/data-portal-explore/src/components/FileTable.tsx index 30ecd3cf..e4befab4 100644 --- a/packages/data-portal-explore/src/components/FileTable.tsx +++ b/packages/data-portal-explore/src/components/FileTable.tsx @@ -9,6 +9,7 @@ import classNames from 'classnames'; import { faDownload, faExternalLinkAlt, + faLockOpen, } from '@fortawesome/free-solid-svg-icons'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; @@ -66,41 +67,89 @@ function generateCdsManifestFile(files: Entity[]): string | undefined { } } +const FilenameWithAccessIcon: React.FunctionComponent<{ + file: Entity; +}> = (props) => { + return ( + <> + {props.file.downloadSource === DownloadSourceCategory.dbgap ? ( + '🔒' + ) : ( + + )}{' '} + {getFileBase(props.file.Filename)} + {'\n'} + + ); +}; + +const CDSFileList: React.FunctionComponent<{ + files: Entity[]; +}> = (props) => { + return ( +
+            
+                {props.files.map((f) => (
+                    
+                ))}
+            
+        
+ ); +}; + const CDSInstructions: React.FunctionComponent<{ files: Entity[]; }> = (props) => { const manifestFile = generateCdsManifestFile(props.files); + const dbgapFiles = props.files.filter( + (f) => f.downloadSource === DownloadSourceCategory.dbgap + ); - return ( + const manifestInstructions = ( + <> + you can import this manifest file into CGC following the + instructions{' '} + + here + + . + + ); + + const dbgapInstructions = ( <>

- Your selection includes Level 1 and/or Level 2 sequencing and/or - imaging data: + Your selection includes Level 1 and/or Level 2 sequencing data + (🔒):

-
-                
-                    {props.files.map((f) => getFileBase(f.Filename)).join('\n')}
-                
-            
+

- To download Level 1/2 sequencing/imaging data you first need to - request{' '} + To download Level 1/2 sequencing data you first need to request{' '} dbGaP {' '} - access. Afterwards you can import this manifest file into CGC - following the instructions{' '} - - here - - . + access. Afterwards {manifestInstructions}

+ + ); + + const openAccessInstructions = ( + <> + +

To download selected files {manifestInstructions}

+ + ); + + return ( + <> + {dbgapFiles.length > 0 && dbgapInstructions} + {dbgapFiles.length === 0 && openAccessInstructions} {manifestFile?.length && (