chore: Improve clear cache

src/i18n/en.i18n.json

@@ -42,6 +42,14 @@
       "yes": "Yes",
       "no": "No"
     },
+    "clearCache": {
+      "announcement": "Clearing cache",
+      "title": "Keep your login session?",
+      "message": "By deleting your login session you will be logged out and asked to inform your credentials again.",
+      "keepLoginData": "Keep login session",
+      "deleteLoginData": "Delete login session",
+      "cancel": "Cancel"
+    },
     "downloadRemoval": {
       "title": "Are you sure?",
       "message": "Remove this download?",
@@ -277,7 +285,7 @@
     "quit": "&Quit {{- appName}}",
     "redo": "&Redo",
     "reload": "&Reload",
-    "reloadIgnoringCache": "Reload ignoring cache",
+    "reloadClearingCache": "Force reload",
     "reportIssue": "Report issue",
     "resetAppData": "Reset app data",
     "resetZoom": "Reset zoom",
@@ -321,7 +329,8 @@
       "openDevTools": "Open DevTools",
       "clearCache": "Clear Cache",
       "clearStorageData": "Clear Storage Data",
-      "copyCurrentUrl": "Copy current URL"
+      "copyCurrentUrl": "Copy current URL",
+      "reloadClearingCache": "Force reload"
     }
   },
   "touchBar": {
@@ -352,4 +361,4 @@
     "unreadMention": "Unread mentions",
     "noUnreadMessage": "No unread messages"
   }
-}
+}

src/i18n/pt-BR.i18n.json

@@ -42,6 +42,14 @@
       "yes": "Sim",
       "no": "Não"
     },
+    "clearCache": {
+      "announcement": "Limpeza de cache",
+      "title": "Deseja manter a sessão de login?",
+      "message": "Ao excluir sua sessão de login, você será desconectado e precisará informar suas credenciais novamente.",
+      "keepLoginData": "Manter sessão de login",
+      "deleteLoginData": "Excluir sessão de login",
+      "cancel": "Cancelar"
+    },
     "downloadRemoval": {
       "title": "Você tem certeza?",
       "message": "Remover este download?",
@@ -263,7 +271,7 @@
     "quit": "&Sair do {{- appName}}",
     "redo": "&Refazer",
     "reload": "&Recarregar",
-    "reloadIgnoringCache": "Recarregar ignorando o cache",
+    "reloadClearingCache": "Forçar recarregamento",
     "reportIssue": "Reportar problema",
     "resetAppData": "Limpar dados do aplicativo",
     "resetZoom": "Redefinir zoom",
@@ -307,7 +315,8 @@
       "openDevTools": "Abrir DevTools",
       "clearCache": "Limpar cache",
       "clearStorageData": "Limpar dados de armazenamento",
-      "copyCurrentUrl": "Copiar URL atual"
+      "copyCurrentUrl": "Copiar URL atual",
+      "reloadClearingCache": "Forçar recarregamento"
     }
   },
   "touchBar": {
@@ -338,4 +347,4 @@
     "unreadMention": "Menções não lidas",
     "noUnreadMessage": "Nenhuma mensagem"
   }
-}
+}

src/main.ts

@@ -17,6 +17,7 @@ import { setupNavigation } from './navigation/main';
 import { setupNotifications } from './notifications/main';
 import { startOutlookCalendarUrlHandler } from './outlookCalendar/ipc';
 import { setupScreenSharing } from './screenSharing/main';
+import { handleClearCacheDialog } from './servers/cache';
 import { setupServers } from './servers/main';
 import { checkSupportedVersionServers } from './servers/supportedVersions/main';
 import { setupSpellChecking } from './spellChecking/main';
