Implement object deletion

This commit is contained in:
Alex 2022-02-28 21:42:55 +01:00
parent a95d37546f
commit 51d96396ef
Signed by: lx
GPG key ID: 0E496D15096376BE
2 changed files with 31 additions and 5 deletions

View file

@ -7,6 +7,7 @@ import Modal from 'react-bootstrap/Modal';
import { BsFileEarmarkText, BsDownload } from 'react-icons/bs';
import downloadFile from './downloadFile';
import fileSizePretty from './fileSizePretty';
type Props = {
client: S3Client;
@ -64,7 +65,7 @@ class ObjectInfo extends React.Component<Props, State> {
<p><strong>Key:</strong> { this.props.s3key }</p>
{ this.state.loaded ?
<>
<p><strong>Size:</strong> { this.state.size }</p>
<p><strong>Size:</strong> { fileSizePretty(this.state.size) }</p>
<p><strong>Content type:</strong> { this.state.contentType }</p>
</>
: <></> }

View file

@ -1,6 +1,6 @@
import React from 'react';
import { Link, useParams } from 'react-router-dom';
import { S3Client, ListObjectsV2Command, GetObjectCommand } from '@aws-sdk/client-s3';
import { S3Client, ListObjectsV2Command, GetObjectCommand, DeleteObjectCommand } from '@aws-sdk/client-s3';
import Alert from 'react-bootstrap/Alert';
import Breadcrumb from 'react-bootstrap/Breadcrumb';
@ -15,7 +15,8 @@ import ObjectInfo from './ObjectInfo';
import UploadFiles from './UploadFiles';
import downloadFile from './downloadFile';
import { BsFolder, BsFileEarmarkText, BsDownload } from 'react-icons/bs';
import { BsInfoCircle, BsFolder, BsFileEarmarkText, BsDownload } from 'react-icons/bs';
import { AiOutlineDelete } from 'react-icons/ai';
type Props = {
client: S3Client;
@ -129,6 +130,18 @@ class ObjectList extends React.Component<Props, State> {
this.setState({info: f, iInfo: this.state.iInfo + 1});
}
async deleteFile(f: string) {
if (window.confirm("Really delete file " + f + "?")) {
console.log("DELETING", f);
let command = new DeleteObjectCommand({
Bucket: this.props.bucket,
Key: this.props.prefix + f,
});
let res = await this.props.client.send(command);
this.loadEntries();
}
}
openUpload() {
this.setState({iUpload: this.state.iUpload + 1});
}
@ -187,16 +200,28 @@ class ObjectList extends React.Component<Props, State> {
</LinkContainer>
)}
{ this.state.files.map((f) =>
<ListGroup.Item key={f} action onClick={() => this.openInfo(f)}>
<ListGroup.Item key={f}>
<Stack direction="horizontal">
<div><BsFileEarmarkText /> { f }</div>
<div className="ms-auto">
<Button size="sm" variant="info" onClick={(event) => {
<Button size="sm" className="mx-1" variant="primary" onClick={(event) => {
event.stopPropagation();
downloadFile(this.props.client, this.props.bucket, this.props.prefix + f, f);
}}>
<BsDownload />
</Button>
<Button size="sm" className="mx-1" variant="danger" onClick={(event) => {
event.stopPropagation();
this.deleteFile(f);
}}>
<AiOutlineDelete />
</Button>
<Button size="sm" className="mx-1" variant="secondary" onClick={(event) => {
event.stopPropagation();
this.openInfo(f);
}}>
<BsInfoCircle />
</Button>
</div>
</Stack>
</ListGroup.Item>