github.com/filecoin-project/bacalhau@v0.3.23-0.20230228154132-45c989550ace/dashboard/frontend/src/components/job/OutputVolumes.tsx (about) 1 import React, { FC} from 'react' 2 import { SxProps } from '@mui/system' 3 import Stack from '@mui/material/Stack' 4 import Box from '@mui/material/Box' 5 import { 6 StorageSpec, 7 RunCommandResult, 8 } from '../../types' 9 import FilPlus from './FilPlus' 10 11 const OutputVolumes: FC<{ 12 outputVolumes: StorageSpec[], 13 publishedResults?: StorageSpec, 14 includeDatacap?: boolean, 15 sx?: SxProps, 16 }> = ({ 17 outputVolumes = [], 18 publishedResults, 19 includeDatacap = false, 20 sx = {}, 21 }) => { 22 return ( 23 <Stack direction="row"> 24 { 25 includeDatacap && ( 26 <Box 27 component="div" 28 sx={{ 29 mr: 1, 30 }} 31 > 32 <FilPlus /> 33 </Box> 34 ) 35 } 36 <Box 37 component="div" 38 sx={{ 39 ...sx 40 }} 41 > 42 { 43 publishedResults && ( 44 <li> 45 <span 46 style={{ 47 fontSize: '0.8em', 48 color: '#333', 49 }} 50 > 51 <a target="_blank" href={ `https://ipfs.io/ipfs/${publishedResults.CID}` }> 52 all 53 </a> 54 </span> 55 </li> 56 ) 57 } 58 { 59 outputVolumes.map((storageSpec) => { 60 return ( 61 <li key={storageSpec.Name}> 62 <span 63 style={{ 64 fontSize: '0.8em', 65 color: '#333', 66 }} 67 > 68 { 69 publishedResults ? ( 70 <a target="_blank" href={ `https://ipfs.io/ipfs/${publishedResults.CID}${storageSpec.path}` }> 71 { storageSpec.Name }:{ storageSpec.path } 72 </a> 73 ) : ( 74 <span> 75 { storageSpec.Name }:{ storageSpec.path } 76 </span> 77 ) 78 } 79 80 </span> 81 </li> 82 ) 83 }) 84 } 85 </Box> 86 </Stack> 87 ) 88 } 89 90 export default OutputVolumes