@@ -98,6 +99,7 @@ const start = async (): Promise<void> => {
   watchAndPersistChanges();
   handleJitsiDesktopCapturerGetSources();
   handleDesktopCapturerGetSources();
+  handleClearCacheDialog();
   startOutlookCalendarUrlHandler();
   startDocumentViewerHandler();
   checkSupportedVersionServers();

src/servers/cache.ts

@@ -0,0 +1,53 @@
+import { webContents, type WebContents } from 'electron';
+
+import { listen } from '../store';
+import {
+  CLEAR_CACHE_DIALOG_DELETE_LOGIN_DATA_CLICKED,
+  CLEAR_CACHE_DIALOG_KEEP_LOGIN_DATA_CLICKED,
+} from '../ui/actions';
+
+export const clearWebviewStorageKeepingLoginData = async (
+  guestWebContents: WebContents
+) => {
+  if (!guestWebContents) return;
+  await guestWebContents.session.clearCache();
+  await guestWebContents.session.clearStorageData({
+    storages: [
+      'cookies',
+      'indexdb',
+      'filesystem',
+      'shadercache',
+      'websql',
+      'serviceworkers',
+      'cachestorage',
+    ],
+  });
+  guestWebContents?.reloadIgnoringCache();
+};
+
+export const clearWebviewStorageDeletingLoginData = async (
+  guestWebContents: WebContents
+) => {
+  if (!guestWebContents) return;
+  await guestWebContents.session.clearCache();
+  await guestWebContents.session.clearStorageData();
+  guestWebContents?.reloadIgnoringCache();
+};
+
+export const handleClearCacheDialog = () => {
+  listen(CLEAR_CACHE_DIALOG_KEEP_LOGIN_DATA_CLICKED, async (action) => {
+    const guestWebContents = webContents.fromId(action.payload);
+    if (!guestWebContents) {
+      return;
+    }
+    await clearWebviewStorageKeepingLoginData(guestWebContents);
+  });
+
+  listen(CLEAR_CACHE_DIALOG_DELETE_LOGIN_DATA_CLICKED, async (action) => {
+    const guestWebContents = webContents.fromId(action.payload);
+    if (!guestWebContents) {
+      return;
+    }
+    await clearWebviewStorageDeletingLoginData(guestWebContents);
+  });
+};

src/ui/actions.ts

@@ -1,10 +1,18 @@
+import type { WebContents } from 'electron';
+
 import type { Server } from '../servers/common';
 import type { RootWindowIcon, WindowState } from './common';
 
 export const ABOUT_DIALOG_DISMISSED = 'about-dialog/dismissed';
 export const ABOUT_DIALOG_TOGGLE_UPDATE_ON_START =
   'about-dialog/toggle-update-on-start';
 export const ADD_SERVER_VIEW_SERVER_ADDED = 'add-server/view-server-added';
+export const CLEAR_CACHE_TRIGGERED = 'clear-cache/triggered';
+export const CLEAR_CACHE_DIALOG_DISMISSED = 'clear-cache-dialog/dismissed';
+export const CLEAR_CACHE_DIALOG_DELETE_LOGIN_DATA_CLICKED =
+  'clear-cache-dialog/delete-login-data-clicked';
+export const CLEAR_CACHE_DIALOG_KEEP_LOGIN_DATA_CLICKED =
+  'clear-cache-dialog/keep-login-data-clicked';
 export const LOADING_ERROR_VIEW_RELOAD_SERVER_CLICKED =
   'loading-error-view/reload-server-clicked';
 export const MENU_BAR_ABOUT_CLICKED = 'menu-bar/about-clicked';
@@ -108,6 +116,10 @@ export type UiActionTypeToPayloadMap = {
   [ABOUT_DIALOG_DISMISSED]: void;
   [ABOUT_DIALOG_TOGGLE_UPDATE_ON_START]: boolean;
   [ADD_SERVER_VIEW_SERVER_ADDED]: Server['url'];
+  [CLEAR_CACHE_TRIGGERED]: WebContents['id'];
+  [CLEAR_CACHE_DIALOG_DISMISSED]: void;
+  [CLEAR_CACHE_DIALOG_DELETE_LOGIN_DATA_CLICKED]: WebContents['id'];
+  [CLEAR_CACHE_DIALOG_KEEP_LOGIN_DATA_CLICKED]: WebContents['id'];
   [LOADING_ERROR_VIEW_RELOAD_SERVER_CLICKED]: { url: Server['url'] };
   [MENU_BAR_ABOUT_CLICKED]: void;
   [MENU_BAR_ADD_NEW_SERVER_CLICKED]: void;

src/ui/components/ClearCacheDialog/index.tsx

@@ -0,0 +1,88 @@
+import { Box, Button, ButtonGroup, Margins } from '@rocket.chat/fuselage';
+import { useEffect, useState } from 'react';
+import { useTranslation } from 'react-i18next';
+import { useDispatch } from 'react-redux';
+import type { Dispatch } from 'redux';
+
+import { listen } from '../../../store';
+import type { RootAction } from '../../../store/actions';
+import {
+  CLEAR_CACHE_DIALOG_DELETE_LOGIN_DATA_CLICKED,
+  CLEAR_CACHE_DIALOG_DISMISSED,
+  CLEAR_CACHE_DIALOG_KEEP_LOGIN_DATA_CLICKED,
+  CLEAR_CACHE_TRIGGERED,
+} from '../../actions';
+import { Dialog } from '../Dialog';
+
+export const ClearCacheDialog = () => {
+  const dispatch = useDispatch<Dispatch<RootAction>>();
+  const [webContendId, setWebcontentId] = useState<number>();
+  const [isVisible, setIsVisible] = useState(false);
+
+  const { t } = useTranslation();
+
+  const handleKeepButtonClick = (): void => {
+    if (webContendId === undefined) return;
+    dispatch({
+      type: CLEAR_CACHE_DIALOG_KEEP_LOGIN_DATA_CLICKED,
+      payload: webContendId,
+    });
+    setIsVisible(false);
+  };
+
+  const handleDeleteButtonClick = (): void => {
+    if (webContendId === undefined) return;
+    dispatch({
+      type: CLEAR_CACHE_DIALOG_DELETE_LOGIN_DATA_CLICKED,
+      payload: webContendId,
+    });
+    setIsVisible(false);
+  };
+
+  const handleClose = (): void => {
+    dispatch({
+      type: CLEAR_CACHE_DIALOG_DISMISSED,
+    });
+    setIsVisible(false);
+  };
+
+  useEffect(
+    () =>
+      listen(CLEAR_CACHE_TRIGGERED, async (action) => {
+        setWebcontentId(action.payload);
+        setIsVisible(true);
+      }),
+    [dispatch]
+  );
+
+  return (
+    <Dialog isVisible={isVisible} onClose={handleClose}>
+      <Box
+        width='x300'
+        display='flex'
+        flexDirection='column'
+        alignItems='center'
+      >
+        <Margins block='x18'>
+          <Box fontScale='h1'>{t('dialog.clearCache.announcement')}</Box>
+          <Box>
+            <strong>{t('dialog.clearCache.title')}</strong>
+            <br />
+            {t('dialog.clearCache.message')}
+          </Box>
+        </Margins>
+      </Box>
+      <ButtonGroup stretch vertical>
+        <Button type='button' primary onClick={handleKeepButtonClick}>
+          {t('dialog.clearCache.keepLoginData')}
+        </Button>
+        <Button type='button' danger onClick={handleDeleteButtonClick}>
+          {t('dialog.clearCache.deleteLoginData')}
+        </Button>
+        <Button type='button' onClick={handleClose}>
+          {t('dialog.clearCache.cancel')}
+        </Button>
+      </ButtonGroup>
+    </Dialog>
+  );
+};

src/ui/components/Shell/index.tsx

@@ -4,6 +4,7 @@ import { useSelector } from 'react-redux';
 import type { RootState } from '../../../store/rootReducer';
 import { AboutDialog } from '../AboutDialog';
 import { AddServerView } from '../AddServerView';
+import { ClearCacheDialog } from '../ClearCacheDialog';
 import DownloadsManagerView from '../DownloadsManagerView';
 import { OutlookCredentialsDialog } from '../OutlookCredentialsDialog';
 import { ScreenSharingDialog } from '../ScreenSharingDialog';
@@ -51,6 +52,7 @@ export const Shell = () => {
       <ScreenSharingDialog />
       <SelectClientCertificateDialog />
       <UpdateDialog />
+      <ClearCacheDialog />
       <OutlookCredentialsDialog />
     </>
   );

src/ui/main/menuBar.ts

@@ -9,6 +9,7 @@ import { dispatch, select, Service } from '../../store';
 import type { RootState } from '../../store/rootReducer';
 import * as urls from '../../urls';
 import {
+  CLEAR_CACHE_TRIGGERED,
   MENU_BAR_ABOUT_CLICKED,
   MENU_BAR_ADD_NEW_SERVER_CLICKED,
   MENU_BAR_SELECT_SERVER_CLICKED,
@@ -216,12 +217,16 @@ const createViewMenu = createSelector(
         },
       },
       {
-        id: 'reloadIgnoringCache',
-        label: t('menus.reloadIgnoringCache'),
+        id: 'reloadClearingCache',
+        label: t('menus.reloadClearingCache'),
         enabled: typeof currentView === 'object' && !!currentView.url,
         click: async () => {
           const guestWebContents = await getCurrentViewWebcontents();
-          guestWebContents?.reloadIgnoringCache();
+          if (guestWebContents)
+            dispatch({
+              type: CLEAR_CACHE_TRIGGERED,
+              payload: guestWebContents.id,
+            });
           const currentView = await getCurrentView();
           if (typeof currentView === 'object' && !!currentView.url) {
             dispatch({

src/ui/main/serverView/index.ts

@@ -41,6 +41,7 @@ import {
   WEBVIEW_DID_START_LOADING,
   WEBVIEW_ATTACHED,
   WEBVIEW_SERVER_RELOADED,
+  CLEAR_CACHE_TRIGGERED,
 } from '../../actions';
 import { getRootWindow } from '../rootWindow';
 import { createPopupMenuForServerView } from './popupMenu';
@@ -425,17 +426,16 @@ export const attachGuestWebContentsEvents = async (): Promise<void> => {
         },
       },
       {
-        label: t('sidebar.item.clearCache'),
+        label: t('sidebar.item.reloadClearingCache'),
         click: async () => {
           const guestWebContents = getWebContentsByServerUrl(serverUrl);
-          await guestWebContents?.session.clearCache();
-        },
-      },
-      {
-        label: t('sidebar.item.clearStorageData'),
-        click: async () => {
-          const guestWebContents = getWebContentsByServerUrl(serverUrl);
-          await guestWebContents?.session.clearStorageData();
+          if (!guestWebContents) {
+            return;
+          }
+          dispatch({
+            type: CLEAR_CACHE_TRIGGERED,
+            payload: guestWebContents.id,
+          });
         },
       },
     ];