diff --git a/web/apps/auth/src/pages/auth.tsx b/web/apps/auth/src/pages/auth.tsx
index 38b254c546..4006cc9e19 100644
--- a/web/apps/auth/src/pages/auth.tsx
+++ b/web/apps/auth/src/pages/auth.tsx
@@ -42,7 +42,7 @@ const AuthenticatorCodesPage = () => {
}
setHasFetched(true);
};
- fetchCodes();
+ void fetchCodes();
appContext.showNavBar(false);
}, []);
@@ -126,7 +126,7 @@ const AuthenticatorCodesPage = () => {
)}
-
+
>
@@ -217,14 +217,11 @@ const CodeDisplay: React.FC = ({ code }) => {
return (
{errorMessage ? (
-
+
) : (
-
-
+
+
)}
@@ -348,19 +345,15 @@ interface TimerProgressProps {
const TimerProgress: React.FC = ({ period }) => {
const [progress, setProgress] = useState(0);
- const microSecondsInPeriod = period * 1000000;
+ const us = period * 1e6;
useEffect(() => {
- const updateTimeRemaining = () => {
- const timeRemaining =
- microSecondsInPeriod -
- ((new Date().getTime() * 1000) % microSecondsInPeriod);
- setProgress(timeRemaining / microSecondsInPeriod);
+ const advance = () => {
+ const timeRemaining = us - ((new Date().getTime() * 1000) % us);
+ setProgress(timeRemaining / us);
};
- const ticker = setInterval(() => {
- updateTimeRemaining();
- }, 10);
+ const ticker = setInterval(advance, 10);
return () => clearInterval(ticker);
}, []);
@@ -379,17 +372,25 @@ const TimerProgress: React.FC = ({ period }) => {
);
};
-function BadCodeInfo({ codeInfo, codeErr }) {
+interface UnparseableCodeProps {
+ code: Code;
+ errorMessage: string;
+}
+
+const UnparseableCode: React.FC = ({
+ code,
+ errorMessage,
+}) => {
const [showRawData, setShowRawData] = useState(false);
return (
-
{codeInfo.title}
-
{codeErr}
+
{code.issuer}
+
{errorMessage}
{showRawData ? (
setShowRawData(false)}>
- {codeInfo.uriString}
+ {code.uriString}
) : (
setShowRawData(true)}>Show rawData
@@ -397,9 +398,9 @@ function BadCodeInfo({ codeInfo, codeErr }) {
);
-}
+};
-const AuthFooter: React.FC = () => {
+const Footer: React.FC = () => {
return (