diff --git a/packages/dashboard-v2/src/components/CurrentUsage/GraphBar.js b/packages/dashboard-v2/src/components/CurrentUsage/GraphBar.js index 96421f6e..1afab541 100644 --- a/packages/dashboard-v2/src/components/CurrentUsage/GraphBar.js +++ b/packages/dashboard-v2/src/components/CurrentUsage/GraphBar.js @@ -12,11 +12,13 @@ const BarTip = styled.span.attrs({ })``; const BarLabel = styled.span.attrs({ - className: "bg-white rounded border-2 border-palette-200 px-3 whitespace-nowrap absolute shadow", + className: "usage-label bg-white rounded border-2 border-palette-200 px-3 whitespace-nowrap absolute shadow", })` - right: max(0%, ${({ $percentage }) => 100 - $percentage}%); - top: -0.5rem; - transform: translateX(50%); + ${({ $percentage }) => ` + left: max(0%, ${$percentage}%); + top: -0.5rem; + transform: translateX(-${$percentage}%); + `} `; export const GraphBar = ({ value, limit, label }) => { diff --git a/packages/dashboard-v2/src/components/LatestActivity/ActivityTable.js b/packages/dashboard-v2/src/components/LatestActivity/ActivityTable.js index 345a2daa..2ee95e0f 100644 --- a/packages/dashboard-v2/src/components/LatestActivity/ActivityTable.js +++ b/packages/dashboard-v2/src/components/LatestActivity/ActivityTable.js @@ -4,6 +4,7 @@ import useSWR from "swr"; import { Table, TableBody, TableCell, TableRow } from "../Table"; import { ContainerLoadingIndicator } from "../LoadingIndicator"; +import { ViewAllLink } from "./ViewAllLink"; import useFormattedActivityData from "./useFormattedActivityData"; export default function ActivityTable({ type }) { @@ -22,20 +23,23 @@ export default function ActivityTable({ type }) { } return ( - - - {items.map(({ id, name, type, size, date, skylink }) => ( - - {name} - {type} - - {size} - - {date} - {skylink} - - ))} - -
+ <> + + + {items.map(({ id, name, type, size, date, skylink }) => ( + + {name} + {type} + + {size} + + {date} + {skylink} + + ))} + +
+ + ); } diff --git a/packages/dashboard-v2/src/components/LatestActivity/LatestActivity.js b/packages/dashboard-v2/src/components/LatestActivity/LatestActivity.js index 87825661..535bceba 100644 --- a/packages/dashboard-v2/src/components/LatestActivity/LatestActivity.js +++ b/packages/dashboard-v2/src/components/LatestActivity/LatestActivity.js @@ -1,21 +1,10 @@ import * as React from "react"; -import { Link } from "gatsby"; import { Panel } from "../Panel"; import { Tab, TabPanel, Tabs } from "../Tabs"; -import { ArrowRightIcon } from "../Icons"; import ActivityTable from "./ActivityTable"; -const ViewAllLink = (props) => ( - - - - - View all - -); - export default function LatestActivity() { return ( @@ -24,11 +13,9 @@ export default function LatestActivity() { - - diff --git a/packages/dashboard-v2/src/components/LatestActivity/ViewAllLink.js b/packages/dashboard-v2/src/components/LatestActivity/ViewAllLink.js new file mode 100644 index 00000000..2cee28ea --- /dev/null +++ b/packages/dashboard-v2/src/components/LatestActivity/ViewAllLink.js @@ -0,0 +1,12 @@ +import { Link } from "gatsby"; + +import { ArrowRightIcon } from "../Icons"; + +export const ViewAllLink = (props) => ( + + + + + View all + +); diff --git a/packages/dashboard-v2/src/components/Uploader/UploaderItem.js b/packages/dashboard-v2/src/components/Uploader/UploaderItem.js index 8ea279d6..46653877 100644 --- a/packages/dashboard-v2/src/components/Uploader/UploaderItem.js +++ b/packages/dashboard-v2/src/components/Uploader/UploaderItem.js @@ -109,7 +109,6 @@ export default function UploaderItem({ onUploadStateChange, upload }) { {upload.status === "uploading" && ( {Math.floor(upload.progress * 100)}% )} - {upload.status === "processing" && Wait} {upload.status === "complete" && (