2022-02-28 11:30:54 +00:00
|
|
|
import React from 'react';
|
2022-02-28 16:08:49 +00:00
|
|
|
import { Link } from 'react-router-dom';
|
2022-02-28 11:30:54 +00:00
|
|
|
import { S3Client, ListBucketsCommand } from '@aws-sdk/client-s3';
|
|
|
|
|
2022-02-28 16:59:06 +00:00
|
|
|
import Breadcrumb from 'react-bootstrap/Breadcrumb';
|
|
|
|
import Card from 'react-bootstrap/Card';
|
|
|
|
import ListGroup from 'react-bootstrap/ListGroup';
|
|
|
|
import { LinkContainer } from 'react-router-bootstrap'
|
|
|
|
|
|
|
|
|
2022-02-28 11:30:54 +00:00
|
|
|
type Props = {
|
|
|
|
client: S3Client;
|
|
|
|
};
|
|
|
|
|
|
|
|
type State = {
|
|
|
|
buckets: string[];
|
|
|
|
};
|
|
|
|
|
|
|
|
class BucketList extends React.Component<Props, State> {
|
|
|
|
state = {
|
|
|
|
buckets: [],
|
|
|
|
};
|
|
|
|
|
2022-02-28 16:08:49 +00:00
|
|
|
async componentDidMount() {
|
2022-02-28 11:30:54 +00:00
|
|
|
let command = new ListBucketsCommand({});
|
|
|
|
try {
|
|
|
|
const data = await this.props.client.send(command);
|
|
|
|
console.log("ok", data);
|
|
|
|
const buckets = (data.Buckets || []).map((b) => (b.Name || 'aza'));
|
2022-02-28 16:59:06 +00:00
|
|
|
buckets.sort();
|
2022-02-28 11:30:54 +00:00
|
|
|
this.setState({buckets: buckets});
|
|
|
|
} catch(error) {
|
|
|
|
console.log("err", error);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
render() {
|
|
|
|
return (
|
2022-02-28 16:59:06 +00:00
|
|
|
<>
|
|
|
|
<Breadcrumb>
|
|
|
|
<Breadcrumb.Item active>my buckets</Breadcrumb.Item>
|
|
|
|
</Breadcrumb>
|
|
|
|
<ListGroup>
|
|
|
|
{ this.state.buckets.map((b) =>
|
|
|
|
<LinkContainer to={ "/" + b }>
|
|
|
|
<ListGroup.Item key={ b } action>
|
|
|
|
{ b }
|
|
|
|
</ListGroup.Item>
|
|
|
|
</LinkContainer>
|
|
|
|
)}
|
|
|
|
</ListGroup>
|
|
|
|
</>
|
2022-02-28 11:30:54 +00:00
|
|
|
);
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
export default BucketList;
|