chore(settings): ensure backward compatibility

src/store/utils/preload.ts

@@ -1,12 +1,18 @@
 import storage from 'helpers/storage';
-import { setSettings } from '../reducers/settings';
+import { defaultSettings, setSettings } from '../reducers/settings';
 import { setChannels } from '../reducers/channels';
 import { setVideos } from '../reducers/videos';
 import { setApp } from '../reducers/app';
 import { dispatch, storageKey } from './persist';
 import { elapsedDays } from 'helpers/utils';
 import { config as channelCheckerConfig } from 'ui/components/webext/Background/ChannelChecker';
-import { VideoCache, Settings, VideosSeniority, HomeView } from 'types';
+import {
+  VideoCache,
+  Settings,
+  VideosSeniority,
+  HomeView,
+  LegacySettings,
+} from 'types';
 import { log } from 'helpers/logger';
 
 export const preloadState = async () => {
@@ -15,8 +21,9 @@ export const preloadState = async () => {
   if (state) {
     // Load stored data
     const { settings, channels, videos } = state;
+    const newSettings = replaceLegacySettings(settings);
     if (settings) {
-      dispatch(setSettings(settings));
+      dispatch(setSettings(newSettings));
     }
     if (channels) {
       dispatch(setChannels(channels));
@@ -26,7 +33,7 @@ export const preloadState = async () => {
         setVideos({
           list: removeOutdatedVideos(
             replaceViewedFlagWithSeen(videos.list),
-            settings,
+            newSettings,
           ),
         }),
       );
@@ -35,6 +42,58 @@ export const preloadState = async () => {
   dispatch(setApp({ loaded: true }), shouldPersist);
 };
 
+const replaceLegacySettings = (
+  settings: LegacySettings | Settings | undefined,
+): Settings => {
+  if (!settings) {
+    return defaultSettings;
+  }
+  if ('viewOptions' in settings) {
+    return settings;
+  }
+  const {
+    recentVideosSeniority,
+    recentViewFilters,
+    watchLaterViewFilters,
+    bookmarksViewFilters,
+    allViewSorting,
+    recentViewSorting,
+    watchLaterViewSorting,
+    bookmarksViewSorting,
+    defaultView,
+    homeDisplayOptions,
+    ...rest
+  } = settings as LegacySettings;
+  return {
+    ...rest,
+    viewOptions: {
+      [HomeView.All]: {
+        sorting: recentViewSorting,
+        filters: recentViewFilters,
+        videosSeniority: recentVideosSeniority,
+      },
+      [HomeView.WatchLater]: {
+        sorting: watchLaterViewSorting,
+        filters: watchLaterViewFilters,
+        videosSeniority: VideosSeniority.Any,
+      },
+      [HomeView.Bookmarks]: {
+        sorting: bookmarksViewSorting,
+        filters: bookmarksViewFilters,
+        videosSeniority: VideosSeniority.Any,
+      },
+    },
+    defaultView:
+      (defaultView as string) === 'recent' ? HomeView.All : defaultView,
+    homeDisplayOptions: {
+      ...homeDisplayOptions,
+      hiddenViews: homeDisplayOptions.hiddenViews.filter(
+        (view) => !['all', 'recent'].includes(view),
+      ),
+    },
+  };
+};
+
 const replaceViewedFlagWithSeen = (videos: VideoCache[]) => {
   return videos.map((video) => {
     const { viewed, ...flags } =

src/types/index.ts

@@ -4,3 +4,4 @@ export * from './Settings';
 export * from './api';
 export * from './webext';
 export * from './common';
+export * from './legacy';

src/types/legacy.ts

@@ -0,0 +1,19 @@
+import {
+  AllViewFilters as RecentViewFilters,
+  BookmarksViewFilters,
+  Settings,
+  VideosSeniority,
+  ViewSorting,
+  WatchLaterViewFilters,
+} from './Settings';
+
+export interface LegacySettings extends Omit<Settings, 'viewOptions'> {
+  recentVideosSeniority: VideosSeniority;
+  recentViewFilters: RecentViewFilters;
+  watchLaterViewFilters: WatchLaterViewFilters;
+  bookmarksViewFilters: BookmarksViewFilters;
+  allViewSorting: ViewSorting;
+  recentViewSorting: ViewSorting;
+  watchLaterViewSorting: ViewSorting;
+  bookmarksViewSorting: ViewSorting;
+}