Artifacts table columns: Name, Upload Date, Size

Fix the artifacts table columns. Serialize upload date instant as milliseconds
from epoch.
This commit is contained in:
Armin Friedl 2020-05-23 19:22:41 +02:00
parent 12729a51a9
commit bc6c2eabba
Signed by: armin
GPG key ID: 48C726EEE7FBCBC8
3 changed files with 29 additions and 3 deletions

View file

@ -2,6 +2,8 @@ package net.friedl.fling.model.dto;
import java.time.Instant; import java.time.Instant;
import com.fasterxml.jackson.annotation.JsonProperty;
import lombok.Data; import lombok.Data;
@Data @Data
@ -21,4 +23,9 @@ public class ArtifactDto {
private Instant uploadTime; private Instant uploadTime;
private FlingDto fling; private FlingDto fling;
@JsonProperty("uploadTime")
public Long getJsonUploadTime() {
return uploadTime.toEpochMilli();
}
} }

View file

@ -15,6 +15,7 @@ function FlingArtifactControl(props) {
.then(() => props.reloadArtifactsFn()); .then(() => props.reloadArtifactsFn());
} }
function handleDownload(ev) { function handleDownload(ev) {
artifactClient.downloadArtifact(props.artifact.id) artifactClient.downloadArtifact(props.artifact.id)
.then(url => { .then(url => {
@ -39,12 +40,25 @@ function FlingArtifactControl(props) {
function FlingArtifactRow(props) { function FlingArtifactRow(props) {
let [hovered, setHovered] = useState(false); let [hovered, setHovered] = useState(false);
function readableBytes(bytes) {
if(bytes <= 0) return "0 KB";
var i = Math.floor(Math.log(bytes) / Math.log(1024)),
sizes = ['Byte', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'];
return (bytes / Math.pow(1024, i)).toFixed(2) * 1 + ' ' + sizes[i];
}
function localizedUploadDate() {
let d = new Date(props.artifact.uploadTime);
return d.toLocaleDateString();
}
return( return(
<tr key={props.artifact.id} className="artifact-row" onMouseOver={() => setHovered(true)} onMouseOut={() => setHovered(false)}> <tr key={props.artifact.id} className="artifact-row" onMouseOver={() => setHovered(true)} onMouseOut={() => setHovered(false)}>
<td>{props.artifact.name}</td> <td>{props.artifact.name}</td>
<td>{props.artifact.version}</td> <td>{localizedUploadDate()}</td>
<td/> <td>{readableBytes(props.artifact.size)}</td>
<td><FlingArtifactControl artifact={props.artifact} reloadArtifactsFn={props.reloadArtifactsFn} hidden={!hovered} /></td> <td><FlingArtifactControl artifact={props.artifact} reloadArtifactsFn={props.reloadArtifactsFn} hidden={!hovered} /></td>
</tr> </tr>
); );
@ -59,7 +73,7 @@ export default function FlingArtifacts(props) {
<thead> <thead>
<tr> <tr>
<th>Name</th> <th>Name</th>
<th>Date</th> <th>Uploaded</th>
<th>Size</th> <th>Size</th>
<th/> <th/>
</tr> </tr>

View file

@ -150,6 +150,7 @@ thead th {
width:20%; width:20%;
} }
&:nth-child(3) { &:nth-child(3) {
text-align: right;
width:20%; width:20%;
} }
// control box // control box
@ -160,6 +161,10 @@ thead th {
} }
tbody td { tbody td {
&:nth-child(3) {
text-align: right;
}
// control box
&:nth-child(4) { &:nth-child(4) {
text-align: right; text-align: right;
width: 4*$control-size; width: 4*$control-size;