Pause, cancel & resume backup media download

This commit is contained in:
trevor-signal 2024-09-16 15:38:12 -04:00 committed by GitHub
parent 65539b1419
commit 028a3f3ef0
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
28 changed files with 958 additions and 141 deletions

View file

@ -0,0 +1,41 @@
// Copyright 2024 Signal Messenger, LLC
// SPDX-License-Identifier: AGPL-3.0-only
import React from 'react';
export function ProgressCircle({
fractionComplete,
width = 24,
strokeWidth = 3,
}: {
fractionComplete: number;
width?: number;
strokeWidth?: number;
}): JSX.Element {
const radius = width / 2 - strokeWidth / 2;
const circumference = radius * 2 * Math.PI;
return (
<svg className="ProgressCircle" width={width} height={width}>
<circle
className="ProgressCircle__background"
strokeWidth={strokeWidth}
r={radius}
cx="50%"
cy="50%"
/>
<circle
className="ProgressCircle__fill"
r={radius}
cx="50%"
cy="50%"
strokeWidth={strokeWidth}
// setting the strokeDashArray to be the circumference of the ring means each dash
// will cover the whole ring
strokeDasharray={circumference}
// offsetting the dash as a fraction of the circumference allows showing the
// progress
strokeDashoffset={(1 - fractionComplete) * circumference}
/>
</svg>
);
}