diff --git a/cypress/integration/view/offline.feature b/cypress/integration/view/offline.feature
index 7ef930560..71e6ba5a1 100644
--- a/cypress/integration/view/offline.feature
+++ b/cypress/integration/view/offline.feature
@@ -53,6 +53,14 @@ Feature: Offline dashboard
         When I click Exit without saving
         Then the cached dashboard is loaded and displayed in view mode
 
+    Scenario: I remove a dashboard from cache while offline
+        Given I open a cached dashboard
+        And connectivity is turned off
+        When I click to Remove from offline storage
+        Then the dashboard is not cached
+        When connectivity is turned on
+        Then I cache one of the dashboards
+
     # Scenario: The sharing dialog is open when connectivity is lost
     #     Given I open a cached dashboard
     #     When I open sharing settings
diff --git a/cypress/integration/view/offline/offline.js b/cypress/integration/view/offline/offline.js
index 3494961f6..f508bdc5d 100644
--- a/cypress/integration/view/offline/offline.js
+++ b/cypress/integration/view/offline/offline.js
@@ -313,3 +313,12 @@ Given('I delete the cached and uncached dashboard', () => {
     deleteDashboard(UNCACHED_DASHBOARD_TITLE)
     deleteDashboard(CACHED_DASHBOARD_TITLE)
 })
+
+// Scenario: I remove a dashboard from cache while offline
+When('I click to Remove from offline storage', () => {
+    clickViewActionButton('More')
+    cy.contains('Remove from offline storage').click()
+})
+Then('the dashboard is not cached', () => {
+    cy.contains(OFFLINE_DATA_LAST_UPDATED_TEXT).should('not.exist')
+})
diff --git a/src/components/MenuItemWithTooltip.js b/src/components/MenuItemWithTooltip.js
index 5bce35e21..10d5d8547 100644
--- a/src/components/MenuItemWithTooltip.js
+++ b/src/components/MenuItemWithTooltip.js
@@ -25,7 +25,10 @@ const MenuItemWithTooltip = ({
             dense
             disabled={notAllowed}
             label={
-                <OfflineTooltip content={tooltipContent}>
+                <OfflineTooltip
+                    content={tooltipContent}
+                    disabledWhenOffline={disabledWhenOffline}
+                >
                     {label}
                 </OfflineTooltip>
             }
diff --git a/src/pages/view/TitleBar/ActionsBar.js b/src/pages/view/TitleBar/ActionsBar.js
index a9a105553..c39f579fe 100644
--- a/src/pages/view/TitleBar/ActionsBar.js
+++ b/src/pages/view/TitleBar/ActionsBar.js
@@ -89,12 +89,16 @@ const ViewActions = ({
         })
     }
 
-    const onToggleOfflineStatus = () => {
-        if (lastUpdated) {
-            return remove()
-        }
+    const onRemoveFromOffline = () => {
+        toggleMoreOptions()
+        lastUpdated && remove()
+    }
 
-        onUpdateOfflineCache()
+    const onAddToOffline = () => {
+        toggleMoreOptions()
+        return filtersLength
+            ? setConfirmCacheDialogIsOpen(true)
+            : startRecording({})
     }
 
     const onUpdateOfflineCache = () => {
@@ -141,16 +145,21 @@ const ViewActions = ({
 
     const getMoreMenu = () => (
         <FlyoutMenu>
-            <MenuItem
-                dense
-                disabled={offline}
-                label={
-                    lastUpdated
-                        ? i18n.t('Remove from offline storage')
-                        : i18n.t('Make available offline')
-                }
-                onClick={onToggleOfflineStatus}
-            />
+            {lastUpdated ? (
+                <MenuItem
+                    dense
+                    disabledWhenOffline={false}
+                    label={i18n.t('Remove from offline storage')}
+                    onClick={onRemoveFromOffline}
+                />
+            ) : (
+                <MenuItem
+                    dense
+                    disabled={offline}
+                    label={i18n.t('Make available offline')}
+                    onClick={onAddToOffline}
+                />
+            )}
             {lastUpdated && (
                 <MenuItem
                     dense