X-Git-Url: https://git.arvados.org/arvados.git/blobdiff_plain/27d2ca4c2691cad55993f25a4427d48e86ec6166..2a7fd99c212c33a1ec9911f8529fa5afc59a7bb2:/src/views-components/webdav-s3-dialog/webdav-s3-dialog.tsx diff --git a/src/views-components/webdav-s3-dialog/webdav-s3-dialog.tsx b/src/views-components/webdav-s3-dialog/webdav-s3-dialog.tsx index 2c92e28de4..a32044a711 100644 --- a/src/views-components/webdav-s3-dialog/webdav-s3-dialog.tsx +++ b/src/views-components/webdav-s3-dialog/webdav-s3-dialog.tsx @@ -2,20 +2,29 @@ // // SPDX-License-Identifier: AGPL-3.0 -import * as React from "react"; +import React from "react"; import { Dialog, DialogActions, Button, StyleRulesCallback, WithStyles, withStyles, CardHeader, Tab, Tabs } from '@material-ui/core'; -import { withDialog } from "~/store/dialog/with-dialog"; -import { COLLECTION_WEBDAV_S3_DIALOG_NAME, WebDavS3InfoDialogData } from '~/store/collections/collection-info-actions'; -import { WithDialogProps } from '~/store/dialog/with-dialog'; +import { withDialog } from "store/dialog/with-dialog"; +import { COLLECTION_WEBDAV_S3_DIALOG_NAME, WebDavS3InfoDialogData } from 'store/collections/collection-info-actions'; +import { WithDialogProps } from 'store/dialog/with-dialog'; import { compose } from 'redux'; -import { DetailsAttribute } from "~/components/details-attribute/details-attribute"; +import { DetailsAttribute } from "components/details-attribute/details-attribute"; +import { DownloadIcon } from "components/icon/icon"; +import { DefaultCodeSnippet } from "components/default-code-snippet/default-code-snippet"; -type CssRules = 'details'; +export type CssRules = 'details' | 'downloadButton' | 'detailsAttrValWithCode'; const styles: StyleRulesCallback = theme => ({ details: { marginLeft: theme.spacing.unit * 3, marginRight: theme.spacing.unit * 3, + }, + downloadButton: { + marginTop: theme.spacing.unit * 2, + }, + detailsAttrValWithCode: { + display: "flex", + alignItems: "center", } }); @@ -40,6 +49,60 @@ function TabPanel(props: TabPanelData) { ); } +const isValidIpAddress = (ipAddress: string): Boolean => { + if (/^(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)$/.test(ipAddress)) { + return true; + } + + return false; +}; + +const mountainduckTemplate = ({ + uuid, + username, + cyberDavStr, + collectionsUrl +}: any) => { + + return ` + + + + Protocol + davs + Provider + iterate GmbH + UUID + ${uuid} + Hostname + ${collectionsUrl.replace('https://', ``).replace('*', uuid).split(':')[0]} + Port + ${(cyberDavStr.split(':')[2] || '443').split('/')[0]} + Username + ${username}${isValidIpAddress(collectionsUrl.replace('https://', ``).split(':')[0]) ? + ` + Path + /c=${uuid}` : ''} + Labels + + + + `.split(/\r?\n/).join('\n'); +}; + +const downloadMountainduckFileHandler = (filename: string, text: string) => { + const element = document.createElement('a'); + element.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(text)); + element.setAttribute('download', filename); + + element.style.display = 'none'; + document.body.appendChild(element); + + element.click(); + + document.body.removeChild(element); +}; + export const WebDavS3InfoDialog = compose( withDialog(COLLECTION_WEBDAV_S3_DIALOG_NAME), withStyles(styles), @@ -47,21 +110,29 @@ export const WebDavS3InfoDialog = compose( (props: WithDialogProps & WithStyles) => { if (!props.data.downloadUrl) { return null; } - const keepwebUrl = props.data.downloadUrl.replace(/\/\*(--[^.]+)?\./, "/"); + let winDav; + let cyberDav; - const winDav = new URL(props.data.downloadUrl.replace("*", props.data.uuid)); + if (props.data.collectionsUrl.indexOf("*") > -1) { + const withuuid = props.data.collectionsUrl.replace("*", props.data.uuid); + winDav = new URL(withuuid); + cyberDav = new URL(withuuid); + } else { + winDav = new URL(props.data.downloadUrl); + cyberDav = new URL(props.data.downloadUrl); + winDav.pathname = `/c=${props.data.uuid}`; + cyberDav.pathname = `/c=${props.data.uuid}`; + } - const gnomeDav = new URL(keepwebUrl); - gnomeDav.username = props.data.username; - gnomeDav.pathname = `/c=${props.data.uuid}/`; - gnomeDav.protocol = "davs:"; + cyberDav.username = props.data.username; + const cyberDavStr = "dav" + cyberDav.toString().slice(4); - const s3endpoint = new URL(keepwebUrl); + const s3endpoint = new URL(props.data.collectionsUrl.replace(/\/\*(--[^.]+)?\./, "/")); const sp = props.data.token.split("/"); let tokenUuid; let tokenSecret; - if (sp.length === 3 && sp[0] === "v2" && props.data.homeCluster === props.data.localCluster) { + if (sp.length === 3 && sp[0] === "v2" && sp[1].slice(0, 5) === props.data.localCluster) { tokenUuid = sp[1]; tokenSecret = sp[2]; } else { @@ -69,30 +140,37 @@ export const WebDavS3InfoDialog = compose( tokenSecret = tokenUuid; } + const isCollection = (props.data.uuid.indexOf("-4zz18-") === 5); + + let activeTab = props.data.activeTab; + if (!isCollection) { + activeTab = 2; + } + + const wgetCommand = `wget --http-user=${props.data.username} --http-passwd=${props.data.token} --mirror --no-parent --no-host --cut-dirs=0 ${winDav.toString()}`; + const curlCommand = `curl -O -u ${props.data.username}:${props.data.token} ${winDav.toString()}`; + return + title={`Open with 3rd party client`} />
- - - - + + {isCollection && } + {isCollection && } + + {isCollection && } - -
    -
  1. Open File Explorer
    2. -
  2. Click on "This PC", then go to Computer → Add a Network Location
    3. -
  3. Click Next, then choose "Add a custom network location", then click Next
    4. -
+ +

Settings

{winDav.toString()}} copyValue={winDav.toString()} /> - - +

Windows

    -
  1. Open Files
    2. -
  2. Select +Other Locations
    3. -
  3. Connect to Server → Enter server address
    4. +
  4. Open File Explorer
    5. +
  5. Click on "This PC", then go to Computer → Add a Network Location
    6. +
  6. Click Next, then choose "Add a custom network location", then click Next
    7. +
  7. Use the "internet address" and credentials listed under Settings, above
+

MacOS

+
    +
  1. Open Finder
    2. +
  2. Click Go → Connect to server
    3. +
  3. Use the "internet address" and credentials listed under Settings, above
    4. +
+ + + + label='Server' + value={{cyberDavStr}} + copyValue={cyberDavStr} /> + + + +

Cyberduck/Mountain Duck

+ + + +

GNOME

+
    +
  1. Open Files
    2. +
  2. Select +Other Locations
    3. +
  3. Connect to Server → Enter server address
    4. +
+ - + + + + + + + + + + + +

+ Note: This curl command downloads single files. + Append the desired filename to the end of the URL. +

+ + +
+ ;