Archive/clean-cuts
1
0
Fork 0
mirror of https://github.com/BlossomiShymae/clean-cuts.git synced 2025-12-06 10:10:47 +01:00
Code Issues Actions Packages Projects Releases Wiki Activity

Refactor into useLocalizedData

Browse Source
This commit is contained in:
BlossomiShymae
2024-10-14 19:02:06 -05:00
parent 793cd3e120
commit e956f7f6d1
15 changed files with 43 additions and 103 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
composables/useLocalizedData.ts Normal file
View File

@@ -0,0 +1,12 @@
export default async function useLocalizedData<T>(producer: (locale: string) => Promise<T>) {
const { currentLocale } = useLocale();
const data = ref(await producer(currentLocale.value));
watch(currentLocale, async () => {
data.value = await producer(currentLocale.value);
});
return {
currentLocale,
data
};
}

7
pages/champions/[id].vue
View File

@@ -5,14 +5,9 @@ const route = useRoute();
const id = route.params.id as unknown;
const { client } = useClient();
const { currentLocale } = useLocale();
const getChampion = async () => await client.champions.getAsync(id as number, {locale: currentLocale.value, version: "latest"});
const { currentLocale, data: champion } = await useLocalizedData(async (x) => await client.champions.getAsync(id as number, {locale: x, version: "latest"}));
const champion = ref(await getChampion());
const data = computed(() => `https://raw.communitydragon.org/latest/plugins/rcp-be-lol-game-data/global/default/v1/champions/${champion.value.id}.json`);
watch(currentLocale, async () => {
champion.value = await getChampion();
});
const currentSkin = ref(champion.value.skins[0]);
const swapCurrentSkin = (id: number) => {

14
pages/champions/index.vue
View File

@@ -1,17 +1,11 @@
<script setup lang="ts">
const { client } = useClient();
const { currentLocale } = useLocale();
const getSummaries = async () => (await client.championSummaries.listAsync({locale: currentLocale.value, version: "latest"}))
.filter((x) => x.id != -1) // Remove placeholder champion
.sort((a, b) => a.name.localeCompare(b.name));
const getSkins = async () => await client.skins.listAsync({locale: currentLocale.value, version: "latest"});
const summaries = ref(await getSummaries());
const skins = ref(await getSkins());
watch(currentLocale, async () => {
summaries.value = await getSummaries();
skins.value = await getSkins();
});
const { data: summaries } = await useLocalizedData(async (x) => (await client.championSummaries.listAsync({locale: x, version: "latest"}))
.filter((x) => x.id != -1) // Remove placeholder champion
.sort((a, b) => a.name.localeCompare(b.name)));
const { data: skins } = await useLocalizedData(async (x) => await client.skins.listAsync({locale: x, version: "latest"}));
const { query, results } = useQueryable(summaries, (x) => x.id, (x) => x.name);
</script>

11
pages/cherry-augments/index.vue
View File

@@ -1,14 +1,9 @@
<script setup lang="ts">
const { client } = useClient();
const { currentLocale } = useLocale();
const getCherryAugments = async () => (await client.cherryAugments.listAsync({locale: currentLocale.value, version: "latest"}))
.sort((a, b) => a.id - b.id);
const cherryAugments = ref(await getCherryAugments());
watch (currentLocale, async() => {
cherryAugments.value = await getCherryAugments();
});
const { data: cherryAugments } = await useLocalizedData(async (x) => (await client.cherryAugments.listAsync({locale: x, version: "latest"}))
.sort((a, b) => a.id - b.id));
const { query, results } = useQueryable(cherryAugments, (x) => x.id, (x) => x.nameTRA);
</script>

9
pages/companions/index.vue
View File

@@ -1,13 +1,8 @@
<script setup lang="ts">
const { client } = useClient();
const { currentLocale } = useLocale();
const getCompanions = async () => (await client.companions.listAsync({locale: currentLocale.value, version: "latest"}))
.sort((a, b) => a.itemId - b.itemId);
const companions = ref(await getCompanions());
watch(currentLocale, async() => {
companions.value = await getCompanions();
});
const { data: companions } = await useLocalizedData(async (x) => (await client.companions.listAsync({locale: x, version: "latest"}))
.sort((a, b) => a.itemId - b.itemId));
const { query, paginate } = useQueryable(companions, (x) => x.itemId, (x) => x.name);
const pagination = paginate(100);

5
pages/items/[id].vue
View File

@@ -5,10 +5,9 @@ const route = useRoute();
const id = route.params.id as unknown;
const { client } = useClient();
const { currentLocale } = useLocale();
const getItems = async () => await client.items.listAsync({locale: currentLocale.value, version: "latest"});
const items = ref(await getItems());
const { data: items } = await useLocalizedData(async (x) => await client.items.listAsync({locale: x, version: "latest"}));
const _default = new Item({});
const item = computed(() => items.value.find((x) => x.id == id) || _default);

7
pages/items/index.vue
View File

@@ -1,12 +1,7 @@
<script setup lang="ts">
const { client } = useClient();
const { currentLocale } = useLocale();
const getItems = async () => await client.items.listAsync({ locale: currentLocale.value, version: "latest"});
const items = ref(await getItems());
watch(currentLocale, async () => {
items.value = await getItems();
});
const { data: items } = await useLocalizedData(async (x) => await client.items.listAsync({ locale: x, version: "latest"}));
const { query, results } = useQueryable(items, (x) => x.id, (x) => x.name);
</script>

22
pages/loots/index.vue
View File

@@ -1,25 +1,22 @@
<script setup lang="ts">
import { Loot } from '../../core/models';
import { Loot } from '~/core/models';
const { client } = useClient();
const { currentLocale } = useLocale();
const query = ref("");
const filter = ref("");
const getLoots = async () => (await client.loots.listAsync({locale: currentLocale.value, version: "latest"}))
const { data: loots } = await useLocalizedData(async (x) => (await client.loots.listAsync({locale: x, version: "latest"}))
.sort((a, b) => a.id.localeCompare(b.id))
.filter((x) => x.id != "");
const getSummaries = async () => await client.championSummaries.listAsync({locale: currentLocale.value, version: "latest"});
.filter((x) => x.id != ""));
const { data: summaries } = await useLocalizedData(async (x) => await client.championSummaries.listAsync({locale: x, version: "latest"}));
const clearFilter = () => filter.value = "";
const applyFilter = (category: string) => filter.value = category;
// Alphanumerically sort by id, remove null entries
const loots = ref(await getLoots());
const categories = new Set(loots.value.map((x) => x.type));
const { isNumeric } = useIsNumeric();
const pagination = computed(() => {
let filtered = [];
@@ -30,19 +27,12 @@ const pagination = computed(() => {
return usePagination(filtered, 100);
});
const summaries = ref(await getSummaries());
const getLootImage = (loot: Loot) => {
if (loot.type.includes('Statstone'))
return summaries.value.find((x) => loot.name.toLowerCase().includes(x.name.toLowerCase()))?.getIcon({locale: "default", version: "latest"});
return loot.getImage('latest');
}
watch(currentLocale, async() => {
loots.value = await getLoots();
summaries.value = await getSummaries();
});
</script>
<template>

9
pages/runes/index.vue
View File

@@ -1,13 +1,8 @@
<script setup lang="ts">
const { client } = useClient();
const { currentLocale } = useLocale();
const getRunes = async () => (await client.perks.listAsync({locale: currentLocale.value, version: "latest"}))
.sort((a, b) => a.id - b.id)
const runes = ref(await getRunes());
watch(currentLocale, async() => {
runes.value = await getRunes();
});
const { data: runes } = await useLocalizedData(async (x) => (await client.perks.listAsync({locale: x, version: "latest"}))
.sort((a, b) => a.id - b.id));
const { query, results } = useQueryable(runes, (x) => x.id, (x) => x.name);
</script>

9
pages/summoner-emotes/index.vue
View File

@@ -1,13 +1,8 @@
<script setup lang="ts">
const { client } = useClient();
const { currentLocale } = useLocale();
const getEmotes = async () => (await client.summonerEmotes.listAsync({locale: currentLocale.value, version: "latest"}))
.sort((a, b) => a.id - b.id);
const emotes = ref(await getEmotes());
watch(currentLocale, async() => {
emotes.value = await getEmotes();
});
const { data: emotes } = await useLocalizedData(async (x) => (await client.summonerEmotes.listAsync({locale: x, version: "latest"}))
.sort((a, b) => a.id - b.id));
const { query, paginate } = useQueryable(emotes, (x) => x.id, (x) => x.name);
const pagination = paginate(100);

9
pages/summoner-icons/index.vue
View File

@@ -1,13 +1,8 @@
<script setup lang="ts">
const { client } = useClient();
const { currentLocale } = useLocale();
const getIcons = async () => (await client.summonerIcons.listAsync({locale: currentLocale.value, version: "latest"}))
.sort((a, b) => a.id - b.id);
const icons = ref(await getIcons());
watch(currentLocale, async() => {
icons.value = await getIcons();
});
const { data: icons } = await useLocalizedData(async (x) => (await client.summonerIcons.listAsync({locale: x, version: "latest"}))
.sort((a, b) => a.id - b.id));
const { query, paginate } = useQueryable(icons, (x) => x.id, (x) => x.title);
const pagination = paginate(100);

9
pages/tft-damage-skins/index.vue
View File

@@ -1,13 +1,8 @@
<script setup lang="ts">
const { client } = useClient();
const { currentLocale } = useLocale();
const getTftDamageSkins = async () => (await client.tftDamageSkins.listAsync({ locale: currentLocale.value, version: "latest"}))
.sort((a, b) => a.itemId - b.itemId);
const tftDamageSkins = ref(await getTftDamageSkins());
watch(currentLocale, async() => {
tftDamageSkins.value = await getTftDamageSkins();
});
const { currentLocale, data: tftDamageSkins } = await useLocalizedData(async (x) => (await client.tftDamageSkins.listAsync({ locale: x, version: "latest"}))
.sort((a, b) => a.itemId - b.itemId));
const { query, results } = useQueryable(tftDamageSkins, (x) => x.itemId, (x) => x.name);
</script>

7
pages/tft-items/index.vue
View File

@@ -1,12 +1,7 @@
<script setup lang="ts">
const { client } = useClient();
const { currentLocale } = useLocale();
const getTftItems = async() => await client.tftItems.listAsync({ locale: currentLocale.value, version: "latest"});
const tftItems = ref(await getTftItems());
watch(currentLocale, async() => {
tftItems.value = await getTftItems();
});
const { data: tftItems } = await useLocalizedData(async(x) => await client.tftItems.listAsync({ locale: x, version: "latest"}));
</script>
<template>

9
pages/tft-map-skins/index.vue
View File

@@ -1,13 +1,8 @@
<script setup lang="ts">
const { client } = useClient();
const { currentLocale } = useLocale();
const getTftMapSkins = async () => (await client.tftMapSkins.listAsync({ locale: currentLocale.value, version: "latest"}))
.sort((a, b) => a.itemId - b.itemId);
const tftMapSkins = ref(await getTftMapSkins());
watch(currentLocale, async() => {
tftMapSkins.value = await getTftMapSkins();
});
const { data: tftMapSkins } = await useLocalizedData(async (x) => (await client.tftMapSkins.listAsync({ locale: x, version: "latest"}))
.sort((a, b) => a.itemId - b.itemId));
const { query, results } = useQueryable(tftMapSkins, (x) => x.itemId, (x) => x.name);
</script>

7
pages/ward-skins/index.vue
View File

@@ -1,12 +1,7 @@
<script setup lang="ts">
const { client } = useClient();
const { currentLocale } = useLocale();
const getSkins = async () => await client.wardSkins.listAsync({locale: currentLocale.value, version: "latest"});
const skins = ref(await getSkins());
watch(currentLocale, async() => {
skins.value = await getSkins();
});
const { data: skins } = await useLocalizedData(async (x) => await client.wardSkins.listAsync({locale: x, version: "latest"}));
const { query, results } = useQueryable(skins, (x) => x.id, (x) => x.name);
</script>