\r\n {/* \r\n on_refresh(item.id)}\r\n />\r\n )}\r\n
\r\n )\r\n}\r\n\r\nconst RowActions = ({\r\n handleDeleteCAClick,\r\n on_show_compare,\r\n cloudAccountId,\r\n projectName,\r\n accountTypeId,\r\n item,\r\n history\r\n}) => (\r\n */}\r\n \r\n
\r\n \r\n )\r\n}\r\n\r\nconst menu =(providers)=> (\r\n \r\n)\r\n","\r\nimport React from 'react'\r\nimport FontAwesome from 'react-fontawesome'\r\nimport { Input, Button, DatePicker, Select, Tooltip } from 'antd'\r\n\r\nimport './filter-account.scss'\r\n\r\nconst { Search } = Input\r\nconst { RangePicker } = DatePicker\r\nconst { Option } = Select\r\n\r\nconst regions = [\r\n 'us-east-2',\r\n 'us-east-1',\r\n 'us-west-1',\r\n 'us-west-2',\r\n 'ca-central-1',\r\n 'ap-south-1',\r\n 'ap-northeast-2',\r\n 'ap-southeast-1',\r\n 'ap-southeast-2',\r\n 'ap-northeast-1',\r\n 'eu-central-1',\r\n 'eu-west-1',\r\n 'eu-west-2',\r\n 'eu-west-3',\r\n 'sa-east-1',\r\n 'cn-north-1',\r\n 'cn-northwest-1'\r\n]\r\n\r\nconst accounts = [\r\n 'aws',\r\n 'wasabi',\r\n 'azure'\r\n]\r\n\r\nexport default ({\r\n expanded, filter, cost, usage,\r\n handleSearch, handleAccountChange, handleRegionChange,\r\n handleCreatedChange, handleCostChange, handleUsageChange,\r\n handleCostRangeChange, handleUsageRangeChange, on_show_compare\r\n }) => (\r\n \r\n
\r\n )\r\n","\r\nimport React from 'react'\r\nimport { connect } from 'react-redux'\r\n// import AccountFilter from '../components/Hybrid/filter-account'\r\nimport AccountFilter from '../components/CloudProviders/filter-account';\r\n\r\nimport {\r\n searchAccount,\r\n selectAccount,\r\n selectRegion,\r\n selectCreated,\r\n selectCost,\r\n selectUsage,\r\n selectUsageRange,\r\n selectCostRange\r\n} from '../actions/cloud-accounts-actions'\r\n\r\nconst mapStateToProps = ({ cloudAccounts }) =>{\r\n return {\r\n ...cloudAccounts,\r\n expanded: cloudAccounts.expandedItemId !== null\r\n }\r\n}\r\n\r\nconst mapDispatchToProps = (dispatch) => ({\r\n handleSearch : search => dispatch(searchAccount(search)),\r\n handleAccountChange : selectedAccount => dispatch(selectAccount(selectedAccount)),\r\n handleRegionChange : selectedRegion => dispatch(selectRegion(selectedRegion)),\r\n handleCreatedChange : selectedCreated => dispatch(selectCreated(selectedCreated)),\r\n handleUsageChange : selectedUsage => dispatch(selectUsage(selectedUsage)),\r\n handleUsageRangeChange : selectedUsageRange => dispatch(selectUsageRange(selectedUsageRange)),\r\n handleCostChange : selectedCost => dispatch(selectCost(selectedCost)),\r\n handleCostRangeChange : selectedCostRange => dispatch(selectCostRange(selectedCostRange))\r\n})\r\n\r\n// export default connect(mapStateToProps, mapDispatchToProps)(AccountFilter)\r\nexport default connect(mapStateToProps, mapDispatchToProps)(AccountFilter)\r\n","import React from 'react'\r\nimport { Button } from 'antd'\r\nimport classnames from 'classnames'\r\nimport './styles.scss'\r\n\r\nexport default ({title, description, content, click_text, error, on_click}) => (\r\n \r\n
\r\n\r\n {\r\n expanded &&\r\n \r\n {/* */}\r\n \r\n \r\n {accounts.map((account, index) =>\r\n \r\n )}\r\n \r\n
\r\n \r\n
\r\n }\r\n\r\n \r\n \r\n
\r\n\r\n \r\n handleSearch(e.target.value)} />\r\n
\r\n \r\n \r\n
\r\n\r\n {/*\r\n \r\n \r\n {accounts.map((account, index) =>\r\n \r\n )}\r\n \r\n
\r\n \r\n \r\n
*/}\r\n \r\n {/*\r\n {filter.cost.min}\r\n
\r\n \r\n \r\n
*/}\r\n \r\n {filter.usage.min}\r\n
\r\n \r\n \r\n
\r\n \r\n \r\n
\r\n \r\n \r\n
\r\n\r\n {/*{\r\n !expanded &&\r\n \r\n \r\n \r\n {regions.map((region, index) =>\r\n \r\n )}\r\n \r\n
\r\n \r\n \r\n \r\n \r\n
\r\n }*/}\r\n \r\n
\r\n)\r\n","import React from \"react\"\r\nimport classnames from \"classnames\"\r\nimport { Modal, Icon, Tooltip, Select } from \"antd\"\r\nimport prettysize from \"../../utils\"\r\n\r\nimport BullhornIcon from \"../../assets/img/bullhorn-font-awesome.png\"\r\nimport BullhornInvertedIcon from \"../../assets/img/bullhorn-inverted-font-awesome.png\"\r\n\r\nimport PencilIcon from \"../../assets/img/edit.svg\"\r\nimport PencilInvertedIcon from \"../../assets/img/pencil-inverted-font-awesome.png\"\r\nimport TrashIcon from \"../../assets/img/trash.svg\"\r\nimport TrashInvertedIcon from \"../../assets/img/trash-o-inverted-font-awesome.png\"\r\nimport BucketIcon from \"../../assets/img/bucket.svg\"\r\n\r\nimport aws from \"../../assets/logo/Aws-icon.svg\"\r\nimport wasabi from \"../../assets/logo/Wasabi-icon.svg\"\r\nimport azure from \"../../assets/logo/Azure-icon.svg\"\r\nimport backblaze from \"../../assets/logo/Blaze-icon.svg\"\r\n\r\nimport google from \"../../assets/img/storage/google.png\"\r\nimport qumulo from \"../../assets/img/storage/qumulo.png\"\r\nimport BBStep1 from \"../../assets/img/billing-bucket-step1.png\"\r\nimport BBStep2 from \"../../assets/img/billing-bucket-step2.png\"\r\nimport StorageList from \"./storage-list\"\r\nimport CloudFlyerAPI from \"../../api/CloudFlyerAPI\"\r\nimport \"./account-list.scss\"\r\n\r\nconst icons = {\r\n aws: aws,\r\n google: google,\r\n qumulo: qumulo,\r\n wasabi: wasabi,\r\n azure:azure,\r\n backblaze: backblaze\r\n}\r\n\r\nlet ref = \"\"\r\n\r\nexport default ({\r\n items,\r\n filter,\r\n expandedItemId,\r\n history,\r\n handleExpandClick,\r\n handleDeleteCAClick,\r\n on_show_compare,\r\n on_bucket_refresh,\r\n bucket_refreshing\r\n}) => (\r\n \r\n \r\n {title ? title : 'No content found'}\r\n \r\n\r\n \r\n {description}\r\n \r\n
\r\n\r\n \r\n\r\n {content}\r\n \r\n on_show_compare(item)}\r\n on_refresh={on_bucket_refresh}\r\n />\r\n )\r\n })}\r\n
\r\n)\r\n\r\nconst Item = ({\r\n item,\r\n handleExpandClick,\r\n handleDeleteCAClick,\r\n on_show_compare,\r\n history,\r\n on_refresh,\r\n refreshing\r\n}) => {\r\n if (item.total_cost) {\r\n item.forecast =\r\n (item.total_cost / new Date().getDate()) *\r\n new Date(\r\n new Date().getFullYear(),\r\n new Date().getMonth() + 1,\r\n 0\r\n ).getDate()\r\n }\r\n\r\n return (\r\n \r\n
\r\n {(filter.items || items).map(item => {\r\n item.expanded = item.id === expandedItemId\r\n return (\r\n Name
\r\n {/*VMs
*/}\r\nStorage
\r\nUsage
\r\n {/*Total Costs
\r\nForecast
\r\nPer GB
*/}\r\nActions
\r\n\r\n
\r\n \r\n
{item.vm ? item.vm.running + item.vm.stopped : ''}
*/}\r\n{item.bucket_count ? item.bucket_count + \" Buckets\" : \"\"}
\r\n\r\n {item.account_type_id === \"aws\" &&\r\n !item.billing_bucket &&\r\n item.storages &&\r\n item.storages.length > 0 &&\r\n !item.expanded ? (\r\n
{item.total_cost ? ('$' + item.total_cost.toFixed(3)) : ''}
\r\n{item.total_cost ? ('$' + item.forecast.toFixed(2)) : ''}
\r\n{item.account_type_id === 'wasabi' ? '0.0049' : (item.per_gb ? ('$' + item.per_gb.toFixed(3)) : '')}
*/}\r\n {item.expanded ? (\r\n\r\n
\r\n {/* Notification Icon ----------------------------------- */}\r\n {/*
\r\n {/*
\r\n
\r\n
\r\n ),\r\n className: \"set-bb-content\",\r\n onOk() {\r\n handleSetBBSave()\r\n }\r\n })\r\n}\r\n","import React from 'react'\r\nimport prettysize from '../../utils'\r\nimport moment from 'moment'\r\nimport { Tooltip, Button } from 'antd'\r\nimport BullhornIcon from '../../assets/img/bullhorn-font-awesome.png'\r\nimport EmptyState from '../Shared/EmptyState'\r\nimport './storage-list.scss'\r\n\r\nexport default ({storages, history, on_refresh, refreshing, cloud={}}) => {\r\n console.log(\"in list\",storages);\r\n console.log(\"cloud\",cloud);\r\n return (\r\n // (!storages || storages.length === 0) ?\r\n // \r\n You need to configure a billing bucket to add the costs information to\r\n your AWS account.\r\n
\r\nBefore selecting a bucket, you must configure it manually in AWS.
\r\n\r\n \r\n
\r\n\r\n \r\n
How to manually configure billing bucket in AWS :
\r\n {/*Enable billing reports to S3 on the target AWS account from the Billing Preferences page in the AWS console:
*/}\r\n\r\n 
\r\n 
\r\n
\r\n - \r\n
- Go to the Billing Preferences page in the AWS console. \r\n
- \r\n Enable Receive Billing Reports by checking the box.\r\n \r\n
- \r\n Enter the exact name of the bucket which will receive the billing\r\n reports in the box. We recommend that you create a new empty\r\n bucket for the billing reports as many files will be created\r\n within it. Click Verify to ensure the bucket exists.
\r\n 3a. Copy the sample policy to be added to the bucket in the S3\r\n console (shown below).\r\n \r\n - Enable all report types. \r\n
- \r\n
- \r\n Click the magnifying glass icon to open the properties for the\r\n bucket you entered in step above.\r\n \r\n
- Click to Edit the bucket policy. \r\n
- Paste the sample bucket policy from step 3a above. \r\n
\r\n \r\n )}\r\n
\r\n )\r\n}\r\n\r\nconst Storage = ({ storage, history }) => (\r\n \r\n \r\n \r\n
\r\n {storages.map((storage, i) => !storage.hidden && \r\n Name
\r\nRegion
\r\nCreated
\r\n {/*Usage
*/}\r\n {/*Costs
*/}\r\n {/*Actions
*/}\r\n\r\n \r\n \r\n\r\n \r\n \r\n\r\n \r\n \r\n\r\n {/* \r\n */}\r\n\r\n {/*\r\n */}\r\n\r\n {/*
\r\n)\r\n\r\nconst RowActions = ({ history, storage }) => (\r\n {storage.name}
\r\n{storage.region}
\r\n{moment(storage.creationDate).format('MM/DD/YYYY')}
\r\n{prettysize(storage.size)}
\r\n${storage.cost ? storage.cost.toFixed(3) : 0}
\r\n\r\n \r\n
\r\n
\r\n
\r\n on_show_compare(item)}\r\n on_refresh={on_bucket_refresh}\r\n />\r\n )\r\n })}\r\n
\r\n)\r\n\r\nconst Item = ({\r\n item,\r\n handleExpandClick,\r\n handleDeleteCAClick,\r\n on_show_compare,\r\n history,\r\n on_refresh,\r\n refreshing\r\n}) => {\r\n if (item.total_cost) {\r\n item.forecast =\r\n (item.total_cost / new Date().getDate()) *\r\n new Date(\r\n new Date().getFullYear(),\r\n new Date().getMonth() + 1,\r\n 0\r\n ).getDate()\r\n }\r\n\r\n return (\r\n \r\n \r\n
\r\n\r\n Active Cloud Providers
\r\n\r\n
\r\n\r\n {(filter.items || items).map(item => {\r\n item.expanded = item.id === expandedItemId\r\n return (\r\n Name
\r\nStorage
\r\n {/*Usage
*/}\r\nActions
\r\n\r\n
{item.accountId}
*/}\r\n\r\n {\r\n item.serviceUrl === 'https://s3.filebase.com' ? :
\r\n }\r\n \r\n {/*
{item.vm ? item.vm.running + item.vm.stopped : ''}
*/}\r\n{item.bucket_count ? item.bucket_count + (item.cloudType == 4 ? \" Containers\" : \" Buckets\") : \"\"}
\r\n {/*{item.account ? item.account + \" Buckets\" : \"NO Buckets\"}
*/}\r\n\r\n\r\n\r\n {/* Usage field ================================================= */}\r\n {/*\r\n {item.account_type_id === \"aws\" &&\r\n !item.billing_bucket &&\r\n item.storages &&\r\n item.storages.length > 0 &&\r\n !item.expanded ? (\r\n
{item.total_cost ? ('$' + item.total_cost.toFixed(3)) : ''}
\r\n{item.total_cost ? ('$' + item.forecast.toFixed(2)) : ''}
\r\n{item.account_type_id === 'wasabi' ? '0.0049' : (item.per_gb ? ('$' + item.per_gb.toFixed(3)) : '')}
*/}\r\n \r\n {item.expanded ? (\r\n\r\n
\r\n {/* Notification Icon ----------------------------------- */}\r\n {/*
\r\n {/*
\r\n
\r\n
\r\n ),\r\n className: \"set-bb-content\",\r\n onOk() {\r\n handleSetBBSave()\r\n }\r\n })\r\n}\r\n","import React from 'react'\r\nimport { Spin } from 'antd'\r\n\r\nexport default () => (\r\n \r\n You need to configure a billing bucket to add the costs information to\r\n your AWS account.\r\n
\r\nBefore selecting a bucket, you must configure it manually in AWS.
\r\n\r\n \r\n
\r\n\r\n \r\n
How to manually configure billing bucket in AWS :
\r\n {/*Enable billing reports to S3 on the target AWS account from the Billing Preferences page in the AWS console:
*/}\r\n\r\n \r\n \r\n
\r\n - \r\n
- Go to the Billing Preferences page in the AWS console. \r\n
- \r\n Enable Receive Billing Reports by checking the box.\r\n \r\n
- \r\n Enter the exact name of the bucket which will receive the billing\r\n reports in the box. We recommend that you create a new empty\r\n bucket for the billing reports as many files will be created\r\n within it. Click Verify to ensure the bucket exists.
\r\n 3a. Copy the sample policy to be added to the bucket in the S3\r\n console (shown below).\r\n \r\n - Enable all report types. \r\n
- \r\n
- \r\n Click the magnifying glass icon to open the properties for the\r\n bucket you entered in step above.\r\n \r\n
- Click to Edit the bucket policy. \r\n
- Paste the sample bucket policy from step 3a above. \r\n
\r\n
\r\n );\r\n }\r\n return (\r\n items &&\r\n items.length > 0 && (\r\n // \r\n
\r\n You currently have no cloud accounts connected to CloudFlyer.
\r\nPlease add one here:
\r\n \r\n\r\n //
\r\n // ),\r\n // })\r\n // user.bypass_onboard = true\r\n // localStorage.setItem('user', JSON.stringify(user))\r\n // }\r\n }\r\n\r\n on_show_compare = () => {\r\n const { history } = this.props\r\n history.push('/cloud-compare/0')\r\n }\r\n\r\n render() {\r\n const { providers } = this.state\r\n const { match } = this.props\r\n return (\r\n Welcome to CloudFlyer!
\r\n //\r\n // We're going to help you manage your videos, files,\r\n // costs
\r\n // and cloud storage so much better!\r\n //
\r\n // 1) Simply enter your public cloud account\r\n // credentials.
\r\n // 2) Name your account.
\r\n // 3) Follow the steps to enable your billing\r\n // information.
\r\n // 4) Download ftX client to move your data faster than\r\n // ever!\r\n //
\r\n // Within seconds you will have access to each account{' '}\r\n //
\r\n // and can start managing + moving your data sets from\r\n // a single page.\r\n //
\r\n // \r\n // Security and data protection is paramount to\r\n // everyone!\r\n // \r\n //
\r\n // We have designed a security architecture that\r\n // encrypts and protects our users\r\n //
\r\n // from any exposure at all times.\r\n //
\r\n
\r\n )\r\n }\r\n}\r\n\r\nexport default withRouter(\r\n connect(\r\n ({ auth }, { match, history }) => {\r\n let user = auth.user\r\n return {\r\n ...user,\r\n }\r\n },\r\n dispatch => bindActionCreators({}, dispatch)\r\n )(Hybrid)\r\n)\r\n","\r\nimport React from 'react';\r\nimport { Progress } from 'antd';\r\n\r\nimport './eachActiveJobs.scss'\r\n\r\nexport default (props) =>{\r\n return (\r\n \r\n
\r\n \r\n
\r\n )\r\n}\r\n\r\n","\r\nimport React ,{Component} from 'react';\r\nimport { bindActionCreators } from 'redux';\r\nimport { withRouter } from 'react-router-dom';\r\nimport { connect } from 'react-redux';\r\nimport { message, Divider } from \"antd\";\r\n\r\nimport CreateJobsReport from './EachActiveJobs/eachActiveJobs';\r\n\r\nimport \"./activeJobs.scss\";\r\nclass ActiveJobsList extends Component{\r\n constructor(props) {\r\n super(props)\r\n\r\n let activeJobsReportList=[\r\n {\r\n name:'10 GB',\r\n storage: '10 GB',\r\n source: 'wasabi-rick',\r\n destination: 'aws',\r\n percentage: 63,\r\n action: 'active'\r\n },\r\n {\r\n name:'30 GB',\r\n storage: '30 GB',\r\n source: 'wasabi-rick',\r\n destination: 'azure',\r\n percentage: 80,\r\n action: 'active'\r\n },\r\n {\r\n name:'100 GB',\r\n storage: '100 GB',\r\n source: 'wasabi-rick',\r\n destination: 'genericS3',\r\n percentage: 20,\r\n action: 'pause'\r\n },\r\n\r\n ];\r\n this.state = {\r\n activeJobsReport: activeJobsReportList,\r\n }\r\n\r\n }\r\n render(){\r\n const jobsReportTableHeader = - \r\n
- {props.name} \r\n
- {props.storage} \r\n
- {props.source} \r\n
- {props.destination} \r\n \r\n
- {props.action} \r\n {/*
- \r\n
\r\n \r\n\r\n \r\n\r\n */}\r\n
- \r\n
- Name \r\n
- Storage \r\n
- Source account \r\n
- Destination \r\n
- % Transfered \r\n
- Actions \r\n
\r\n
\r\n )\r\n })\r\n return(\r\n \r\n
\r\n )\r\n }\r\n}\r\n\r\nexport default withRouter(\r\n connect(\r\n // mapStateToProps,\r\n // mapDispatchToProps\r\n )(ActiveJobsList)\r\n );","\r\nimport React ,{Component} from 'react';\r\nimport { bindActionCreators } from 'redux';\r\nimport { withRouter } from 'react-router-dom';\r\nimport { connect } from 'react-redux';\r\nimport { Progress } from \"antd\";\r\n\r\n\r\nimport \"./usage.scss\";\r\nclass Usage extends Component{\r\n constructor(props) {\r\n super(props)\r\n\r\n let usageList=[\r\n {\r\n name:'cloud to cloud',\r\n storage: '10 TB',\r\n percentage: 63,\r\n },\r\n {\r\n name:'aws to wasabi',\r\n storage: '20 TB',\r\n percentage: 80,\r\n },\r\n\r\n ];\r\n this.state = {\r\n usage: usageList,\r\n }\r\n\r\n }\r\n render(){\r\n const usageReport = this.state.usage.map((u,index)=>{\r\n return(\r\n \r\n
\r\n Active Jobs
\r\n\r\n {jobsReportTableHeader}\r\n
\r\n \r\n {ReportList}\r\n
\r\n \r\n
\r\n )\r\n })\r\n return(\r\n \r\n
\r\n {u.name}
\r\n{u.storage}
\r\n\r\n \r\n
\r\n \r\n
\r\n )\r\n }\r\n}\r\n\r\nexport default withRouter(\r\n connect(\r\n // mapStateToProps,\r\n // mapDispatchToProps\r\n )(Usage)\r\n );","\r\nimport React ,{Component} from 'react';\r\nimport { bindActionCreators } from 'redux';\r\nimport { withRouter } from 'react-router-dom';\r\nimport { connect } from 'react-redux';\r\nimport { message, Divider, Table, Tooltip, Switch } from \"antd\";\r\nimport prettysize from '../../../../src/utils';\r\nimport moment from 'moment';\r\n\r\nimport CreateTransferReport from './EachTransfer/eachTransfer';\r\nimport { on_migration_progress, clear_migration, refresh_migrations_history, aws_migrations_history,aws_migrations_retry} from \"../../../actions/migrations\";\r\nimport {refresh_rm, refresh_profile} from \"../../../actions/auth\";\r\n\r\nimport \"./recentTransfer.scss\";\r\nclass RecentTransfer extends Component{\r\n constructor(props) {\r\n super(props)\r\n \r\n this.state = {\r\n awshistory: [],\r\n user:{},\r\n migration:{},\r\n migrations:{},\r\n disabledRetry:[],\r\n downloadUrl:null,\r\n history : [],\r\n }\r\n }\r\n \r\n componentDidMount() {\r\n this.props.aws_migrations_history(3)\r\n // this.props.aws_migrations_history(this.props.user.id)\r\n // this.props.refresh_migrations_history()\r\n // this.props.refresh_rm()\r\n // this.stats_loop()\r\n }\r\n\r\n componentWillReceiveProps(props) {\r\n this.setState({migrations:props.ongoing, history:props.history, awshistory:props.awshistory, user:props.user, awsLoading:props.awsLoading})\r\n // console.log(\"migrations\", props.awshistory);\r\n }\r\n\r\n render(){\r\n // console.log(\"hi in recent trabsfer\", this.state);\r\n const { user } = this.props;\r\n let counter = 0;\r\n\r\n let {speeds, speed_stat={}, transferred_stat={}, remaining_stat={},\r\n history:{today:today_history=[], yesterday:yesterday_history=[], week:week_history=[]}={},\r\n awshistory, migrations={}, downloadUrl, awsLoading} = this.state\r\n\r\n\r\n const columns = [\r\n {\r\n title: 'Source',\r\n dataIndex: 'source',\r\n key: 'source',\r\n ellipsis: {\r\n showTitle: false,\r\n }, \r\n render: source => (\r\n \r\n
\r\n Service Usage
\r\n\r\n {usageReport}\r\n
\r\n - \r\n
- Source \r\n
- Destination \r\n
- Total Size \r\n
- Transferred size \r\n
- Date \r\n
- Transferred \r\n
- Skipped \r\n
- Failed \r\n
\r\n
\r\n )\r\n }\r\n}\r\nexport default withRouter(connect(({migrations={},auth}) => ({\r\n user : auth.user,\r\n ongoing:migrations.ongoing, \r\n history:migrations.history, \r\n awshistory:migrations.awshistory, \r\n awsLoading:migrations.awsLoading}), dispatch => \r\n bindActionCreators({\r\n on_migration_progress, \r\n clear_migration, \r\n refresh_migrations_history, \r\n aws_migrations_history, \r\n refresh_rm, \r\n refresh_profile, \r\n aws_migrations_retry}, dispatch))(RecentTransfer))\r\n// export default withRouter(\r\n// connect(\r\n// // mapStateToProps,\r\n// // mapDispatchToProps\r\n// )(RecentTransfer)\r\n// );","import React, {Component} from 'react';\r\nimport {bindActionCreators} from 'redux';\r\nimport {withRouter} from 'react-router-dom';\r\nimport {connect} from 'react-redux';\r\nimport {Button, message, Divider, Tooltip, Table, Switch, Modal} from \"antd\";\r\nimport moment from 'moment'\r\nimport {fetchSyncInfoWasabi} from \"../../../actions/sync-info-wasabi\";\r\nimport {refresh_profile} from \"../../../actions/auth\";\r\nimport CloudFlyerAPI from '../../../api/CloudFlyerAPI'\r\nimport infoIcon from '../../../assets/svg/info_icon.svg';\r\n\r\nimport './SyncList.scss';\r\n\r\nclass SyncList extends Component {\r\n\r\n constructor(props) {\r\n super();\r\n\r\n this.state = {\r\n syncInfoList: [],\r\n }\r\n }\r\n\r\n componentDidMount() {\r\n this.props.fetchSyncInfoWasabi();\r\n this.props.refresh_profile(true);\r\n }\r\n\r\n componentWillReceiveProps({syncInfoWasabi, user}) {\r\n if (syncInfoWasabi.error) {\r\n message.error(syncInfoWasabi.error);\r\n } else {\r\n this.setState({\r\n syncInfoList: syncInfoWasabi.items,\r\n user\r\n });\r\n }\r\n }\r\n\r\n handleActivateClick = (syncId, active) => {\r\n\r\n let activateMessage = \"\"\r\n if (active) {\r\n activateMessage = \"deactivate\"\r\n } else {\r\n activateMessage = \"activate\"\r\n }\r\n\r\n CloudFlyerAPI\r\n .new_user_account\r\n .activateSync({\r\n id: syncId,\r\n active: !active\r\n })\r\n .then(response => {\r\n message.success(`Sync Information ${activateMessage} successfully!`)\r\n this.props.fetchSyncInfoWasabi();\r\n })\r\n .catch(err => {\r\n message.error(\"Something went wrong.\")\r\n })\r\n }\r\n\r\n handleDeleteClick = (syncId) => {\r\n\r\n CloudFlyerAPI\r\n .new_user_account\r\n .deleteSync(syncId)\r\n .then(response => {\r\n message.success(\"Sync Information deleted successfully!\")\r\n this.props.fetchSyncInfoWasabi();\r\n })\r\n .catch(err => {\r\n message.error(\"Something went wrong.\")\r\n })\r\n\r\n\r\n }\r\n\r\n faultedTooltip(status, error) {\r\n if (status === 'Faulted') {\r\n if (error === undefined) {\r\n error = \"Error\";\r\n }\r\n return (\r\n
\r\n Recent Transfers
\r\n {/*More...
*/}\r\n\r\n
\r\n
\r\n\r\n Faulted 
);\r\n }\r\n return status;\r\n }\r\n\r\n\r\n // handleTriggerClick = (syncId) => {\r\n // CloudFlyerAPI\r\n // .user_account\r\n // .triggerSyncWasabi(syncId)\r\n // .then(response => {\r\n // message.success(\"Sync started successfully!\")\r\n // this.props.fetchSyncInfoWasabi();\r\n // })\r\n // .catch(err => {\r\n // message.error(\"Something went wrong.\")\r\n // })\r\n // }\r\n\r\n render() {\r\n\r\n const columns = [\r\n {\r\n title: 'Source',\r\n dataIndex: 'source',\r\n key: 'source',\r\n ellipsis: {\r\n showTitle: false,\r\n },\r\n render: source => (\r\n \r\n
\r\n \r\n \r\n\r\n \r\n )\r\n }\r\n}\r\n\r\n\r\nfunction mapStateToProps({syncInfoWasabi, auth: {user} = {}}) {\r\n return {syncInfoWasabi, user};\r\n}\r\n\r\nfunction mapDispatchToProps(dispatch) {\r\n return {\r\n fetchSyncInfoWasabi: bindActionCreators(fetchSyncInfoWasabi, dispatch),\r\n refresh_profile\r\n };\r\n}\r\n\r\nconst showActivateConfirm = (e, handleActivateClick, syncId, destination, active) => {\r\n //e.stopPropagation()\r\n let activateMessage = \"\"\r\n if (active) {\r\n activateMessage = \"deactivate\"\r\n } else {\r\n activateMessage = \"activate\"\r\n }\r\n\r\n Modal.confirm({\r\n title: `Are you sure you want to ${activateMessage} the ${destination} Sync?`,\r\n content:\r\n \"\",\r\n onOk() {\r\n handleActivateClick(syncId, active)\r\n }\r\n })\r\n}\r\n\r\nconst showDeleteConfirm = (\r\n e,\r\n handleDeleteClick,\r\n syncId,\r\n destination\r\n) => {\r\n e.stopPropagation()\r\n Modal.confirm({\r\n title: `Do you want to remove the ${destination} Sync Information?`,\r\n content:\r\n \"This will only remove your Sync Information from CloudFlyer.\",\r\n onOk() {\r\n handleDeleteClick(syncId)\r\n }\r\n })\r\n}\r\n\r\n\r\nexport default withRouter(\r\n connect(\r\n mapStateToProps,\r\n mapDispatchToProps\r\n )(SyncList)\r\n);\r\n","import React from 'react';\r\n\r\nimport { Row, Col, Container } from 'react-grid-system'\r\nimport { bindActionCreators } from 'redux';\r\nimport { withRouter } from 'react-router-dom';\r\nimport { connect } from 'react-redux';\r\n\r\nimport { Modal, Button, Link, Tooltip } from 'antd';\r\n\r\nimport CloudAccountFilterContainer from '../../containers/cloud-account-filter-container';\r\nimport CloudAccountListContainer from '../../containers/cloud-account-list-container';\r\nimport ActiveJobsList from './ActiveJobs/activeJobs';\r\nimport ServiceUsage from './Usage/usage';\r\nimport TransferReport from './RecentTransfer/recentTransfer';\r\n\r\nimport SyncList from '../SyncC2cWasabi/SyncList/SyncList';\r\n\r\n\r\nimport AmazonS3Logo from '../../assets/logo/partner-logo-Amazon.svg';\r\nimport WasabiLogo from '../../assets/img/wasabi-logo.svg';\r\nimport AzureLogo from '../../assets/logo/partner-logo-Azure.svg';\r\nimport GenericS3Logo from '../../assets/logo/genericS3.svg';\r\n\r\nimport './dashboard.scss';\r\n\r\nclass CloudProviders extends React.Component {\r\n constructor(props) {\r\n super(props)\r\n\r\n let defaultProviders = [\r\n {\r\n img: AmazonS3Logo,\r\n name: 'aws',\r\n style: {\r\n height: '38px',\r\n },\r\n },\r\n {\r\n img: WasabiLogo,\r\n name: 'wasabi',\r\n style: {\r\n height: '38px',\r\n },\r\n },\r\n {\r\n img: AzureLogo,\r\n name: 'azure',\r\n style: {\r\n height: '38px',\r\n },\r\n },\r\n {\r\n img: GenericS3Logo,\r\n name: 'genericS3',\r\n style: {\r\n height: '38px'\r\n }\r\n }\r\n \r\n ]\r\n let { referrer_id } = props\r\n if (referrer_id === 1) {\r\n defaultProviders = defaultProviders\r\n .concat\r\n /*[\r\n {\r\n img: AzureLogo,\r\n name: 'azure',\r\n style: {\r\n height: '38px'\r\n }\r\n },\r\n {\r\n img: GoogleCloudLogo,\r\n name: 'google'\r\n },\r\n {\r\n img: QumuloLogo,\r\n name: 'qumulo'\r\n },\r\n {\r\n img: ZadaraLogo,\r\n name: 'zadara'\r\n }\r\n ]*/\r\n ()\r\n }\r\n\r\n this.state = {\r\n providers: defaultProviders,\r\n }\r\n }\r\n\r\n componentDidMount() {\r\n const { match } = this.props\r\n let user = JSON.parse(localStorage.getItem('user')) || {\r\n bypass_onboard: true,\r\n }\r\n /* user.bypass_onboard = false */\r\n // if (!user.bypass_onboard) {\r\n // Modal.success({\r\n // //title: 'Thank You',\r\n // okText: \"Let's get started\",\r\n // wrapClassName: 'modal_onboard',\r\n // className: 'modal_onboard',\r\n // maskClosable: true,\r\n // onOk: () => {},\r\n // content: (\r\n //