feat: enhance backup and download functionalities

- Updated `BackupCenterPage` to support download progress tracking during remote backup downloads.
- Modified `ImportPage` to simplify export functionality by removing unnecessary payload handling.
- Improved `JwtWarningPage` to utilize a new clipboard utility for copying text with feedback.
- Enhanced `PublicSendPage` to show download progress for files being downloaded.
- Updated `RecoverTwoFactorPage` to include autocomplete attributes for better user experience.
- Refactored `SendsPage` to use the new clipboard utility for copying access URLs.
- Enhanced `SettingsPage` to utilize the clipboard utility for copying sensitive information.
- Improved `TotpCodesPage` to use the clipboard utility for copying TOTP codes.
- Updated `VaultPage` and related components to support download progress for attachments.
- Introduced a new `app-notify` module for consistent notification handling across the application.
- Created a `clipboard` utility for improved clipboard interactions with user feedback.
- Added progress tracking for file downloads in the API layer, enhancing user experience during downloads.

webapp/src/components/TotpCodesPage.tsx

@@ -1,8 +1,10 @@
 import { useEffect, useMemo, useRef, useState } from 'preact/hooks';
 import { Clipboard, Globe } from 'lucide-preact';
+import { copyTextToClipboard as copyTextWithFeedback } from '@/lib/clipboard';
 import { calcTotpNow } from '@/lib/crypto';
 import { t } from '@/lib/i18n';
 import type { Cipher } from '@/lib/types';
+import { websiteIconUrl } from '@/components/vault/vault-page-helpers';
 
 interface TotpCodesPageProps {
   ciphers: Cipher[];
@@ -13,6 +15,7 @@ interface TotpCodesPageProps {
 const TOTP_PERIOD_SECONDS = 30;
 const TOTP_RING_RADIUS = 14;
 const TOTP_RING_CIRCUMFERENCE = 2 * Math.PI * TOTP_RING_RADIUS;
+const failedIconHosts = new Set<string>();
 
 function formatTotp(code: string): string {
   if (!code || code.length < 6) return code;
@@ -41,20 +44,22 @@ function hostFromUri(uri: string): string {
 function TotpListIcon({ cipher }: { cipher: Cipher }) {
   const uri = firstCipherUri(cipher);
   const host = hostFromUri(uri);
-  const [errored, setErrored] = useState(false);
-
+  const [errored, setErrored] = useState(() => (host ? failedIconHosts.has(host) : false));
   if (host && !errored) {
     return (
       <img
         className="list-icon"
-        src={`/icons/${host}/icon.png?v=2`}
+        src={websiteIconUrl(host)}
         alt=""
         loading="lazy"
-        onError={() => setErrored(true)}
+        referrerPolicy="no-referrer"
+        onError={() => {
+          failedIconHosts.add(host);
+          setErrored(true);
+        }}
       />
     );
   }
-
   return (
     <span className="list-icon-fallback">
       <Globe size={18} />
@@ -68,9 +73,7 @@ export default function TotpCodesPage(props: TotpCodesPageProps) {
   const listRef = useRef<HTMLDivElement | null>(null);
 
   async function copyToClipboard(value: string): Promise<void> {
-    if (!value.trim()) return;
-    await navigator.clipboard.writeText(value);
-    props.onNotify('success', t('txt_code_copied'));
+    await copyTextWithFeedback(value, { successMessage: t('txt_code_copied') });
   }
 
   const totpItems = useMemo(