=> {
+ if (commentMediaInfo.type === 'webpage' && !commentMediaInfo.thumbnail) {
+ const cachedThumbnail = getCachedThumbnail(commentMediaInfo.url);
+ if (cachedThumbnail) {
+ return { ...commentMediaInfo, thumbnail: cachedThumbnail };
+ }
+ const thumbnail = await fetchWebpageThumbnail(commentMediaInfo.url);
+ if (thumbnail) {
+ setCachedThumbnail(commentMediaInfo.url, thumbnail);
+ }
+ return { ...commentMediaInfo, thumbnail };
+ }
+ return commentMediaInfo;
+};
+const THUMBNAIL_CACHE_KEY = 'webpageThumbnailCache';
+
+export const getCachedThumbnail = (url: string): string | null => {
+ const cache = JSON.parse(localStorage.getItem(THUMBNAIL_CACHE_KEY) || '{}');
+ return cache[url] || null;
+};
+
+export const setCachedThumbnail = (url: string, thumbnail: string): void => {
+ const cache = JSON.parse(localStorage.getItem(THUMBNAIL_CACHE_KEY) || '{}');
+ cache[url] = thumbnail;
+ localStorage.setItem(THUMBNAIL_CACHE_KEY, JSON.stringify(cache));
+};
diff --git a/src/views/settings/account-settings/account-settings.module.css b/src/views/settings/account-settings/account-settings.module.css
index 46b185b8..b2496b00 100644
--- a/src/views/settings/account-settings/account-settings.module.css
+++ b/src/views/settings/account-settings/account-settings.module.css
@@ -24,6 +24,14 @@
margin-left: 0px;
}
+.warning {
+ text-transform: lowercase;
+ font-size: 0.8em;
+ color: var(--red);
+ padding-bottom: 10px;
+ padding-right: 10px;
+}
+
.createAccount button {
margin-left: 0px;
margin-bottom: 10px;
@@ -53,4 +61,8 @@
.deleteAccountBox, .deleteAccountBox button {
color: var(--red);
+}
+
+.deleteAccountBox {
+ padding-top: 10px;
}
\ No newline at end of file
diff --git a/src/views/settings/account-settings/account-settings.tsx b/src/views/settings/account-settings/account-settings.tsx
index 85ba58f5..6585c539 100644
--- a/src/views/settings/account-settings/account-settings.tsx
+++ b/src/views/settings/account-settings/account-settings.tsx
@@ -3,6 +3,9 @@ import { createAccount, deleteAccount, exportAccount, importAccount, setAccount,
import stringify from 'json-stringify-pretty-compact';
import { useTranslation } from 'react-i18next';
import styles from './account-settings.module.css';
+import { Capacitor } from '@capacitor/core';
+
+const isAndroid = Capacitor.getPlatform() === 'android';
const AccountSettings = () => {
const { t } = useTranslation();
@@ -183,6 +186,12 @@ const AccountSettings = () => {
{t('a_new_account')}
+
+ {t('stored_locally', {
+ location: window.isElectron ? 'this desktop app' : isAndroid ? 'this mobile app' : window.location.hostname,
+ interpolation: { escapeValue: false },
+ })}
+
{t('account_data_preview')}