From 717b1d2f40dfe38c448366d686a6334b08252f22 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Fe=CC=81lix=20Pe=CC=81ault?= <hello@flayks.com>
Date: Sat, 3 Aug 2024 12:24:52 +0200
Subject: [PATCH] refactor: use padZero function for numbers

---
 .../src/routes/(site)/[country]/[location]/+page.svelte   | 3 ++-
 .../(site)/[country]/[location]/[photo]/+page.svelte      | 6 ++++--
 packages/utils/string.ts                                  | 8 ++++++++
 3 files changed, 14 insertions(+), 3 deletions(-)

diff --git a/apps/website/src/routes/(site)/[country]/[location]/+page.svelte b/apps/website/src/routes/(site)/[country]/[location]/+page.svelte
index d4192c2..8cca38f 100644
--- a/apps/website/src/routes/(site)/[country]/[location]/+page.svelte
+++ b/apps/website/src/routes/(site)/[country]/[location]/+page.svelte
@@ -13,6 +13,7 @@
     import { seenLocations } from '$utils/stores'
     import { photoFields } from '$utils/api'
     import { PUBLIC_LIST_INCREMENT } from '$env/static/public'
+    import { padZero } from 'utils/string'
     // Components
     import Metas from '$components/Metas.svelte'
     import Image from '$components/atoms/Image.svelte'
@@ -294,7 +295,7 @@
                     location={location.name}
                     ratio={width / height}
                     date={date_taken}
-                    index="{(totalPhotos - index < 10) ? '0' : ''}{totalPhotos - index}"
+                    index={padZero(totalPhotos - index)}
                 />
             {/each}
         </section>
diff --git a/apps/website/src/routes/(site)/[country]/[location]/[photo]/+page.svelte b/apps/website/src/routes/(site)/[country]/[location]/[photo]/+page.svelte
index a731633..48cef1d 100644
--- a/apps/website/src/routes/(site)/[country]/[location]/[photo]/+page.svelte
+++ b/apps/website/src/routes/(site)/[country]/[location]/[photo]/+page.svelte
@@ -13,8 +13,9 @@
     import { getAssetUrlKey } from '$utils/api'
     import { previousPage } from '$utils/stores'
     import { DELAY } from '$utils/constants'
-    import { throttle } from 'utils/actions'
     import { swipe } from '$utils/interactions/swipe'
+    import { throttle } from 'utils/actions'
+    import { padZero } from 'utils/string'
     // Components
     import Metas from '$components/Metas.svelte'
     import SplitText from '$components/SplitText.svelte'
@@ -354,7 +355,8 @@
 
 
                 <div class="photo-page__index title-index">
-                    <SplitText text="{(currentPhotoIndex < 10) ? '0' : ''}{currentPhotoIndex}" mode="chars" />
+                <div class="index title-index">
+                    <SplitText text={padZero(currentPhotoIndex)} mode="chars" />
                 </div>
             </div>
 
diff --git a/packages/utils/string.ts b/packages/utils/string.ts
index 4fbd44e..8c1e97b 100644
--- a/packages/utils/string.ts
+++ b/packages/utils/string.ts
@@ -4,3 +4,11 @@
 export const capitalizeFirstLetter = (string: string) => {
     return string[0].toUpperCase() + string.slice(1)
 }
+
+
+/**
+ * Pad string or number with zero
+ */
+export const padZero = (value: string | number) => {
+    return ('0' + Number(value)).slice(-2)
+}