From facaeb216915aab87329e5401bda57f140bb1f66 Mon Sep 17 00:00:00 2001
From: hoangvu12 <hggaming91@gmail.com>
Date: Wed, 14 Feb 2024 15:31:50 +0700
Subject: [PATCH] feat: storage settings

---
 .../settings/components/storage-settings.tsx  | 59 +++++++++++++++++++
 src/screens/settings/screen.tsx               |  7 ++-
 src/storage/episode.ts                        |  4 ++
 src/storage/media-id.ts                       |  4 ++
 4 files changed, 73 insertions(+), 1 deletion(-)
 create mode 100644 src/screens/settings/components/storage-settings.tsx

diff --git a/src/screens/settings/components/storage-settings.tsx b/src/screens/settings/components/storage-settings.tsx
new file mode 100644
index 0000000..4732158
--- /dev/null
+++ b/src/screens/settings/components/storage-settings.tsx
@@ -0,0 +1,59 @@
+import { TrashIcon } from 'lucide-react-native';
+import React from 'react';
+import { ToastAndroid } from 'react-native';
+
+import { clearWatchedEpisodes } from '@/storage/episode';
+import { clearMappings } from '@/storage/media-id';
+import { Button, Text, View } from '@/ui';
+
+const StorageSettings = () => {
+  const handleClearRecentlyData = () => {
+    clearWatchedEpisodes();
+
+    ToastAndroid.show('Cleared cache successfully', ToastAndroid.SHORT);
+  };
+
+  const handleClearMappingData = () => {
+    clearMappings();
+
+    ToastAndroid.show('Cleared cache successfully', ToastAndroid.SHORT);
+  };
+
+  return (
+    <View>
+      <Text className="mb-2 text-xl" weight="medium">
+        Storage
+      </Text>
+
+      <View className="w-full space-y-4">
+        <View className="flex w-full flex-row items-center justify-between">
+          <View className="w-4/6">
+            <Text weight="normal">Clear watched/read cache</Text>
+            <Text weight="light" className="text-gray-200">
+              Storing your recently episodes or chapters.
+            </Text>
+          </View>
+
+          <Button onPress={handleClearRecentlyData}>
+            <TrashIcon size={24} color="white" />
+          </Button>
+        </View>
+
+        <View className="flex flex-row items-center justify-between">
+          <View className="w-4/6">
+            <Text weight="normal">Clear mapping cache</Text>
+            <Text weight="light" className="text-gray-200">
+              Storing mapping between module's media ID and AniList ID.
+            </Text>
+          </View>
+
+          <Button onPress={handleClearMappingData}>
+            <TrashIcon size={24} color="white" />
+          </Button>
+        </View>
+      </View>
+    </View>
+  );
+};
+
+export default StorageSettings;
diff --git a/src/screens/settings/screen.tsx b/src/screens/settings/screen.tsx
index 2ebf7a1..65ba0f6 100644
--- a/src/screens/settings/screen.tsx
+++ b/src/screens/settings/screen.tsx
@@ -5,6 +5,7 @@ import { ScrollView, Text, View } from '@/ui';
 import AccountSettings from './components/account-settings';
 import AppSettings from './components/app-settings';
 import PlayerSettings from './components/player-settings';
+import StorageSettings from './components/storage-settings';
 
 const SettingsScreen = () => {
   return (
@@ -22,9 +23,13 @@ const SettingsScreen = () => {
           <AccountSettings />
         </View>
 
-        <View>
+        <View className="mb-8">
           <PlayerSettings />
         </View>
+
+        <View>
+          <StorageSettings />
+        </View>
       </View>
     </ScrollView>
   );
diff --git a/src/storage/episode.ts b/src/storage/episode.ts
index a7d8206..4056d9e 100644
--- a/src/storage/episode.ts
+++ b/src/storage/episode.ts
@@ -116,3 +116,7 @@ export function getWatchedEpisode(mediaId: number): WatchedEpisode | undefined {
     (watchedEpisode) => watchedEpisode.mediaId === mediaId
   );
 }
+
+export const clearWatchedEpisodes = () => {
+  storage.delete(episodeKey);
+};
diff --git a/src/storage/media-id.ts b/src/storage/media-id.ts
index 90257fa..01ac7cf 100644
--- a/src/storage/media-id.ts
+++ b/src/storage/media-id.ts
@@ -88,3 +88,7 @@ export function getMappings(): Mapping[] {
     return [];
   }
 }
+
+export const clearMappings = () => {
+  storage.delete(MAPPING_NAMESPACE);
+};