Skip to content

Commit 2d507f4

Browse files
dvcoldvcol
committed
feat(settings): adds cache settings card
1 parent 5076f2a commit 2d507f4

11 files changed

+375
-11
lines changed

‎src/components/views/settings/SettingsAccount.vue

+14
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
<script lang="ts" setup>
2+
import { NFlex } from 'naive-ui';
3+
4+
import { useUserSettingsStoreRefs } from '~/stores/settings/user.store';
5+
6+
const { user, userSetting } = useUserSettingsStoreRefs();
7+
</script>
8+
9+
<template>
10+
<NFlex>
11+
<div>This is the account card : {{ user }}</div>
12+
<div>{{ JSON.stringify(userSetting, undefined, 2) }}</div>
13+
</NFlex>
14+
</template>

‎src/components/views/settings/SettingsCache.vue

+164
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,164 @@
1+
<script lang="ts" setup>
2+
import { NButton, NFormItem, NIcon, NSelect } from 'naive-ui';
3+
4+
import { reactive, ref } from 'vue';
5+
6+
import IconRestore from '~/components/icons/IconRestore.vue';
7+
import { NotificationService } from '~/services/notification.service';
8+
import { TraktService } from '~/services/trakt.service';
9+
import { useExtensionSettingsStoreRefs } from '~/stores/settings/extension.store';
10+
import { useI18n } from '~/utils';
11+
import { CacheRetention } from '~/utils/cache.utils';
12+
13+
const i18n = useI18n('settings', 'cache');
14+
15+
const { traktCacheRetention, tmdbCacheRetention } = useExtensionSettingsStoreRefs();
16+
17+
const cacheOptions = Object.entries(CacheRetention).map(([key, value]) => ({
18+
label: key,
19+
value,
20+
}));
21+
22+
const loading = reactive({});
23+
24+
const onClick = async (fn: () => Promise<void>, index: number) => {
25+
loading[index] = true;
26+
27+
try {
28+
await fn();
29+
NotificationService.message.success(i18n('evict_success'));
30+
} catch (error) {
31+
console.error('Failed to evict cache.', error);
32+
NotificationService.error(i18n('evict_failure'), error);
33+
} finally {
34+
loading[index] = false;
35+
}
36+
};
37+
38+
const evictScopes = [
39+
{ label: i18n('evict_images'), click: TraktService.evict.tmdb },
40+
{
41+
label: i18n('evict_progress'),
42+
click: () =>
43+
Promise.all([
44+
TraktService.evict.progress.movies(),
45+
TraktService.evict.progress.shows(),
46+
TraktService.evict.collection.movies(),
47+
TraktService.evict.collection.shows(),
48+
]),
49+
},
50+
{ label: i18n('evict_calendar'), click: TraktService.evict.calendar },
51+
{ label: i18n('evict_history'), click: TraktService.evict.history },
52+
{
53+
label: i18n('evict_lists'),
54+
click: () =>
55+
Promise.all([
56+
TraktService.evict.watchlist(),
57+
TraktService.evict.favorites(),
58+
TraktService.evict.list(),
59+
TraktService.evict.lists(),
60+
TraktService.evict.collection.movies(),
61+
TraktService.evict.collection.shows(),
62+
]),
63+
},
64+
{ label: i18n('evict_search'), click: TraktService.evict.search },
65+
{ label: i18n('evict_shows'), click: TraktService.evict.shows },
66+
{ label: i18n('evict_seasons'), click: TraktService.evict.seasons },
67+
{ label: i18n('evict_episodes'), click: TraktService.evict.episodes },
68+
{ label: i18n('evict_movies'), click: TraktService.evict.movies },
69+
{ label: i18n('evict_people'), click: TraktService.evict.people },
70+
].map((item, index) => ({ ...item, click: () => onClick(item.click, index) }));
71+
72+
const container = ref();
73+
</script>
74+
75+
<template>
76+
<div ref="container" class="cache-container">
77+
<NFormItem
78+
class="form-row"
79+
:label="i18n('label_retention_trakt')"
80+
:show-feedback="false"
81+
label-placement="left"
82+
>
83+
<NSelect
84+
v-model:value="traktCacheRetention"
85+
class="form-select"
86+
:to="container"
87+
:options="cacheOptions"
88+
/>
89+
</NFormItem>
90+
<NFormItem
91+
class="form-row"
92+
:label="i18n('label_retention_images')"
93+
:show-feedback="false"
94+
label-placement="left"
95+
>
96+
<NSelect
97+
v-model:value="tmdbCacheRetention"
98+
:to="container"
99+
:options="cacheOptions"
100+
/>
101+
</NFormItem>
102+
103+
<NFormItem
104+
v-for="({ label, click }, index) in evictScopes"
105+
:key="index"
106+
class="form-row"
107+
:show-feedback="false"
108+
label-placement="left"
109+
>
110+
<template #label>
111+
<span class="from-label">{{ label }}</span>
112+
</template>
113+
<NButton
114+
class="evict-button"
115+
type="warning"
116+
secondary
117+
:loading="loading[index]"
118+
@click="click"
119+
>
120+
<span>{{ i18n('evict', 'common', 'button') }}</span>
121+
<template #icon>
122+
<NIcon :component="IconRestore" />
123+
</template>
124+
</NButton>
125+
</NFormItem>
126+
</div>
127+
</template>
128+
129+
<style lang="scss" scoped>
130+
.cache-container {
131+
display: flex;
132+
flex-direction: column;
133+
gap: 1.5rem;
134+
}
135+
136+
.evict-button {
137+
i {
138+
margin-left: calc(0% - var(--n-icon-margin));
139+
}
140+
}
141+
142+
.form-select {
143+
min-width: 10rem;
144+
}
145+
146+
.from-label {
147+
color: var(--white-70);
148+
font-weight: 600;
149+
font-size: 1rem;
150+
transition: color 0.3s var(--n-bezier);
151+
}
152+
153+
.form-row {
154+
display: flex;
155+
flex: 1 1 auto;
156+
justify-content: space-between;
157+
158+
&:hover {
159+
.from-label {
160+
color: var(--white-mute);
161+
}
162+
}
163+
}
164+
</style>

