Get rid of lodash dependency

package.json

@@ -23,7 +23,6 @@
 		"date-fns": "^3.2.0",
 		"eslint": "^8.56.0",
 		"eslint-plugin-vue": "^9.20.1",
-		"lodash": "^4.17.21",
 		"pinia": "^2.1.7",
 		"pinia-plugin-persistedstate": "^3.2.1",
 		"sass": "^1.69.7",

src/pages/home/components/SearchHistoryCard.vue

@@ -2,14 +2,14 @@
 	<ContentCard v-if="store.history.length > 0">
 		<button :class="$style.button" :key="h.ts" @click="() => navigateToLeaderboard(h.region, h.name)" v-for="h of store.history">
 			{{ h.region }}
-			{{ capitalize(h.name) }}
+			{{ capitalise(h.name) }}
 			({{ formatDistanceToNow(h.ts) }} ago)
 		</button>
 	</ContentCard>
 </template>
 
 <script lang="ts" setup>
-	import { capitalize } from "lodash"
+	import { capitalise } from "@/utils"
 	import { ContentCard } from "@/components"
 	import { formatDistanceToNow } from "date-fns"
 	import { type RegionEnum } from "@/data"

src/pages/leaderboard/LeaderboardPage.vue

@@ -12,7 +12,7 @@
 
 <script setup>
 	import { AddToCustomCard, LeaderboardCard, NavCard } from "./components"
-	import { capitalize } from "lodash"
+	import { capitalise } from "@/utils"
 	import { computed } from "vue"
 	import { FooterCard, HeaderCard } from "@/components"
 	import { routeNameEnum } from "@/router"
@@ -28,7 +28,7 @@
 	const store = useMainStore()
 	useHead({
 		title: computed(() => {
-			const guildName = capitalize(route.name === routeNameEnum.CUSTOM_LEADERBOARD ? "Custom" : route.params.guildName)
+			const guildName = capitalise(route.name === routeNameEnum.CUSTOM_LEADERBOARD ? "Custom" : route.params.guildName)
 			const discipline = ({
 				age: "account age",
 				characters: "number of characters",

src/stores/useMainStore.ts

@@ -1,6 +1,5 @@
 import { defineStore } from "pinia"
 import { RegionEnum } from "@/data"
-import { take } from "lodash"
 
 const useMainStore = defineStore("main", {
 	state: (): {
@@ -45,8 +44,7 @@ const useMainStore = defineStore("main", {
 				this.history.unshift({ ts, name, region })
 			}
 
-			const sortedHistory = this.history.toSorted((a, b) => a.ts < b.ts ? 1 : -1)
-			this.history = take(sortedHistory, 5)
+			this.history = this.history.toSorted((a, b) => a.ts < b.ts ? 1 : -1).slice(0, 5)
 		}
 	},
 	persist: { key: "leaderboards-vuex" },

src/utils/capitalise.ts

@@ -0,0 +1,3 @@
+export default function capitalise(str: string) {
+	return str.charAt(0).toUpperCase() + str.slice(1)
+}

src/utils/index.ts

@@ -0,0 +1 @@
+export { default as capitalise } from "./capitalise"