Automatically delete stale archives after...

src/components/Hyperchat.svelte

@@ -65,7 +65,8 @@
     ytDark,
     confirmDialog,
     initialSetupDone,
-    defaultFilterPresetId
+    defaultFilterPresetId,
+    autoClear
   } from '../ts/storage';
   import { version } from '../manifest.json';
   import { shouldFilterMessage, saveMessageActions, findSavedMessageActionKey, getSavedMessageDumpActions, getSavedMessageDumpInfo, getAutoActivatedPreset, downloadAsJson, downloadAsTxt, redirectIfInitialSetup, importJsonDump, mergeVideoInfoObjs } from '../ts/ytcf-logic';
@@ -677,7 +678,7 @@
   };
   let key = '';
   const initMessageStorage = async () => {
-    let tempKey = paramsArchiveKey || await findSavedMessageActionKey(paramsContinuation, $videoInfo, true);
+    let tempKey = paramsArchiveKey || await findSavedMessageActionKey(paramsContinuation, $videoInfo, $autoClear);
     tempKey = tempKey === null ? getRandomString() : tempKey;
     const newMsgs = await getSavedMessageDumpActions(tempKey);
     if (newMsgs?.length) {

src/components/settings/YtcFilterGeneral.svelte

@@ -1,13 +1,15 @@
 <script lang="ts">
   import { Theme } from '../../ts/chat-constants';
-  import { theme, showProfileIcons, showUsernames, showTimestamps, showUserBadges, errorDialog, confirmDialog, inputDialog, filterInBackground, initialSetupDone, autoOpenFilterPanel } from '../../ts/storage';
-  import { exioButton, exioCheckbox, exioDropdown, exioIcon } from 'exio/svelte';
+  import { theme, showProfileIcons, showUsernames, showTimestamps, showUserBadges, errorDialog, confirmDialog, inputDialog, filterInBackground, initialSetupDone, autoOpenFilterPanel, autoClear } from '../../ts/storage';
+  import { exioButton, exioCheckbox, exioDropdown, exioIcon, exioTextbox } from 'exio/svelte';
   import { forceReloadAll } from '../../ts/ytcf-logic';
+  import { TimeUnit } from '../../ts/chat-constants';
   import '../../stylesheets/ui.css';
   import { readFromJson, exportSettingsAsJson, importSettingsFromJson } from '../../ts/ytcf-logic';
   import YtcFilterErrorDialog from '../YtcFilterErrorDialog.svelte';
   import LoadingBar from '../common/LoadingBar.svelte';
   import { version } from '../../manifest.json';
+  import { onMount, tick } from 'svelte';
   let loading: false | string = false;
   const importData = async () => {
     const data = await readFromJson();
@@ -61,6 +63,30 @@
   } else {
     $inputDialog = null;
   }
+
+  let waitingForStore = true;
+  let boolAutoClear = false;
+  let numberAutoClear = 2;
+  let unitAutoClear = TimeUnit.WEEKS;
+
+  onMount(async () => {
+    await autoClear.ready();
+    boolAutoClear = $autoClear.enabled;
+    numberAutoClear = $autoClear.duration;
+    unitAutoClear = $autoClear.unit;
+    await tick();
+    await tick();
+    waitingForStore = false;
+  });
+
+  const updateAutoClear = () => {
+    if (waitingForStore) return;
+    $autoClear = {
+      enabled: boolAutoClear,
+      duration: numberAutoClear,
+      unit: unitAutoClear
+    };
+  };
 </script>
 
 <YtcFilterErrorDialog />
@@ -120,6 +146,40 @@
     <input class="check" type="checkbox" use:exioCheckbox bind:checked={$filterInBackground} id="silently-filter" />
     <label for="silently-filter">Silently begin filtering messages in the background on load</label>
   </div>
+  <div class="setting-item" style="margin-bottom: 5px;">
+    <input
+      class="check"
+      type="checkbox"
+      use:exioCheckbox
+      bind:checked={boolAutoClear}
+      id="clear-auto"
+      on:change={updateAutoClear}
+      style="transform: translateY(-0.4em);"
+    />
+    <label for="clear-auto">
+      Automatically delete stale archives after
+      <input
+        type="number"
+        min="1"
+        disabled={!boolAutoClear}
+        on:change={updateAutoClear}
+        bind:value={numberAutoClear}
+        use:exioTextbox
+        style="width: 4em;"
+      />
+      <select
+        use:exioDropdown
+        disabled={!boolAutoClear}
+        bind:value={unitAutoClear}
+        on:change={updateAutoClear}
+      >
+        <option value={TimeUnit.HOURS}>Hours</option>
+        <option value={TimeUnit.DAYS}>Days</option>
+        <option value={TimeUnit.WEEKS}>Weeks</option>
+        <option value={TimeUnit.MONTHS}>Months</option>
+      </select>
+    </label>    
+  </div>
 </div>
 <div class="settings-title big-text">About</div>
 <div class="settings-content">
@@ -153,4 +213,7 @@
     vertical-align: bottom;
     margin: 0px 10px;
   }
+  input[type=number]::-webkit-inner-spin-button {
+    opacity: 1;
+  }
 </style>

src/ts/chat-constants.ts

@@ -73,6 +73,13 @@ export enum ChatReportUserOptions {
   MISINFORMATION = 'MISINFORMATION',
 }
 
+export enum TimeUnit {
+  HOURS = 'HOURS',
+  DAYS = 'DAYS',
+  WEEKS = 'WEEKS',
+  MONTHS = 'MONTHS'
+}
+
 export const chatReportUserOptions = [
   { value: ChatReportUserOptions.UNWANTED_SPAM, label: 'Unwanted commercial content or spam' },
   { value: ChatReportUserOptions.PORN_OR_SEX, label: 'Pornography or sexually explicit material' },

src/ts/storage.ts

@@ -3,7 +3,7 @@ import { derived, readable, writable } from 'svelte/store';
 import type { Writable } from 'svelte/store';
 import { getClient, AvailableLanguages } from 'iframe-translator';
 import type { IframeTranslatorClient, AvailableLanguageCodes } from 'iframe-translator';
-import { ChatReportUserOptions, Theme, YoutubeEmojiRenderMode, isLiveTL } from './chat-constants';
+import { ChatReportUserOptions, Theme, TimeUnit, YoutubeEmojiRenderMode, isLiveTL } from './chat-constants';
 
 const INITIAL_PRESET_ID = 'initial-preset-id'; // all other ids will be random
 
@@ -228,3 +228,8 @@ export const getPresetById = async (id: string): Promise<YtcF.FilterPreset | nul
 export const bytesUsed = stores.addSyncStore('hc.bytes.used', 0);
 export const filterInBackground = stores.addSyncStore('ytcf.startFilteringInBackground', true);
 export const autoOpenFilterPanel = stores.addSyncStore('ytcf.autoOpenFilterPanel', false);
+export const autoClear = stores.addSyncStore('ytcf.autoClear', {
+  unit: TimeUnit.WEEKS,
+  duration: 2,
+  enabled: true
+} as YtcF.AutoClearDurationObject);

src/ts/typings/ytcf.d.ts

@@ -37,6 +37,11 @@ declare namespace YtcF {
     triggers: PresetTrigger[];
     activation: 'manual' | 'auto';
   }
+  interface AutoClearDurationObject {
+    enabled: boolean;
+    duration: number;
+    unit: TimeUnit.WEEKS;
+  };
   interface MessageDumpInfoItem {
     nickname: string;
     continuation: string[];

src/ts/ytcf-logic.ts

@@ -1,6 +1,6 @@
 import { get } from 'svelte/store';
 import { currentFilterPreset, chatFilterPresets, defaultFilterPresetId, currentStorageVersion, initialSetupDone, forceReload, showProfileIcons, showTimestamps } from './storage';
-import { stringifyRuns, download } from './ytcf-utils';
+import { stringifyRuns, download, convertDurationObjectToMs } from './ytcf-utils';
 import { getRandomString } from './chat-utils';
 import parseRegex from 'regex-parser';
 import { isLangMatch, parseTranslation } from './tl-tag-detect';
@@ -620,7 +620,7 @@ export const deleteSavedMessageActions = async (key: string): Promise<void> => {
 export const findSavedMessageActionKey = async (
   continuation: string | null,
   info: SimpleVideoInfo | null,
-  clearOldItems = false
+  autoClearDurationObject: YtcF.AutoClearDurationObject
 ): Promise<string | null> => {
   // return await new Promise((resolve) => {
   //   chrome.storage.local.get(null, (s) => {
@@ -637,13 +637,21 @@ export const findSavedMessageActionKey = async (
   //   });
   // });
   const allInfoDumps = await getAllMessageDumpInfoItems();
+  let returnValue = null;
   for (const dump of allInfoDumps) {
-    if ((continuation != null && continuation && dump.continuation.includes(continuation)) ||
+    if (
+      autoClearDurationObject.enabled &&
+      dump.lastEdited < Date.now() - convertDurationObjectToMs(autoClearDurationObject)
+    ) {
+      await deleteSavedMessageActions(dump.key);
+    } else if ((continuation != null && continuation && dump.continuation.includes(continuation)) ||
       (info?.video != null && dump.info?.video?.videoId === info.video.videoId && info.video.videoId)) {
-      return dump.key;
+      // return dump.key;
+      returnValue = dump.key;
     }
   }
-  return null;
+  // return null;
+  return returnValue;
 };
 
 export const getAllMessageDumpInfoItems = async (): Promise<YtcF.MessageDumpInfoItem[]> => {

src/ts/ytcf-utils.ts

@@ -1,3 +1,5 @@
+import { TimeUnit } from "./chat-constants";
+
 export const stringifyRuns = (msg: Ytc.ParsedRun[], ignoreEmoji = false): string => {
   return msg.map(m => {
     if (m.type === 'text') {
@@ -17,3 +19,13 @@ export const download = (data: string, filename: string): void => {
   a.click();
   a.remove();
 };
+
+export const convertDurationObjectToMs = (duration: YtcF.AutoClearDurationObject): number => {
+  let multiplier = 1;
+  if (!duration.enabled) multiplier = 0;
+  if (duration.unit === TimeUnit.MONTHS) multiplier = 30 * 24 * 60 * 60 * 1000;
+  if (duration.unit === TimeUnit.WEEKS) multiplier = 7 * 24 * 60 * 60 * 1000;
+  if (duration.unit === TimeUnit.DAYS) multiplier = 24 * 60 * 60 * 1000;
+  if (duration.unit === TimeUnit.HOURS) multiplier = 60 * 60 * 1000;
+  return duration.duration * multiplier;
+};