Add localization for search page

src/components/search/AlbumSearch.astro

@@ -1,4 +1,5 @@
 ---
+import * as m from 'paraglide/messages'
 import type { Prisma } from '@prisma/client'
 import type { DefaultArgs } from '@prisma/client/runtime/library'
 import { Image } from 'astro:assets'
@@ -39,16 +40,14 @@ const [count, search] = await Promise.all([
   prismaClient.albums.count(countQuery),
   prismaClient.albums.findMany({ ...findQuery, take, skip: (page - 1) * take })
 ])
+
+const start = (page - 1) * take
+const end = Math.min(page * take, count)
 ---
 
 <div class='text-xl'>
-  Albums ({count}) {
-    count > take ? (
-      <span>
-        {' '}
-        / Showing {page === 1 ? `first ${take}` : `${(page - 1) * take}-${Math.min(page * take, count)}`} results
-      </span>
-    ) : null
+  {m.albums()} ({count}) {
+    count > take ? <span> / {page === 1 ? m.firstResults({ take }) : m.moreResults({ start, end })}</span> : null
   }
 </div>
 <div class='flex gap-x-2'>
@@ -76,8 +75,7 @@ const [count, search] = await Promise.all([
     ))
   }
 </div>
-<div class='text-xl'>
-  <div class='flex gap-x-2'>
-    <SearchNav query={query} count={count} take={take} page={page} />
-  </div>
+
+<div class='text-xl flex gap-x-2'>
+  <SearchNav query={query} count={count} take={take} page={page} />
 </div>