‎src/components/views/settings/SettingsComponent.vue

+8-4
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,11 @@ import { NAnchor, NAnchorLink, NCard, NLayout, NLayoutSider } from 'naive-ui';
33
44
import { type Component, onDeactivated, type Ref, ref } from 'vue';
55
6+
import SettingsAccount from '~/components/views/settings/SettingsAccount.vue';
7+
import SettingsCache from '~/components/views/settings/SettingsCache.vue';
68
import SettingsLinks from '~/components/views/settings/SettingsLinks.vue';
9+
import SettingsLogs from '~/components/views/settings/SettingsLogs.vue';
10+
import SettingsTabs from '~/components/views/settings/SettingsTabs.vue';
711
812
import { useI18n } from '~/utils';
913
@@ -16,11 +20,11 @@ type Section = {
1620
};
1721
1822
const sections: Section[] = [
19-
{ title: 'menu__account', reference: ref() },
20-
{ title: 'menu__tabs', reference: ref() },
23+
{ title: 'menu__account', reference: ref(), component: SettingsAccount },
24+
{ title: 'menu__tabs', reference: ref(), component: SettingsTabs },
2125
{ title: 'menu__links', reference: ref(), component: SettingsLinks },
22-
{ title: 'menu__cache', reference: ref() },
23-
{ title: 'menu__logs', reference: ref() },
26+
{ title: 'menu__cache', reference: ref(), component: SettingsCache },
27+
{ title: 'menu__logs', reference: ref(), component: SettingsLogs },
2428
];
2529
2630
const focus = ref();

‎src/components/views/settings/SettingsLinks.vue

+5-1
Original file line numberDiff line numberDiff line change
@@ -281,7 +281,11 @@ const containerRef = ref<HTMLDivElement>();
281281
}
282282
283283
.form-button {
284-
margin-left: 12px;
284+
margin-left: 0.25rem;
285+
286+
i {
287+
margin-left: calc(0% - var(--n-icon-margin));
288+
}
285289
}
286290
287291
.footer {

‎src/components/views/settings/SettingsLogs.vue

+11
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
<script lang="ts" setup>
2+
import { NFlex } from 'naive-ui';
3+
4+
import { useExtensionSettingsStore } from '~/stores/settings/extension.store';
5+
6+
const { logLevel } = useExtensionSettingsStore();
7+
</script>
8+
9+
<template>
10+
<NFlex> This is the logs card : {{ logLevel }} </NFlex>
11+
</template>

‎src/components/views/settings/SettingsTabs.vue

+11
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
<script lang="ts" setup>
2+
import { NFlex } from 'naive-ui';
3+
4+
import { useExtensionSettingsStore } from '~/stores/settings/extension.store';
5+
6+
const { progressTab } = useExtensionSettingsStore();
7+
</script>
8+
9+
<template>
10+
<NFlex> This is the tabs card : {{ progressTab }} </NFlex>
11+
</template>

‎src/i18n/en/common/button.json

+4
Original file line numberDiff line numberDiff line change
@@ -30,5 +30,9 @@
3030
"common__button__hide": {
3131
"message": "Hide",
3232
"description": "Button to hide an item."
33+
},
34+
"common__button__evict": {
35+
"message": "Evict cache data",
36+
"description": "Button to evict an item from cache."
3337
}
3438
}

‎src/i18n/en/settings/settings-cache.json

+62
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,62 @@
1+
{
2+
"settings__cache__label_retention_trakt": {
3+
"message": "Cache retention for Trakt data",
4+
"description": "Label for the cache retention setting for Trakt data"
5+
},
6+
"settings__cache__label_retention_images": {
7+
"message": "Cache retention for images",
8+
"description": "Label for the cache retention setting for images"
9+
},
10+
"settings__cache__evict_images": {
11+
"message": "Evict images from cache",
12+
"description": "Label for the evict images button"
13+
},
14+
"settings__cache__evict_progress": {
15+
"message": "Evict progress data from cache",
16+
"description": "Label for the evict progress data button"
17+
},
18+
"settings__cache__evict_calendar": {
19+
"message": "Evict calendar data from cache",
20+
"description": "Label for the evict calendar data button"
21+
},
22+
"settings__cache__evict_history": {
23+
"message": "Evict history data from cache",
24+
"description": "Label for the evict history data button"
25+
},
26+
"settings__cache__evict_lists": {
27+
"message": "Evict lists data from cache (watchlist, lists and collections)",
28+
"description": "Label for the evict lists data button"
29+
},
30+
"settings__cache__evict_search": {
31+
"message": "Evict search data from cache",
32+
"description": "Label for the evict search data button"
33+
},
34+
"settings__cache__evict_shows": {
35+
"message": "Evict shows data from cache",
36+
"description": "Label for the evict shows data button"
37+
},
38+
"settings__cache__evict_seasons": {
39+
"message": "Evict seasons data from cache",
40+
"description": "Label for the evict seasons data button"
41+
},
42+
"settings__cache__evict_episodes": {
43+
"message": "Evict episodes data from cache",
44+
"description": "Label for the evict episodes data button"
45+
},
46+
"settings__cache__evict_movies": {
47+
"message": "Evict movies data from cache",
48+
"description": "Label for the evict movies data button"
49+
},
50+
"settings__cache__evict_people": {
51+
"message": "Evict people data from cache",
52+
"description": "Label for the evict people data button"
53+
},
54+
"settings__cache__evict_success": {
55+
"message": "Cache evicted successfully",
56+
"description": "Message displayed when cache is evicted successfully"
57+
},
58+
"settings__cache__evict_failure": {
59+
"message": "Failed to evict cache.",
60+
"description": "Message displayed when cache evict fails"
61+
}
62+
}

‎src/services/trakt.service.ts

+5-2
Original file line numberDiff line numberDiff line change
@@ -108,8 +108,10 @@ export class TraktService {
108108
this.caches.tvdb.prefix = `tvdb-cache-${user}`;
109109
}
110110

111-
static changeRetention(retention: number) {
112-
this.caches.trakt.retention = retention;
111+
static changeRetention({ trakt, tvdb, tmdb }: { trakt?: number; tvdb?: number; tmdb?: number }) {
112+
if (trakt !== undefined) this.caches.trakt.retention = trakt;
113+
if (tvdb !== undefined) this.caches.tvdb.retention = tvdb;
114+
if (tmdb !== undefined) this.caches.tmdb.retention = tmdb;
113115
}
114116

115117
private static async saveAuth(
@@ -505,6 +507,7 @@ export class TraktService {
505507
shows: TraktService.traktClient.shows.summary.cached.evict,
506508
seasons: () => Promise.all([TraktService.traktClient.seasons.summary.cached.evict(), TraktService.traktClient.seasons.season.cached.evict()]),
507509
episodes: TraktService.traktClient.episodes.summary.cached.evict,
510+
search: TraktService.traktClient.search.text.cached.evict,
508511
list: TraktService.traktClient.users.list.items.get.cached.evict,
509512
lists: () =>
510513
Promise.all([

0 commit comments

Comments
 (0)